chore: add precommit and pr action

.github/workflows/prs.yaml

@@ -0,0 +1,26 @@
+name: Check PR
+
+on: [pull_request]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  check-code:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: "Setup yarn"
+        uses: actions/setup-node@v4
+        with:
+          node-version: "22"
+          cache: "yarn"
+      - name: Install dependencies
+        run: yarn install --frozen-lockfile
+      - name: Biome check
+        run: yarn link
+      - name: Typescript check
+        run: yarn type-check

.husky/pre-commit

@@ -0,0 +1,2 @@
+yarn lint
+yarn type-check

app/[lang]/dictionaries.ts

@@ -1,15 +1,17 @@
-import 'server-only'
+import 'server-only';
 
 const dictionaries = {
-  en: () => import('../../dictionaries/en.json').then((module) => module.default),
-  es: () => import('../../dictionaries/es.json').then((module) => module.default),
-}
+  en: () =>
+    import('../../dictionaries/en.json').then((module) => module.default),
+  es: () =>
+    import('../../dictionaries/es.json').then((module) => module.default),
+};
 
-export type Locale = keyof typeof dictionaries
+export type Locale = keyof typeof dictionaries;
 
 export const hasLocale = (locale: string): locale is Locale =>
-  locale in dictionaries
+  locale in dictionaries;
 
-export const getDictionary = async (locale: Locale) => dictionaries[locale]()
+export const getDictionary = async (locale: Locale) => dictionaries[locale]();
 
 export type Dictionary = Awaited<ReturnType<typeof getDictionary>>;

app/[lang]/game/_components/card.tsx

@@ -1,11 +1,11 @@
-import { type FC, useEffect, useRef, useState } from "react";
-import { cn } from "@/lib/cls";
-import { Button } from "@/primitives/components/ui/button";
-import { Dictionary } from "@/dictionaries";
+import { type FC, useEffect, useRef, useState } from 'react';
+import type { Dictionary } from '@/dictionaries';
+import { cn } from '@/lib/cls';
+import { Button } from '@/primitives/components/ui/button';
 
-const transitionClass = "duration-700";
+const transitionClass = 'duration-700';
 // biome-ignore lint/style/noNonNullAssertion: Trust me bro
-const changeOnMs = Number(transitionClass.split("-")[1]!) / 3;
+const changeOnMs = Number(transitionClass.split('-')[1]!) / 3;
 
 export const GameCard: FC<{
   player: { name: string; isSpy: boolean };
@@ -46,10 +46,10 @@ export const GameCard: FC<{
       <div className="perspective-midrange relative h-96 w-80 cursor-pointer border-0">
         <div
           className={cn(
-            "transform-3d relative h-full w-full transition-transform",
+            'transform-3d relative h-full w-full transition-transform',
             transitionClass,
             {
-              "rotate-y-180": isFlipped,
+              'rotate-y-180': isFlipped,
             },
           )}>
           {/* Front Face - Player Name */}
@@ -64,7 +64,9 @@ export const GameCard: FC<{
             {player.isSpy ? (
               <>
                 <div className="mb-4 text-6xl">🕵</div>
-                <h3 className="font-bold text-4xl text-destructive">{dict.card.spy}</h3>
+                <h3 className="font-bold text-4xl text-destructive">
+                  {dict.card.spy}
+                </h3>
               </>
             ) : (
               <>

app/[lang]/game/layout.tsx

@@ -1,4 +1,4 @@
-import type { FC, PropsWithChildren } from "react";
+import type { FC, PropsWithChildren } from 'react';
 
 const Layout: FC<PropsWithChildren> = ({ children }) => (
   <div className="flex h-screen w-screen items-center justify-center">

app/[lang]/game/local/_store/game-settings.ts

@@ -1,9 +1,9 @@
-import { atom } from "jotai";
-import type z from "zod";
-import type { localGameFormSchema } from "../setup/_components/form";
+import { atom } from 'jotai';
+import type z from 'zod';
+import type { localGameFormSchema } from '../setup/_components/form';
 
 export const gameSettingsAtom = atom<z.infer<typeof localGameFormSchema>>({
   players: [],
-  numberOfSpies: "0",
+  numberOfSpies: '0',
   randomNumberOfSpies: false,
 });

app/[lang]/game/local/layout.tsx

@@ -1,5 +1,5 @@
-import type { FC, PropsWithChildren } from "react";
-import { StoreProvider } from "@/providers/store";
+import type { FC, PropsWithChildren } from 'react';
+import { StoreProvider } from '@/providers/store';
 
 const Layout: FC<PropsWithChildren> = ({ children }) => (
   <StoreProvider>{children}</StoreProvider>

app/[lang]/game/local/play/_components/game.tsx

@@ -1,11 +1,11 @@
-"use client";
+'use client';
 
-import { useAtomValue } from "jotai";
-import { type FC, useCallback, useMemo, useState } from "react";
-import { GameCard } from "@/game/_components/card";
-import { gameSettingsAtom } from "../../_store/game-settings";
-import { GameTimer } from "./timer";
-import { Dictionary } from "@/dictionaries";
+import { useAtomValue } from 'jotai';
+import { type FC, useCallback, useMemo, useState } from 'react';
+import type { Dictionary } from '@/dictionaries';
+import { GameCard } from '@/game/_components/card';
+import { gameSettingsAtom } from '../../_store/game-settings';
+import { GameTimer } from './timer';
 
 export const Game: FC<{ dict: Dictionary }> = ({ dict }) => {
   const gameSettings = useAtomValue(gameSettingsAtom);
@@ -15,7 +15,7 @@
   // Generate spy assignments
   // biome-ignore lint/correctness/useExhaustiveDependencies: gameKey is intentionally used to trigger regeneration
   const playerRoles = useMemo(() => {
     const players = gameSettings.players.map((p) => p.name);
     const spyCount = gameSettings.randomNumberOfSpies
       ? Math.floor(Math.random() * players.length) + 1
       : Number(gameSettings.numberOfSpies);
@@ -26,7 +26,7 @@
       spyIndices.add(Math.floor(Math.random() * players.length));
     }
 
     return players.map((name, index) => ({
       name,
       isSpy: spyIndices.has(index),
     }));
@@ -42,7 +42,11 @@
   // Show timer once all players have checked their cards
   if (allPlayersChecked) {
     return (
-      <GameTimer playerRoles={playerRoles} onPlayAgain={handlePlayAgain} dict={dict} />
+      <GameTimer
+        playerRoles={playerRoles}
+        onPlayAgain={handlePlayAgain}
+        dict={dict}
+      />
     );
   }
 
@@ -60,12 +64,10 @@
       <div className="text-center">
         <h2 className="mb-2 font-bold text-2xl">
           {dict.play.playerProgress
-            .replace("{current}", String(currentPlayerIndex + 1))
-            .replace("{total}", String(playerRoles.length))}
+            .replace('{current}', String(currentPlayerIndex + 1))
+            .replace('{total}', String(playerRoles.length))}
         </h2>
-        <p className="text-muted-foreground">
-          {dict.play.cardInstruction}
-        </p>
+        <p className="text-muted-foreground">{dict.play.cardInstruction}</p>
       </div>
 
       <GameCard

app/[lang]/game/local/play/_components/timer.tsx

@@ -1,9 +1,9 @@
-"use client";
+'use client';
 
-import { type FC, useEffect, useState } from "react";
-import { cn } from "@/lib/cls";
-import { Button } from "@/primitives/components/ui/button";
-import { Dictionary } from "@/dictionaries";
+import { type FC, useEffect, useState } from 'react';
+import type { Dictionary } from '@/dictionaries';
+import { cn } from '@/lib/cls';
+import { Button } from '@/primitives/components/ui/button';
 
 const TIMER_DURATION = 120; // 2 minutes in seconds
 
@@ -18,7 +18,11 @@ interface GameTimerProps {
   dict: Dictionary;
 }
 
-export const GameTimer: FC<GameTimerProps> = ({ playerRoles, onPlayAgain, dict }) => {
+export const GameTimer: FC<GameTimerProps> = ({
+  playerRoles,
+  onPlayAgain,
+  dict,
+}) => {
   const [timeLeft, setTimeLeft] = useState(TIMER_DURATION);
   const [isExpired, setIsExpired] = useState(false);
   const [showSpies, setShowSpies] = useState(false);
@@ -44,13 +48,13 @@ export const GameTimer: FC<GameTimerProps> = ({ playerRoles, onPlayAgain, dict }
 
   const minutes = Math.floor(timeLeft / 60);
   const seconds = timeLeft % 60;
-  const formattedTime = `${minutes}:${seconds.toString().padStart(2, "0")}`;
+  const formattedTime = `${minutes}:${seconds.toString().padStart(2, '0')}`;
 
   const getTimerColor = () => {
-    if (isExpired) return "text-destructive";
-    if (timeLeft <= 30) return "text-destructive";
-    if (timeLeft <= 60) return "text-warning";
-    return "text-foreground";
+    if (isExpired) return 'text-destructive';
+    if (timeLeft <= 30) return 'text-destructive';
+    if (timeLeft <= 60) return 'text-warning';
+    return 'text-foreground';
   };
 
   const spies = playerRoles.filter((player) => player.isSpy);
@@ -61,29 +65,29 @@ export const GameTimer: FC<GameTimerProps> = ({ playerRoles, onPlayAgain, dict }
         <div className="text-center">
           <h2 className="mb-2 font-bold text-2xl">{dict.timer.title}</h2>
           <p className="text-muted-foreground">
-            {isExpired
-              ? dict.timer.timeUpDescription
-              : dict.timer.description}
+            {isExpired ? dict.timer.timeUpDescription : dict.timer.description}
           </p>
         </div>
 
         <div
           className={cn(
-            "flex h-64 w-64 items-center justify-center rounded-full border-4 shadow-lg transition-colors",
+            'flex h-64 w-64 items-center justify-center rounded-full border-4 shadow-lg transition-colors',
             getTimerColor(),
             {
-              "animate-pulse border-destructive": isExpired,
-              "border-destructive": timeLeft <= 30 && !isExpired,
-              "border-warning": timeLeft > 30 && timeLeft <= 60,
-              "border-border": timeLeft > 60,
+              'animate-pulse border-destructive': isExpired,
+              'border-destructive': timeLeft <= 30 && !isExpired,
+              'border-warning': timeLeft > 30 && timeLeft <= 60,
+              'border-border': timeLeft > 60,
             },
           )}>
           <div className="text-center">
-            <div className={cn("font-bold text-6xl", getTimerColor())}>
+            <div className={cn('font-bold text-6xl', getTimerColor())}>
               {formattedTime}
             </div>
             {isExpired && (
-              <div className="mt-2 font-semibold text-xl">{dict.timer.timeUp}</div>
+              <div className="mt-2 font-semibold text-xl">
+                {dict.timer.timeUp}
+              </div>
             )}
           </div>
         </div>

app/[lang]/game/local/play/page.tsx

@@ -1,9 +1,9 @@
 import { notFound } from 'next/navigation';
 import { getDictionary, hasLocale } from '@/dictionaries';
-import { Game } from "./_components/game";
+import { Game } from './_components/game';
 
 const Page = async ({ params }: PageProps<'/[lang]/game/local/play'>) => {
-  const { lang } = await params
+  const { lang } = await params;
   if (!hasLocale(lang)) notFound();
 
   const dict = await getDictionary(lang);