diff --git a/CHANGELOG.MD b/CHANGELOG.MD index bca8cc2fc..c9ce6fabd 100644 --- a/CHANGELOG.MD +++ b/CHANGELOG.MD @@ -19,14 +19,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 diff --git a/met-api/src/met_api/resources/tenant.py b/met-api/src/met_api/resources/tenant.py index 3e3fff5a5..be3386b0f 100644 --- a/met-api/src/met_api/resources/tenant.py +++ b/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('/') -class Feedback(Resource): - """Resource for managing feedbacks.""" +class Tenant(Resource): + """Resource for managing a single tenant.""" @staticmethod @cross_origin(origins=allowedorigins()) diff --git a/met-api/src/met_api/services/tenant_service.py b/met-api/src/met_api/services/tenant_service.py index 0797bee97..8a0fd7b3a 100644 --- a/met-api/src/met_api/services/tenant_service.py +++ b/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) diff --git a/met-web/src/App.tsx b/met-web/src/App.tsx index ebd897a8e..89b0c50b6 100644 --- a/met-web/src/App.tsx +++ b/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 = () => { - + @@ -242,8 +242,7 @@ const App = () => { - - + diff --git a/met-web/src/apiManager/endpoints/index.ts b/met-web/src/apiManager/endpoints/index.ts index 85f0f05f5..f9a9f23cb 100644 --- a/met-web/src/apiManager/endpoints/index.ts +++ b/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`, diff --git a/met-web/src/components/FormCAC/FirstTab.tsx b/met-web/src/components/FormCAC/FirstTab.tsx index 1b6f6f7b9..97d1b8687 100644 --- a/met-web/src/components/FormCAC/FirstTab.tsx +++ b/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 = () => { {translate('formCAC.tab1.labels.0')} - {translate('formCAC.tab1.paragraph.0')} + {translate('formCAC.tab1.paragraph.0')} - {translate('formCAC.tab1.paragraph.1')} + {translate('formCAC.tab1.paragraph.1')} {translate('formCAC.tab1.labels.1')} - {translate('formCAC.tab1.paragraph.2')} + {translate('formCAC.tab1.paragraph.2')} @@ -125,9 +125,9 @@ export const FirstTab: React.FC = () => { - + {translate('formCAC.tab1.button.next')} - + ); diff --git a/met-web/src/components/FormCAC/Form.tsx b/met-web/src/components/FormCAC/Form.tsx index 4601928a2..41b3be8a5 100644 --- a/met-web/src/components/FormCAC/Form.tsx +++ b/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} > - {translate('formCAC.form.header')} + {translate('formCAC.form.header')} - {translate('formCAC.form.paragraph')} + {translate('formCAC.form.paragraph')} diff --git a/met-web/src/components/FormCAC/SecondTab.tsx b/met-web/src/components/FormCAC/SecondTab.tsx index 2e36bbef5..be8082b00 100644 --- a/met-web/src/components/FormCAC/SecondTab.tsx +++ b/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 = () => { - + {translate('formCAC.tab2.button.submit')} - + ); diff --git a/met-web/src/components/Login/index.tsx b/met-web/src/components/Login/index.tsx index 05072afb9..776e257c9 100644 --- a/met-web/src/components/Login/index.tsx +++ b/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 ( {isLoggedIn ? ( - UserService.doLogout()}> + UserService.doLogout()}> Logout - + ) : ( - UserService.doLogin()}> + UserService.doLogin()}> Login - + )} ); diff --git a/met-web/src/components/MetDesignSystem/index.tsx b/met-web/src/components/MetDesignSystem/index.tsx new file mode 100644 index 000000000..e69de29bb diff --git a/met-web/src/components/comments/admin/review/CommentReview.tsx b/met-web/src/components/comments/admin/review/CommentReview.tsx index 7db75ad8c..d6ae50b1f 100644 --- a/met-web/src/components/comments/admin/review/CommentReview.tsx +++ b/met-web/src/components/comments/admin/review/CommentReview.tsx @@ -19,13 +19,13 @@ import { useParams, useNavigate } from 'react-router-dom'; import { openNotification } from 'services/notificationService/notificationSlice'; import { MetLabel, - MetParagraph, + MetParagraphOld, MetPageGridContainer, - PrimaryButton, - SecondaryButton, + PrimaryButtonOld, + SecondaryButtonOld, MetHeader3, MetHeader4, - MetSmallText, + MetSmallTextOld, MetTooltip, } from 'components/common'; import { CommentStatus } from 'constants/commentStatus'; @@ -227,7 +227,7 @@ const CommentReview = () => { Comment ID: - {id} + {id} @@ -236,7 +236,7 @@ const CommentReview = () => { Status: - {CommentStatus[comment_status_id]} + {CommentStatus[comment_status_id]} @@ -245,7 +245,7 @@ const CommentReview = () => { Comment Date: - {formatDate(created_date)} + {formatDate(created_date)} @@ -254,7 +254,7 @@ const CommentReview = () => { Reviewed by: - {reviewed_by} + {reviewed_by} @@ -263,7 +263,7 @@ const CommentReview = () => { Date Reviewed: - {formatDate(review_date)} + {formatDate(review_date)} @@ -315,7 +315,7 @@ const CommentReview = () => { {comment.label ?? 'Label not available.'} - {comment.text} + {comment.text} @@ -347,17 +347,17 @@ const CommentReview = () => { } - label={Approve} + label={Approve} /> } - label={Reject} + label={Reject} /> } - label={Needs further review} + label={Needs further review} /> @@ -369,7 +369,7 @@ const CommentReview = () => { Reason for Rejection Contains personal information} + label={Contains personal information} control={ { /> Contains profanity or inappropriate language + + Contains profanity or inappropriate language + } control={ { } /> Contains threat/menace} + label={Contains threat/menace} control={ { /> } /> - + {translate('comment.admin.review.threatTextOne')}{' '} {translate('comment.admin.review.threatContact')}{' '} {translate('comment.admin.review.threatTextTwo')}{' '} {threatEmailContact} - + Other} + label={Other} control={ { /> } /> - + This will be inserted in the email sent to the respondent: - + We have reviewed your feedback and can't accept it for the following reason(s): - Your feedback contains "other" - - + + { multiline />
- + Review Notes - - + + This note will be inserted in the email sent to the respondent to help them understand what needs to be edited for their comment(s) to be approved. - + {reviewNotes.map((staffNote) => { return ( { alignItems="flex-end" justifyContent="flex-end" > - {'Preview Email'} + + {'Preview Email'} +
@@ -495,18 +501,18 @@ const CommentReview = () => { ); })}
- + Clicking the "Save" button will trigger an automatic email to be sent to the person who made this comment. They will have the option to edit and re-submit their comment. The edited comment will have to be approved before it is published. - +
+ Don't send this email to the person who commented. - + } control={ { - + {'Save & Continue'} - + - navigate(-1)}>Cancel + navigate(-1)}>Cancel diff --git a/met-web/src/components/comments/admin/review/emailPreview/EmailPreview.tsx b/met-web/src/components/comments/admin/review/emailPreview/EmailPreview.tsx index 76ca9e076..cf6a37e7a 100644 --- a/met-web/src/components/comments/admin/review/emailPreview/EmailPreview.tsx +++ b/met-web/src/components/comments/admin/review/emailPreview/EmailPreview.tsx @@ -1,6 +1,6 @@ import { Box, Grid, Stack, Link } from '@mui/material'; import * as React from 'react'; -import { MetBody } from 'components/common'; +import { MetBodyOld } from 'components/common'; import { ReactComponent as BCLogo } from 'assets/images/BritishColumbiaLogoDark.svg'; import { Survey } from 'models/survey'; import dayjs from 'dayjs'; @@ -36,13 +36,13 @@ export default function EmailPreview({ /> - + Thank you for taking the time to provide your feedback on {engagementName}. - + {children} - + {!isClosed ? ( <> You can edit and re-submit your feedback. The comment period is open until {''} @@ -54,11 +54,11 @@ export default function EmailPreview({ your feedback cannot be edited. )} - + {!isClosed ? ( - Edit your feedback - + ) : null} - Thank you, + Thank you, - The {tenant.name} Team + The {tenant.name} Team diff --git a/met-web/src/components/comments/admin/review/emailPreview/EmailPreviewModal.tsx b/met-web/src/components/comments/admin/review/emailPreview/EmailPreviewModal.tsx index dd02f731d..790d6d1d0 100644 --- a/met-web/src/components/comments/admin/review/emailPreview/EmailPreviewModal.tsx +++ b/met-web/src/components/comments/admin/review/emailPreview/EmailPreviewModal.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid, Modal } from '@mui/material'; -import { PrimaryButton, modalStyle } from 'components/common'; +import { PrimaryButtonOld, modalStyle } from 'components/common'; type EmailModal = { open: boolean; @@ -26,7 +26,7 @@ const EmailPreviewModal = ({ open, header, renderEmail, handleClose }: EmailModa {renderEmail} - handleClose()}>Close Preview + handleClose()}>Close Preview diff --git a/met-web/src/components/comments/admin/review/emailPreview/EmailTemplates.tsx b/met-web/src/components/comments/admin/review/emailPreview/EmailTemplates.tsx index ef442ae08..7c6374099 100644 --- a/met-web/src/components/comments/admin/review/emailPreview/EmailTemplates.tsx +++ b/met-web/src/components/comments/admin/review/emailPreview/EmailTemplates.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { MetBody } from 'components/common'; +import { MetBodyOld } from 'components/common'; import { Grid } from '@mui/material'; import { When } from 'react-if'; import { StaffNote } from 'models/staffNote'; @@ -20,29 +20,31 @@ export const RejectEmailTemplate = ({ }: RejectionEmailProps) => ( <> - + We have reviewed your feedback and canโ€™t accept it for the following reason(s): - +
  • - Your feedback contains personal information + Your feedback contains personal information
  • - Your feedback contains profanity or inappropriate language + + Your feedback contains profanity or inappropriate language +
  • - {` Your feedback contains ${otherReason}.`} + {` Your feedback contains ${otherReason}.`}
    • @@ -50,7 +52,7 @@ export const RejectEmailTemplate = ({ - {reviewNotes ? reviewNotes[0]?.note : ''} + {reviewNotes ? reviewNotes[0]?.note : ''} diff --git a/met-web/src/components/comments/admin/reviewListing/AdvancedSearch.tsx b/met-web/src/components/comments/admin/reviewListing/AdvancedSearch.tsx index 4659b3419..1a66e1de4 100644 --- a/met-web/src/components/comments/admin/reviewListing/AdvancedSearch.tsx +++ b/met-web/src/components/comments/admin/reviewListing/AdvancedSearch.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import { Grid, MenuItem, Stack, TextField } from '@mui/material'; -import { MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { COMMENTS_STATUS, CommentStatus } from 'constants/commentStatus'; import { AdvancedSearchFilters, CommentListingContext, initialSearchFilters } from './CommentListingContext'; @@ -159,22 +159,22 @@ export const AdvancedSearch = () => { width="100%" justifyContent="flex-end" > - { setAdvancedSearchFilters(initialSearchFilters); setSearchFilters(initialSearchFilters); }} > Reset All Filters - - + { setAdvancedSearchFilters(searchFilters); }} > Search - + diff --git a/met-web/src/components/comments/admin/reviewListing/Submissions.tsx b/met-web/src/components/comments/admin/reviewListing/Submissions.tsx index 913a19b4c..6f2af88a1 100644 --- a/met-web/src/components/comments/admin/reviewListing/Submissions.tsx +++ b/met-web/src/components/comments/admin/reviewListing/Submissions.tsx @@ -2,7 +2,7 @@ import React, { useState, useContext } from 'react'; import MetTable from 'components/common/Table'; import Grid from '@mui/material/Grid'; import { Link, useLocation } from 'react-router-dom'; -import { MetPageGridContainer, PrimaryButton, MetHeader1, SecondaryButton } from 'components/common'; +import { MetPageGridContainer, PrimaryButtonOld, MetHeader1Old, SecondaryButtonOld } from 'components/common'; import { HeadCell, PaginationOptions } from 'components/common/Table/types'; import { formatDate } from 'components/common/dateHelper'; import { Collapse, Link as MuiLink } from '@mui/material'; @@ -118,13 +118,13 @@ const Submissions = () => { onChange={(e) => setSearchText(e.target.value)} size="small" /> - handleSearchBarClick(searchText)} > - - + setIsAdvancedSearchOpen(!isAdvancedSearchOpen)} startIcon={ @@ -140,12 +140,12 @@ const Submissions = () => { } > Advanced Search - + - + Read All Comments - + @@ -157,9 +157,9 @@ const Submissions = () => { - + {`${survey.name} Comments`} - + { {comment.label ?? 'Label not available.'} - {' ' + comment.text} + {' ' + comment.text} @@ -284,14 +284,14 @@ const CommentTextListing = () => { justifyContent: 'flex-start', }} > - Comment Date: - - {formatDate(row.created_date)} + + {formatDate(row.created_date)} @@ -309,14 +309,14 @@ const CommentTextListing = () => { justifyContent: 'flex-start', }} > - Reviewed By: - - {row.reviewed_by} + + {row.reviewed_by} @@ -347,25 +347,25 @@ const CommentTextListing = () => { onChange={(e) => setSearchText(e.target.value)} size="small" /> - handleSearchBarClick(searchText)} > - + - + Return to Comments List - + - { } > Export to CSV - + void; + variant: 'primary' | 'secondary' | 'tertiary'; + size?: 'small' | 'medium' | 'large'; + icon?: React.ReactNode; + iconPosition?: 'left' | 'right'; + disabled?: boolean; +} & Omit; // Exclude conflicting props + +const sizeMap = { + small: '40px', + medium: '48px', + large: '56px', +}; + +export const Button: React.FC = ({ + children, + onClick, + variant = 'secondary', + size = 'medium', + icon, + iconPosition = 'left', + disabled, + ...buttonProps +}) => { + const colorMap = colors.button[variant]; + const height: string = sizeMap[size]; + const typeColors = variant == 'primary' ? colors.type.inverted : colors.type.regular; + // Don't display elevation changes for tertiary buttons + const elevation = + variant == 'tertiary' ? { z1: elevations.none, z4: elevations.none, z9: elevations.none } : elevations; + + return ( + + {children} + + ); +}; diff --git a/met-web/src/components/common/Input/index.tsx b/met-web/src/components/common/Input/index.tsx new file mode 100644 index 000000000..fe9c53c51 --- /dev/null +++ b/met-web/src/components/common/Input/index.tsx @@ -0,0 +1 @@ +export { Button } from './Button'; diff --git a/met-web/src/components/common/Layout/Table.tsx b/met-web/src/components/common/Layout/Table.tsx new file mode 100644 index 000000000..d077281f6 --- /dev/null +++ b/met-web/src/components/common/Layout/Table.tsx @@ -0,0 +1,53 @@ +import { + styled, + Table as MuiTable, + TableBody as MuiTableBody, + TableCell as MuiTableCell, + TableContainer as MuiTableContainer, + TableHead as MuiTableHead, + TableRow as MuiTableRow, +} from '@mui/material'; +import { globalFocusVisible, colors } from '..'; + +export const Table = styled(MuiTable)({ + borderCollapse: 'collapse', + width: '100%', +}); + +export const TableHead = styled(MuiTableHead)({}); + +export const TableHeadRow = styled(MuiTableRow)({ + backgroundColor: colors.surface.gray[10], +}); + +export const TableHeadCell = styled(MuiTableCell)({ + padding: '1rem 1rem 0.5rem 1rem', + fontWeight: 700, + fontSize: '0.875rem', + color: colors.surface.gray[80], + borderBottom: `1px solid ${colors.surface.gray[60]}`, + maxWidth: '700px', +}); + +export const TableBody = styled(MuiTableBody)({}); + +export const TableRow = styled(MuiTableRow)(({ onClick }) => ({ + '&:hover': { + backgroundColor: colors.surface.blue[10], + }, + '&:active': { + backgroundColor: colors.surface.blue[20], + }, + cursor: onClick ? 'pointer' : 'default', + + ...globalFocusVisible, +})); +export const TableCell = styled(MuiTableCell)({ + padding: '1em', + borderBottom: `1px solid ${colors.surface.gray[30]}`, + textAlign: 'left', + verticalAlign: 'top', + maxWidth: '700px', +}); + +export const TableContainer = styled(MuiTableContainer)({}); diff --git a/met-web/src/components/common/Layout/index.tsx b/met-web/src/components/common/Layout/index.tsx new file mode 100644 index 000000000..985e99829 --- /dev/null +++ b/met-web/src/components/common/Layout/index.tsx @@ -0,0 +1,23 @@ +import { styled, Box as MuiBox, Theme, useMediaQuery } from '@mui/material'; + +const desktopOrLarger = (theme: Theme) => useMediaQuery(theme.breakpoints.up('md')); +const tabletOrLarger = (theme: Theme) => useMediaQuery(theme.breakpoints.up('sm')); + +// A container that decreases its padding on smaller screens +export const ResponsiveContainer = styled(MuiBox)(({ theme }) => { + if (desktopOrLarger(theme)) { + return { + padding: '1.5em 4.0em', + }; + } + if (tabletOrLarger(theme)) { + return { + padding: '1.5em 2.0em', + }; + } + return { + padding: '1.5em 1.0em', + }; +}); + +export { Table, TableHead, TableHeadRow, TableHeadCell, TableBody, TableRow, TableCell, TableContainer } from './Table'; diff --git a/met-web/src/components/common/Modals/ConfirmModal.tsx b/met-web/src/components/common/Modals/ConfirmModal.tsx index c2011885c..7f480c50c 100644 --- a/met-web/src/components/common/Modals/ConfirmModal.tsx +++ b/met-web/src/components/common/Modals/ConfirmModal.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid, Stack, useMediaQuery, Theme } from '@mui/material'; -import { modalStyle, PrimaryButton, SecondaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, SecondaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; import { NotificationModalProps } from './types'; const ConfirmModal = ({ @@ -24,17 +24,17 @@ const ConfirmModal = ({ > - + {header} - + {subText.map((subtext, index) => ( - + {subtext.text} - + ))} {isSmallScreen ? ( <> - + {confirmButtonText ? confirmButtonText : 'Confirm'} - - + + {cancelButtonText ? cancelButtonText : 'Cancel'} - + ) : ( <> - + {cancelButtonText ? cancelButtonText : 'Cancel'} - - + + {confirmButtonText ? confirmButtonText : 'Confirm'} - + )} diff --git a/met-web/src/components/common/Modals/EmailModal.tsx b/met-web/src/components/common/Modals/EmailModal.tsx index 63f24697b..538a3362c 100644 --- a/met-web/src/components/common/Modals/EmailModal.tsx +++ b/met-web/src/components/common/Modals/EmailModal.tsx @@ -10,7 +10,14 @@ import { useMediaQuery, Theme, } from '@mui/material'; -import { MetLabel, modalStyle, PrimaryButton, SecondaryButton, MetHeader1, MetBody } from 'components/common'; +import { + MetLabel, + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, + MetHeader1Old, + MetBodyOld, +} from 'components/common'; import Modal from '@mui/material/Modal'; import { ModalProps } from './types'; @@ -64,14 +71,14 @@ const EmailModal = ({ rowSpacing={2} > - + {header} - + {subText.map((subtext) => ( - {subtext.text} + {subtext.text} ))} @@ -142,12 +149,12 @@ const EmailModal = ({ width="100%" justifyContent="flex-end" > - updateModal(false)}> + updateModal(false)}> Cancel - - + + Submit - + diff --git a/met-web/src/components/common/Modals/UpdateModal.tsx b/met-web/src/components/common/Modals/UpdateModal.tsx index d8932135f..8207e6021 100644 --- a/met-web/src/components/common/Modals/UpdateModal.tsx +++ b/met-web/src/components/common/Modals/UpdateModal.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid } from '@mui/material'; -import { modalStyle, PrimaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; import { NotificationModalProps } from './types'; const UpdateModal = ({ header, subText, handleClose }: NotificationModalProps) => { @@ -15,17 +15,17 @@ const UpdateModal = ({ header, subText, handleClose }: NotificationModalProps) = > - + {header} - + {subText.map((subtext) => ( - + {subtext.text} - + ))} - + Close - + diff --git a/met-web/src/components/common/Navigation/Breadcrumb.tsx b/met-web/src/components/common/Navigation/Breadcrumb.tsx new file mode 100644 index 000000000..4c94ed09e --- /dev/null +++ b/met-web/src/components/common/Navigation/Breadcrumb.tsx @@ -0,0 +1,29 @@ +import { Breadcrumbs } from '@mui/material'; +import React from 'react'; +import { BodyText, Link } from '../Typography'; + +type BreadcrumbProps = { + name: string; + link?: string; +}; + +export const BreadcrumbTrail: React.FC<{ crumbs: BreadcrumbProps[]; smallScreenOnly?: boolean }> = ({ + crumbs, + smallScreenOnly, +}) => { + return ( + + {crumbs.map((crumb, index) => + crumb.link ? ( + + {crumb.name} + + ) : ( + + {crumb.name} + + ), + )} + + ); +}; diff --git a/met-web/src/components/common/Navigation/index.tsx b/met-web/src/components/common/Navigation/index.tsx new file mode 100644 index 000000000..2d48187e2 --- /dev/null +++ b/met-web/src/components/common/Navigation/index.tsx @@ -0,0 +1 @@ +export { BreadcrumbTrail } from './Breadcrumb'; diff --git a/met-web/src/components/common/Typography/Body.tsx b/met-web/src/components/common/Typography/Body.tsx new file mode 100644 index 000000000..55c1e100e --- /dev/null +++ b/met-web/src/components/common/Typography/Body.tsx @@ -0,0 +1,31 @@ +import { styled } from '@mui/material'; +import { globalFocusVisible, colors } from '../../common'; +import { Link as RouterLink } from 'react-router-dom'; + +export const BodyText = styled('p')<{ bold?: boolean; small?: boolean }>(({ bold, small }) => ({ + margin: 0, + lineHeight: small ? '1.375' : '1.5', + fontSize: small ? '0.875rem' : '1rem', + color: '#292929', + fontWeight: bold ? 700 : 400, +})); + +export const Link = styled(RouterLink)<{ bold?: boolean; small?: boolean }>(({ bold, small }) => ({ + textDecoration: 'none', + lineHeight: small ? '1.375' : '1.5', + fontSize: small ? '0.875rem' : '1rem', + fontWeight: bold ? 700 : 400, + color: colors.type.regular.link, + '&:hover': { + textDecoration: 'underline', + }, + '&:focus': { + ...globalFocusVisible, + }, +})); + +const Body = { + BodyText, +}; + +export default Body; diff --git a/met-web/src/components/common/Typography/Headers.tsx b/met-web/src/components/common/Typography/Headers.tsx new file mode 100644 index 000000000..f4eb19d1a --- /dev/null +++ b/met-web/src/components/common/Typography/Headers.tsx @@ -0,0 +1,37 @@ +import { styled } from '@mui/material'; + +export const Header1 = styled('h1')({ + lineHeight: '1.5', + fontSize: '2rem', + marginBottom: '2rem', + marginTop: '1.5rem', + fontWeight: 700, + color: '#292929', +}); + +export const Header2 = styled('h2')<{ decorated?: boolean }>((props) => ({ + lineHeight: '1.5', + fontSize: '1.5rem', + marginBottom: '1.5rem', + marginTop: '0.5rem', + fontWeight: 600, + color: '#292929', + '&::before': props.decorated + ? { + backgroundColor: '#FCBA19', + content: '""', + display: 'block', + width: '40px', + height: '4px', + position: 'relative', + bottom: '4px', + } + : {}, +})); + +const Headers = { + Header1, + Header2, +}; + +export default Headers; diff --git a/met-web/src/components/common/Typography/index.tsx b/met-web/src/components/common/Typography/index.tsx new file mode 100644 index 000000000..f8dbf56e4 --- /dev/null +++ b/met-web/src/components/common/Typography/index.tsx @@ -0,0 +1,2 @@ +export { Header1, Header2 } from './Headers'; +export { BodyText, Link } from './Body'; diff --git a/met-web/src/components/common/index.tsx b/met-web/src/components/common/index.tsx index c4e47c99a..1a343a780 100644 --- a/met-web/src/components/common/index.tsx +++ b/met-web/src/components/common/index.tsx @@ -22,6 +22,112 @@ import { MET_Header_Font_Family, MET_Font_Weight, MET_Header_Font_Weight } from import { When } from 'react-if'; import ReactPlayer from 'react-player'; +export const colors = { + type: { + regular: { + primary: '#292929', + secondary: '#464341', + link: '#1A5A96', + disabled: '#A19F9D', + }, + inverted: { + primary: '#FFFFFF', + secondary: '#EDEBE9', + link: '#D8EBFF', + disabled: '#A19F9D', + }, + }, + button: { + primary: { + enabled: '#053662', + hover: '#1E5189', + focused: '#053662', + pressed: '#032543', + disabled: '#EDEBE9', + }, + secondary: { + enabled: '#FFFFFF', + hover: '#EDEBE9', + focused: '#FFFFFF', + pressed: '#E0DEDC', + disabled: '#EDEBE9', + stroke: '#201F1E', + }, + tertiary: { + enabled: '#FFFFFF', + hover: '#F1F8FF', + focused: '#FFFFFF', + pressed: '#F1F8FF', + disabled: '#FFFFFF', + }, + }, + focus: { + regular: { + outer: '#2E5DD7', + inner: '#FFFFFF', + }, + }, + surface: { + gray: { + 10: '#FAF9F8', + 20: '#F3F2F1', + 30: '#EDEBE9', + 40: '#E1DFDD', + 50: '#D2D0CE', + 60: '#C8C6C4', + 70: '#A19F9D', + 80: '#7A7876', + 90: '#3B3A39', + 100: '#323130', + 110: '#201F1E', + }, + blue: { + 10: '#F1F8FF', + 20: '#D8EBFF', + 30: '#C0DFFF', + 40: '#A7D2FF', + 50: '#8EC6FF', + 60: '#76BAFF', + 70: '#4E97E0', + 80: '#2B71B8', + 90: '#12508F', + 100: '#053662', + bc: '#053662', + }, + gold: { + 10: '#FFF8E8', + 20: '#FFECBE', + 30: '#FFE095', + 40: '#FFD46C', + 50: '#FFC843', + 60: '#FCBA19', + bc: '#FCBA19', + 70: '#D39706', + 80: '#AA7900', + 90: '#825C00', + 100: '#593F00', + }, + }, +}; + +export const elevations = { + // For use with CSS box-shadow property + // Not complete in Figma yet + none: '0px 0px transparent', + z1: '0px 2px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 6px 0px rgba(0, 0, 0, 0.60) inset', + z4: '0px 2px 3px 0px rgba(0, 0, 0, 0.10), 0px 6px 6px 0px rgba(0, 0, 0, 0.09), 0px 14px 9px 0px rgba(0, 0, 0, 0.05)', + z9: '0px 5px 6px 0px rgba(0, 0, 0, 0.20), 0px 9px 12px 0px rgba(0, 0, 0, 0.14), 0px 3px 16px 0px rgba(0, 0, 0, 0.12)', +}; + +export const globalFocusShadow = `inset 0px 0px 0px 2px ${colors.focus.regular.inner}`; + +export const globalFocusVisible = { + '&:focus-visible': { + outline: `2px solid ${colors.focus.regular.outer}`, + boxShadow: globalFocusShadow, + }, +}; + export const MetTooltip = styled(({ className, ...props }: TooltipProps) => ( ))(({ theme }) => ({ @@ -117,8 +223,10 @@ export const WidgetButton = ({ children, ...rest }: { children: React.ReactNode; {children} ); - -export const SecondaryButton = ({ +/** + * @deprecated Use โ€นSecondaryButtonโ€บ from common/Input instead + */ +export const SecondaryButtonOld = ({ children, disabled = false, ...rest @@ -128,9 +236,9 @@ export const SecondaryButton = ({ }) => { if (disabled) { return ( - + {children} - + ); } return ( @@ -144,7 +252,10 @@ export const SecondaryButton = ({ ); }; -export const PrimaryButton = ({ children, ...rest }: { children: React.ReactNode; [prop: string]: unknown }) => ( +/** + * @deprecated Use โ€นPrimaryButtonโ€บ from common/Input instead + */ +export const PrimaryButtonOld = ({ children, ...rest }: { children: React.ReactNode; [prop: string]: unknown }) => ( ({ fontFamily: MET_Header_Font_Family, })); -export const MetParagraph = styled(Typography)(() => ({ +/** + * @deprecated Use โ€นMetBodyโ€บ from common/Typography instead + */ +export const MetParagraphOld = styled(Typography)(() => ({ fontSize: '16px', fontFamily: MET_Header_Font_Family, })); @@ -271,13 +385,19 @@ export const MetDescription = styled(Typography)(() => ({ color: '#707070', })); -export const HeaderTitle = styled(Typography)(() => ({ +/** + * @deprecated Use โ€นHeader1โ€บ from common/Typography instead + */ +export const HeaderTitleOld = styled(Typography)(() => ({ fontSize: '32px', fontWeight: 'bold', fontFamily: MET_Header_Font_Family, })); -export const SubHeader = styled(Typography)(() => ({ +/** + * @deprecated Use โ€นHeader2โ€บ from common/Typography instead + */ +export const SubHeaderOld = styled(Typography)(() => ({ fontSize: '28px', fontFamily: MET_Header_Font_Family, })); @@ -288,7 +408,10 @@ export const ListItem = styled(Typography)(() => ({ marginBottom: 1, })); -export const MetSmallText = ({ bold, children, sx, ...rest }: HeaderProps) => { +/** + * @deprecated Use โ€นBodyText smallโ€บ from common/Typography instead + */ +export const MetSmallTextOld = ({ bold, children, sx, ...rest }: HeaderProps) => { return ( { +/** + * @deprecated Use โ€นHeader1โ€บ from common/Typography instead + */ +export const MetHeader1Old = ({ bold, children, sx, ...rest }: HeaderProps) => { return ( { ); }; -export const MetHeader2 = ({ bold, children, sx, ...rest }: HeaderProps) => { + +/** + * @deprecated Use โ€นHeader2โ€บ from common/Typography instead + */ +export const MetHeader2Old = ({ bold, children, sx, ...rest }: HeaderProps) => { return ( { +/** + * @deprecated Use โ€นBodyTextโ€บ from common/Typography instead + */ +export const MetBodyOld = ({ bold, children, sx, ...rest }: HeaderProps) => { return ( { rowSpacing={3} > - Engagements Dashboard + Engagements Dashboard diff --git a/met-web/src/components/dashboard/EngagementsAccordion.tsx b/met-web/src/components/dashboard/EngagementsAccordion.tsx index ad416616f..4914a26ba 100644 --- a/met-web/src/components/dashboard/EngagementsAccordion.tsx +++ b/met-web/src/components/dashboard/EngagementsAccordion.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import Grid from '@mui/material/Grid'; -import { MetBody, MetLabel } from 'components/common'; +import { MetBodyOld, MetLabel } from 'components/common'; import { Accordion, AccordionDetails, AccordionSummary, useMediaQuery, Theme } from '@mui/material'; import { Engagement } from 'models/engagement'; import { When } from 'react-if'; @@ -81,11 +81,11 @@ const EngagementsAccordion = ({ {engagement.name} - + {engagement.start_date} {' - '} {engagement.end_date} - + diff --git a/met-web/src/components/engagement/dashboard/comment/CommentTable.tsx b/met-web/src/components/engagement/dashboard/comment/CommentTable.tsx index c3a3d43b8..ee2da1373 100644 --- a/met-web/src/components/engagement/dashboard/comment/CommentTable.tsx +++ b/met-web/src/components/engagement/dashboard/comment/CommentTable.tsx @@ -1,7 +1,7 @@ import React, { useContext } from 'react'; import MetTable from 'components/common/Table'; import { HeadCell } from 'components/common/Table/types'; -import { MetLabel, MetParagraph } from 'components/common'; +import { MetLabel, MetParagraphOld } from 'components/common'; import { Skeleton } from '@mui/material'; import { CommentViewContext, TransformedComment } from './CommentViewContext'; import { useAppTranslation } from 'hooks'; @@ -52,7 +52,7 @@ const CommentTable = () => {
    {comment.label}
    - {comment.text} + {comment.text}
    ))} @@ -67,7 +67,7 @@ const CommentTable = () => { allowSort: false, customStyle: { width: '20%' }, align: 'right', - renderCell: (row: TransformedComment) => {row.submission_date}, + renderCell: (row: TransformedComment) => {row.submission_date}, }, ]; diff --git a/met-web/src/components/engagement/dashboard/comment/CommentsBlock.tsx b/met-web/src/components/engagement/dashboard/comment/CommentsBlock.tsx index 33d50942e..f2c14c9be 100644 --- a/met-web/src/components/engagement/dashboard/comment/CommentsBlock.tsx +++ b/met-web/src/components/engagement/dashboard/comment/CommentsBlock.tsx @@ -2,7 +2,7 @@ import React, { useContext } from 'react'; import { Grid, Skeleton } from '@mui/material'; import { Link, useNavigate, useParams } from 'react-router-dom'; import { CommentViewContext } from './CommentViewContext'; -import { PrimaryButton, MetPaper, MetHeader4 } from 'components/common'; +import { PrimaryButtonOld, MetPaper, MetHeader4 } from 'components/common'; import CommentTable from './CommentTable'; import { useAppSelector, useAppDispatch } from 'hooks'; import { SubmissionStatus } from 'constants/engagementStatus'; @@ -87,12 +87,12 @@ export const CommentsBlock: React.FC = ({ dashboardType }) = direction={{ xs: 'column', sm: 'row' }} justifyContent="flex-end" > - {translate('commentDashboard.block.buttonText')} - + diff --git a/met-web/src/components/engagement/form/DayCalculator/dayZeroRules.tsx b/met-web/src/components/engagement/form/DayCalculator/dayZeroRules.tsx index 0ba38fe7b..11bca447f 100644 --- a/met-web/src/components/engagement/form/DayCalculator/dayZeroRules.tsx +++ b/met-web/src/components/engagement/form/DayCalculator/dayZeroRules.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MetHeader4, MetBody } from 'components/common'; +import { MetHeader4, MetBodyOld } from 'components/common'; const DayZeroRules = () => (
    @@ -8,11 +8,11 @@ const DayZeroRules = () => (
    • - + If a deadline falls on a holiday the deadline is extended to the next day that is not a holiday. For example, if the deadline for a comment period is December 26, boxing day, the deadline is extended to December 27. - +
    @@ -20,11 +20,11 @@ const DayZeroRules = () => (
    • - + If a deadline falls on a day when the office is not open (Saturday, Sunday) the deadline is extended to the next day that the office is open. For example, if the deadline for a comment period falls on a Saturday then the deadline is extended to Monday. - +
    @@ -32,17 +32,17 @@ const DayZeroRules = () => (
    • - + When calculating periods (for example 30 day comment period) the first day must be excluded and the last day included. For example, a 30 day comment period starts March 1, 2017, the comment period does not end until March 31, 2017. - +
    • - + Legislated time periods must be calculated with day -0- eg, Evaluation 30 days, Application Review 180 days, Ministers Decision 45 days, and Public Comment Periods. - +
    @@ -50,7 +50,7 @@ const DayZeroRules = () => (
    • - + There is no specific mention of time of day in the Interpretation Act so the day would end at midnight. If a comment is received before midnight on the last day of the comment period it would be included in the comment period. If an email was received at 11:59PM it would be @@ -58,7 +58,7 @@ const DayZeroRules = () => ( midnight then the comment would also be included in the comment period. Comments sent by mail or courier must be post marked by the last day of the comment period in order to be included in the comment period. - +
    @@ -66,12 +66,12 @@ const DayZeroRules = () => (
    • - + Suspending a project during the Application Review period, when the suspension resumes it starts back on the day it was suspended on. If a project is suspended on day 50 of the 180, in accordance with the spirit of the Act, day 49 was the last full day of the Application Review Period, when the project resumes, it would resume on day 50 to allow 180 full days of review. - +
    diff --git a/met-web/src/components/engagement/form/DayCalculator/index.tsx b/met-web/src/components/engagement/form/DayCalculator/index.tsx index f0768e941..3c85cdb42 100644 --- a/met-web/src/components/engagement/form/DayCalculator/index.tsx +++ b/met-web/src/components/engagement/form/DayCalculator/index.tsx @@ -2,12 +2,12 @@ import React, { useState } from 'react'; import { Modal, Grid, Stack, useMediaQuery, TextField, Autocomplete, Link as MuiLink, Typography } from '@mui/material'; import { modalStyle, - MetHeader1, + MetHeader1Old, MetHeader4, - PrimaryButton, - SecondaryButton, + PrimaryButtonOld, + SecondaryButtonOld, MetLabel, - MetBody, + MetBodyOld, } from 'components/common'; import { When } from 'react-if'; import dayjs from 'dayjs'; @@ -179,9 +179,9 @@ const DayCalculatorModal = ({ open, updateModal }: DayCalcModalProps) => { - + Day Calculator - + @@ -625,9 +625,9 @@ const DayCalculatorModal = ({ open, updateModal }: DayCalcModalProps) => { width="100%" justifyContent="flex-end" > - resetToDefault()}> + resetToDefault()}> Reset All - + @@ -640,20 +640,20 @@ const DayCalculatorModal = ({ open, updateModal }: DayCalcModalProps) => { { - + {options[0].description} setShowHideStatus(!showHideStatus)}>{`${ showHideStatus ? 'Hide' : 'Show' }`}{' '} Day Zero rules. - + } - {{options[1].description}} + {{options[1].description}} - {{options[2].description}} + {{options[2].description}} @@ -678,12 +678,12 @@ const DayCalculatorModal = ({ open, updateModal }: DayCalcModalProps) => { width="100%" justifyContent="flex-end" > - updateModal(false)}> + updateModal(false)}> Close - - calculator()}> + + calculator()}> Calculate - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/AdditionalDetails/AdditionalTabContent.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/AdditionalDetails/AdditionalTabContent.tsx index 61f89cdaf..477c31349 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/AdditionalDetails/AdditionalTabContent.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/AdditionalDetails/AdditionalTabContent.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Divider, Grid, Box } from '@mui/material'; -import { MetPaper, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetPaper, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import ConsentMessage from './ConsentMessage'; import EngagementMetadata from './Metadata/EngagementMetadata'; import { EngagementTabsContext } from '../EngagementTabsContext'; @@ -44,29 +44,29 @@ const AdditionalTabContent = () => { sx={{ backgroundColor: 'var(--bcds-surface-background-white)' }} > - handleSaveAndContinueEngagement()} loading={isSaving} > Save and Continue - - + handleSaveAndExitEngagement()} loading={isSaving} > Save and Exit - - + handlePreviewEngagement()} disabled={isSaving} > {'Preview'} - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/EngagementContent/ContentTabModal.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/EngagementContent/ContentTabModal.tsx index 8ca010ad6..f26a78ea2 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/EngagementContent/ContentTabModal.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/EngagementContent/ContentTabModal.tsx @@ -1,6 +1,6 @@ import React, { useContext, useEffect, useState } from 'react'; import { MenuItem, Modal, Grid, Stack, TextField, Select } from '@mui/material'; -import { modalStyle, MetHeader1, MetLabel, PrimaryButton } from 'components/common'; +import { modalStyle, MetHeader1Old, MetLabel, PrimaryButtonOld } from 'components/common'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; import { ActionContext } from '../../ActionContext'; @@ -98,9 +98,9 @@ const ContentTabModal = ({ open, updateModal, tabs, setTabs, selectedTabType, ta > - + {isEditMode ? 'Edit the engagement content tab' : 'Add a new engagement content tab'} - + @@ -171,13 +171,13 @@ const ContentTabModal = ({ open, updateModal, tabs, setTabs, selectedTabType, ta alignItems="center" sx={{ mt: '1em' }} > - {isEditMode ? 'Update Tab' : 'Add Tab'} - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/EngagementForm.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/EngagementForm.tsx index 63077a121..e79496dbf 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/EngagementForm.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/EngagementForm.tsx @@ -1,6 +1,6 @@ import React, { useContext, useEffect, useState } from 'react'; import { Typography, Grid, TextField, Stack, Box } from '@mui/material'; -import { MetPaper, MetLabel, PrimaryButton, SecondaryButton, MetDescription } from '../../../common'; +import { MetPaper, MetLabel, PrimaryButtonOld, SecondaryButtonOld, MetDescription } from '../../../common'; import { ActionContext } from '../ActionContext'; import ImageUpload from 'components/imageUpload'; import { EngagementTabsContext } from './EngagementTabsContext'; @@ -178,9 +178,9 @@ const EngagementForm = () => { - setIsOpen(true)}> + setIsOpen(true)}> Day Calculator - + @@ -230,29 +230,29 @@ const EngagementForm = () => { sx={{ backgroundColor: 'var(--bcds-surface-background-white)' }} > - handleSaveAndContinueEngagement()} loading={isSaving} > Save and Continue - - + handleSaveAndExitEngagement()} loading={isSaving} > Save and Exit - - + handlePreviewEngagement()} disabled={isSaving} > {'Preview'} - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx index e7399b815..284a4f366 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Box } from '@mui/material'; -import { MetPaper, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetPaper, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { EngagementTabsContext } from '../EngagementTabsContext'; import { ActionContext } from '../../ActionContext'; import PollResultsView from './PollResults/PollResultsView'; @@ -36,29 +36,29 @@ const EngagementResults = () => { sx={{ backgroundColor: 'var(--bcds-surface-background-white)' }} > - handleSaveAndContinueEngagement()} loading={isSaving} > Save and Continue - - + handleSaveAndExitEngagement()} loading={isSaving} > Save and Exit - - + handlePreviewEngagement()} disabled={isSaving} > {'Preview'} - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/Settings/EngagementSettingsForm.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/Settings/EngagementSettingsForm.tsx index 4d941de30..055aa29e4 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/Settings/EngagementSettingsForm.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/Settings/EngagementSettingsForm.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Divider, Grid, Box } from '@mui/material'; -import { MetPaper, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetPaper, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import InternalEngagement from './InternalEngagement'; import SendReport from './SendReport'; import { PublicUrls } from './PublicUrls'; @@ -50,29 +50,29 @@ const EngagementSettingsForm = () => { sx={{ backgroundColor: 'var(--bcds-surface-background-white)' }} > - handleSaveAndContinueEngagement()} loading={isSaving} > Save and Continue - - + handleSaveAndExitEngagement()} loading={isSaving} > Save and Exit - - + handlePreviewEngagement()} disabled={isSaving} > {'Preview'} - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/Settings/PublicUrls.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/Settings/PublicUrls.tsx index ccbd5e14a..60cb9d2f4 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/Settings/PublicUrls.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/Settings/PublicUrls.tsx @@ -1,6 +1,6 @@ import React, { useState, useContext, useEffect } from 'react'; import { InputAdornment, TextField, Tooltip, Grid, useTheme } from '@mui/material'; -import { SecondaryButton, MetDescription, MetHeader4, MetSmallText, MetLabel } from 'components/common'; +import { SecondaryButtonOld, MetDescription, MetHeader4, MetSmallTextOld, MetLabel } from 'components/common'; import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import ClickAwayListener from '@mui/material/ClickAwayListener'; import { ActionContext } from 'components/engagement/form/ActionContext'; @@ -126,7 +126,7 @@ export const PublicUrls = () => { ), endAdornment: ( - { @@ -135,7 +135,7 @@ export const PublicUrls = () => { }} > - + ), }} @@ -150,7 +150,7 @@ export const PublicUrls = () => { - {backendError} + {backendError} @@ -197,7 +197,7 @@ export const PublicUrls = () => { InputProps={{ endAdornment: ( - { @@ -206,7 +206,7 @@ export const PublicUrls = () => { }} > - + ), }} diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/SurveyBlock/index.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/SurveyBlock/index.tsx index 6a144f353..c24bb3a13 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/SurveyBlock/index.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/SurveyBlock/index.tsx @@ -1,7 +1,7 @@ import React, { useContext, useState } from 'react'; import { ActionContext } from '../../ActionContext'; import { Grid } from '@mui/material'; -import { MetHeader4, MetPaper, MetSurvey, MetTooltip, SecondaryButton } from 'components/common'; +import { MetHeader4, MetPaper, MetSurvey, MetTooltip, SecondaryButtonOld } from 'components/common'; import { useNavigate } from 'react-router-dom'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; @@ -102,12 +102,12 @@ export const SurveyBlock = () => { title={!savedEngagement.id ? 'Please save the engagement before adding a survey.' : ''} > - 0} > Add Survey - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/AddTeamMemberModal.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/AddTeamMemberModal.tsx index 45d37f40a..33bf99313 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/AddTeamMemberModal.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/AddTeamMemberModal.tsx @@ -1,7 +1,14 @@ import React, { useContext, useState, useMemo, useRef } from 'react'; import Modal from '@mui/material/Modal'; import { Autocomplete, CircularProgress, Grid, Paper, Stack, TextField, useTheme } from '@mui/material'; -import { MetHeader3, MetLabel, MetSmallText, modalStyle, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetHeader3, + MetLabel, + MetSmallTextOld, + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { User } from 'models/user'; import { useForm, FormProvider, SubmitHandler, Controller } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; @@ -188,7 +195,9 @@ export const AddTeamMemberModal = () => { - {backendError} + + {backendError} + @@ -207,10 +216,10 @@ export const AddTeamMemberModal = () => { width="100%" justifyContent="flex-end" > - Cancel - + Cancel + Submit - + diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/EngagementUserManagement.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/EngagementUserManagement.tsx index 1bc6b6ffe..caa0364cb 100644 --- a/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/EngagementUserManagement.tsx +++ b/met-web/src/components/engagement/form/EngagementFormTabs/UserManagement/EngagementUserManagement.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Box } from '@mui/material'; -import { MetLabel, MetPaper, PrimaryButton, SecondaryButton, MetParagraph } from 'components/common'; +import { MetLabel, MetPaper, PrimaryButtonOld, SecondaryButtonOld, MetParagraphOld } from 'components/common'; import { ActionContext } from '../../ActionContext'; import { EngagementTabsContext } from '../EngagementTabsContext'; import { formatDate } from 'components/common/dateHelper'; @@ -31,7 +31,7 @@ const EngagementUserManagement = () => { Engagement Created by: - {savedEngagement.user_id} + {savedEngagement.user_id} @@ -40,12 +40,14 @@ const EngagementUserManagement = () => { Date Created: - {formatDate(savedEngagement.created_date)} + {formatDate(savedEngagement.created_date)} - setAddTeamMemberOpen(true)}>+ Add Team Member + setAddTeamMemberOpen(true)}> + + Add Team Member + @@ -63,29 +65,29 @@ const EngagementUserManagement = () => { sx={{ backgroundColor: 'var(--bcds-surface-background-white)' }} > - handleSaveAndContinueEngagement()} loading={isSaving} > Save and Continue - - + handleSaveAndExitEngagement()} loading={isSaving} > Save and Exit - - + handlePreviewEngagement()} disabled={isSaving} > {'Preview'} - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Documents/AddFileDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Documents/AddFileDrawer.tsx index dee7bdfb8..4e1a17659 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Documents/AddFileDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Documents/AddFileDrawer.tsx @@ -3,7 +3,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid, MenuItem } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -228,12 +228,12 @@ const AddFileDrawer = () => { marginTop="8em" > - + {`Save & Close`} - + - handleClose()}>{`Cancel`} + handleClose()}>{`Cancel`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Documents/CreateFolderForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Documents/CreateFolderForm.tsx index 8e5aeb0fe..c5b8fcf7f 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Documents/CreateFolderForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Documents/CreateFolderForm.tsx @@ -1,6 +1,6 @@ import React, { useContext, useState } from 'react'; import { Grid, TextField, Stack } from '@mui/material'; -import { MetLabel, PrimaryButton, SecondaryButton, WidgetButton } from 'components/common'; +import { MetLabel, PrimaryButtonOld, SecondaryButtonOld, WidgetButton } from 'components/common'; import { When } from 'react-if'; import { DocumentsContext } from './DocumentsContext'; import { useAppDispatch } from 'hooks'; @@ -110,17 +110,17 @@ const CreateFolderForm = () => { width="100%" justifyContent="flex-start" > - Save - - setCreateFolderMode(false)}> + + setCreateFolderMode(false)}> Cancel - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Documents/DocumentForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Documents/DocumentForm.tsx index 62cc7bc41..7602b18ff 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Documents/DocumentForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Documents/DocumentForm.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Divider, Grid } from '@mui/material'; -import { PrimaryButton } from 'components/common'; +import { PrimaryButtonOld } from 'components/common'; import { WidgetDrawerContext } from '../WidgetDrawerContext'; import CreateFolderForm from './CreateFolderForm'; import DocumentsBlock from './DocumentsBlock'; @@ -32,7 +32,7 @@ const DocumentForm = () => { - handleWidgetDrawerOpen(false)}>{`Close`} + handleWidgetDrawerOpen(false)}>{`Close`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Documents/StyledTreeItem.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Documents/StyledTreeItem.tsx index 5a3f9ff65..576113fd8 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Documents/StyledTreeItem.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Documents/StyledTreeItem.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { styled } from '@mui/material/styles'; import TreeItem, { treeItemClasses, TreeItemProps } from '@mui/lab/TreeItem'; -import { MetBody } from 'components/common'; +import { MetBodyOld } from 'components/common'; import { If, Then, Else } from 'react-if'; import { Link, Box } from '@mui/material'; import OpenInNew from '@mui/icons-material/OpenInNew'; @@ -99,7 +99,7 @@ export function StyledTreeItem(props: StyledTreeItemProps & DocumentTreeItemProp - {labelText} + {labelText} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Documents/UploadFileDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Documents/UploadFileDrawer.tsx index 70bcec3fb..7ef37620c 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Documents/UploadFileDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Documents/UploadFileDrawer.tsx @@ -3,7 +3,14 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid, MenuItem } from '@mui/material'; -import { MetHeader3, MetLabel, MetParagraph, MetWidgetPaper, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetHeader3, + MetLabel, + MetParagraphOld, + MetWidgetPaper, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -174,13 +181,13 @@ const UploadFileDrawer = () => { {fileToUpload?.name} - {fileToUpload?.type} + {fileToUpload?.type} {fileToUpload && ( - + {`${fileToUpload.size / OneMegaByte} MB`} - + )} @@ -264,15 +271,15 @@ const UploadFileDrawer = () => { marginTop="8em" > - + {`Save & Close`} - + - handleClose()} - >{`Cancel`} + >{`Cancel`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Events/EventInfoPaper.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Events/EventInfoPaper.tsx index 0d6894f3e..37dad275b 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Events/EventInfoPaper.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Events/EventInfoPaper.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { MetParagraph, MetWidgetPaper } from 'components/common'; +import { MetParagraphOld, MetWidgetPaper } from 'components/common'; import { Grid, IconButton } from '@mui/material'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; import HighlightOffIcon from '@mui/icons-material/HighlightOff'; @@ -38,52 +38,52 @@ const EventInfoPaper = ({ event, removeEvent, ...rest }: EventInfoPaperProps) => > - Description: + Description: - + {eventItem.description} - + - Location: + Location: - + {eventItem.location_name} - + - Address: + Address: - + {eventItem.location_address} - + - Date: + Date: - + {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} - + - Time: + Time: - + {`${formatDate(eventItem.start_date, 'h:mm a')} to ${formatDate( eventItem.end_date, 'h:mm a', )} PT`} - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Events/Form.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Events/Form.tsx index 5cb74eaa9..278644fbd 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Events/Form.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Events/Form.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Divider } from '@mui/material'; -import { PrimaryButton, WidgetButton } from 'components/common'; +import { PrimaryButtonOld, WidgetButton } from 'components/common'; import { WidgetDrawerContext } from '../WidgetDrawerContext'; import { EventsContext } from './EventsContext'; import EventsInfoBlock from './EventsInfoBlock'; @@ -45,13 +45,13 @@ const Form = () => { - { handleWidgetDrawerOpen(false); }} > Close - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Events/InPersonEventFormDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Events/InPersonEventFormDrawer.tsx index 19440dee7..9cace4de2 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Events/InPersonEventFormDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Events/InPersonEventFormDrawer.tsx @@ -3,7 +3,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -260,12 +260,15 @@ const InPersonEventFormDrawer = () => { marginTop="2em" > - {`Save & Close`} + {`Save & Close`} - handleEventDrawerOpen(EVENT_TYPE.MEETUP, false)}> + handleEventDrawerOpen(EVENT_TYPE.MEETUP, false)}> Cancel - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualEventInfoPaper.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualEventInfoPaper.tsx index 3ad10bef8..537307450 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualEventInfoPaper.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualEventInfoPaper.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { MetParagraph, MetWidgetPaper } from 'components/common'; +import { MetParagraphOld, MetWidgetPaper } from 'components/common'; import { Grid, IconButton } from '@mui/material'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; import HighlightOffIcon from '@mui/icons-material/HighlightOff'; @@ -33,42 +33,42 @@ const VirtualEventInfoPaper = ({ event, removeEvent, ...rest }: EventInfoPaperPr > - Description: + Description: - + {eventItem.description} - + - Date: + Date: - + {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} - + - Time: + Time: - + {`${formatDate(eventItem.start_date, 'h:mm a')} to ${formatDate( eventItem.end_date, 'h:mm a', )} PT`} - + - Link: + Link: - + {eventItem.url} - {eventItem.url_label} - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualSessionFormDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualSessionFormDrawer.tsx index 64c749ebd..4fb2ea086 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualSessionFormDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Events/VirtualSessionFormDrawer.tsx @@ -3,7 +3,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -256,16 +256,19 @@ const VirtualSessionFormDrawer = () => { marginTop="2em" > - {`Save & Close`} + {`Save & Close`} - { handleEventDrawerOpen(EVENT_TYPE.VIRTUAL, false); }} > Cancel - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Map/Form.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Map/Form.tsx index 8e3907411..17d6ee913 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Map/Form.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Map/Form.tsx @@ -3,8 +3,8 @@ import Divider from '@mui/material/Divider'; import { Grid, Typography, Stack, IconButton } from '@mui/material'; import { MetLabel, - PrimaryButton, - SecondaryButton, + PrimaryButtonOld, + SecondaryButtonOld, MidScreenLoader, MetWidgetPaper, MetDescription, @@ -267,9 +267,9 @@ const Form = () => { - + Preview Map - + { marginTop="2em" > - {`Save & Close`} + {`Save & Close`} - handleWidgetDrawerOpen(false)}> + handleWidgetDrawerOpen(false)}> Cancel - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Phases/PhasesForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Phases/PhasesForm.tsx index ba8488b3f..ab87ea8a9 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Phases/PhasesForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Phases/PhasesForm.tsx @@ -1,6 +1,6 @@ import React, { useContext, useEffect, useState } from 'react'; import { Autocomplete, Checkbox, Divider, FormControl, FormControlLabel, Grid, TextField } from '@mui/material'; -import { MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { EngagementPhases } from 'models/engagementPhases'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; @@ -133,15 +133,15 @@ const PhasesForm = () => { - saveWidgetItem()} - >{`Save & Close`} + >{`Save & Close`} - handleWidgetDrawerOpen(false)}>{`Cancel`} + handleWidgetDrawerOpen(false)}>{`Cancel`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Poll/Form.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Poll/Form.tsx index dfacc7099..b9d32d116 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Poll/Form.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Poll/Form.tsx @@ -1,7 +1,7 @@ import React, { useContext } from 'react'; import Divider from '@mui/material/Divider'; import { Grid, MenuItem, TextField, Select, SelectChangeEvent } from '@mui/material'; -import { MetDescription, MetLabel, MidScreenLoader, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetDescription, MetLabel, MidScreenLoader, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { SubmitHandler } from 'react-hook-form'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; @@ -256,12 +256,12 @@ const Form = () => { mt={'1em'} > - + Save & Close - + - handleWidgetDrawerOpen(false)}>Cancel + handleWidgetDrawerOpen(false)}>Cancel ); diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Poll/PollAnswerForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Poll/PollAnswerForm.tsx index 52f9b7931..8f96f6f94 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Poll/PollAnswerForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Poll/PollAnswerForm.tsx @@ -1,7 +1,7 @@ // PollAnswerForm.tsx import React, { useState, useEffect } from 'react'; import { Grid } from '@mui/material'; -import { PrimaryButton } from 'components/common'; +import { PrimaryButtonOld } from 'components/common'; import { PollAnswer } from 'models/pollWidget'; import Typography from '@mui/material/Typography'; import PollAnswerItemForm from './PolllAnswerItemForm'; @@ -56,7 +56,7 @@ const PollAnswerForm: React.FC = ({ initialPollAnswers, onP /> ))} - handleAddAnswer()}>Add Answer + handleAddAnswer()}>Add Answer ); diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Poll/PolllAnswerItemForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Poll/PolllAnswerItemForm.tsx index 6d330de77..a5ccaa4d0 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Poll/PolllAnswerItemForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Poll/PolllAnswerItemForm.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid, TextField, Divider } from '@mui/material'; -import { SecondaryButton, MetLabel } from 'components/common'; +import { SecondaryButtonOld, MetLabel } from 'components/common'; import { PollAnswer } from 'models/pollWidget'; interface PollAnswerItemProps { @@ -29,7 +29,7 @@ const PollAnswerItemForm: React.FC = React.memo( {canRemove && ( - onRemove(index)}>Remove Answer + onRemove(index)}>Remove Answer )} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/EmailListFormDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/EmailListFormDrawer.tsx index 1801c8600..10333fe74 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/EmailListFormDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/EmailListFormDrawer.tsx @@ -4,7 +4,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid, FormControlLabel, Radio, FormControl, FormLabel, FormHelperText } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler, Controller } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -245,10 +245,13 @@ const EmailListDrawer = () => { marginTop="2em" > - {`Save & Close`} + {`Save & Close`} - Cancel + Cancel diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/FormSignUpDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/FormSignUpDrawer.tsx index c7e334461..c2838d1d4 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/FormSignUpDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/FormSignUpDrawer.tsx @@ -3,7 +3,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid, FormControlLabel, Radio, FormLabel, FormControl, FormHelperText } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler, Controller } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -242,13 +242,13 @@ const FormSignUpDrawer = () => { marginTop="2em" > - {`Save & Close`} + >{`Save & Close`} - Cancel + Cancel diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeForm.tsx index f4228b9bf..64a9bc6d3 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeForm.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Divider } from '@mui/material'; -import { PrimaryButton, WidgetButton, MetParagraph } from 'components/common'; +import { PrimaryButtonOld, WidgetButton, MetParagraphOld } from 'components/common'; import { WidgetDrawerContext } from '../WidgetDrawerContext'; import { SubscribeContext } from './SubscribeContext'; import { SUBSCRIBE_TYPE } from 'models/subscription'; @@ -32,16 +32,16 @@ const Form = () => { - + The email list will collect email addresses for a mailing list. A "double-opt-in" email will be sent to confirm the subscription. Only the email addresses that have been double-opted-in will be on the list. - + - + The form sign-up will open the pre-defined form. The text and CTA for both are customizable. - + @@ -74,13 +74,13 @@ const Form = () => { - { handleWidgetDrawerOpen(false); }} > Close - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeInfoPaper.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeInfoPaper.tsx index b1a2a99aa..f7004cc00 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeInfoPaper.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Subscribe/SubscribeInfoPaper.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { MetLabel, MetParagraph, MetWidgetPaper } from 'components/common'; +import { MetLabel, MetParagraphOld, MetWidgetPaper } from 'components/common'; import { Grid, IconButton, useMediaQuery } from '@mui/material'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; import HighlightOffIcon from '@mui/icons-material/HighlightOff'; @@ -52,7 +52,7 @@ const SubscribeInfoPaper = ({ subscribeForm, removeSubscribeForm, ...rest }: Sub - Description: + Description: - {capitalizeFirstLetter(subscribeItem.call_to_action_type)}: + {capitalizeFirstLetter(subscribeItem.call_to_action_type)}: - + {subscribeItem.call_to_action_text} - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Timeline/Form.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Timeline/Form.tsx index fdbf8016d..fd098fca0 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Timeline/Form.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Timeline/Form.tsx @@ -1,7 +1,7 @@ import React, { useContext, useEffect } from 'react'; import Divider from '@mui/material/Divider'; import { Grid, MenuItem, TextField, Select, SelectChangeEvent } from '@mui/material'; -import { MetDescription, MetLabel, MidScreenLoader, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetDescription, MetLabel, MidScreenLoader, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { SubmitHandler } from 'react-hook-form'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; @@ -331,14 +331,14 @@ const Form = () => { {1 < timelineEvents.length && ( - ) => { handleRemoveEvent(event); }} > Remove Event - + )} @@ -348,7 +348,7 @@ const Form = () => { ))} - handleAddEvent()}>Add Event + handleAddEvent()}>Add Event @@ -363,12 +363,14 @@ const Form = () => { mt={'3em'} > - + Save & Close - + - handleWidgetDrawerOpen(false)}>Cancel + handleWidgetDrawerOpen(false)}> + Cancel + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/Video/Form.tsx b/met-web/src/components/engagement/form/EngagementWidgets/Video/Form.tsx index 624f08cbd..e3df41268 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/Video/Form.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/Video/Form.tsx @@ -1,7 +1,7 @@ import React, { useContext, useEffect } from 'react'; import Divider from '@mui/material/Divider'; import { Grid } from '@mui/material'; -import { MetDescription, MetLabel, MidScreenLoader, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetDescription, MetLabel, MidScreenLoader, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; import * as yup from 'yup'; @@ -180,14 +180,14 @@ const Form = () => { mt={'3em'} > - + Save & Close - + - handleWidgetDrawerOpen(false)}> + handleWidgetDrawerOpen(false)}> Cancel - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/AddContactDrawer.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/AddContactDrawer.tsx index beff82930..6b6e1dbb6 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/AddContactDrawer.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/AddContactDrawer.tsx @@ -3,7 +3,7 @@ import Box from '@mui/material/Box'; import Drawer from '@mui/material/Drawer'; import Divider from '@mui/material/Divider'; import { Grid } from '@mui/material'; -import { MetHeader3, MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetHeader3, MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import ImageUpload from 'components/imageUpload'; import { useForm, FormProvider, SubmitHandler } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; @@ -270,12 +270,12 @@ const AddContactDrawer = () => { marginTop="8em" > - + {`Save & Close`} - + - {`Cancel`} + {`Cancel`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/ContactInfoPaper.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/ContactInfoPaper.tsx index 366720b88..fc066156b 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/ContactInfoPaper.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/ContactInfoPaper.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { MetLabel, MetParagraph, MetWidgetPaper } from 'components/common'; +import { MetLabel, MetParagraphOld, MetWidgetPaper } from 'components/common'; import { Grid, IconButton } from '@mui/material'; import { Contact } from 'models/contact'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; @@ -30,9 +30,9 @@ const ContactInfoPaper = ({ contact, removeContact, ...rest }: ContactInfoPaperP - + {contact.title} - + @@ -47,49 +47,49 @@ const ContactInfoPaper = ({ contact, removeContact, ...rest }: ContactInfoPaperP > - Phone: + Phone: - + {contact.phone_number} - + - Email: + Email: - {contact.email} + {contact.email} - Address: + Address: - {contact.address} - + - Bio: + Bio: - {contact.bio} - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/WhoIsListeningForm.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/WhoIsListeningForm.tsx index a0cfaf9d2..47f0269d3 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/WhoIsListeningForm.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/WhoIsListening/WhoIsListeningForm.tsx @@ -1,6 +1,6 @@ import React, { useContext, useState, useEffect } from 'react'; import { Autocomplete, Grid, TextField, Divider } from '@mui/material'; -import { MetLabel, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetLabel, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { Contact } from 'models/contact'; import { useAppDispatch } from 'hooks'; import { openNotification } from 'services/notificationService/notificationSlice'; @@ -114,14 +114,14 @@ const WhoIsListeningForm = () => { /> - addContact()} fullWidth> + addContact()} fullWidth> Add This Contact - + - handleAddContactDrawerOpen(true)}> + handleAddContactDrawerOpen(true)}> Create New Contact - + @@ -129,14 +129,14 @@ const WhoIsListeningForm = () => { - saveWidgetItems()} - >{`Save & Close`} + >{`Save & Close`} - handleWidgetDrawerOpen(false)}>{`Cancel`} + handleWidgetDrawerOpen(false)}>{`Cancel`} diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx index d3e58f01c..32629ba4c 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { MetHeader3, PrimaryButton } from 'components/common'; +import { MetHeader3, PrimaryButtonOld } from 'components/common'; import { Widget } from 'models/widget'; import { CircularProgress, IconButton, Stack, TextField } from '@mui/material'; import EditIcon from '@mui/icons-material/Edit'; @@ -73,13 +73,13 @@ export const WidgetTitle = ({ widget }: { widget: Widget }) => { - { saveTitle(); }} > Save - + diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WidgetsBlock.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WidgetsBlock.tsx index 173576f5a..53cac22df 100644 --- a/met-web/src/components/engagement/form/EngagementWidgets/WidgetsBlock.tsx +++ b/met-web/src/components/engagement/form/EngagementWidgets/WidgetsBlock.tsx @@ -1,6 +1,6 @@ import React, { useContext, useEffect, useState, useRef } from 'react'; import { Divider, Grid, Skeleton } from '@mui/material'; -import { MetHeader2, MetPaper, MetTooltip, SecondaryButton } from 'components/common'; +import { MetHeader2Old, MetPaper, MetTooltip, SecondaryButtonOld } from 'components/common'; import { WidgetCardSwitch } from './WidgetCardSwitch'; import { If, Then, Else, When } from 'react-if'; import { WidgetDrawerContext } from './WidgetDrawerContext'; @@ -76,7 +76,7 @@ const WidgetsBlock = () => { return ( - Widgets + Widgets @@ -92,9 +92,9 @@ const WidgetsBlock = () => { title={!savedEngagement.id ? 'Please save the engagement before adding a widget.' : ''} > - + Add Widget - + diff --git a/met-web/src/components/engagement/listing/AdvancedSearch/SearchComponent.tsx b/met-web/src/components/engagement/listing/AdvancedSearch/SearchComponent.tsx index 411751811..8c19911d1 100644 --- a/met-web/src/components/engagement/listing/AdvancedSearch/SearchComponent.tsx +++ b/met-web/src/components/engagement/listing/AdvancedSearch/SearchComponent.tsx @@ -10,9 +10,9 @@ import { useMediaQuery, Theme, } from '@mui/material'; -import { MetParagraph, MetLabel } from 'components/common'; +import { MetParagraphOld, MetLabel } from 'components/common'; import { EngagementDisplayStatus } from 'constants/engagementStatus'; -import { PrimaryButton, SecondaryButton } from '../../../common'; +import { PrimaryButtonOld, SecondaryButtonOld } from '../../../common'; import dayjs from 'dayjs'; import { formatToUTC } from 'components/common/dateHelper'; import { SearchOptions } from './SearchTypes'; @@ -131,7 +131,9 @@ const AdvancedSearch: React.FC = ({ setFilterParams }) => { /> } label={ - {EngagementDisplayStatus[EngagementDisplayStatus.Draft]} + + {EngagementDisplayStatus[EngagementDisplayStatus.Draft]} + } /> = ({ setFilterParams }) => { /> } label={ - + {EngagementDisplayStatus[EngagementDisplayStatus.Scheduled]} - + } /> = ({ setFilterParams }) => { /> } label={ - {EngagementDisplayStatus[EngagementDisplayStatus.Upcoming]} + + {EngagementDisplayStatus[EngagementDisplayStatus.Upcoming]} + } /> = ({ setFilterParams }) => { }} /> } - label={{EngagementDisplayStatus[EngagementDisplayStatus.Open]}} + label={ + + {EngagementDisplayStatus[EngagementDisplayStatus.Open]} + + } /> = ({ setFilterParams }) => { /> } label={ - {EngagementDisplayStatus[EngagementDisplayStatus.Closed]} + + {EngagementDisplayStatus[EngagementDisplayStatus.Closed]} + } /> = ({ setFilterParams }) => { /> } label={ - + {EngagementDisplayStatus[EngagementDisplayStatus.Unpublished]} - + } /> @@ -320,16 +330,19 @@ const AdvancedSearch: React.FC = ({ setFilterParams }) => { width="100%" justifyContent="flex-end" > - handleResetSearchFilters()}> + handleResetSearchFilters()} + > Reset All Filters - - + handleSearch()} > Search - + diff --git a/met-web/src/components/engagement/listing/index.tsx b/met-web/src/components/engagement/listing/index.tsx index e60e9cf55..c4e0eabd4 100644 --- a/met-web/src/components/engagement/listing/index.tsx +++ b/met-web/src/components/engagement/listing/index.tsx @@ -5,7 +5,7 @@ import Grid from '@mui/material/Grid'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import Collapse from '@mui/material/Collapse'; import { Link, useNavigate, useLocation } from 'react-router-dom'; -import { MetPageGridContainer, MetTooltip, PrimaryButton, SecondaryButton } from 'components/common'; +import { MetPageGridContainer, MetTooltip, PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { Engagement } from 'models/engagement'; import { useAppDispatch, useAppSelector } from 'hooks'; import { createDefaultPageInfo, HeadCell, PageInfo, PaginationOptions } from 'components/common/Table/types'; @@ -404,14 +404,14 @@ const EngagementListing = () => { onChange={(e) => setSearchText(e.target.value)} size="small" /> - handleSearchBarClick(searchText)} > - + - setAdvancedSearchOpen(!advancedSearchOpen)} @@ -428,11 +428,11 @@ const EngagementListing = () => { } > Advanced Search - + - setAdvancedSearchOpen(!advancedSearchOpen)} @@ -454,16 +454,16 @@ const EngagementListing = () => { /> } Advanced Search - + - + Create Engagement - + diff --git a/met-web/src/components/engagement/view/EmailPanel.tsx b/met-web/src/components/engagement/view/EmailPanel.tsx index 54f62a936..22c7c6cd4 100644 --- a/met-web/src/components/engagement/view/EmailPanel.tsx +++ b/met-web/src/components/engagement/view/EmailPanel.tsx @@ -5,10 +5,10 @@ import { EmailPanelProps } from './types'; import { MetLabel, modalStyle, - PrimaryButton, - SecondaryButton, - MetHeader1, - MetBody, + PrimaryButtonOld, + SecondaryButtonOld, + MetHeader1Old, + MetBodyOld, MetDescription, MetDisclaimer, } from 'components/common'; @@ -59,30 +59,30 @@ const EmailPanel = ({ email, checkEmail, handleClose, updateEmail, isSaving, isI rowSpacing={2} > - + Verify your email address - + - + To provide you with the best experience possible, we require you to validate your email address. - + - + You will receive a link to provide your feedback at the email address you provide. - + - + Why are we collecting your email? Email verification helps us to know you are not a robot, and ensures we have your consent to collect your feedback. Your email address will remain confidential and will only be used to authenticate your participation in this public comment period. - + @@ -154,12 +154,12 @@ const EmailPanel = ({ email, checkEmail, handleClose, updateEmail, isSaving, isI width="100%" justifyContent="flex-end" > - + Cancel - - + + Submit - + diff --git a/met-web/src/components/engagement/view/EngagementInfoSection.tsx b/met-web/src/components/engagement/view/EngagementInfoSection.tsx index 46bae0fc8..bc09a6f8f 100644 --- a/met-web/src/components/engagement/view/EngagementInfoSection.tsx +++ b/met-web/src/components/engagement/view/EngagementInfoSection.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Stack } from '@mui/material'; -import { MetHeader1, MetLabel } from 'components/common'; +import { MetHeader1Old, MetLabel } from 'components/common'; import { EngagementStatusChip } from '../status'; import { Editor } from 'react-draft-wysiwyg'; import dayjs from 'dayjs'; @@ -60,7 +60,7 @@ const EngagementInfoSection = ({ savedEngagement, children }: EngagementInfoSect spacing={1} > - {name} + {name} diff --git a/met-web/src/components/engagement/view/FailurePanel.tsx b/met-web/src/components/engagement/view/FailurePanel.tsx index e9930ce93..01391f4c7 100644 --- a/met-web/src/components/engagement/view/FailurePanel.tsx +++ b/met-web/src/components/engagement/view/FailurePanel.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Grid, Stack } from '@mui/material'; import { FailurePanelProps } from './types'; -import { modalStyle, PrimaryButton, SecondaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, SecondaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; import { When } from 'react-if'; const FailurePanel = ({ email, handleClose, tryAgain, isInternal }: FailurePanelProps) => { @@ -15,32 +15,32 @@ const FailurePanel = ({ email, handleClose, tryAgain, isInternal }: FailurePanel spacing={2} > - We are sorry + We are sorry - There was a problem with the email address you provided: + There was a problem with the email address you provided: - {email} + {email} - + This is an internal engagement. Make sure you are using a government email. - + - Please verify your email and try again. + Please verify your email and try again. - If this problem persists, contact sample@gmail.com + If this problem persists, contact sample@gmail.com - Go back to Engagement - Try Again + Go back to Engagement + Try Again diff --git a/met-web/src/components/engagement/view/PreviewBanner.tsx b/met-web/src/components/engagement/view/PreviewBanner.tsx index 7785c31ae..3041f4798 100644 --- a/met-web/src/components/engagement/view/PreviewBanner.tsx +++ b/met-web/src/components/engagement/view/PreviewBanner.tsx @@ -4,7 +4,7 @@ import { Box, Typography, Grid, Skeleton, Stack, useMediaQuery, Theme, Link } fr import { useNavigate } from 'react-router-dom'; import { EngagementStatusChip } from '../status'; import { EngagementStatus, SubmissionStatus } from 'constants/engagementStatus'; -import { MetHeader1, PrimaryButton, SecondaryButton, MetBody, MetPaper } from 'components/common'; +import { MetHeader1Old, PrimaryButtonOld, SecondaryButtonOld, MetBodyOld, MetPaper } from 'components/common'; import { useAppSelector } from 'hooks'; import ImageIcon from '@mui/icons-material/Image'; import UnpublishedIcon from '@mui/icons-material/Unpublished'; @@ -58,15 +58,15 @@ export const PreviewBanner = () => { > - {engagementBannerText} + {engagementBannerText} - + This engagement is scheduled to go live on {' ' + scheduledDate + ' at ' + scheduledTime + ' PT'}.{' '} setIsScheduleModalOpen(true)}>Click here to edit the date this Engagement page will go live. - + @@ -84,7 +84,7 @@ export const PreviewBanner = () => { - This engagement is missing a header image. + This engagement is missing a header image. @@ -101,7 +101,7 @@ export const PreviewBanner = () => { - This engagement is missing a survey. + This engagement is missing a survey. @@ -118,7 +118,7 @@ export const PreviewBanner = () => { - This engagement is missing a description. + This engagement is missing a description. @@ -135,7 +135,7 @@ export const PreviewBanner = () => { - This engagement is missing content. + This engagement is missing content. @@ -150,7 +150,9 @@ export const PreviewBanner = () => { - An Administrator can schedule the engagement when ready. + + An Administrator can schedule the engagement when ready. + @@ -194,7 +196,7 @@ export const PreviewBanner = () => { justifyContent="flex-start" > - { onClick={() => navigate(`/engagements/${engagementId}/form`)} > Edit Engagement - + @@ -210,12 +212,12 @@ export const PreviewBanner = () => { scopes={[USER_ROLES.UNPUBLISH_ENGAGEMENT]} errorProps={{ disabled: true }} > - setIsUnpublishModalOpen(true)} > Unpublish Engagement - + @@ -224,12 +226,12 @@ export const PreviewBanner = () => { scopes={[USER_ROLES.PUBLISH_ENGAGEMENT]} errorProps={{ disabled: true }} > - setIsScheduleModalOpen(true)} > Schedule Engagement - + @@ -237,12 +239,12 @@ export const PreviewBanner = () => { scopes={[USER_ROLES.PUBLISH_ENGAGEMENT]} errorProps={{ disabled: true }} > - setIsScheduleModalOpen(true)} > Reschedule Engagement - + diff --git a/met-web/src/components/engagement/view/ScheduleModal/index.tsx b/met-web/src/components/engagement/view/ScheduleModal/index.tsx index 17b896e63..57431fe2c 100644 --- a/met-web/src/components/engagement/view/ScheduleModal/index.tsx +++ b/met-web/src/components/engagement/view/ScheduleModal/index.tsx @@ -1,6 +1,13 @@ import React, { useContext, useState } from 'react'; import { Grid, Stack, TextField, Modal } from '@mui/material'; -import { modalStyle, PrimaryButton, SecondaryButton, MetHeader1, MetBody, MetLabel } from 'components/common'; +import { + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, + MetHeader1Old, + MetBodyOld, + MetLabel, +} from 'components/common'; import dayjs, { Dayjs } from 'dayjs'; import { useAppDispatch } from 'hooks'; import { EngagementStatus } from 'constants/engagementStatus'; @@ -111,22 +118,22 @@ const ScheduleModal = ({ reschedule, open, updateModal }: ScheduleModalProps) => > - + {reschedule ? 'Reschedule Engagement' : 'Schedule Engagement'} - + - + The Engagement page will be visible on the date selected below but the public wonโ€™t be able to provide feedback until the public comment period opens. - + - + Enter the date & time you want the Engagement page to go live. - + width="100%" justifyContent="flex-end" > - updateModal(false)}> + updateModal(false)}> Cancel - - + Submit - + diff --git a/met-web/src/components/engagement/view/SuccessPanel.tsx b/met-web/src/components/engagement/view/SuccessPanel.tsx index b809123ba..058405bb1 100644 --- a/met-web/src/components/engagement/view/SuccessPanel.tsx +++ b/met-web/src/components/engagement/view/SuccessPanel.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Grid } from '@mui/material'; import { SuccessPanelProps } from './types'; -import { modalStyle, PrimaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; const SuccessPanel = ({ email, handleClose }: SuccessPanelProps) => { return ( @@ -15,37 +15,37 @@ const SuccessPanel = ({ email, handleClose }: SuccessPanelProps) => { > - + Thank you - + - + We sent a link to provide your feedback at the following email address: - - {email} + + {email} - + If you don't see the email in your inbox within a few minutes, please check your junk/spam folder, or your promotion folder (Gmail). - + - + Please click the link provided to provide your feedback. - + - The link will be valid for 24 hours. + The link will be valid for 24 hours. - + If you are not able to provide feedback within 24 hours, you may request a new link. Refer to the verification email for more information. - + { spacing={1} sx={{ mt: '1em' }} > - + Close - + diff --git a/met-web/src/components/engagement/view/SurveyBlock.tsx b/met-web/src/components/engagement/view/SurveyBlock.tsx index 21a6f187f..4f0fd38a7 100644 --- a/met-web/src/components/engagement/view/SurveyBlock.tsx +++ b/met-web/src/components/engagement/view/SurveyBlock.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Skeleton } from '@mui/material'; -import { MetPaper, PrimaryButton } from '../../common'; +import { MetPaper, PrimaryButtonOld } from '../../common'; import { ActionContext } from './ActionContext'; import { SubmissionStatus } from 'constants/engagementStatus'; import { SurveyBlockProps } from './types'; @@ -46,18 +46,18 @@ const SurveyBlock = ({ startSurvey }: SurveyBlockProps) => { - {translate('buttonText.shareYourThoughts')} - + - { @@ -69,7 +69,7 @@ const SurveyBlock = ({ startSurvey }: SurveyBlockProps) => { }} > {translate('buttonText.viewFeedback')} - + diff --git a/met-web/src/components/engagement/view/ThankYouPanel.tsx b/met-web/src/components/engagement/view/ThankYouPanel.tsx index 0737f1ed7..8fae25920 100644 --- a/met-web/src/components/engagement/view/ThankYouPanel.tsx +++ b/met-web/src/components/engagement/view/ThankYouPanel.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Typography } from '@mui/material'; -import { modalStyle, PrimaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; import { ThankYouPanelProps } from './types'; import { ActionContext } from './ActionContext'; @@ -17,9 +17,9 @@ const ThankYouPanel = ({ handleClose }: ThankYouPanelProps) => { > - + Thank you - + @@ -27,14 +27,14 @@ const ThankYouPanel = ({ handleClose }: ThankYouPanelProps) => { - Your submission was successful. + Your submission was successful. - + We appreciate you take the time to voice your opinion about {savedEngagement.name}. When the engagement period is over ({savedEngagement.end_date}), you will receive a link to access the full survey report and view all the comments we received. - + { spacing={1} sx={{ mt: '1em' }} > - + Close - + diff --git a/met-web/src/components/engagement/view/UnpublishModal/index.tsx b/met-web/src/components/engagement/view/UnpublishModal/index.tsx index a1f8bd15f..ea17a267c 100644 --- a/met-web/src/components/engagement/view/UnpublishModal/index.tsx +++ b/met-web/src/components/engagement/view/UnpublishModal/index.tsx @@ -1,6 +1,6 @@ import React, { useContext, useState } from 'react'; import { Grid, Stack, Modal } from '@mui/material'; -import { modalStyle, PrimaryButton, SecondaryButton, MetHeader1, MetBody } from 'components/common'; +import { modalStyle, PrimaryButtonOld, SecondaryButtonOld, MetHeader1Old, MetBodyOld } from 'components/common'; import { EngagementStatus } from 'constants/engagementStatus'; import { ActionContext } from 'components/engagement/view/ActionContext'; @@ -38,36 +38,36 @@ const UnpublishModal = ({ open, setModalOpen }: UnpublishModalProps) => { > - + Unpublish Engagement - + - This Engagement will be unpublished: + This Engagement will be unpublished:
    • - The engagement card will be removed from the home page. + The engagement card will be removed from the home page.
    • - + The engagement page and the survey won't be visible to the public anymore. - +
    • - + If the engagement was open, the survey won't be accessible to the public anymore. - +
    • - + The report and approved comments will be accessible internally only. You will have two weeks to review new comments. All comments not reviewed, rejected, or labelled as "needs further review" will be deleted on "two weeks from today date". - +
    @@ -87,15 +87,15 @@ const UnpublishModal = ({ open, setModalOpen }: UnpublishModalProps) => { width="100%" justifyContent="flex-end" > - setModalOpen(false)}>Cancel - setModalOpen(false)}>Cancel + Submit - +     diff --git a/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx b/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx index d23cdbf2c..c24974015 100644 --- a/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx +++ b/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { MetPaper, MetHeader2 } from 'components/common'; +import { MetPaper, MetHeader2Old } from 'components/common'; import { Grid, Skeleton, Divider } from '@mui/material'; import { Widget } from 'models/widget'; import { DocumentItem } from 'models/document'; @@ -50,7 +50,7 @@ const DocumentWidget = ({ widget }: DocumentWidgetProps) => { <> - {widget.title} + {widget.title} {documents.map((document: DocumentItem) => { diff --git a/met-web/src/components/engagement/view/widgets/Events/EventsWidget.tsx b/met-web/src/components/engagement/view/widgets/Events/EventsWidget.tsx index f126705f2..2699fd9ca 100644 --- a/met-web/src/components/engagement/view/widgets/Events/EventsWidget.tsx +++ b/met-web/src/components/engagement/view/widgets/Events/EventsWidget.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { MetPaper, MetHeader2 } from 'components/common'; +import { MetPaper, MetHeader2Old } from 'components/common'; import { Grid, Skeleton, Divider } from '@mui/material'; import { Widget } from 'models/widget'; import { Event, EVENT_TYPE } from 'models/event'; @@ -44,9 +44,9 @@ const EventsWidget = ({ widget }: EventsWidgetProps) => { - + - + @@ -73,7 +73,7 @@ const EventsWidget = ({ widget }: EventsWidgetProps) => { xs={12} paddingBottom={0} > - {widget.title} + {widget.title} {events.map((event: Event) => { diff --git a/met-web/src/components/engagement/view/widgets/Events/InPersonEvent.tsx b/met-web/src/components/engagement/view/widgets/Events/InPersonEvent.tsx index c71c27d4c..1145a7c70 100644 --- a/met-web/src/components/engagement/view/widgets/Events/InPersonEvent.tsx +++ b/met-web/src/components/engagement/view/widgets/Events/InPersonEvent.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { EventItem } from 'models/event'; import { Grid } from '@mui/material'; -import { MetBody } from 'components/common'; +import { MetBodyOld } from 'components/common'; import { formatDate } from 'components/common/dateHelper'; export interface EventProps { @@ -14,43 +14,43 @@ const InPersonEvent = ({ eventItem }: EventProps) => { return ( <> - {eventItem.description} + {eventItem.description} - Location:  + Location:  - {eventItem.location_name} + {eventItem.location_name} - Address:  + Address:  - {eventItem.location_address} + {eventItem.location_address} - Date:  + Date:  - {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} + {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} - Time:  + Time:  - + {`${formatDate(eventItem.start_date, 'h:mm a')} to ${formatDate( eventItem.end_date, 'h:mm a', )} PT`} - + diff --git a/met-web/src/components/engagement/view/widgets/Events/VirtualSession.tsx b/met-web/src/components/engagement/view/widgets/Events/VirtualSession.tsx index 92b4e4965..49d398778 100644 --- a/met-web/src/components/engagement/view/widgets/Events/VirtualSession.tsx +++ b/met-web/src/components/engagement/view/widgets/Events/VirtualSession.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid, Link } from '@mui/material'; -import { MetBody } from 'components/common'; +import { MetBodyOld } from 'components/common'; import { formatDate } from 'components/common/dateHelper'; import { EventProps } from './InPersonEvent'; @@ -9,27 +9,27 @@ const VirtualSession = ({ eventItem }: EventProps) => { return ( <> - {eventItem.description} + {eventItem.description} - Date:  + Date:  - {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} + {formatDate(eventItem.start_date, 'MMMM DD, YYYY')} - Time:  + Time:  - + {`${formatDate(eventItem.start_date, 'h:mm a')} to ${formatDate( eventItem.end_date, 'h:mm a', )} PT`} - + diff --git a/met-web/src/components/engagement/view/widgets/Map/ExpandModal.tsx b/met-web/src/components/engagement/view/widgets/Map/ExpandModal.tsx index bba8ab881..17ff1df8b 100644 --- a/met-web/src/components/engagement/view/widgets/Map/ExpandModal.tsx +++ b/met-web/src/components/engagement/view/widgets/Map/ExpandModal.tsx @@ -3,7 +3,7 @@ import Modal from '@mui/material/Modal'; import { Box, Paper, Grid } from '@mui/material'; import MetMap from 'components/map'; import { WidgetMap } from 'models/widgetMap'; -import { PrimaryButton } from 'components/common'; +import { PrimaryButtonOld } from 'components/common'; import { geoJSONDecode, calculateZoomLevel } from 'components/engagement/form/EngagementWidgets/Map/utils'; interface ExpandModalProps { @@ -71,13 +71,13 @@ export const ExpandModal = ({ open, setOpen, map }: ExpandModalProps) => { - { setOpen(false); }} > Close - + diff --git a/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx b/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx index 66ce61643..d3da63f77 100644 --- a/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx +++ b/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState, useRef } from 'react'; -import { MetPaper, MetHeader2, MetLabel } from 'components/common'; +import { MetPaper, MetHeader2Old, MetLabel } from 'components/common'; import { Grid, Skeleton, Divider, Box, IconButton, Link, useMediaQuery, Theme } from '@mui/material'; import { Widget } from 'models/widget'; import { useAppDispatch } from 'hooks'; @@ -56,9 +56,9 @@ const MapWidget = ({ widget }: MapWidgetProps) => { - + - + @@ -87,7 +87,7 @@ const MapWidget = ({ widget }: MapWidgetProps) => { xs={12} paddingBottom={0} > - {widget.title} + {widget.title} diff --git a/met-web/src/components/engagement/view/widgets/PhasesWidget/EngagementPhase.tsx b/met-web/src/components/engagement/view/widgets/PhasesWidget/EngagementPhase.tsx index d20b4094e..f028bf233 100644 --- a/met-web/src/components/engagement/view/widgets/PhasesWidget/EngagementPhase.tsx +++ b/met-web/src/components/engagement/view/widgets/PhasesWidget/EngagementPhase.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid } from '@mui/material'; -import { MetHeader4, MetParagraph } from 'components/common'; +import { MetHeader4, MetParagraphOld } from 'components/common'; import { LearnMoreBox } from './LearnMoreBox'; import { EngagementPhases, PAST_PHASE, ProcessStageProps } from 'models/engagementPhases'; import { PhaseBox } from './PhaseBox'; @@ -44,7 +44,7 @@ export const EngagementPhase = ({ } - iconBox={popOverText ? {popOverText} : false} + iconBox={popOverText ? {popOverText} : false} isCurrentPhase={phaseId === currentPhase} currentPhase={currentPhase} /> diff --git a/met-web/src/components/engagement/view/widgets/PhasesWidget/InfoArrow.tsx b/met-web/src/components/engagement/view/widgets/PhasesWidget/InfoArrow.tsx index 6459e1d5f..e5abd7f68 100644 --- a/met-web/src/components/engagement/view/widgets/PhasesWidget/InfoArrow.tsx +++ b/met-web/src/components/engagement/view/widgets/PhasesWidget/InfoArrow.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { MetSmallText } from 'components/common'; +import { MetSmallTextOld } from 'components/common'; import { Stack, Box } from '@mui/material'; import { INFO_ARROW } from 'models/engagementPhases'; @@ -12,10 +12,10 @@ export const InfoArrow = () => { padding: '0.25em 1em', }} > - + Engagement and consensus-seeking with participating First Nations occur at each stage of the process, supported by dispute resolution at certain stages if required. - + } accordionBackground={isCurrent ? accordionBackground : PAST_PHASE.learnMoreBackgroundColor} - iconBox={popOverText ? {popOverText} : false} + iconBox={popOverText ? {popOverText} : false} isCurrentPhase={phaseId === currentPhase} currentPhase={currentPhase} /> diff --git a/met-web/src/components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx b/met-web/src/components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx index 8217f4613..cbb3098b6 100644 --- a/met-web/src/components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx +++ b/met-web/src/components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; import { Grid, Skeleton, Typography } from '@mui/material'; -import { MetBody, MetHeader3, MetPaper } from 'components/common'; +import { MetBodyOld, MetHeader3, MetPaper } from 'components/common'; import { WidgetType } from 'models/widget'; import { styled } from '@mui/material/styles'; import { ActionContext } from '../../../ActionContext'; @@ -68,10 +68,10 @@ export const PhasesWidgetMobile = () => { {phasesWidget.title} - + Click on the sections below to expand them and learn more about each EA process phase. You can also learn more about each engagement period by clicking the engagement icon. - + diff --git a/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx b/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx index 4d7c69d1e..cef3d6763 100644 --- a/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx +++ b/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx @@ -1,6 +1,6 @@ import React, { useContext, useState } from 'react'; import { Grid, Skeleton, Stack } from '@mui/material'; -import { MetBody, MetHeader3, MetLabel, MetPaper } from 'components/common'; +import { MetBodyOld, MetHeader3, MetLabel, MetPaper } from 'components/common'; import { WidgetType } from 'models/widget'; import { ActionContext } from '../../ActionContext'; import { EngagementPhase } from './EngagementPhase'; @@ -56,12 +56,12 @@ export const PhasesWidget = () => { - + Click โ€˜learn moreโ€™ on the sections below for more details about each phase in the Environmental Assessment process. Click the speech bubble icon {} to learn more about each unique public commenting period. - + diff --git a/met-web/src/components/engagement/view/widgets/Poll/PollWidgetView.tsx b/met-web/src/components/engagement/view/widgets/Poll/PollWidgetView.tsx index e28f9a2a5..8be09d280 100644 --- a/met-web/src/components/engagement/view/widgets/Poll/PollWidgetView.tsx +++ b/met-web/src/components/engagement/view/widgets/Poll/PollWidgetView.tsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { MetPaper, MetHeader2, PrimaryButton } from 'components/common'; +import { MetPaper, MetHeader2Old, PrimaryButtonOld } from 'components/common'; import { Grid, Skeleton, Divider } from '@mui/material'; import PollDisplay from '../../../form/EngagementWidgets/Poll/PollDisplay'; import { Widget } from 'models/widget'; @@ -138,9 +138,9 @@ const PollWidgetView = ({ widget }: PollWidgetViewProps) => { - + - + @@ -161,7 +161,7 @@ const PollWidgetView = ({ widget }: PollWidgetViewProps) => { xs={12} paddingBottom={0} > - {widget.title} + {widget.title} @@ -174,7 +174,7 @@ const PollWidgetView = ({ widget }: PollWidgetViewProps) => { <> {!isSubmitted && ( - handleSubmit()}>Submit + handleSubmit()}>Submit )} {responseMessage?.message && ( diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/EmailListSection.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/EmailListSection.tsx index 4cd210861..62b1ab635 100644 --- a/met-web/src/components/engagement/view/widgets/Subscribe/EmailListSection.tsx +++ b/met-web/src/components/engagement/view/widgets/Subscribe/EmailListSection.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { SecondaryButton } from 'components/common'; +import { SecondaryButtonOld } from 'components/common'; import { Grid, Link } from '@mui/material'; import { SubscribeForm, CallToActionType } from 'models/subscription'; import { When } from 'react-if'; @@ -34,9 +34,9 @@ const EmailListSection = ({ - setOpen(true)}> + setOpen(true)}> {subscribeOption.subscribe_items[0].call_to_action_text} - + diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/FormSignUpSection.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/FormSignUpSection.tsx index 7fc3948de..fd83cd966 100644 --- a/met-web/src/components/engagement/view/widgets/Subscribe/FormSignUpSection.tsx +++ b/met-web/src/components/engagement/view/widgets/Subscribe/FormSignUpSection.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { SecondaryButton } from 'components/common'; +import { SecondaryButtonOld } from 'components/common'; import { Grid, Link } from '@mui/material'; import { SubscribeForm, CallToActionType } from 'models/subscription'; import { When } from 'react-if'; @@ -35,9 +35,9 @@ const FormSignUpSection = ({ subscribeOption, widget }: { subscribeOption: Subsc - + {subscribeOption.subscribe_items[0].call_to_action_text} - + diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/ManageSubscription/Subscription.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/ManageSubscription/Subscription.tsx index 966e12189..a21d121e3 100644 --- a/met-web/src/components/engagement/view/widgets/Subscribe/ManageSubscription/Subscription.tsx +++ b/met-web/src/components/engagement/view/widgets/Subscribe/ManageSubscription/Subscription.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from 'react'; import { useParams } from 'react-router-dom'; import { Grid } from '@mui/material'; -import { MetHeader1, MetParagraph, MetLabel } from 'components/common'; +import { MetHeader1Old, MetParagraphOld, MetLabel } from 'components/common'; import { Banner } from 'components/banner/Banner'; import LandingPageBanner from 'assets/images/LandingPageBanner.png'; import { useAppDispatch, useAppSelector } from 'hooks'; @@ -102,10 +102,10 @@ export const Subscription = () => { rowSpacing={2} > - {tenant?.name} + {tenant?.name} - {translate('subscription.paragraph')} + {translate('subscription.paragraph')} diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx index b6811e1b5..580699553 100644 --- a/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx +++ b/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState, useContext } from 'react'; -import { MetHeader2, MetPaper } from 'components/common'; +import { MetHeader2Old, MetPaper } from 'components/common'; import { ActionContext } from '../../ActionContext'; import { Divider, Grid, Skeleton } from '@mui/material'; import { useAppDispatch } from 'hooks'; @@ -52,7 +52,7 @@ const SubscribeWidget = ({ widget }: { widget: Widget }) => { - {widget.title} + {widget.title} {subscribeItems?.map((item, index) => { diff --git a/met-web/src/components/engagement/view/widgets/Timeline/TimelineWidgetView.tsx b/met-web/src/components/engagement/view/widgets/Timeline/TimelineWidgetView.tsx index b0b87fa5f..25e09a670 100644 --- a/met-web/src/components/engagement/view/widgets/Timeline/TimelineWidgetView.tsx +++ b/met-web/src/components/engagement/view/widgets/Timeline/TimelineWidgetView.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { MetPaper, MetHeader2, MetParagraph, MetHeader4 } from 'components/common'; +import { MetPaper, MetHeader2Old, MetParagraphOld, MetHeader4 } from 'components/common'; import { Avatar, Grid, Skeleton, Divider } from '@mui/material'; import { Widget } from 'models/widget'; import { useAppDispatch } from 'hooks'; @@ -113,13 +113,13 @@ const TimelineWidgetView = ({ widget }: TimelineWidgetProps) => { {tEvent.description} - {tEvent.time} - + ); @@ -130,9 +130,9 @@ const TimelineWidgetView = ({ widget }: TimelineWidgetProps) => { - + - + @@ -157,11 +157,11 @@ const TimelineWidgetView = ({ widget }: TimelineWidgetProps) => { xs={12} paddingBottom={0} > - {timelineWidget.title} + {timelineWidget.title} - {timelineWidget.description} + {timelineWidget.description} {timelineWidget && diff --git a/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx b/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx index be4b87d5a..79a085f10 100644 --- a/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx +++ b/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { MetPaper, MetHeader2, MetParagraph, AspectRatioContainer, ReactPlayerWrapper } from 'components/common'; +import { MetPaper, MetHeader2Old, MetParagraphOld, AspectRatioContainer, ReactPlayerWrapper } from 'components/common'; import { Grid, Skeleton, Divider } from '@mui/material'; import { Widget } from 'models/widget'; import { useAppDispatch } from 'hooks'; @@ -51,9 +51,9 @@ const VideoWidgetView = ({ widget }: VideoWidgetProps) => { - + - + @@ -78,11 +78,11 @@ const VideoWidgetView = ({ widget }: VideoWidgetProps) => { xs={12} paddingBottom={0} > - {widget.title} + {widget.title} - {videoWidget.description} + {videoWidget.description} diff --git a/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx b/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx index fc543c33a..f4c6011d0 100644 --- a/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx +++ b/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { MetPaper, MetHeader2, MetHeader3, MetBody, MetSmallText } from 'components/common'; +import { MetPaper, MetHeader2Old, MetHeader3, MetBodyOld, MetSmallTextOld } from 'components/common'; import { Grid, Avatar, Link, Skeleton, useTheme, Divider } from '@mui/material'; import { Widget } from 'models/widget'; import { Contact } from 'models/contact'; @@ -51,9 +51,9 @@ const WhoIsListeningWidget = ({ widget }: WhoIsListeningWidgetProps) => { - + - + @@ -73,7 +73,7 @@ const WhoIsListeningWidget = ({ widget }: WhoIsListeningWidgetProps) => { return ( - {widget.title} + {widget.title} {contacts.map((contact) => { @@ -105,7 +105,7 @@ const WhoIsListeningWidget = ({ widget }: WhoIsListeningWidgetProps) => { - {contact.title} + {contact.title} @@ -116,7 +116,7 @@ const WhoIsListeningWidget = ({ widget }: WhoIsListeningWidgetProps) => { xs={12} sx={{ whiteSpace: 'pre-line' }} > - { }} > {contact.bio} - + - + Email:{' '} - + {' ' + contact.email} - + Phone:{' '} - + {' ' + contact.phone_number} diff --git a/met-web/src/components/feedback/FeedbackModal/index.tsx b/met-web/src/components/feedback/FeedbackModal/index.tsx index ac9a22a2e..d37cf21f3 100644 --- a/met-web/src/components/feedback/FeedbackModal/index.tsx +++ b/met-web/src/components/feedback/FeedbackModal/index.tsx @@ -14,7 +14,7 @@ import * as React from 'react'; import CloseIcon from '@mui/icons-material/Close'; import { ReactComponent as CheckIcon } from 'assets/images/check.svg'; import { useState } from 'react'; -import { MetBody, MetHeader3, MetLabel, modalStyle, PrimaryButton, MetDisclaimer } from '../../common'; +import { MetBodyOld, MetHeader3, MetLabel, modalStyle, PrimaryButtonOld, MetDisclaimer } from '../../common'; import { CommentTypeEnum, createDefaultFeedback, setFeedbackPath, RatingTypeEnum } from 'models/feedback'; import { Else, If, Then, When } from 'react-if'; import { CommentTypeButton, StyledRating } from './styledComponents'; @@ -88,7 +88,7 @@ export const FeedbackModal = () => { return ( <> - setIsOpen(true)} sx={{ @@ -105,7 +105,7 @@ export const FeedbackModal = () => { {translate('feedback.websiteFeedback')} - + handleClose()}> { - + {translate('feedback.submitModal.button')} - + @@ -184,7 +184,7 @@ export const FeedbackModal = () => { sx={{ border: comment_type == CommentTypeEnum.Issue ? '2px solid black' : '' }} > - {commentTypes[CommentTypeEnum.Issue].label} + {commentTypes[CommentTypeEnum.Issue].label} {commentTypes[CommentTypeEnum.Issue].icon} @@ -195,7 +195,7 @@ export const FeedbackModal = () => { sx={{ border: comment_type == CommentTypeEnum.Idea ? '2px solid black' : '' }} > - {commentTypes[CommentTypeEnum.Idea].label} + {commentTypes[CommentTypeEnum.Idea].label} {commentTypes[CommentTypeEnum.Idea].icon} @@ -218,7 +218,7 @@ export const FeedbackModal = () => { justifyContent="space-around" alignItems="center" > - {commentTypes[comment_type].label} + {commentTypes[comment_type].label} {commentTypes[comment_type].icon} @@ -245,14 +245,14 @@ export const FeedbackModal = () => { - {translate('feedback.feedbackModal.button')} - + diff --git a/met-web/src/components/feedback/listing.tsx b/met-web/src/components/feedback/listing.tsx index 51ad3c9df..5994057db 100644 --- a/met-web/src/components/feedback/listing.tsx +++ b/met-web/src/components/feedback/listing.tsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from 'react'; import Grid from '@mui/material/Grid'; -import { MetPageGridContainer, PrimaryButton } from 'components/common'; +import { MetPageGridContainer, PrimaryButtonOld } from 'components/common'; import { CommentTypeEnum, Feedback, FeedbackStatusEnum, SourceTypeEnum } from 'models/feedback'; import { useAppDispatch, useAppSelector } from 'hooks'; import { createDefaultPageInfo, HeadCell, PageInfo, PaginationOptions } from 'components/common/Table/types'; @@ -155,7 +155,7 @@ const FeedbackListing = () => { sx={{ p: 2 }} > - { setPaginationOptions({ page: 1, @@ -172,7 +172,7 @@ const FeedbackListing = () => { }} > {statusFilter == FeedbackStatusEnum.NotReviewed ? 'View Archive' : 'View Feedback'} - + diff --git a/met-web/src/components/homePage/homePage.tsx b/met-web/src/components/homePage/homePage.tsx index 787a0844d..dc6d99d27 100644 --- a/met-web/src/components/homePage/homePage.tsx +++ b/met-web/src/components/homePage/homePage.tsx @@ -1,6 +1,6 @@ import React from 'react'; import Grid from '@mui/material/Grid'; -import { MetHeader1 } from 'components/common'; +import { MetHeader1Old } from 'components/common'; const HomePage = () => { return ( { textAlign="center" style={{ minHeight: '100vh' }} > - Welcome to MET + Welcome to MET ); }; diff --git a/met-web/src/components/imageUpload/Uploader.tsx b/met-web/src/components/imageUpload/Uploader.tsx index ea7534f56..6ec193d1b 100644 --- a/met-web/src/components/imageUpload/Uploader.tsx +++ b/met-web/src/components/imageUpload/Uploader.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useContext } from 'react'; import { Grid, Stack, Typography } from '@mui/material'; import Dropzone, { Accept } from 'react-dropzone'; -import { PrimaryButton, SecondaryButton } from 'components/common'; +import { PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { ImageUploadContext } from './imageUploadContext'; interface UploaderProps { @@ -73,7 +73,7 @@ const Uploader = ({ width="100%" justifyContent="flex-end" > - { setAddedImageFileUrl(''); setAddedImageFileName(''); @@ -85,15 +85,15 @@ const Uploader = ({ size="small" > Remove - - + { setCropModalOpen(true); }} size="small" > Crop - + diff --git a/met-web/src/components/imageUpload/cropModal.tsx b/met-web/src/components/imageUpload/cropModal.tsx index af102fa46..cbd95a1bd 100644 --- a/met-web/src/components/imageUpload/cropModal.tsx +++ b/met-web/src/components/imageUpload/cropModal.tsx @@ -1,7 +1,7 @@ import React, { useContext, useState } from 'react'; import Modal from '@mui/material/Modal'; import { Container, Grid, Paper } from '@mui/material'; -import { MetDescription, modalStyle, PrimaryButton } from 'components/common'; +import { MetDescription, modalStyle, PrimaryButtonOld } from 'components/common'; import Cropper, { Area } from 'react-easy-crop'; import { ImageUploadContext } from './imageUploadContext'; import { Box } from '@mui/system'; @@ -99,13 +99,13 @@ export const CropModal = () => { - { handleCropDone(croppedArea); }} > Save - + diff --git a/met-web/src/components/landing/EngagementTile.tsx b/met-web/src/components/landing/EngagementTile.tsx index a5f21927e..d8844d6d8 100644 --- a/met-web/src/components/landing/EngagementTile.tsx +++ b/met-web/src/components/landing/EngagementTile.tsx @@ -5,7 +5,14 @@ import CardContent from '@mui/material/CardContent'; import CardMedia from '@mui/material/CardMedia'; import { Engagement } from 'models/engagement'; import { Box, Stack } from '@mui/material'; -import { MetBody, MetHeader4, MetLabel, MetParagraph, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetBodyOld, + MetHeader4, + MetLabel, + MetParagraphOld, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { getEngagement } from 'services/engagementService'; import { If, Then, When } from 'react-if'; import dayjs from 'dayjs'; @@ -99,7 +106,7 @@ const EngagementTile = ({ passedEngagement, engagementId }: EngagementTileProps) {name} - {description} - + - + {EngagementDate} - + - {translate('landingPage.tile.status')} + {translate('landingPage.tile.status')} - { event.stopPropagation(); @@ -131,7 +138,7 @@ const EngagementTile = ({ passedEngagement, engagementId }: EngagementTileProps) }} > {translate('buttonText.shareYourThoughts')} - + - { event.stopPropagation(); @@ -148,7 +155,7 @@ const EngagementTile = ({ passedEngagement, engagementId }: EngagementTileProps) }} > {translate('buttonText.viewEngagement')} - + diff --git a/met-web/src/components/landing/LandingComponent.tsx b/met-web/src/components/landing/LandingComponent.tsx index 042e0d0ab..0a0618c5d 100644 --- a/met-web/src/components/landing/LandingComponent.tsx +++ b/met-web/src/components/landing/LandingComponent.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Grid } from '@mui/material'; import { Banner } from 'components/banner/Banner'; -import { MetHeader1, MetParagraph } from 'components/common'; +import { MetHeader1Old, MetParagraphOld } from 'components/common'; import TileBlock from './TileBlock'; import { Container } from '@mui/system'; import LandingPageBanner from 'assets/images/LandingPageBanner.png'; @@ -47,10 +47,10 @@ const LandingComponent = () => { rowSpacing={2} > - {translate('landing.banner.header')} + {translate('landing.banner.header')} - {translate('landing.banner.description')} + {translate('landing.banner.description')} diff --git a/met-web/src/components/layout/Footer/index.tsx b/met-web/src/components/layout/Footer/index.tsx index eaaddcec5..3bda9c332 100644 --- a/met-web/src/components/layout/Footer/index.tsx +++ b/met-web/src/components/layout/Footer/index.tsx @@ -1,5 +1,5 @@ import { Box, Divider, Grid, Link, Stack } from '@mui/material'; -import { MetBody, MetLabel, SocialIconButton } from 'components/common'; +import { MetBodyOld, MetLabel, SocialIconButton } from 'components/common'; import React from 'react'; import { ReactComponent as BCLogo } from 'assets/images/BritishColumbiaLogoDark.svg'; import { Palette } from 'styles/Theme'; @@ -32,7 +32,7 @@ const Footer = () => { }} padding={{ xs: '2em 1em', md: '2em 6em' }} > - {translate('footer.body')} + {translate('footer.body')} { /> - {translate('footer.connectWithUs')} + {translate('footer.connectWithUs')} { - {translate('footer.copyrightNotice')} + {translate('footer.copyrightNotice')} diff --git a/met-web/src/components/layout/Header/InternalHeader.tsx b/met-web/src/components/layout/Header/InternalHeader.tsx index e321388da..376546aae 100644 --- a/met-web/src/components/layout/Header/InternalHeader.tsx +++ b/met-web/src/components/layout/Header/InternalHeader.tsx @@ -9,7 +9,7 @@ import SideNav from '../SideNav/SideNav'; import CssBaseline from '@mui/material/CssBaseline'; import { Palette } from 'styles/Theme'; import EnvironmentBanner from './EnvironmentBanner'; -import { HeaderTitle } from 'components/common'; +import { HeaderTitleOld } from 'components/common'; import { ReactComponent as BCLogo } from 'assets/images/BritishColumbiaLogoDark.svg'; import { When } from 'react-if'; import MenuIcon from '@mui/icons-material/Menu'; @@ -93,23 +93,23 @@ const InternalHeader = ({ drawerWidth = 280 }: HeaderProps) => { /> {isMediumScreen ? ( - { navigate('/home'); }} sx={{ flexGrow: 1, cursor: 'pointer' }} > {translate('header.title')} - + ) : ( - { navigate('/home'); }} sx={{ flexGrow: 1, cursor: 'pointer' }} > {translate('header.smallTitle')} - + )} + + + + + + + Name + Description + + + + + + {[...Array(5)].map((_, index) => ( + + + + + + + + + + ))} + + + {tenants.map((tenant) => ( + { + return; + }} + key={tenant.name} + tabIndex={0} + > + + + {tenant.name} + + {/* TODO: Replace when primary contact info is added to tenants */} + <Primary Contact> + + + {tenant.description} + + + ))} + + + +
    +     + + ); +}; + +export default TenantListing; diff --git a/met-web/src/components/tenantManagement/listing/index.tsx b/met-web/src/components/tenantManagement/listing/index.tsx deleted file mode 100644 index 018234264..000000000 --- a/met-web/src/components/tenantManagement/listing/index.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import { Box, Typography } from '@mui/material'; -import React from 'react'; - -const TenantManagement = () => { - return ( - - This is the tenant management page! - {/* todo: the rest of the page */} - - ); -}; - -export default TenantManagement; diff --git a/met-web/src/components/userManagement/listing/AddUserModal.tsx b/met-web/src/components/userManagement/listing/AddUserModal.tsx index b89c42b8b..3ab595512 100644 --- a/met-web/src/components/userManagement/listing/AddUserModal.tsx +++ b/met-web/src/components/userManagement/listing/AddUserModal.tsx @@ -1,7 +1,14 @@ import React, { useContext, useEffect, useRef, useState } from 'react'; import Modal from '@mui/material/Modal'; import { Autocomplete, CircularProgress, Grid, Paper, Stack, TextField, useTheme } from '@mui/material'; -import { MetHeader3, MetLabel, MetSmallText, modalStyle, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetHeader3, + MetLabel, + MetSmallTextOld, + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { UserManagementContext } from './UserManagementContext'; import { useForm, FormProvider, SubmitHandler, Controller } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; @@ -202,7 +209,9 @@ export const AddUserModal = () => { - {backendError} + + {backendError} + @@ -221,10 +230,10 @@ export const AddUserModal = () => { width="100%" justifyContent="flex-end" > - Cancel - + Cancel + Submit - + diff --git a/met-web/src/components/userManagement/listing/AssignRoleModal.tsx b/met-web/src/components/userManagement/listing/AssignRoleModal.tsx index e24dac9e0..7d65b8abc 100644 --- a/met-web/src/components/userManagement/listing/AssignRoleModal.tsx +++ b/met-web/src/components/userManagement/listing/AssignRoleModal.tsx @@ -14,7 +14,14 @@ import { TextField, useTheme, } from '@mui/material'; -import { MetHeader3, MetLabel, MetSmallText, modalStyle, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetHeader3, + MetLabel, + MetSmallTextOld, + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { USER_COMPOSITE_ROLE } from 'models/user'; import { UserManagementContext } from './UserManagementContext'; import { Palette } from 'styles/Theme'; @@ -284,7 +291,9 @@ export const AssignRoleModal = () => { - {backendError} + + {backendError} + { width="100%" justifyContent="flex-end" > - Cancel - + Cancel + Submit - + diff --git a/met-web/src/components/userManagement/listing/ReassignRoleModal.tsx b/met-web/src/components/userManagement/listing/ReassignRoleModal.tsx index d92866c73..cfdbe10a0 100644 --- a/met-web/src/components/userManagement/listing/ReassignRoleModal.tsx +++ b/met-web/src/components/userManagement/listing/ReassignRoleModal.tsx @@ -1,7 +1,7 @@ import React, { useContext, useState } from 'react'; import Modal from '@mui/material/Modal'; import { FormControl, FormControlLabel, FormLabel, Grid, Paper, Radio, Stack } from '@mui/material'; -import { MetDescription, MetHeader3, PrimaryButton, SecondaryButton, modalStyle } from 'components/common'; +import { MetDescription, MetHeader3, PrimaryButtonOld, SecondaryButtonOld, modalStyle } from 'components/common'; import { UserManagementContext } from './UserManagementContext'; import { useForm, FormProvider } from 'react-hook-form'; import { yupResolver } from '@hookform/resolvers/yup'; @@ -143,10 +143,10 @@ export const ReassignRoleModal = () => { width="100%" justifyContent="flex-end" > - Cancel - + Cancel + Submit - + diff --git a/met-web/src/components/userManagement/listing/UserManagementListing.tsx b/met-web/src/components/userManagement/listing/UserManagementListing.tsx index 66b902d25..a403baf95 100644 --- a/met-web/src/components/userManagement/listing/UserManagementListing.tsx +++ b/met-web/src/components/userManagement/listing/UserManagementListing.tsx @@ -5,7 +5,7 @@ import Stack from '@mui/material/Stack'; import SearchIcon from '@mui/icons-material/Search'; import { USER_STATUS, User } from 'models/user'; import { HeadCell, PaginationOptions } from 'components/common/Table/types'; -import { MetPageGridContainer, PrimaryButton } from 'components/common'; +import { MetPageGridContainer, PrimaryButtonOld } from 'components/common'; import { Link } from 'react-router-dom'; import { Link as MuiLink } from '@mui/material'; import MetTable from 'components/common/Table'; @@ -100,9 +100,9 @@ const UserManagementListing = () => { onChange={(e) => setSearchBarText(e.target.value)} size="small" /> - + - + diff --git a/met-web/src/components/userManagement/userDetails/AddToEngagement.tsx b/met-web/src/components/userManagement/userDetails/AddToEngagement.tsx index 980345066..fa6946c5f 100644 --- a/met-web/src/components/userManagement/userDetails/AddToEngagement.tsx +++ b/met-web/src/components/userManagement/userDetails/AddToEngagement.tsx @@ -14,7 +14,14 @@ import { TextField, useTheme, } from '@mui/material'; -import { MetHeader3, MetLabel, MetSmallText, modalStyle, PrimaryButton, SecondaryButton } from 'components/common'; +import { + MetHeader3, + MetLabel, + MetSmallTextOld, + modalStyle, + PrimaryButtonOld, + SecondaryButtonOld, +} from 'components/common'; import { USER_COMPOSITE_ROLE } from 'models/user'; import { UserDetailsContext } from './UserDetailsContext'; import { useForm, FormProvider, SubmitHandler, Controller } from 'react-hook-form'; @@ -298,7 +305,9 @@ export const AddToEngagementModal = () => { - {backendError} + + {backendError} + @@ -317,10 +326,10 @@ export const AddToEngagementModal = () => { width="100%" justifyContent="flex-end" > - Cancel - + Cancel + Submit - + diff --git a/met-web/src/components/userManagement/userDetails/UserDetails.tsx b/met-web/src/components/userManagement/userDetails/UserDetails.tsx index 4cf553856..36affd5a6 100644 --- a/met-web/src/components/userManagement/userDetails/UserDetails.tsx +++ b/met-web/src/components/userManagement/userDetails/UserDetails.tsx @@ -1,7 +1,7 @@ import React, { useContext } from 'react'; import { Grid, Stack, Link } from '@mui/material'; import { useAppSelector } from 'hooks'; -import { MetLabel, MetParagraph, MetPageGridContainer, PrimaryButton } from 'components/common'; +import { MetLabel, MetParagraphOld, MetPageGridContainer, PrimaryButtonOld } from 'components/common'; import { UserDetailsContext } from './UserDetailsContext'; import { formatDate } from 'components/common/dateHelper'; import AssignedEngagementsListing from './AssignedEngagementsListing'; @@ -40,7 +40,7 @@ export const UserDetails = () => { {`${savedUser?.last_name}, ${savedUser?.first_name}`} + {`${savedUser?.last_name}, ${savedUser?.first_name}`} } /> @@ -56,7 +56,9 @@ export const UserDetails = () => { {savedUser ? formatDate(savedUser?.created_date) : ''} + + {savedUser ? formatDate(savedUser?.created_date) : ''} + } /> @@ -64,17 +66,20 @@ export const UserDetails = () => { - {savedUser?.main_role}} /> + {savedUser?.main_role}} + /> + {savedUser?.status_id === USER_STATUS.ACTIVE.value ? USER_STATUS.ACTIVE.label : USER_STATUS.INACTIVE.label} - + } /> @@ -89,7 +94,7 @@ export const UserDetails = () => { - setAddUserModalOpen(true)} disabled={ savedUser?.main_role === USER_COMPOSITE_ROLE.VIEWER.label || @@ -98,7 +103,7 @@ export const UserDetails = () => { } > + Add to an Engagement - + diff --git a/met-web/src/components/userManagement/userDetails/UserStatusButton.tsx b/met-web/src/components/userManagement/userDetails/UserStatusButton.tsx index 9f92bcd99..e808af129 100644 --- a/met-web/src/components/userManagement/userDetails/UserStatusButton.tsx +++ b/met-web/src/components/userManagement/userDetails/UserStatusButton.tsx @@ -1,5 +1,5 @@ import React, { useContext, useEffect, useState } from 'react'; -import { PrimaryButton, SecondaryButton } from 'components/common'; +import { PrimaryButtonOld, SecondaryButtonOld } from 'components/common'; import { useAppSelector, useAppDispatch } from 'hooks'; import { UserDetailsContext } from './UserDetailsContext'; import { openNotificationModal } from 'services/notificationModalService/notificationModalSlice'; @@ -114,17 +114,17 @@ const UserStatusButton = () => { }; return disabled ? ( - + {userStatus ? 'Deactivate User' : 'Reactivate User'} - + ) : ( - handleToggleUserStatus(!userStatus)} > {userStatus ? 'Deactivate User' : 'Reactivate User'} - + ); }; diff --git a/met-web/src/models/engagementPhases.tsx b/met-web/src/models/engagementPhases.tsx index d6947f1a5..3ffc90998 100644 --- a/met-web/src/models/engagementPhases.tsx +++ b/met-web/src/models/engagementPhases.tsx @@ -1,6 +1,6 @@ import React, { ReactNode } from 'react'; import { Grid } from '@mui/material'; -import { MetParagraph } from 'components/common'; +import { MetParagraphOld } from 'components/common'; export enum EngagementPhases { Standalone = 0, @@ -46,10 +46,10 @@ export const ENGAGEMENT_PHASES = { learnMoreBackgroundColor: '#EFFBFD', learnMoreText: ( - + Engage with Indigenous nations, stakeholders, technical experts and the public to identify potential key issues early in the process, and ways they could be addressed. - + ), popOverText: @@ -63,10 +63,10 @@ export const ENGAGEMENT_PHASES = { accordionBackground: '#F2DEDE', learnMoreText: ( - + Review detailed project description, and input from early engagement and technical advisors, to determine whether to proceed to environmental assessment. Consensus with Indigenous nations sought. - + ), }, @@ -78,11 +78,11 @@ export const ENGAGEMENT_PHASES = { learnMoreBackgroundColor: '#ECF3FC', learnMoreText: ( - + Engage with Indigenous nations, stakeholders, technical experts to establish how the environmental assessment will be conducted, including scope, procedures and methods, and how provincial and Indigenous processes and decision-making will align. Consensus with Indigenous nations sought. - + ), popOverText: @@ -97,21 +97,21 @@ export const ENGAGEMENT_PHASES = { learnMoreText: ( <> - + Proponent consults and does technical studies, then develops the initial application. EAO then seeks feedback on it from Indigenous nations, stakeholders, technical experts and the public. - + - + Proponent revises application, and submits to EAO for review. Consensus with Indigenous nations sought. - + - + Decision point: accept revised application or require further revisions. - + ), @@ -127,18 +127,18 @@ export const ENGAGEMENT_PHASES = { learnMoreText: ( <> - + Assess potential effects of the project. Develop assessment report and draft conditions to address potential adverse effects, in consultation with technical experts and Indigenous nations. Seek and incorporate feedback from Indigenous nations, stakeholders, technical experts and the public. Consensus with Indigenous nations sought. - + - + Decision point: recommend to ministers whether or not to issue an Environmental Assessment Certificate. - + ), @@ -153,10 +153,10 @@ export const ENGAGEMENT_PHASES = { learnMoreBackgroundColor: '#F3EFFF', learnMoreText: ( - + Decision point: Ministers determine whether or not project will receive an Environmental Assessment Certificate, and if so, what conditions will be required to address potential adverse effects. - + ), }, @@ -169,16 +169,16 @@ export const ENGAGEMENT_PHASES = { learnMoreText: ( <> - + Monitor project to make sure requirements are being followed. Projects not in compliance are subject to enforcement measures, including fines. - + - + Proponents may also seek amendments to the Certificate as permitting and construction proceeds and operations get underway. - + ), diff --git a/met-web/src/routes/AuthenticatedRoutes.tsx b/met-web/src/routes/AuthenticatedRoutes.tsx index 0028fb8a0..d060c1e90 100644 --- a/met-web/src/routes/AuthenticatedRoutes.tsx +++ b/met-web/src/routes/AuthenticatedRoutes.tsx @@ -25,7 +25,7 @@ import UserProfile from 'components/userManagement/userDetails'; import ScrollToTop from 'components/scrollToTop'; import ReportSettings from 'components/survey/report'; import FormioListener from 'components/FormioListener'; -import TenantManagement from 'components/tenantManagement/listing'; +import TenantListing from 'components/tenantManagement/Listing'; const AuthenticatedRoutes = () => { return ( @@ -65,7 +65,7 @@ const AuthenticatedRoutes = () => { } /> }> - } /> + } /> }> } /> diff --git a/met-web/src/routes/NoAccess.tsx b/met-web/src/routes/NoAccess.tsx index b75317e42..52e171d26 100644 --- a/met-web/src/routes/NoAccess.tsx +++ b/met-web/src/routes/NoAccess.tsx @@ -1,6 +1,6 @@ import { Grid, Stack, Toolbar } from '@mui/material'; import React from 'react'; -import { MetHeader1, MetHeader4 } from 'components/common'; +import { MetHeader1Old, MetHeader4 } from 'components/common'; const NoAccess = () => { return ( @@ -16,9 +16,9 @@ const NoAccess = () => { > - + Access Request - + Your login was successful and an email has been sent to our administrators to request your access. Once your request is processed, you'll get a notification email to confirm you can diff --git a/met-web/src/routes/NoResults.tsx b/met-web/src/routes/NoResults.tsx index 53b9a7212..32043d4d1 100644 --- a/met-web/src/routes/NoResults.tsx +++ b/met-web/src/routes/NoResults.tsx @@ -1,5 +1,5 @@ import { Grid, Toolbar, Box } from '@mui/material'; -import { MetParagraph, HeaderTitle, SubHeader, ListItem } from 'components/common'; +import { MetParagraphOld, HeaderTitleOld, SubHeaderOld, ListItem } from 'components/common'; import React from 'react'; import { useAppTranslation } from 'hooks'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; @@ -10,7 +10,7 @@ const marginStyle = { mr: 2 }; const SuggestionsList = ({ translate }: { translate: (key: string) => string }) => ( - {translate('NoResults.paragraph')} + {translate('NoResults.paragraph')}
    • {translate('NoResults.list.0')} @@ -40,7 +40,7 @@ const NoResults = () => { padding={'2em 2em 1em 1em'} > - {translate('NoResults.header')} + {translate('NoResults.header')} @@ -67,14 +67,14 @@ const NoResults = () => { borderRadius="8px 8px 0px 0px" > - + {translate('NoResults.contact.header')} - + - {translate('NoResults.contact.paragraph')} + {translate('NoResults.contact.paragraph')} @@ -83,12 +83,12 @@ const NoResults = () => {
      - + {translate('NoResults.contact.telephone.text')} - - + + {translate('NoResults.contact.telephone.number')} - +
      @@ -101,12 +101,12 @@ const NoResults = () => { style={{ fontSize: '32px', color: '#12508F' }} />
      - + {translate('NoResults.contact.email.text')} - - + + {translate('NoResults.contact.email.address')} - +
      diff --git a/met-web/src/routes/NotAvailable.tsx b/met-web/src/routes/NotAvailable.tsx index eae6fe1aa..3c395d12f 100644 --- a/met-web/src/routes/NotAvailable.tsx +++ b/met-web/src/routes/NotAvailable.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Grid } from '@mui/material'; -import { MetHeader1, MetParagraph, MetLabel } from 'components/common'; +import { MetHeader1Old, MetParagraphOld, MetLabel } from 'components/common'; import { Banner } from 'components/banner/Banner'; import LandingPageBanner from 'assets/images/LandingPageBanner.png'; import { useAppTranslation } from 'hooks'; @@ -41,10 +41,10 @@ export const NotAvailable = () => { rowSpacing={2} > - {translate('landing.banner.header')} + {translate('landing.banner.header')} - {translate('landing.banner.description')} + {translate('landing.banner.description')} diff --git a/met-web/src/routes/NotFound.tsx b/met-web/src/routes/NotFound.tsx index a1489cf7d..6bf059988 100644 --- a/met-web/src/routes/NotFound.tsx +++ b/met-web/src/routes/NotFound.tsx @@ -1,5 +1,5 @@ import { Grid, Toolbar, SvgIcon, Box } from '@mui/material'; -import { MetHeader1, MetHeader4 } from 'components/common'; +import { MetHeader1Old, MetHeader4 } from 'components/common'; import React from 'react'; import { ReactComponent as ErrorSvg } from 'assets/images/404.svg'; import { Link } from 'react-router-dom'; @@ -44,9 +44,9 @@ const NotFound = () => { padding={'2em 2em 1em 2em'} > - + {translate('notFound.header.0')} - + { @@ -15,9 +15,9 @@ const Unauthorized = () => { padding={'2em 2em 1em 2em'} > - + Unauthorized - + @@ -26,13 +26,13 @@ const Unauthorized = () => { - { navigate('/'); }} > Go to home page - + diff --git a/met-web/src/services/tenantService/index.tsx b/met-web/src/services/tenantService/index.tsx index 342db677b..451b26bdf 100644 --- a/met-web/src/services/tenantService/index.tsx +++ b/met-web/src/services/tenantService/index.tsx @@ -9,5 +9,13 @@ export const getTenant = async (id: string): Promise => { if (response.data) { return response.data; } - return Promise.reject('Failed to fetch tenant info'); + return Promise.reject(Error('Failed to fetch tenant info')); +}; + +export const getAllTenants = async (): Promise => { + const response = await http.GetRequest(Endpoints.Tenants.GET_LIST); + if (response.data) { + return response.data; + } + return Promise.reject(Error('Failed to fetch tenants')); }; diff --git a/met-web/src/web-components/components/engagement-banner-wc.tsx b/met-web/src/web-components/components/engagement-banner-wc.tsx index 0fba63126..855f489d2 100644 --- a/met-web/src/web-components/components/engagement-banner-wc.tsx +++ b/met-web/src/web-components/components/engagement-banner-wc.tsx @@ -7,7 +7,7 @@ import ReactDOM from 'react-dom/client'; import { EngagementBanner } from '../../components/engagement/view/EngagementBanner/StandAloneBanner'; import createWcTheme from '../styles/wcTheme'; import { store } from '../../store'; -import { PrimaryButton } from 'components/common'; +import { PrimaryButtonOld } from 'components/common'; import { Grid } from '@mui/material'; export default class EngagementBannerWC extends HTMLElement { @@ -61,9 +61,11 @@ export default class EngagementBannerWC extends HTMLElement { xs={12} justifyContent="flex-end" > - (window.location.href = props['engagementurl'])}> + (window.location.href = props['engagementurl'])} + > View Engagement - + } engagementSlug={this._getSlugFromUrl(props['engagementurl'])} diff --git a/met-web/tests/unit/components/comment/CommentListing.test.tsx b/met-web/tests/unit/components/comment/CommentListing.test.tsx index c9dd23f97..377eb407f 100644 --- a/met-web/tests/unit/components/comment/CommentListing.test.tsx +++ b/met-web/tests/unit/components/comment/CommentListing.test.tsx @@ -49,10 +49,10 @@ jest.mock('axios'); jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children }: { children: ReactNode }) => { + PrimaryButtonOld: ({ children }: { children: ReactNode }) => { return ; }, - SecondaryButton: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { + SecondaryButtonOld: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { return ; }, })); diff --git a/met-web/tests/unit/components/dashboard/dashboard.test.tsx b/met-web/tests/unit/components/dashboard/dashboard.test.tsx index 6a13db0f9..1f206a2f3 100644 --- a/met-web/tests/unit/components/dashboard/dashboard.test.tsx +++ b/met-web/tests/unit/components/dashboard/dashboard.test.tsx @@ -18,11 +18,11 @@ jest.mock('@mui/material', () => ({ }, })); -jest.mock('axios') +jest.mock('axios'); jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: ReactNode;[prop: string]: unknown }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { return ; }, })); @@ -39,7 +39,9 @@ jest.mock('@mui/material', () => ({ describe('Dashboard page tests', () => { jest.spyOn(reactRedux, 'useDispatch').mockImplementation(() => jest.fn()); jest.spyOn(notificationSlice, 'openNotification').mockImplementation(jest.fn()); - const getEngagementMock = jest.spyOn(engagementService, 'getEngagements').mockReturnValue(Promise.resolve({ items: [], total: 0 })); + const getEngagementMock = jest + .spyOn(engagementService, 'getEngagements') + .mockReturnValue(Promise.resolve({ items: [], total: 0 })); const getAggregatorMock = jest.spyOn(aggregatorService, 'getAggregatorData'); const getUserResponseDetailByMonthMock = jest.spyOn(userResponseDetailService, 'getUserResponseDetailByMonth'); const getSurveyResultDataMock = jest.spyOn(surveyResultService, 'getSurveyResultData'); diff --git a/met-web/tests/unit/components/engagement/EngagementListing.test.tsx b/met-web/tests/unit/components/engagement/EngagementListing.test.tsx index 7f64a4418..b9d632aa2 100644 --- a/met-web/tests/unit/components/engagement/EngagementListing.test.tsx +++ b/met-web/tests/unit/components/engagement/EngagementListing.test.tsx @@ -81,7 +81,7 @@ jest.mock('@mui/material', () => ({ jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { return ; }, })); diff --git a/met-web/tests/unit/components/feedback/feedbackListing.test.tsx b/met-web/tests/unit/components/feedback/feedbackListing.test.tsx index 1df91fcbf..260fcc20d 100644 --- a/met-web/tests/unit/components/feedback/feedbackListing.test.tsx +++ b/met-web/tests/unit/components/feedback/feedbackListing.test.tsx @@ -40,7 +40,7 @@ jest.mock('@mui/material', () => ({ jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { return ; }, })); diff --git a/met-web/tests/unit/components/landingPage/LandingPage.test.tsx b/met-web/tests/unit/components/landingPage/LandingPage.test.tsx index 1564e215c..108009e18 100644 --- a/met-web/tests/unit/components/landingPage/LandingPage.test.tsx +++ b/met-web/tests/unit/components/landingPage/LandingPage.test.tsx @@ -11,7 +11,7 @@ jest.mock('axios'); jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: React.ReactNode }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: React.ReactNode }) => { return ; }, })); diff --git a/met-web/tests/unit/components/publicDashboard/PublicDashboard.test.tsx b/met-web/tests/unit/components/publicDashboard/PublicDashboard.test.tsx index 96ef86696..38cad8f60 100644 --- a/met-web/tests/unit/components/publicDashboard/PublicDashboard.test.tsx +++ b/met-web/tests/unit/components/publicDashboard/PublicDashboard.test.tsx @@ -12,7 +12,7 @@ import { BrowserRouter } from 'react-router-dom'; jest.mock('axios'); jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: React.ReactNode }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: React.ReactNode }) => { return ; }, })); @@ -33,7 +33,7 @@ jest.mock('hooks', () => { 'dashboard.projectLocation': 'Project Location', 'dashboard.submissionTrend.label': 'Live Activity - Engagement', 'dashboard.link.0': '< ({ ...jest.requireActual('@mui/material'), @@ -86,7 +86,7 @@ jest.mock('@mui/material', () => ({ jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { + PrimaryButtonOld: ({ children, ...rest }: { children: ReactNode; [prop: string]: unknown }) => { return ; }, })); diff --git a/met-web/tests/unit/components/test.test.tsx b/met-web/tests/unit/components/test.test.tsx index 7d7416ee9..7f97f2508 100644 --- a/met-web/tests/unit/components/test.test.tsx +++ b/met-web/tests/unit/components/test.test.tsx @@ -4,13 +4,13 @@ import { render, fireEvent, waitFor, screen } from '@testing-library/react'; // add custom jest matchers from jest-dom import '@testing-library/jest-dom'; // the component to test -import { PrimaryButton } from 'components/common'; +import { PrimaryButtonOld } from 'components/common'; test('loads and displays greeting', async () => { render( - console.log('Hello')}> + console.log('Hello')}> Hello - , + , ); fireEvent.click(screen.getByTestId('test-button')); diff --git a/met-web/tests/unit/components/user/UserDetails.test.tsx b/met-web/tests/unit/components/user/UserDetails.test.tsx index f182dfa31..c9ca845ac 100644 --- a/met-web/tests/unit/components/user/UserDetails.test.tsx +++ b/met-web/tests/unit/components/user/UserDetails.test.tsx @@ -49,7 +49,7 @@ jest.mock('@mui/material', () => ({ jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { + PrimaryButtonOld: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { return ; }, })); diff --git a/met-web/tests/unit/components/user/UserListing.test.tsx b/met-web/tests/unit/components/user/UserListing.test.tsx index 8d0219d9e..dd54667e1 100644 --- a/met-web/tests/unit/components/user/UserListing.test.tsx +++ b/met-web/tests/unit/components/user/UserListing.test.tsx @@ -24,7 +24,7 @@ const mockUser1: User = { roles: [], }; -jest.mock('axios') +jest.mock('axios'); jest.mock('@mui/material', () => ({ ...jest.requireActual('@mui/material'), @@ -35,7 +35,7 @@ jest.mock('@mui/material', () => ({ jest.mock('components/common', () => ({ ...jest.requireActual('components/common'), - PrimaryButton: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { + PrimaryButtonOld: ({ children, onClick }: { children: ReactNode; onClick: () => void }) => { return ; }, }));