fix: fix modify coordinates and selfsign

src/app/dashboard/[id]/modal/editModal.tsx

@@ -54,12 +54,15 @@ export function EditModal({
   );
   const [isMdScreen, setIsMdScreen] = useState(false);
   const animationFrameId = useRef<number | null>(null);
+  const [screenSize, setScreenSize] = useState(1440);
 
   useEffect(() => {
     const handleResize = () => {
       setIsMdScreen(window.innerWidth >= 768);
     };
 
+    setScreenSize(window.innerWidth);
+
     window.addEventListener("resize", handleResize);
     handleResize();
 
@@ -195,8 +198,8 @@ export function EditModal({
 
     const rect = page.getBoundingClientRect();
 
-    const scaleX = 595 / rect.width;
-    const scaleY = 842 / rect.height;
+    const scaleX = 595 / (screenSize >= 768 ? 227 : rect.width);
+    const scaleY = 842 / (screenSize >= 768 ? 322 : rect.height);
 
     const scaledX = selection.x * scaleX;
     const scaledY = selection.y * scaleY;

src/components/form/SelectableInput.tsx

@@ -5,6 +5,7 @@ import { useQuery } from "@tanstack/react-query";
 import React, { useState, useEffect, useRef } from "react";
 import { useFormContext } from "react-hook-form";
 import ErrorMessage from "./ErrorMessage";
+import useAuthStore from "@/app/stores/useAuthStore";
 
 export type SelectableInputProps = {
   id: string;
@@ -27,6 +28,8 @@ const SelectableInput: React.FC<SelectableInputProps> = ({
   const [searchTerm, setSearchTerm] = useState<string>("");
   const dropdownRef = useRef<HTMLDivElement>(null);
 
+  const { user } = useAuthStore();
+
   const {
     register,
     setValue,
@@ -41,8 +44,10 @@ const SelectableInput: React.FC<SelectableInputProps> = ({
     },
   });
 
-  const filteredData = data?.filter((item: string) =>
-    item.toLowerCase().includes(searchTerm.toLowerCase()),
+  const filteredData = data?.filter(
+    (item: string) =>
+      item.toLowerCase().includes(searchTerm.toLowerCase()) &&
+      item.toLowerCase() !== user?.username.toLowerCase(),
   );
 
   useEffect(() => {