perf upgrade

src/features/matches/components/match-card.tsx

@@ -4,7 +4,7 @@ import { useNavigate } from "@tanstack/react-router";
 import { Match } from "../types";
 import TeamAvatar from "@/components/team-avatar";
 import EmojiBar from "@/features/reactions/components/emoji-bar";
-import { Suspense } from "react";
+import { memo, Suspense } from "react";
 import { useSheet } from "@/hooks/use-sheet";
 import Sheet from "@/components/sheet/sheet";
 import TeamHeadToHeadSheet from "./team-head-to-head-sheet";
@@ -237,4 +237,4 @@ const MatchCard = ({ match, hideH2H = false }: MatchCardProps) => {
   );
 };
 
-export default MatchCard;
+export default memo(MatchCard);

src/features/matches/components/match-list.tsx

@@ -1,4 +1,5 @@
 import { Stack, Text } from "@mantine/core";
+import { useMemo } from "react";
 import { Match } from "../types";
 import MatchCard from "./match-card";
 
@@ -8,9 +9,15 @@ interface MatchListProps {
 }
 
 const MatchList = ({ matches, hideH2H = false }: MatchListProps) => {
-  const filteredMatches = matches?.filter(match =>
-    match.home && match.away && !match.bye && match.status != "tbd"
-  ).sort((a, b) => a.start_time < b.start_time ? 1 : -1) || [];
+  const filteredMatches = useMemo(
+    () =>
+      [...(matches ?? [])]
+        .filter(match =>
+          match.home && match.away && !match.bye && match.status != "tbd"
+        )
+        .sort((a, b) => a.start_time < b.start_time ? 1 : -1),
+    [matches]
+  );
 
   if (!filteredMatches.length) {
     return undefined;

src/features/matches/server.ts

@@ -17,7 +17,7 @@ const orderedTeamsSchema = z.object({
 });
 
 export const generateTournamentBracket = createServerFn()
-  .inputValidator(orderedTeamsSchema)
+  .validator(orderedTeamsSchema)
   .middleware([superTokensAdminFunctionMiddleware, serverFnLoggingMiddleware])
   .handler(async ({ data: { tournamentId, orderedTeamIds } }) =>
     toServerResult(async () => {
@@ -138,7 +138,7 @@ export const generateTournamentBracket = createServerFn()
   );
 
 export const startMatch = createServerFn()
-  .inputValidator(z.string())
+  .validator(z.string())
   .middleware([superTokensAdminFunctionMiddleware, serverFnLoggingMiddleware])
   .handler(async ({ data }) =>
     toServerResult(async () => {
@@ -165,7 +165,7 @@ export const startMatch = createServerFn()
   );
 
 export const populateKnockoutBracket = createServerFn()
-  .inputValidator(z.object({
+  .validator(z.object({
     tournamentId: z.string(),
   }))
   .middleware([superTokensAdminFunctionMiddleware, serverFnLoggingMiddleware])
@@ -459,7 +459,7 @@ const endMatchSchema = z.object({
   ot_count: z.number(),
 });
 export const endMatch = createServerFn()
-  .inputValidator(endMatchSchema)
+  .validator(endMatchSchema)
   .middleware([superTokensAdminFunctionMiddleware, serverFnLoggingMiddleware])
   .handler(async ({ data: { matchId, home_cups, away_cups, ot_count } }) =>
     toServerResult(async () => {
@@ -546,7 +546,7 @@ const toggleReactionSchema = z.object({
 });
 
 export const toggleMatchReaction = createServerFn()
-  .inputValidator(toggleReactionSchema)
+  .validator(toggleReactionSchema)
   .middleware([superTokensFunctionMiddleware])
   .handler(async ({ data: { matchId, emoji }, context }) =>
     toServerResult(async () => {
@@ -606,7 +606,7 @@ export interface Reaction {
   players: PlayerInfo[];
 }
 export const getMatchReactions = createServerFn()
-  .inputValidator(z.string())
+  .validator(z.string())
   .middleware([superTokensFunctionMiddleware])
   .handler(async ({ data: matchId, context }) =>
     toServerResult(async () => {
@@ -647,7 +647,7 @@ const matchesBetweenPlayersSchema = z.object({
 });
 
 export const getMatchesBetweenPlayers = createServerFn()
-  .inputValidator(matchesBetweenPlayersSchema)
+  .validator(matchesBetweenPlayersSchema)
   .middleware([superTokensFunctionMiddleware])
   .handler(async ({ data: { player1Id, player2Id } }) =>
     toServerResult(async () => {
@@ -663,7 +663,7 @@ const matchesBetweenTeamsSchema = z.object({
 });
 
 export const getMatchesBetweenTeams = createServerFn()
-  .inputValidator(matchesBetweenTeamsSchema)
+  .validator(matchesBetweenTeamsSchema)
   .middleware([superTokensFunctionMiddleware])
   .handler(async ({ data: { team1Id, team2Id } }) =>
     toServerResult(async () => {