From 30588918979e39ccf6bd07e87262b0a537a228c0 Mon Sep 17 00:00:00 2001
From: Baelx <16845197+Baelx@users.noreply.github.com>
Date: Fri, 15 Mar 2024 13:26:12 -0700
Subject: [PATCH] DESENG-512 Add results tab to engagements (#2419)

Co-authored-by: Alex <awintschel@gmail.com>
---
 CHANGELOG.MD                                  |  3 +
 .../form/EngagementFormTabs/FormTabs.tsx      |  5 ++
 .../Results/EngagementResults.tsx             | 65 +++++++++++++++++++
 .../form/EngagementFormTabs/constants.ts      |  3 +-
 4 files changed, 75 insertions(+), 1 deletion(-)
 create mode 100644 met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx

diff --git a/CHANGELOG.MD b/CHANGELOG.MD
index 6006949be..741973b95 100644
--- a/CHANGELOG.MD
+++ b/CHANGELOG.MD
@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 ## March 15, 2024
 
 - **Task**: Multi-language - Create event, subcribe_item, poll, timeline widget translation tables & API routes [DESENG-515](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-515)
@@ -6,6 +7,8 @@
   - Added Subscribe Item translation API.
   - Added Event item translation API
   - Added Unit tests.
+- **Task** Add "Results" page to engagements [DESENG-512](https://apps.itsm.gov.bc.ca/jira/browse/DESENG-512)
+
 
 ## March 08, 2024
 
diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/FormTabs.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/FormTabs.tsx
index 48ac387f1..c94720e8a 100644
--- a/met-web/src/components/engagement/form/EngagementFormTabs/FormTabs.tsx
+++ b/met-web/src/components/engagement/form/EngagementFormTabs/FormTabs.tsx
@@ -6,6 +6,7 @@ import { MetTab, MetTabList, MetTabPanel } from '../StyledTabComponents';
 import { EngagementFormTabValues, ENGAGEMENT_FORM_TABS } from './constants';
 import EngagementUserManagement from './UserManagement/EngagementUserManagement';
 import EngagementSettingsForm from './Settings/EngagementSettingsForm';
+import EngagementResults from './Results/EngagementResults';
 import { ActionContext } from '../ActionContext';
 import { MetTooltip } from 'components/common';
 import AdditionalTabContent from './AdditionalDetails/AdditionalTabContent';
@@ -50,6 +51,7 @@ const FormTabs = () => {
                         {generateTab('Additional Details', ENGAGEMENT_FORM_TABS.ADDITIONAL)}
                         {generateTab('User Management', ENGAGEMENT_FORM_TABS.USER_MANAGEMENT)}
                         {generateTab('Settings', ENGAGEMENT_FORM_TABS.SETTINGS)}
+                        {generateTab('Results', ENGAGEMENT_FORM_TABS.RESULTS)}
                     </MetTabList>
                 </Box>
                 <MetTabPanel value={ENGAGEMENT_FORM_TABS.CONTENT}>
@@ -64,6 +66,9 @@ const FormTabs = () => {
                 <MetTabPanel value={ENGAGEMENT_FORM_TABS.SETTINGS}>
                     <EngagementSettingsForm />
                 </MetTabPanel>
+                <MetTabPanel value={ENGAGEMENT_FORM_TABS.RESULTS}>
+                    <EngagementResults />
+                </MetTabPanel>
             </TabContext>
         </Box>
     );
diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx b/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx
new file mode 100644
index 000000000..390a8512a
--- /dev/null
+++ b/met-web/src/components/engagement/form/EngagementFormTabs/Results/EngagementResults.tsx
@@ -0,0 +1,65 @@
+import React, { useContext } from 'react';
+import { Grid, Box } from '@mui/material';
+import { MetPaper, PrimaryButton, SecondaryButton } from 'components/common';
+import { EngagementTabsContext } from '../EngagementTabsContext';
+import { ActionContext } from '../../ActionContext';
+
+const EngagementResults = () => {
+    const { isSaving } = useContext(ActionContext);
+    const { handleSaveAndContinueEngagement, handleSaveAndExitEngagement, handlePreviewEngagement } =
+        useContext(EngagementTabsContext);
+
+    return (
+        <MetPaper elevation={1}>
+            <Grid
+                container
+                direction="row"
+                justifyContent="flex-start"
+                alignItems="flex-start"
+                spacing={2}
+                sx={{ padding: '2em' }}
+            >
+                <Box
+                    position="sticky"
+                    bottom={0}
+                    width="100%"
+                    marginLeft={2}
+                    borderTop="1px solid #ddd"
+                    padding={2}
+                    marginTop={2}
+                    zIndex={1000}
+                    boxShadow="0px 0px 5px rgba(0, 0, 0, 0.1)"
+                    sx={{ backgroundColor: 'white' }}
+                >
+                    <Grid item xs={12}>
+                        <PrimaryButton
+                            sx={{ marginRight: 1 }}
+                            data-testid="save-engagement-button"
+                            onClick={() => handleSaveAndContinueEngagement()}
+                            loading={isSaving}
+                        >
+                            Save and Continue
+                        </PrimaryButton>
+                        <PrimaryButton
+                            sx={{ marginRight: 1 }}
+                            data-testid="save-and-exit-engagement-button"
+                            onClick={() => handleSaveAndExitEngagement()}
+                            loading={isSaving}
+                        >
+                            Save and Exit
+                        </PrimaryButton>
+                        <SecondaryButton
+                            data-testid="preview-engagement-button"
+                            onClick={() => handlePreviewEngagement()}
+                            disabled={isSaving}
+                        >
+                            {'Preview'}
+                        </SecondaryButton>
+                    </Grid>
+                </Box>
+            </Grid>
+        </MetPaper>
+    );
+};
+
+export default EngagementResults;
diff --git a/met-web/src/components/engagement/form/EngagementFormTabs/constants.ts b/met-web/src/components/engagement/form/EngagementFormTabs/constants.ts
index 1cd6983d8..c33f8d763 100644
--- a/met-web/src/components/engagement/form/EngagementFormTabs/constants.ts
+++ b/met-web/src/components/engagement/form/EngagementFormTabs/constants.ts
@@ -1,10 +1,11 @@
-export type EngagementFormTabValues = 'content' | 'settings' | 'User Management' | 'additional';
+export type EngagementFormTabValues = 'content' | 'settings' | 'User Management' | 'additional' | 'results';
 
 export const ENGAGEMENT_FORM_TABS: { [x: string]: EngagementFormTabValues } = {
     CONTENT: 'content',
     ADDITIONAL: 'additional',
     USER_MANAGEMENT: 'User Management',
     SETTINGS: 'settings',
+    RESULTS: 'results',
 };
 
 export const ENGAGEMENT_UPLOADER_HEIGHT = '360px';