upd

src/components/ClientCard.tsx

@@ -16,7 +16,7 @@ function ClientCard({ client }: { client: Client }) {
               Добавьте email
             </p>
           )}
-          <span className="w-[1.389vw] h-[1.389vw] flex items-center justify-center text-[#7B60F3]">
+          <span className="size-[1.389vw] flex items-center justify-center text-[#7B60F3]">
             <ChevronRightIcon />
           </span>
         </div>

src/components/SearchInput.tsx

@@ -8,7 +8,6 @@ function SearchInput(
     setSearch: React.Dispatch<React.SetStateAction<string | null>>;
   }
 ) {
-  // const [value, setValue] = useState();
   const ref = useRef<HTMLInputElement>(null);
 
   return (

src/components/SessionCard.tsx

@@ -4,6 +4,7 @@ import SessionModal from "./modals/SessionModal";
 
 function SessionCard({ session }: { session: Session }) {
   const { setModal, setPosition } = useModalStore();
+
   return (
     <div
       className="w-full h-[4.444vw] not-last:border-b-1 border-[#F6F6F6] flex py-[0.278vw] items-center gap-[0.556vw] cursor-pointer group"

src/components/modals/ClientModal.tsx

@@ -14,15 +14,14 @@ import api from "../../utils/api";
 import SpinIcon from "../icons/SpinIcon";
 import useModalStore from "../../stores/useModalStore";
 import CreateSessionModal from "./CreateSessionModal";
+import SessionModal from "./SessionModal";
 
 function ClientModal({ client }: { client: Client }) {
   const queryClient = useQueryClient();
+
   const { setModal } = useModalStore();
-  const [clientData, setClientData] = useState({
-    name: client.name,
-    phone: client.phone,
-    email: client.email,
-  });
+
+  const [clientData, setClientData] = useState(client);
 
   const { mutate: updateClientData, isPending } = useMutation({
     mutationKey: ["clients", client.id],
@@ -32,6 +31,11 @@ function ClientModal({ client }: { client: Client }) {
     },
   });
 
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    updateClientData();
+  };
+
   return (
     <div className="w-[49.722vw] bg-[#FFFFFF] rounded-[2.222vw] overflow-hidden">
       <div className="flex justify-center items-center py-[1.806vw] border-b border-[#D6D6D6]">
@@ -46,72 +50,70 @@ function ClientModal({ client }: { client: Client }) {
                 Вы можете изменить данные клиента
               </p>
             </div>
-            <div className="flex flex-col gap-[0.278vw]">
-              <Input
-                placeholder="Имя"
-                defaultValue={clientData.name || ""}
-                onChange={(e) => {
-                  setClientData({ ...clientData, name: e.target.value });
-                }}
-                className="relative"
-              >
-                <span
-                  className="absolute z-10 top-[1.25vw] left-[17.917vw] size-[1.389vw] text-[#7D7D7D] cursor-pointer"
-                  onClick={() => {
-                    navigator.clipboard.writeText(clientData.name);
+            <form onSubmit={handleSubmit}>
+              <div className="flex flex-col gap-[0.278vw]">
+                <Input
+                  placeholder="Имя"
+                  defaultValue={clientData.name || ""}
+                  onChange={(e) => {
+                    setClientData({ ...clientData, name: e.target.value });
                   }}
+                  className="relative"
+                  required
                 >
-                  <CopyIcon />
-                </span>
-              </Input>
-              <Input
-                placeholder="Номер телефона"
-                defaultValue={clientData.phone || ""}
-                onChange={(e) => {
-                  setClientData({ ...clientData, phone: e.target.value });
-                }}
-                className="relative"
-              >
-                <span
-                  className="absolute top-[1.25vw] left-[17.917vw] size-[1.389vw] text-[#7D7D7D] cursor-pointer"
-                  onClick={() => {
-                    navigator.clipboard.writeText(clientData.phone);
-                  }}
-                >
-                  <CopyIcon />
-                </span>
-              </Input>
-              <Input
-                placeholder="Эл. почта"
-                defaultValue={clientData.email || ""}
-                onChange={(e) => {
-                  setClientData({ ...clientData, email: e.target.value });
-                }}
-              />
-            </div>
-            <div>
-              <Button
-                variant="primary"
-                size="large"
-                className="w-full"
-                type="submit"
-                onClick={() => updateClientData()}
-                disabled={
-                  clientData.name === client.name &&
-                  clientData.phone === client.phone &&
-                  clientData.email === client.email &&
-                  !isPending
-                }
-              >
-                {isPending ? (
-                  <span className="size-[1.111vw] animate-spin text-[#7B60F3] flex items-center justify-center">
-                    <SpinIcon />
+                  <span
+                    className="absolute z-10 top-[1.25vw] left-[17.917vw] size-[1.389vw] text-[#7D7D7D] cursor-pointer"
+                    onClick={() => {
+                      navigator.clipboard.writeText(clientData.name);
+                    }}
+                  >
+                    <CopyIcon />
                   </span>
-                ) : (
-                  "Сохранить изменения"
-                )}
-              </Button>
-            </div>
+                </Input>
+                <Input
+                  placeholder="Номер телефона"
+                  defaultValue={clientData.phone || ""}
+                  onChange={(e) => {
+                    setClientData({ ...clientData, phone: e.target.value });
+                  }}
+                  className="relative"
+                  required
+                >
+                  <span
+                    className="absolute top-[1.25vw] left-[17.917vw] size-[1.389vw] text-[#7D7D7D] cursor-pointer"
+                    onClick={() => {
+                      navigator.clipboard.writeText(clientData.phone);
+                    }}
+                  >
+                    <CopyIcon />
+                  </span>
+                </Input>
+                <Input
+                  placeholder="Эл. почта"
+                  defaultValue={clientData.email || ""}
+                  onChange={(e) => {
+                    setClientData({ ...clientData, email: e.target.value });
+                  }}
+                />
+              </div>
+              <div className="mt-[1.111vw]">
+                <Button
+                  variant="primary"
+                  size="large"
+                  className="w-full"
+                  type="submit"
+                  disabled={!clientData.name || !clientData.phone || isPending}
+                >
+                  {isPending ? (
+                    <span className="size-[1.111vw] animate-spin text-[#7B60F3] flex items-center justify-center">
+                      <SpinIcon />
+                    </span>
+                  ) : (
+                    "Сохранить изменения"
+                  )}
+                </Button>
+              </div>
+            </form>
           </div>
           <div className="flex flex-col gap-[1.111vw] rounded-[1.667vw] bg-white p-[1.111vw]">
             <div className="flex flex-col gap-[0.278vw]">
@@ -150,6 +152,9 @@ function ClientModal({ client }: { client: Client }) {
                 <div
                   key={session.id}
                   className="p-[0.278vw] border-b border-[#F6F6F6] cursor-pointer"
+                  onClick={() => {
+                    setModal(<SessionModal session={session} />);
+                  }}
                 >
                   <div className="p-[0.833vw] flex justify-between items-center">
                     <div className="flex gap-[0.556vw] items-center">

src/components/modals/SessionModal.tsx

@@ -10,7 +10,6 @@ import ClientCard from "../ClientCard";
 import SessionComments from "../SessionComments";
 import { useQuery } from "@tanstack/react-query";
 import api from "../../utils/api";
-import { useEffect } from "react";
 import SessionFiles from "../SessionFiles";
 import DownloadIcon from "../icons/DownloadIcon";
 import ShareIcon from "../icons/ShareIcon";
@@ -28,10 +27,6 @@ function SessionModal({ session }: { session: Session }) {
         .json<{ filename: string; size: number }[]>(),
   });
 
-  useEffect(() => {
-    console.log(data);
-  }, [data]);
-
   return (
     <div className="bg-[#FFFFFF] w-[49.722vw] rounded-[2.222vw]">
       <div className="w-full flex justify-center items-center h-[4.861vw] border-b-1 border-[#D6D6D6]">
@@ -66,7 +61,7 @@ function SessionModal({ session }: { session: Session }) {
                   Интерактивный стол:
                 </span>
                 <span className="caption-s font-medium">
-                  {session.server.name}
+                  {session.server?.name}
                 </span>
               </p>
               <p className="flex gap-[0.556vw]">