Merge pull request #5731 from beyondessential/release-2024-25

Release 2024-25

.prettierrc → .prettierrc.js

@@ -1,4 +1,4 @@
-{
+module.exports = {
   "arrowParens": "avoid",
   "printWidth": 100,
   "singleQuote": true,

packages/admin-panel/src/App.jsx

@@ -3,17 +3,17 @@
  *  Copyright (c) 2017 - 2024 Beyond Essential Systems Pty Ltd
  */
 import React from 'react';
-import PropTypes from 'prop-types';
 import { Navigate, Route, Routes } from 'react-router-dom';
-import { connect } from 'react-redux';
-import { AppPageLayout, Footer } from './layout';
-import { ROUTES } from './routes';
+import { AppPageLayout, AuthLayout, Footer } from './layout';
+import { AUTH_ROUTES, ROUTES } from './routes';
 import { PROFILE_ROUTES } from './profileRoutes';
-import { getHasBESAdminAccess, getUser, PrivateRoute } from './authentication';
+import { PrivateRoute } from './authentication';
 import { LoginPage } from './pages/LoginPage';
-import { LogoutPage } from './pages/LogoutPage';
 import { ResourcePage } from './pages/resources/ResourcePage';
 import { TabPageLayout } from './layout/TabPageLayout';
+import { useUser } from './api/queries';
+import { getHasBESAdminAccess } from './utilities/getHasBESAdminAccess';
+import { ForgotPasswordPage, ResetPasswordPage } from './pages';
 
 export const getFlattenedChildViews = (route, basePath = '') => {
   return route.childViews.reduce((acc, childView) => {
@@ -45,7 +45,9 @@ export const getFlattenedChildViews = (route, basePath = '') => {
   }, []);
 };
 
-export const App = ({ user, hasBESAdminAccess }) => {
+const App = () => {
+  const { data: user } = useUser();
+  const hasBESAdminAccess = getHasBESAdminAccess(user);
   const userHasAccessToTab = tab => {
     if (tab.isBESAdminOnly) {
       return !!hasBESAdminAccess;
@@ -69,13 +71,15 @@ export const App = ({ user, hasBESAdminAccess }) => {
   const accessibleRoutes = getAccessibleRoutes();
   return (
     <Routes>
-      <Route path="/login" element={<LoginPage />} />
-      <Route path="/logout" element={<LogoutPage />} />
+      <Route element={<AuthLayout />}>
+        <Route path={AUTH_ROUTES.LOGIN} element={<LoginPage />} />
+        <Route path={AUTH_ROUTES.FORGOT_PASSWORD} element={<ForgotPasswordPage />} />
+        <Route path={AUTH_ROUTES.RESET_PASSWORD} element={<ResetPasswordPage />} />
+      </Route>
       <Route path="/" element={<PrivateRoute />}>
         <Route
           element={
             <AppPageLayout
-              user={user}
               routes={accessibleRoutes}
               profileLink={{ label: 'Profile', to: '/profile' }}
             />
@@ -117,24 +121,4 @@ export const App = ({ user, hasBESAdminAccess }) => {
   );
 };
 
-App.defaultProps = {
-  hasBESAdminAccess: false,
-};
-
-App.propTypes = {
-  user: PropTypes.shape({
-    name: PropTypes.string.isRequired,
-    email: PropTypes.string.isRequired,
-    firstName: PropTypes.string,
-    profileImage: PropTypes.string,
-  }).isRequired,
-  hasBESAdminAccess: PropTypes.bool,
-};
-
-export default connect(
-  state => ({
-    user: getUser(state),
-    hasBESAdminAccess: getHasBESAdminAccess(state),
-  }),
-  null,
-)(App);
+export default App;

packages/admin-panel/src/VizBuilderApp/App.jsx

@@ -10,18 +10,10 @@ import { matchRoutes } from 'react-router-dom';
 import { FullPageLoader } from '@tupaia/ui-components';
 import { Main } from './views/Main';
 import { CreateNew } from './views/CreateNew';
-import { useUser } from './api/queries';
 import { VizConfigProvider as StateProvider } from './context';
 import { useVizBuilderBasePath } from './utils';
-import { NavPanel } from './components';
-
-const Wrapper = styled.main`
-  display: flex;
-  flex-direction: column;
-  background: ${props => props.theme.palette.background.default};
-  height: 100vh;
-  overflow: hidden;
-`;
+import { SimplePageLayout } from '../layout';
+import { useUser } from '../api/queries';
 
 const Container = styled.div`
   flex: 1;
@@ -62,15 +54,13 @@ export const App = ({ Footer, homeLink, logo }) => {
 
   return (
     <StateProvider>
-      <Wrapper>
-        <NavPanel logo={logo} homeLink={homeLink} />
-
+      <SimplePageLayout logo={logo} homeLink={homeLink}>
         <Container>
           {/** Workaround for handling issues with this nested app */}
           {renderMatches(matches)}
           {Footer && <Footer />}
         </Container>
-      </Wrapper>
+      </SimplePageLayout>
     </StateProvider>
   );
 };

packages/admin-panel/src/VizBuilderApp/api/constants.js

@@ -5,7 +5,7 @@
 
 // @see https://react-query.tanstack.com/overview
 export const DEFAULT_REACT_QUERY_OPTIONS = {
-  retry: 0,
+  retry: false,
   // should be refetched in the background every hour
   refetchOnWindowFocus: false,
   cacheTime: 0, // disable cache entirely because we always need to show live data

packages/admin-panel/src/VizBuilderApp/api/queries/index.js

@@ -6,7 +6,6 @@ export * from './useLocations';
 export * from './useProjects';
 export * from './useProject';
 export * from './useReportPreview';
-export * from './useUser';
 export * from './useDashboardVisualisation';
 export * from './useMapOverlays';
 export * from './useCountries';

packages/admin-panel/src/VizBuilderApp/components/index.js

@@ -10,4 +10,3 @@ export * from './PreviewSection';
 export * from './PreviewOptions';
 export * from './PlayButton';
 export * from './SaveButton';
-export { NavPanel } from './NavPanel';

packages/admin-panel/src/api/TupaiaApi.js

@@ -5,11 +5,10 @@
 
 import { saveAs } from 'file-saver';
 import { parse } from 'content-disposition-header';
+import { logout } from '../authentication';
 
 import { verifyResponseStatus, stringifyQuery } from '@tupaia/utils';
 
-import { logout } from '../authentication';
-
 const FETCH_TIMEOUT = 120 * 1000; // 120 seconds in milliseconds
 
 const isJsonResponse = response => {
@@ -36,20 +35,6 @@ export class TupaiaApi {
     this.store.dispatch(action);
   }
 
-  async login(loginCredentials) {
-    const { body: authenticationDetails } = await this.post(
-      'login',
-      null,
-      loginCredentials,
-      this.clientBasicAuthHeader,
-    );
-    return authenticationDetails;
-  }
-
-  async logout() {
-    await this.post('logout');
-  }
-
   get(endpoint, queryParameters) {
     return this.requestJson(endpoint, queryParameters, this.buildFetchConfig('GET'));
   }
@@ -153,21 +138,10 @@ export class TupaiaApi {
     return { headers: response.headers, body };
   }
 
-  async checkIfAuthorized(response) {
-    // Unauthorized
-    if (response.status === 401) {
-      const data = await response.json();
-      this.dispatch(logout(data.error)); // log out if user is unauthorized
-      throw new Error(data.error);
-    }
-  }
-
   async request(endpoint, queryParameters, fetchConfig) {
     const queryUrl = stringifyQuery(this.apiUrl, endpoint, queryParameters);
     const response = await Promise.race([fetch(queryUrl, fetchConfig), createTimeoutPromise()]);
 
-    await this.checkIfAuthorized(response);
-
     await verifyResponseStatus(response);
     return response;
   }

packages/admin-panel/src/api/mutations/index.js

@@ -0,0 +1,11 @@
+/*
+ * Tupaia
+ *  Copyright (c) 2017 - 2024 Beyond Essential Systems Pty Ltd
+ */
+
+export { useLogout } from './useLogout';
+export { useLogin } from './useLogin';
+export { useUpdateProfile } from './useUpdateProfile';
+export { useResetPassword } from './useResetPassword';
+export { useRequestResetPassword } from './useRequestResetPassword';
+export { useOneTimeLogin } from './useOneTimeLogin';

packages/admin-panel/src/api/mutations/useLogin.js

@@ -0,0 +1,40 @@
+/*
+ * Tupaia
+ *  Copyright (c) 2017 - 2024 Beyond Essential Systems Pty Ltd
+ */
+
+import { useMutation, useQueryClient } from 'react-query';
+import { useLocation, useNavigate } from 'react-router-dom';
+import { post } from '../../VizBuilderApp/api';
+
+export const useLogin = homeLink => {
+  const queryClient = useQueryClient();
+  const navigate = useNavigate();
+  const location = useLocation();
+  const from = location.state?.from;
+
+  return useMutation(
+    ({ email, password }) => {
+      return post('login', {
+        data: {
+          emailAddress: email,
+          password,
+        },
+      });
+    },
+    {
+      onSuccess: async () => {
+        await queryClient.invalidateQueries();
+        if (from) {
+          navigate(from, {
+            state: null,
+          });
+        } else {
+          navigate(homeLink, {
+            state: null,
+          });
+        }
+      },
+    },
+  );
+};

packages/admin-panel/src/api/mutations/useLogout.js

@@ -0,0 +1,18 @@
+/*
+ * Tupaia
+ *  Copyright (c) 2017 - 2024 Beyond Essential Systems Pty Ltd
+ */
+
+import { useMutation, useQueryClient } from 'react-query';
+import { post } from '../../VizBuilderApp/api';
+
+export const useLogout = onSuccess => {
+  const queryClient = useQueryClient();
+
+  return useMutation('logout', () => post('logout'), {
+    onSuccess: () => {
+      queryClient.invalidateQueries();
+      if (onSuccess) onSuccess();
+    },
+  });
+};

packages/admin-panel/src/api/mutations/useOneTimeLogin.js

@@ -0,0 +1,25 @@
+/*
+ * Tupaia
+ *  Copyright (c) 2017 - 2023 Beyond Essential Systems Pty Ltd
+ */
+
+import { useMutation, useQueryClient } from 'react-query';
+import { post } from '../../VizBuilderApp/api';
+
+export const useOneTimeLogin = () => {
+  const queryClient = useQueryClient();
+  return useMutation(
+    token => {
+      return post('login/oneTimeLogin', {
+        data: {
+          token,
+        },
+      });
+    },
+    {
+      onSuccess: () => {
+        queryClient.invalidateQueries();
+      },
+    },
+  );
+};

packages/admin-panel/src/api/mutations/useRequestResetPassword.js

@@ -0,0 +1,18 @@
+/*
+ * Tupaia
+ *  Copyright (c) 2017 - 2024 Beyond Essential Systems Pty Ltd
+ */
+
+import { useMutation } from 'react-query';
+import { post } from '../../VizBuilderApp/api';
+
+export const useRequestResetPassword = () => {
+  return useMutation(({ emailAddress }) => {
+    return post('requestResetPassword', {
+      data: {
+        emailAddress,
+        resetPasswordUrl: window.location.origin,
+      },
+    });
+  });
+};