Show the widget.title in the engagement view

bcgov · Aug 3, 2023 · 1f261ad · 1f261ad
1 parent ab652f1
commit 1f261ad
Show file tree

Hide file tree

Showing 12 changed files with 27 additions and 20 deletions.
diff --git a/met-web/src/apiManager/apiSlices/widgets/index.ts b/met-web/src/apiManager/apiSlices/widgets/index.ts
@@ -43,7 +43,7 @@ export const widgetsApi = createApi({
         }),
         deleteWidget: builder.mutation<Widget, { engagementId: number; widgetId: number }>({
             query: ({ engagementId, widgetId }) => ({
-                url: `widgets/engagement/${engagementId}/widget/${widgetId}`,
+                url: `widgets/${widgetId}/engagements/${engagementId}`,
                 method: 'DELETE',
             }),
             invalidatesTags: (_result, _error, arg) => [{ type: 'Widgets', id: arg.widgetId }],

diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WidgetCardSwitch.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WidgetCardSwitch.tsx
@@ -19,7 +19,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                     <MetWidget
                         sortable={false}
                         testId={`phases-${widget.widget_type_id}`}
-                        title="EA Process"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -32,7 +32,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.WhoIsListening}>
                     <MetWidget
                         testId={`who-is-listening-${widget.widget_type_id}`}
-                        title="Who is Listening"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -45,7 +45,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.Document}>
                     <MetWidget
                         testId={`document-${widget.widget_type_id}`}
-                        title="Document"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -58,7 +58,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.Subscribe}>
                     <MetWidget
                         testId={`subscribe-${widget.widget_type_id}`}
-                        title="Subscribe"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -71,7 +71,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.Events}>
                     <MetWidget
                         testId={`event-${widget.widget_type_id}`}
-                        title="Events"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -84,7 +84,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.Map}>
                     <MetWidget
                         testId={`event-${widget.widget_type_id}`}
-                        title="Map"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}
@@ -97,7 +97,7 @@ export const WidgetCardSwitch = ({ widget, removeWidget }: WidgetCardSwitchProps
                 <Case condition={widget.widget_type_id === WidgetType.Video}>
                     <MetWidget
                         testId={`event-${widget.widget_type_id}`}
-                        title="Video"
+                        title={widget.title}
                         onDelete={() => {
                             removeWidget(widget.id);
                         }}

diff --git a/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx b/met-web/src/components/engagement/form/EngagementWidgets/WidgetTitle.tsx
@@ -66,7 +66,13 @@ export const WidgetTitle = ({ widget }: { widget: Widget }) => {
                     justifyContent={'space-between'}
                     width={'100%'}
                 >
-                    <TextField name="title" value={title} onChange={(e) => handleTitleChange(e.target.value)} />
+                    <TextField
+                        name="title"
+                        value={title}
+                        onChange={(e) => handleTitleChange(e.target.value)}
+                        inputProps={{ maxLength: 100 }}
+                        fullWidth
+                    />
                     <If condition={isSaving}>
                         <Then>
                             <CircularProgress size={20} color="info" />

diff --git a/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx b/met-web/src/components/engagement/view/widgets/DocumentWidget.tsx
@@ -50,7 +50,7 @@ const DocumentWidget = ({ widget }: DocumentWidgetProps) => {
         <>
             <MetPaper elevation={1} sx={{ padding: '1em', minHeight: '12em' }}>
                 <Grid item justifyContent="flex-start" alignItems="center" xs={12}>
-                    <MetHeader2 bold>Documents</MetHeader2>
+                    <MetHeader2 bold>{widget.title}</MetHeader2>
                     <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
                 </Grid>
                 {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
@@ -73,7 +73,7 @@ const EventsWidget = ({ widget }: EventsWidgetProps) => {
                 xs={12}
                 paddingBottom={0}
             >
-                <MetHeader2 bold>Events</MetHeader2>
+                <MetHeader2 bold>{widget.title}</MetHeader2>
                 <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
             </Grid>
             {events.map((event: Event) => {

diff --git a/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx b/met-web/src/components/engagement/view/widgets/Map/MapWidget.tsx
@@ -79,7 +79,7 @@ const MapWidget = ({ widget }: MapWidgetProps) => {
                         xs={12}
                         paddingBottom={0}
                     >
-                        <MetHeader2 bold>Map</MetHeader2>
+                        <MetHeader2 bold>{widget.title}</MetHeader2>
                         <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
                     </Grid>
                     <Grid item xs={12}>

diff --git a/...components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx b/...components/engagement/view/widgets/PhasesWidget/PhasesWidgetMobile/PhasesWidgetMobile.tsx
@@ -65,7 +65,7 @@ export const PhasesWidgetMobile = () => {
         <MetPaper elevation={1} sx={{ padding: '2em', pt: '25px' }}>
             <Grid container direction="row" justifyContent="flex-start" alignItems="flex-start" rowSpacing={2}>
                 <Grid item xs={12}>
-                    <MetHeader3 bold>The EA Process</MetHeader3>
+                    <MetHeader3 bold>{phasesWidget.title}</MetHeader3>
                 </Grid>
                 <Grid item xs={12}>
                     <MetBody>

diff --git a/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx b/met-web/src/components/engagement/view/widgets/PhasesWidget/index.tsx
@@ -45,7 +45,7 @@ export const PhasesWidget = () => {
             <MetPaper elevation={1} sx={{ padding: '2em', pt: '25px' }}>
                 <Grid container direction="row" justifyContent="flex-start" alignItems="flex-start">
                     <Grid item xs={12}>
-                        <MetHeader3 bold>The Environmental Assessment Process</MetHeader3>
+                        <MetHeader3 bold>{phasesWidget.title}</MetHeader3>
                     </Grid>
 
                     <When condition={Boolean(currentPhaseId) && currentPhaseId !== EngagementPhases.Standalone}>

diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/SubscribeWidget.tsx
@@ -9,8 +9,9 @@ import { createEmailVerification } from 'services/emailVerificationService';
 import { createSubscription } from 'services/subscriptionService';
 import { EmailVerificationType } from 'models/emailVerification';
 import { SubscriptionType } from 'constants/subscriptionType';
+import { Widget } from 'models/widget';
 
-function SubscribeWidget() {
+const SubscribeWidget = ({ widget }: { widget: Widget }) => {
     const dispatch = useAppDispatch();
     const { savedEngagement, engagementMetadata } = useContext(ActionContext);
     const defaultType = engagementMetadata.project_id ? SubscriptionType.PROJECT : SubscriptionType.ENGAGEMENT;
@@ -171,7 +172,7 @@ function SubscribeWidget() {
             />
             <Grid spacing={2} container xs={12}>
                 <Grid item xs={12}>
-                    <MetHeader2 bold>Sign Up for Updates</MetHeader2>
+                    <MetHeader2 bold>{widget.title}</MetHeader2>
                     <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
                 </Grid>
                 <Grid item xs={12}>
@@ -188,6 +189,6 @@ function SubscribeWidget() {
             </Grid>
         </MetPaper>
     );
-}
+};
 
 export default SubscribeWidget;
diff --git a/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx b/met-web/src/components/engagement/view/widgets/Video/VideoWidgetView.tsx
@@ -78,7 +78,7 @@ const VideoWidgetView = ({ widget }: VideoWidgetProps) => {
                     xs={12}
                     paddingBottom={0}
                 >
-                    <MetHeader2 bold>Video</MetHeader2>
+                    <MetHeader2 bold>{widget.title}</MetHeader2>
                     <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
                 </Grid>
                 <Grid item xs={12}>

diff --git a/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx b/met-web/src/components/engagement/view/widgets/WhoIsListeningWidget.tsx
@@ -73,7 +73,7 @@ const WhoIsListeningWidget = ({ widget }: WhoIsListeningWidgetProps) => {
     return (
         <MetPaper elevation={1} sx={{ padding: '1em', minHeight: '12em' }}>
             <Grid item justifyContent={{ xs: 'center', md: 'flex-start' }} xs={12}>
-                <MetHeader2 bold>Who is Listening</MetHeader2>
+                <MetHeader2 bold>{widget.title}</MetHeader2>
                 <Divider sx={{ borderWidth: 1, marginTop: 0.5 }} />
             </Grid>
             {contacts.map((contact) => {

diff --git a/met-web/src/components/engagement/view/widgets/WidgetSwitch.tsx b/met-web/src/components/engagement/view/widgets/WidgetSwitch.tsx
@@ -28,7 +28,7 @@ export const WidgetSwitch = ({ widget }: WidgetSwitchProps) => {
                     <MapWidget widget={widget} />
                 </Case>
                 <Case condition={widget.widget_type_id === WidgetType.Subscribe}>
-                    <SubscribeWidget />
+                    <SubscribeWidget widget={widget} />
                 </Case>
                 <Case condition={widget.widget_type_id === WidgetType.Video}>
                     <VideoWidgetView widget={widget} />