fix(hackathons): 2-column grid and pagination on teams tab (#560)

Teams tab was rendering as a single column with no pager, so teams
past the first page were unreachable. Use the existing Pagination
component wired to the API's pagination.totalPages and switch the
grid to two columns from the lg breakpoint.

Author: Benjtalkshow

app/(landing)/hackathons/[slug]/components/tabs/contents/FindTeam.tsx

@@ -19,6 +19,7 @@ import {
 import TeamCard from './teams/TeamCard';
 import MyTeamView from './teams/MyTeamView';
 import { BoundlessButton } from '@/components/buttons/BoundlessButton';
+import Pagination from '@/components/ui/pagination';
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -91,6 +92,7 @@ const FindTeam = () => {
   const teams = (teamsResponse?.data?.teams || []).filter(
     t => !myTeam || t.id !== myTeam.id
   );
+  const totalPages = teamsResponse?.data?.pagination?.totalPages ?? 1;
 
   const handleJoin = (team: Team) => {
     setSelectedTeam(team);
@@ -264,16 +266,23 @@ const FindTeam = () => {
               </p>
             </div>
           ) : teams.length > 0 ? (
-            <div className='grid grid-cols-1 gap-6 md:grid-cols-1'>
-              {teams.map(team => (
-                <TeamCard
-                  key={team.id}
-                  team={team}
-                  onJoin={() => handleJoin(team)}
-                  onMessageLeader={handleMessageLeader}
-                />
-              ))}
-            </div>
+            <>
+              <div className='grid grid-cols-1 gap-6 lg:grid-cols-2'>
+                {teams.map(team => (
+                  <TeamCard
+                    key={team.id}
+                    team={team}
+                    onJoin={() => handleJoin(team)}
+                    onMessageLeader={handleMessageLeader}
+                  />
+                ))}
+              </div>
+              <Pagination
+                currentPage={page}
+                totalPages={totalPages}
+                onPageChange={setPage}
+              />
+            </>
           ) : (
             <div className='flex flex-col items-center justify-center space-y-6 rounded-3xl border border-white/5 bg-[#0D0E10] py-24 text-center'>
               <div className='flex h-20 w-20 items-center justify-center rounded-full bg-white/5'>