[To Main] Add tenant listing page

CHANGELOG.MD

@@ -1,14 +1,18 @@
 ## May 10, 2024
 
 - **Bugfix** Language picker should only appear on engagements with more than one language [🎟️ DESENG-575](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-575)
-- Allow for the web app to see if there are available translations by language
-- Disable language switching itself for now until design decisions are made
+  - Allow for the web app to see if there are available translations by language
+  - Disable language switching itself for now until design decisions are made
 
 ## May 9, 2024
 
 - **Feature** [Engagement Filtering UXD] - Public | No Results Message [🎟️ DESENG-586](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-586)
   - Added a new no results page to display to users when their search term(s) and / or filter(s) returns no engagement results on landing page.
   - Contact information is developed but hidden currently as this was the approach requested in the ticket till the contact information is decided.
+- **Feature** Added the initial version of the tenant listing page [🎟️ DESENG-592](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-592)
+  - The page lists all tenants in the system
+  - Functionality to view or create individual tenants is still under construction
+  - Began work on adding new components from the MET component library, with high reusability in mind
 
 ## May 8, 2024
 
@@ -22,12 +26,12 @@
 - **Feature** Ensure users can belong to more than one tenant [🎟️ DESENG-478](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-478)
   - Tested users can belong to more than one tenant.
   - Overide the default tenant filter for staff_user table to check with user_group_membership table.
-  
+
 ## May 6, 2024
 
 - **Feature** Auto-populate question descriptions [🎟️ DESENG-596](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-596)
-  - Upgrading the version of met-formio to version 1.0.15-rc1. This version has the changes to have a default 
-  description for the form components. The changes were pushed to met-formio by the PR: https://github.com/bcgov/met-formio/pull/25.
+  - Upgrading the version of met-formio to version 1.0.15-rc1. This version has the changes to have a default
+    description for the form components. The changes were pushed to met-formio by the PR: https://github.com/bcgov/met-formio/pull/25.
 
 ## May 2, 2024
 

met-api/src/met_api/resources/tenant.py

@@ -11,7 +11,7 @@
 # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 # See the License for the specific language governing permissions and
 # limitations under the License.
-"""API endpoints for managing an tenant resource."""
+"""API endpoints for managing tenant resources."""
 
 from http import HTTPStatus
 
@@ -20,6 +20,8 @@
 
 from met_api.auth import auth
 from met_api.services.tenant_service import TenantService
+from met_api.utils.roles import Role
+from met_api.utils.tenant_validator import require_role
 from met_api.utils.util import allowedorigins, cors_preflight
 
 
@@ -28,10 +30,28 @@
 """
 
 
+@cors_preflight('GET OPTIONS')
+@API.route('/')
+class Tenants(Resource):
+    """Resource for managing tenants."""
+
+    @staticmethod
+    @cross_origin(origins=allowedorigins())
+    @require_role(Role.SUPER_ADMIN.value)
+    def get():
+        """Fetch all tenants."""
+        try:
+            tenants = TenantService().get_all()
+
+            return tenants, HTTPStatus.OK
+        except ValueError as err:
+            return str(err), HTTPStatus.INTERNAL_SERVER_ERROR
+
+
 @cors_preflight('GET OPTIONS')
 @API.route('/<tenant_id>')
-class Feedback(Resource):
-    """Resource for managing feedbacks."""
+class Tenant(Resource):
+    """Resource for managing a single tenant."""
 
     @staticmethod
     @cross_origin(origins=allowedorigins())

met-api/src/met_api/services/tenant_service.py

@@ -29,3 +29,8 @@ def get(cls, tenant_id):
         if not tenant:
             raise ValueError('Tenant not found.', cls, tenant_id)
         return TenantSchema().dump(tenant)
+
+    def get_all(self):
+        """Get all tenants."""
+        tenants = TenantModel.query.all()
+        return TenantSchema().dump(tenants, many=True)

met-web/src/App.tsx

@@ -4,7 +4,7 @@ import './App.scss';
 import { Route, BrowserRouter as Router, Routes } from 'react-router-dom';
 import { useAppSelector, useAppDispatch } from './hooks';
 import { MidScreenLoader, MobileToolbar } from './components/common';
-import { Box, Container, useMediaQuery, Theme, Toolbar } from '@mui/material';
+import { Box, Container, useMediaQuery, Theme } from '@mui/material';
 import InternalHeader from './components/layout/Header/InternalHeader';
 import PublicHeader from './components/layout/Header/PublicHeader';
 import UnauthenticatedRoutes from './routes/UnauthenticatedRoutes';
@@ -225,7 +225,7 @@ const App = () => {
             <Router basename={tenant.basename}>
                 <DocumentTitle />
                 <InternalHeader />
-                <Container>
+                <Container sx={{ padding: { xs: 0, sm: 0, md: 0 } }}>
                     <MobileToolbar />
                     <AuthenticatedRoutes />
                     <FeedbackModal />
@@ -242,8 +242,7 @@ const App = () => {
                 <InternalHeader drawerWidth={drawerWidth} />
                 <Notification />
                 <NotificationModal />
-                <Box component="main" sx={{ flexGrow: 1, width: `calc(100% - ${drawerWidth}px)`, marginTop: '17px' }}>
-                    <Toolbar />
+                <Box component="main" sx={{ flexGrow: 1, width: `calc(100% - ${drawerWidth}px)`, marginTop: '80px' }}>
                     <AuthenticatedRoutes />
                     <FeedbackModal />
                 </Box>

met-web/src/apiManager/endpoints/index.ts

@@ -174,6 +174,7 @@ const Endpoints = {
     },
     Tenants: {
         GET: `${AppConfig.apiUrl}/tenants/tenant_id`,
+        GET_LIST: `${AppConfig.apiUrl}/tenants/`,
     },
     AnalyticsUserResponseDetail: {
         GET_COUNT_BY_MONTH: `${AppConfig.analyticsApiUrl}/responses/month/engagement_id`,

met-web/src/components/FormCAC/FirstTab.tsx

@@ -3,7 +3,7 @@ import { useForm, Controller } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import * as yup from 'yup';
 import { Checkbox, FormControlLabel, FormGroup, FormHelperText, Grid, Link } from '@mui/material';
-import { MetLabel, MetParagraph, PrimaryButton } from 'components/common';
+import { MetLabel, MetParagraphOld, PrimaryButtonOld } from 'components/common';
 import { FormContext } from './FormContext';
 import { TAB_TWO } from './constants';
 import { When } from 'react-if';
@@ -52,15 +52,15 @@ export const FirstTab: React.FC = () => {
         <Grid container spacing={2}>
             <Grid item xs={12}>
                 <MetLabel>{translate('formCAC.tab1.labels.0')}</MetLabel>
-                <MetParagraph>{translate('formCAC.tab1.paragraph.0')}</MetParagraph>
+                <MetParagraphOld>{translate('formCAC.tab1.paragraph.0')}</MetParagraphOld>
             </Grid>
             <Grid item xs={12}>
-                <MetParagraph>{translate('formCAC.tab1.paragraph.1')}</MetParagraph>
+                <MetParagraphOld>{translate('formCAC.tab1.paragraph.1')}</MetParagraphOld>
             </Grid>
 
             <Grid item xs={12}>
                 <MetLabel>{translate('formCAC.tab1.labels.1')}</MetLabel>
-                <MetParagraph>{translate('formCAC.tab1.paragraph.2')}</MetParagraph>
+                <MetParagraphOld>{translate('formCAC.tab1.paragraph.2')}</MetParagraphOld>
             </Grid>
 
             <Grid item xs={12}>
@@ -125,9 +125,9 @@ export const FirstTab: React.FC = () => {
             </Grid>
 
             <Grid item xs={12}>
-                <PrimaryButton onClick={handleSubmit(handleNextClick)}>
+                <PrimaryButtonOld onClick={handleSubmit(handleNextClick)}>
                     {translate('formCAC.tab1.button.next')}
-                </PrimaryButton>
+                </PrimaryButtonOld>
             </Grid>
         </Grid>
     );

met-web/src/components/FormCAC/Form.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { MetHeader1, MetPaper, MetParagraph } from 'components/common';
+import { MetHeader1Old, MetPaper, MetParagraphOld } from 'components/common';
 import { Grid } from '@mui/material';
 import { Banner } from 'components/banner/Banner';
 import LandingPageBanner from 'assets/images/LandingPageBanner.png';
@@ -43,10 +43,10 @@ export const Form = () => {
                             rowSpacing={2}
                         >
                             <Grid item xs={12}>
-                                <MetHeader1>{translate('formCAC.form.header')}</MetHeader1>
+                                <MetHeader1Old>{translate('formCAC.form.header')}</MetHeader1Old>
                             </Grid>
                             <Grid item xs={12}>
-                                <MetParagraph>{translate('formCAC.form.paragraph')}</MetParagraph>
+                                <MetParagraphOld>{translate('formCAC.form.paragraph')}</MetParagraphOld>
                             </Grid>
                         </Grid>
                     </Grid>

met-web/src/components/FormCAC/SecondTab.tsx

@@ -1,6 +1,6 @@
 import React, { useContext, useState } from 'react';
 import { Grid } from '@mui/material';
-import { MetDescription, MetLabel, PrimaryButton } from 'components/common';
+import { MetDescription, MetLabel, PrimaryButtonOld } from 'components/common';
 import { FormContext } from './FormContext';
 import * as yup from 'yup';
 import ControlledTextField from 'components/common/ControlledInputComponents/ControlledTextField';
@@ -122,9 +122,9 @@ export const SecondTab = () => {
             </Grid>
 
             <Grid item xs={12}>
-                <PrimaryButton loading={submittingForm} onClick={handleSubmit(onSubmit)}>
+                <PrimaryButtonOld loading={submittingForm} onClick={handleSubmit(onSubmit)}>
                     {translate('formCAC.tab2.button.submit')}
-                </PrimaryButton>
+                </PrimaryButtonOld>
             </Grid>
         </Grid>
     );

met-web/src/components/Login/index.tsx

@@ -2,20 +2,20 @@ import React from 'react';
 import UserService from 'services/userService';
 import { Grid } from '@mui/material';
 import { useAppSelector } from 'hooks';
-import { PrimaryButton } from 'components/common';
+import { PrimaryButtonOld } from 'components/common';
 const Login = () => {
     const isLoggedIn = useAppSelector((state) => state.user.authentication.authenticated);
 
     return (
         <Grid container direction="row" justifyContent="flex-start" alignItems="flex-start" spacing={2} padding="2em">
             {isLoggedIn ? (
-                <PrimaryButton className="btn btn-lg btn-warning" onClick={() => UserService.doLogout()}>
+                <PrimaryButtonOld className="btn btn-lg btn-warning" onClick={() => UserService.doLogout()}>
                     Logout
-                </PrimaryButton>
+                </PrimaryButtonOld>
             ) : (
-                <PrimaryButton className="btn btn-lg btn-warning" onClick={() => UserService.doLogin()}>
+                <PrimaryButtonOld className="btn btn-lg btn-warning" onClick={() => UserService.doLogin()}>
                     Login
-                </PrimaryButton>
+                </PrimaryButtonOld>
             )}
         </Grid>
     );