diff --git a/frontend/components/App/App.tsx b/frontend/components/App/App.tsx index 4346a3aaff..523877930d 100644 --- a/frontend/components/App/App.tsx +++ b/frontend/components/App/App.tsx @@ -1,10 +1,9 @@ -import React, { useContext, useState } from "react"; +import React, { useContext, useEffect, useState } from "react"; import { AxiosResponse } from "axios"; import { InjectedRouter } from "react-router"; import { QueryClient, QueryClientProvider } from "react-query"; import classnames from "classnames"; -import PATHS from "router/paths"; import TableProvider from "context/table"; import QueryProvider from "context/query"; import PolicyProvider from "context/policy"; @@ -28,9 +27,11 @@ import Spinner from "components/Spinner"; interface IAppProps { children: JSX.Element; router: InjectedRouter; - location?: { - pathname: string; - }; + location: + | { + pathname: string; + } + | undefined; } const App = ({ children, location, router }: IAppProps): JSX.Element => { @@ -48,42 +49,38 @@ const App = ({ children, location, router }: IAppProps): JSX.Element => { const [isLoading, setIsLoading] = useState(false); - useDeepEffect(() => { - const fetchCurrentUser = async () => { - try { - const { user, available_teams } = await usersAPI.me(); - setCurrentUser(user); - setAvailableTeams(available_teams); - } catch (error) { - console.error(error); + const fetchConfig = async () => { + try { + const config = await configAPI.loadAll(); + setConfig(config); + } catch (error) { + console.error(error); + return false; + } finally { + setIsLoading(false); + } + return true; + }; - local.removeItem("auth_token"); - return router.push(PATHS.LOGIN); - } - }; + const fetchCurrentUser = async () => { + try { + const { user, available_teams } = await usersAPI.me(); + setCurrentUser(user); + setAvailableTeams(available_teams); + fetchConfig(); + } catch (error) { + console.log(error); + local.removeItem("auth_token"); + window.location.href = "/login"; + } + return true; + }; - const fetchConfig = async () => { - try { - const config = await configAPI.loadAll(); - setConfig(config); - } catch (error) { - console.error(error); - return false; - } finally { - setIsLoading(false); - } - }; - - // on page refresh - if (!currentUser && authToken()) { + useEffect(() => { + if (authToken()) { fetchCurrentUser(); } - - if (currentUser) { - setIsLoading(true); - fetchConfig(); - } - }, [currentUser, location]); + }, [location?.pathname]); useDeepEffect(() => { const canGetEnrollSecret = @@ -108,7 +105,7 @@ const App = ({ children, location, router }: IAppProps): JSX.Element => { if (canGetEnrollSecret) { getEnrollSecret(); } - }, [currentUser, isGlobalObserver, isOnlyObserver, location]); + }, [currentUser, isGlobalObserver, isOnlyObserver]); // "any" is used on purpose. We are using Axios but this // function expects a native React Error type, which is incompatible. diff --git a/frontend/components/PageHeader/TeamsDropdownHeader.tsx b/frontend/components/PageHeader/TeamsDropdownHeader.tsx index 0f69e36e98..f0064b8f88 100644 --- a/frontend/components/PageHeader/TeamsDropdownHeader.tsx +++ b/frontend/components/PageHeader/TeamsDropdownHeader.tsx @@ -1,9 +1,7 @@ import React, { useCallback, useContext, useEffect } from "react"; -import { useQuery } from "react-query"; import { InjectedRouter } from "react-router/lib/Router"; import { AppContext, IAppContext } from "context/app"; -import usersAPI, { IGetMeResponse } from "services/entities/users"; import TeamsDropdown from "../TeamsDropdown/TeamsDropdown"; @@ -80,13 +78,6 @@ const TeamsDropdownHeader = ({ isOnlyObserver, }; - useQuery(["me"], () => usersAPI.me(), { - onSuccess: ({ user, available_teams }: IGetMeResponse) => { - setCurrentUser(user); - setAvailableTeams(available_teams); - }, - }); - const findAvailableTeam = (id: number) => { return availableTeams?.find((t) => t.id === id); }; diff --git a/frontend/pages/LoginPage/LoginPage.tsx b/frontend/pages/LoginPage/LoginPage.tsx index 3909aaee88..90c34fdb43 100644 --- a/frontend/pages/LoginPage/LoginPage.tsx +++ b/frontend/pages/LoginPage/LoginPage.tsx @@ -82,7 +82,6 @@ const LoginPage = ({ router }: ILoginPageProps) => { if (user.force_password_reset) { return router.push(RESET_PASSWORD); } - return router.push(redirectLocation || HOME); } catch (response) { const errorObject = formatErrorResponse(response); diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx index 5f254b30b0..494799f495 100644 --- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx +++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/TeamDetailsWrapper.tsx @@ -131,6 +131,7 @@ const TeamDetailsWrapper = ({ }>({}); const { refetch: refetchMe } = useQuery(["me"], () => usersAPI.me(), { + enabled: false, onSuccess: ({ user, available_teams }: IGetMeResponse) => { setCurrentUser(user); setAvailableTeams(available_teams); diff --git a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx index 08a9fa71c5..f9beeaa430 100644 --- a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx +++ b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx @@ -10,7 +10,6 @@ import FileSaver from "file-saver"; import enrollSecretsAPI from "services/entities/enroll_secret"; import labelsAPI from "services/entities/labels"; import teamsAPI from "services/entities/teams"; -import usersAPI, { IGetMeResponse } from "services/entities/users"; import globalPoliciesAPI from "services/entities/global_policies"; import teamPoliciesAPI from "services/entities/team_policies"; import hostsAPI, { @@ -146,32 +145,24 @@ const ManageHostsPage = ({ isOnlyObserver, isPremiumTier, isFreeTier, - setAvailableTeams, setCurrentTeam, - setCurrentUser, } = useContext(AppContext); const { renderFlash } = useContext(NotificationContext); - useQuery(["me"], () => usersAPI.me(), { - onSuccess: ({ user, available_teams }: IGetMeResponse) => { - setCurrentUser(user); - setAvailableTeams(available_teams); - if (queryParams.team_id) { - const teamIdParam = parseInt(queryParams.team_id, 10); - if ( - isNaN(teamIdParam) || - (teamIdParam && - available_teams && - !available_teams.find((t) => t.id === teamIdParam)) - ) { - router.replace({ - pathname: location.pathname, - query: omit(queryParams, "team_id"), - }); - } - } - }, - }); + if (queryParams.team_id) { + const teamIdParam = parseInt(queryParams.team_id, 10); + if ( + isNaN(teamIdParam) || + (teamIdParam && + availableTeams && + !availableTeams.find((team) => team.id === teamIdParam)) + ) { + router.replace({ + pathname: location.pathname, + query: omit(queryParams, "team_id"), + }); + } + } const { selectedOsqueryTable, setSelectedOsqueryTable } = useContext( QueryContext diff --git a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx index 6d508bc98c..4e6509fd73 100644 --- a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx +++ b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx @@ -17,7 +17,6 @@ import configAPI from "services/entities/config"; import globalPoliciesAPI from "services/entities/global_policies"; import teamPoliciesAPI from "services/entities/team_policies"; import teamsAPI from "services/entities/teams"; -import usersAPI, { IGetMeResponse } from "services/entities/users"; import Button from "components/buttons/Button"; import RevealButton from "components/buttons/RevealButton"; @@ -30,7 +29,7 @@ import AddPolicyModal from "./components/AddPolicyModal"; import RemovePoliciesModal from "./components/RemovePoliciesModal"; interface IManagePoliciesPageProps { - router: InjectedRouter; // v3 + router: InjectedRouter; location: { action: string; hash: string; @@ -97,13 +96,6 @@ const ManagePolicyPage = ({ setLastEditedQueryPlatform(null); }, []); - useQuery(["me"], () => usersAPI.me(), { - onSuccess: ({ user, available_teams }: IGetMeResponse) => { - setCurrentUser(user); - setAvailableTeams(available_teams); - }, - }); - const { data: globalPolicies, error: globalPoliciesError, diff --git a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx index f371e19f40..d8b930c469 100644 --- a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx +++ b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx @@ -19,7 +19,6 @@ import fleetQueriesAPI from "services/entities/queries"; import globalScheduledQueriesAPI from "services/entities/global_scheduled_queries"; import teamScheduledQueriesAPI from "services/entities/team_scheduled_queries"; import teamsAPI from "services/entities/teams"; -import usersAPI, { IGetMeResponse } from "services/entities/users"; import sortUtils from "utilities/sort"; import paths from "router/paths"; @@ -122,8 +121,6 @@ const ManageSchedulePage = ({ isPremiumTier, isFreeTier, currentTeam, - setAvailableTeams, - setCurrentUser, setCurrentTeam, } = useContext(AppContext); @@ -144,13 +141,6 @@ const ManageSchedulePage = ({ return filteredSortedTeams; }; - useQuery(["me"], () => usersAPI.me(), { - onSuccess: ({ user, available_teams }: IGetMeResponse) => { - setCurrentUser(user); - setAvailableTeams(available_teams); - }, - }); - const { data: teams, isLoading: isLoadingTeams } = useQuery( ["teams"], () => teamsAPI.loadAll({}), diff --git a/frontend/router/index.tsx b/frontend/router/index.tsx index 459776038e..d7516c1418 100644 --- a/frontend/router/index.tsx +++ b/frontend/router/index.tsx @@ -56,13 +56,18 @@ import RoutingProvider from "context/routing"; interface IAppWrapperProps { children: JSX.Element; router: InjectedRouter; + location?: { + pathname: string; + }; } // App.tsx needs the context for user and config -const AppWrapper = ({ children, router }: IAppWrapperProps) => ( +const AppWrapper = ({ children, router, location }: IAppWrapperProps) => ( - {children} + + {children} + );