Handle when team not found.

src/app/(main)/teams/[teamId]/Team.tsx

@@ -0,0 +1,21 @@
+'use client';
+import { useTeam, useTeamContext } from 'components/hooks';
+import { Loading } from 'react-basics';
+import notFound from 'app/not-found';
+
+export function Team({ children }) {
+  const { teamId } = useTeamContext();
+  const { data: team, isLoading } = useTeam(teamId);
+
+  if (isLoading) {
+    return <Loading />;
+  }
+
+  if (!team) {
+    return notFound();
+  }
+
+  return children;
+}
+
+export default Team;

src/app/(main)/teams/[teamId]/layout.tsx

@@ -0,0 +1,5 @@
+import Team from './Team';
+
+export default function ({ children }) {
+  return <Team>{children}</Team>;
+}