feat: add option to keep fwd email (#253) (#254)

.gitignore

@@ -38,3 +38,5 @@ storybook-static
 
 # netlify
 .netlify
+.aider*
+.env

src/components/pages/employees/EmployeeForm.tsx

@@ -182,13 +182,11 @@ export const EmployeeForm = (props: Props) => {
                 showArrow
                 filterOption={searchFilterOption}
               >
-                {Object.keys(employeeStatuses)
-                  .map((key) => ({
-                    value: key,
-                    label:
-                      employeeStatuses[key as keyof typeof employeeStatuses],
-                  }))
-                  .map(renderStatusOption)}
+                {Object.values(EmployeeStatus).map((status) => (
+                  <Select.Option key={status} value={status}>
+                    {employeeStatuses[status]}
+                  </Select.Option>
+                ))}
               </Select>
             </Form.Item>
           </Col>

src/components/pages/employees/detail/General.tsx

@@ -28,7 +28,7 @@ import {
   ViewPosition,
 } from 'types/schema'
 import { client, GET_PATHS } from 'libs/apis'
-import { ReactElement, useMemo, useState } from 'react'
+import {  ReactElement,  useRef, useMemo, useState } from 'react'
 import {
   EmployeeStatus,
   employeeStatuses,
@@ -55,6 +55,7 @@ import { AuthenticatedContent } from 'components/common/AuthenticatedContent'
 import { TotalResultCount } from 'components/common/Table/TotalResultCount'
 import { formatCurrency } from 'utils/currency'
 import { DEFAULT_CURRENCY_SYMBOL } from 'constants/currency'
+import { Modal } from 'antd'
 import { EditPersonalInfoModal } from './EditPersonalInfoModal'
 import { EditSkillsModal } from './EditSkillsModal'
 import { EditGeneralInfoModal } from './EditGeneralInfoModal'
@@ -177,11 +178,52 @@ export const General = (props: Props) => {
     mutate([GET_PATHS.getEmployees, data.username])
   }
 
+  const isKeepFwdEmailRef = useRef(false)
+
   const onChangeStatus = async (value: string) => {
+    if (value === EmployeeStatus.LEFT) {
+      // Reset the checkbox state before opening the modal
+      isKeepFwdEmailRef.current = false
+
+      Modal.confirm({
+        title: 'Confirm Employee Status Change',
+        content: (
+          <div>
+            <p>Are you sure you want to change the status to "Left"?</p>
+            <div>
+              <input
+                type="checkbox"
+                id="keepForwardEmailCheckbox"
+                onChange={(e) => {
+                  isKeepFwdEmailRef.current = e.target.checked
+                }}
+                aria-label="Keep Forward Email"
+              />
+              <label
+                htmlFor="keepForwardEmailCheckbox"
+                style={{ marginLeft: '8px', cursor: 'pointer' }}
+              >
+                Keep Forward Email
+              </label>
+            </div>
+          </div>
+        ),
+        onOk() {
+          return updateEmployeeStatus(value);
+        },
+        okText: 'Confirm',
+        cancelText: 'Cancel',
+      });
+    } else {
+      await updateEmployeeStatus(value)
+    }
+  }
+
+  const updateEmployeeStatus = async (value: string) => {
     try {
       setIsLoading(true)
 
-      await client.updateEmployeeStatus(data.id || '', value)
+      await client.updateEmployeeStatus(data.id || '', value, isKeepFwdEmailRef.current)
 
       // Refetch user data
       notification.success({ message: 'Employee status updated successfully!' })

src/libs/apis.ts

@@ -216,14 +216,15 @@ class Client {
     })
   }
 
-  public updateEmployeeStatus(id: string, employeeStatus: string) {
+  public updateEmployeeStatus(id: string, employeeStatus: string, isKeepFwdEmail?: boolean) {
     return fetcher<Response<ViewEmployeeData>>(
       `${BASE_URL}/employees/${id}/employee-status`,
       {
         method: 'PUT',
         headers: { ...this.privateHeaders, 'Content-Type': 'application/json' },
         body: JSON.stringify({
           employeeStatus,
+          isKeepFwdEmail,
         }),
       },
     )