more optimizations

src/features/tournaments/components/tournament-form.tsx

@@ -11,6 +11,7 @@ import { logger } from "..";
 import { useQueryClient } from "@tanstack/react-query";
 import { tournamentQueries } from "@/features/tournaments/queries";
 import { DateTimePicker } from "@mantine/dates";
+import { useCallback } from "react";
 
 interface TournamentFormProps {
   close: () => void;
@@ -48,7 +49,7 @@ const TournamentForm = ({ close, initialValues, tournamentId }: TournamentFormPr
   
   const isPending = createPending || updatePending;
 
-  const handleSubmit = async (values: TournamentFormInput) => {
+  const handleSubmit = useCallback(async (values: TournamentFormInput) => {
     const { logo, ...tournamentData } = values;
     
     const mutation = isEditMode ? updateTournament : createTournament;
@@ -100,7 +101,7 @@ const TournamentForm = ({ close, initialValues, tournamentId }: TournamentFormPr
         logger.error(`Tournament ${isEditMode ? 'update' : 'create'} error`, error);
       }
     });
-  }
+  }, [isEditMode, createTournament, updateTournament, queryClient]);
 
   return (
     <SlidePanel

src/features/tournaments/components/tournament-list.tsx

@@ -2,6 +2,7 @@ import { List, ListItem, Skeleton, Text } from "@mantine/core";
 import { useNavigate } from "@tanstack/react-router";
 import Avatar from "@/components/avatar";
 import { Tournament } from "../types";
+import { useCallback } from "react";
 
 interface TournamentListProps {
   tournaments: Tournament[];
@@ -10,6 +11,9 @@ interface TournamentListProps {
 
 const TournamentList = ({ tournaments, loading = false }: TournamentListProps) => {
   const navigate = useNavigate();
+
+  const handleClick = useCallback((tournamentId: string) => 
+    navigate({ to: `/tournaments/${tournamentId}` }), [navigate]);
   
   if (loading) return <List>
     {Array.from({ length: 10 }).map((_, i) => (
@@ -27,9 +31,7 @@ const TournamentList = ({ tournaments, loading = false }: TournamentListProps) =
         py='xs'
         icon={<Avatar radius='xs' size={40} name={`${tournament.name}`} src={`/api/files/tournaments/${tournament.id}/${tournament.logo}`} />}
         style={{ cursor: 'pointer' }}
-        onClick={() => {
-          navigate({ to: `/tournaments/${tournament.id}` });
-        }}
+        onClick={() => handleClick(tournament.id)}
       >
         <Text fw={500}>{`${tournament.name}`}</Text>
       </ListItem>