Added website and team providers.

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

@@ -1,21 +0,0 @@
-'use client';
-import { useTeam, useTeamUrl } from 'components/hooks';
-import { Loading } from 'react-basics';
-import TeamContext from './TeamContext';
-
-export function Team({ children }) {
-  const { teamId } = useTeamUrl();
-  const { data: team, isLoading } = useTeam(teamId);
-
-  if (isLoading) {
-    return <Loading />;
-  }
-
-  if (!team) {
-    return null;
-  }
-
-  return <TeamContext.Provider value={team}>{children}</TeamContext.Provider>;
-}
-
-export default Team;

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

@@ -1,6 +0,0 @@
-'use client';
-import { createContext } from 'react';
-
-export const TeamContext = createContext(null);
-
-export default TeamContext;

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

@@ -0,0 +1,30 @@
+'use client';
+import { createContext, ReactNode, useEffect } from 'react';
+import { useTeam } from 'components/hooks';
+import { Loading } from 'react-basics';
+import useModified from 'store/modified';
+
+export const TeamContext = createContext(null);
+
+export function TeamProvider({ teamId, children }: { teamId: string; children: ReactNode }) {
+  const modified = useModified(state => state?.[`team:${teamId}`]);
+  const { data: team, isLoading, isFetching, refetch } = useTeam(teamId);
+
+  useEffect(() => {
+    if (modified) {
+      refetch();
+    }
+  }, [modified]);
+
+  if (isFetching && isLoading) {
+    return <Loading />;
+  }
+
+  if (!team) {
+    return null;
+  }
+
+  return <TeamContext.Provider value={team}>{children}</TeamContext.Provider>;
+}
+
+export default TeamProvider;

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

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