diff --git a/client/src/components/App.tsx b/client/src/components/App.tsx index f0b3e67..adfb1ae 100644 --- a/client/src/components/App.tsx +++ b/client/src/components/App.tsx @@ -1,4 +1,4 @@ -import React, { FunctionComponent, useState } from 'react'; +import React, { FunctionComponent, useState, useEffect } from 'react'; import { BrowserRouter, Route, Redirect, Switch } from "react-router-dom"; import { HomePage } from './HomePage/HomePage'; import { ProfilePage } from './ProfilePage/ProfilePage'; @@ -6,44 +6,76 @@ import { WorkgroupPage } from './WorkgroupPage/WorkgroupPage'; import { DecisionSupportFilePage } from './DecisionSupportFilePage/DecisionSupportFilePage'; import { DashboardPage } from './DashboardPage/DashboardPage'; import { useUserProfile } from '../gql/queries/profile'; -import { LoggedInContext } from '../hooks/useLoggedIn'; +import { LoggedInContext, getSavedLoggedIn, saveLoggedIn } from '../hooks/useLoggedIn'; import { PrivateRoute } from './PrivateRoute'; import { useKonamiCode } from '../hooks/useKonamiCode'; import { Modal } from './Modal'; +import { createClient } from '../util/apollo'; +import { ApolloProvider } from '@apollo/client'; +import { LogoutPage } from './LogoutPage'; export interface AppProps { } + + export const App: FunctionComponent = () => { - const { user } = useUserProfile(); + const [ loggedIn, setLoggedIn ] = useState(getSavedLoggedIn()); + + const client = createClient((loggedIn) => { + setLoggedIn(loggedIn); + }); + + useEffect(() => { + saveLoggedIn(loggedIn); + }, [loggedIn]); const [ showBoneyM, setShowBoneyM ] = useState(false); useKonamiCode(() => setShowBoneyM(true)); return ( - - - - - - - - - } /> - - - { - showBoneyM ? - setShowBoneyM(false)}> - - : - null - } - + + + + + + + + + + + + } /> + + + { + showBoneyM ? + setShowBoneyM(false)}> + + : + null + } + + ); -} \ No newline at end of file +} + +interface UserSessionCheckProps { + setLoggedIn: (boolean) => void +} + +const UserSessionCheck: FunctionComponent = ({ setLoggedIn }) => { + const { user, loading } = useUserProfile(); + + useEffect(() => { + if (loading) return; + setLoggedIn(user.id !== ''); + }, [user]); + + return null; +}; \ No newline at end of file diff --git a/client/src/components/DashboardPage/DecisionSupportFilePanel.tsx b/client/src/components/DashboardPage/DecisionSupportFilePanel.tsx index 1fa31e8..ba8929d 100644 --- a/client/src/components/DashboardPage/DecisionSupportFilePanel.tsx +++ b/client/src/components/DashboardPage/DecisionSupportFilePanel.tsx @@ -26,8 +26,7 @@ export function DecisionSupportFilePanel() { itemFilter: (item: Item) => (item as DecisionSupportFile).status === DecisionSupportFileStatus.Closed }, ]; - - + return ( boolean } - - export interface ItemPanelProps { className?: string itemIconClassName?: string @@ -30,9 +28,12 @@ export const ItemPanel: FunctionComponent = (props) => { const { title, className, newItemUrl, itemKey, itemLabel, - itemIconClassName, itemUrl + itemIconClassName, itemUrl, } = props; + const items = props.items || []; + const tabs = props.tabs || []; + const [ state, setState ] = useState({ selectedTab: 0, filteredItems: [] }); const filterItemsForTab = (tab: TabDefinition, items: Item[]) => { @@ -42,7 +43,6 @@ export const ItemPanel: FunctionComponent = (props) => { const selectTab = (tabIndex: number) => { setState(state => { - const { tabs, items } = props; const newTab = Array.isArray(tabs) && tabs.length > 0 ? tabs[tabIndex] : null; return { ...state, @@ -61,7 +61,7 @@ export const ItemPanel: FunctionComponent = (props) => { filteredItems: filterItemsForTab(newTab, items), } }); - }, [props.items, props.tabs]); + }, [items, tabs]); const itemElements = state.filteredItems.map((item: Item, i: number) => { return ( @@ -74,8 +74,6 @@ export const ItemPanel: FunctionComponent = (props) => { ); }); - const tabs = props.tabs || []; - return (