Updated login check method.

components/pages/Dashboard.js

@@ -6,6 +6,7 @@ import PageHeader from 'components/layout/PageHeader';
 import WebsiteChartList from 'components/pages/WebsiteChartList';
 import DashboardSettingsButton from 'components/settings/DashboardSettingsButton';
 import useApi from 'hooks/useApi';
+import useRequireLogin from 'hooks/useRequireLogin';
 import useDashboard from 'store/dashboard';
 import DashboardEdit from './DashboardEdit';
 import styles from './WebsiteList.module.css';
@@ -16,6 +17,7 @@ const messages = defineMessages({
 });
 
 export default function Dashboard({ userId }) {
+  const { user } = useRequireLogin();
   const dashboard = useDashboard();
   const { showCharts, limit, editing } = dashboard;
   const [max, setMax] = useState(limit);
@@ -27,7 +29,7 @@ export default function Dashboard({ userId }) {
     setMax(max + limit);
   }
 
-  if (isLoading) {
+  if (!user || isLoading) {
     return <Loading />;
   }
 

components/pages/Settings.js

@@ -1,10 +1,10 @@
 import Layout from 'components/layout/Layout';
 import Menu from 'components/nav/Nav';
-import useUser from 'hooks/useUser';
+import useRequireLogin from 'hooks/useRequireLogin';
 import styles from './Settings.module.css';
 
 export default function Settings({ children }) {
-  const user = useUser();
+  const { user } = useRequireLogin();
 
   if (!user) {
     return null;

hooks/useRequireLogin.js

@@ -0,0 +1,28 @@
+import { useEffect } from 'react';
+import { useRouter } from 'next/router';
+import useApi from 'hooks/useApi';
+import useUser from 'hooks/useUser';
+
+export default function useRequireLogin() {
+  const router = useRouter();
+  const { get } = useApi();
+  const { user, setUser } = useUser();
+
+  useEffect(() => {
+    async function loadUser() {
+      try {
+        const { user } = await get('/auth/verify');
+
+        setUser(user);
+      } catch {
+        await router.push('/login');
+      }
+    }
+
+    if (!user) {
+      loadUser();
+    }
+  }, [user]);
+
+  return { user };
+}

hooks/useUser.js

@@ -1,33 +1,9 @@
-import { useEffect } from 'react';
-import { useRouter } from 'next/router';
 import useStore, { setUser } from 'store/app';
-import useApi from 'hooks/useApi';
 
 const selector = state => state.user;
-let loading = false;
 
 export default function useUser() {
   const user = useStore(selector);
-  const { get } = useApi();
-  const router = useRouter();
 
-  useEffect(() => {
-    async function loadUser() {
-      const { user } = await get('/auth/verify');
-      loading = false;
-
-      if (!user) {
-        await router.push('/login');
-      } else {
-        setUser(user);
-      }
-    }
-
-    if (!user && !loading) {
-      loading = true;
-      loadUser();
-    }
-  }, [user, get, router]);
-
-  return user;
+  return { user, setUser };
 }

pages/console/[[...id]].js

@@ -1,9 +1,9 @@
 import Layout from 'components/layout/Layout';
 import TestConsole from 'components/pages/TestConsole';
-import useUser from 'hooks/useUser';
+import useRequireLogin from 'hooks/useRequireLogin';
 
 export default function ConsolePage({ pageDisabled }) {
-  const user = useUser();
+  const { user } = useRequireLogin();
 
   if (pageDisabled || !user || !user.isAdmin) {
     return null;

pages/dashboard/[[...id]].js

@@ -1,8 +1,8 @@
 import { useRouter } from 'next/router';
 import Layout from 'components/layout/Layout';
 import Dashboard from 'components/pages/Dashboard';
-import useUser from 'hooks/useUser';
 import useConfig from 'hooks/useConfig';
+import useRequireLogin from 'hooks/useRequireLogin';
 
 export default function DashboardPage() {
   const {
@@ -10,7 +10,7 @@ export default function DashboardPage() {
     isReady,
     asPath,
   } = useRouter();
-  const user = useUser();
+  const { user } = useRequireLogin();
   const { adminDisabled } = useConfig();
 
   if (adminDisabled || !user || !isReady) {

pages/realtime.js

@@ -1,9 +1,9 @@
 import Layout from 'components/layout/Layout';
 import RealtimeDashboard from 'components/pages/RealtimeDashboard';
-import useUser from 'hooks/useUser';
+import useRequireLogin from 'hooks/useRequireLogin';
 
 export default function RealtimePage() {
-  const user = useUser();
+  const { user } = useRequireLogin();
 
   if (!user) {
     return null;

pages/websites/[id]/index.js

@@ -1,10 +1,10 @@
 import { useRouter } from 'next/router';
 import Layout from 'components/layout/Layout';
 import WebsiteDetails from 'components/pages/WebsiteDetails';
-import useUser from 'hooks/useUser';
+import useRequireLogin from 'hooks/useRequireLogin';
 
 export default function DetailsPage() {
-  const user = useUser();
+  const { user } = useRequireLogin();
   const router = useRouter();
   const { id } = router.query;
 

pages/websites/index.js

@@ -1,11 +1,10 @@
 import Settings from 'components/pages/Settings';
 import useConfig from 'hooks/useConfig';
-import useUser from 'hooks/useUser';
-
+import useRequireLogin from 'hooks/useRequireLogin';
 import WebsitesList from 'components/pages/WebsitesList';
 
 export default function WebsitesPage() {
-  const user = useUser();
+  const { user } = useRequireLogin();
   const { adminDisabled } = useConfig();
 
   if (adminDisabled || !user) {

queries/admin/team.ts

@@ -26,7 +26,7 @@ export async function getTeamWebsites(teamId: string): Promise<Website[]> {
         name: 'asc',
       },
     ],
-  });
+  } as any);
 }
 
 export async function createTeam(data: Prisma.TeamCreateInput): Promise<Team> {