Confirmation modal for new both DREF Operational Update and final report

app/src/components/Navbar/LanguageDropdown/index.tsx

@@ -16,17 +16,10 @@ import {
 } from '@togglecorp/fujs';
 
 import DropdownMenuItem from '#components/DropdownMenuItem';
+import { languageNameMap } from '#utils/common';
 
 import styles from './styles.module.css';
 
-// NOTE: these doesn't need to be translated
-const languageNameMap: Record<Language, string> = {
-    en: 'English',
-    fr: 'Français',
-    es: 'Español',
-    ar: 'عربي',
-};
-
 const languageList = mapToList(
     languageNameMap,
     (value, key) => ({ key: key as Language, value }),

app/src/components/domain/GoMultiFileInput/index.tsx

@@ -62,6 +62,7 @@ type Props<T extends NameType> = Omit<RawFileInputProps<T>, 'multiple' | 'value'
     withoutPreview?: boolean;
     error?: React.ReactNode;
     description?: React.ReactNode;
+    useCurrentLanguageForMutation?: boolean;
 }
 
 function GoMultiFileInput<T extends NameType>(props: Props<T>) {
@@ -85,6 +86,7 @@ function GoMultiFileInput<T extends NameType>(props: Props<T>) {
         withoutPreview,
         error,
         description,
+        useCurrentLanguageForMutation = false,
     } = props;
 
     const strings = useTranslation(i18n);
@@ -97,6 +99,7 @@ function GoMultiFileInput<T extends NameType>(props: Props<T>) {
         formData: true,
         url,
         method: 'POST',
+        useCurrentLanguageForMutation,
         body: (body: { files: File[] }) => {
             const formData = new FormData();
 

app/src/components/domain/GoSingleFileInput/index.tsx

@@ -45,6 +45,7 @@ type Props<T extends NameType> = Omit<RawFileInputProps<T>, 'multiple' | 'value'
     description?: React.ReactNode;
     onSuccess?: () => void;
     withoutStatus?: boolean;
+    useCurrentLanguageForMutation?: boolean;
 }
 
 function GoSingleFileInput<T extends NameType>(props: Props<T>) {
@@ -72,6 +73,7 @@ function GoSingleFileInput<T extends NameType>(props: Props<T>) {
         requestBody,
         onSuccess,
         withoutStatus,
+        useCurrentLanguageForMutation = false,
     } = props;
 
     const strings = useTranslation(i18n);
@@ -88,6 +90,7 @@ function GoSingleFileInput<T extends NameType>(props: Props<T>) {
         // FIXME: fix typing in server (low priority)
         // the server generated type for response and body is the same
         body: (body) => body as never,
+        useCurrentLanguageForMutation,
         onSuccess: (response) => {
             const { id, file } = response;
             onChange(id, name);

app/src/components/domain/ImageWithCaptionInput/index.tsx

@@ -39,6 +39,7 @@ interface Props<N> {
     icons?: React.ReactNode;
     actions?: React.ReactNode;
     disabled?: boolean;
+    useCurrentLanguageForMutation?: boolean;
 }
 
 // FIXME: Move this to components
@@ -57,6 +58,7 @@ function ImageWithCaptionInput<const N extends string | number>(props: Props<N>)
         icons,
         actions,
         disabled,
+        useCurrentLanguageForMutation,
     } = props;
 
     const strings = useTranslation(i18n);
@@ -111,6 +113,7 @@ function ImageWithCaptionInput<const N extends string | number>(props: Props<N>)
                     />
                 ) : undefined}
                 clearable
+                useCurrentLanguageForMutation={useCurrentLanguageForMutation}
             >
                 {label}
             </GoSingleFileInput>

app/src/components/domain/MultiImageWithCaptionInput/index.tsx

@@ -47,6 +47,7 @@ interface Props<N> {
     actions?: React.ReactNode;
     readOnly?: boolean;
     disabled?: boolean;
+    useCurrentLanguageForMutation?: boolean;
 }
 
 // FIXME: Move this to components
@@ -65,6 +66,7 @@ function MultiImageWithCaptionInput<const N extends string | number>(props: Prop
         actions,
         readOnly,
         disabled,
+        useCurrentLanguageForMutation = false,
     } = props;
 
     const strings = useTranslation(i18n);
@@ -143,6 +145,7 @@ function MultiImageWithCaptionInput<const N extends string | number>(props: Prop
                 withoutPreview
                 readOnly={readOnly}
                 disabled={disabled}
+                useCurrentLanguageForMutation={useCurrentLanguageForMutation}
             >
                 {label}
             </GoMultiFileInput>

app/src/utils/common.ts

@@ -1,3 +1,4 @@
+import { type Language } from '@ifrc-go/ui/contexts';
 import { DEFAULT_INVALID_TEXT } from '@ifrc-go/ui/utils';
 import { isTruthyString } from '@togglecorp/fujs';
 
@@ -37,6 +38,14 @@ export function downloadFile(
     URL.revokeObjectURL(url);
 }
 
+// NOTE: these doesn't need to be translated
+export const languageNameMap: Record<Language, string> = {
+    en: 'English',
+    fr: 'Français',
+    es: 'Español',
+    ar: 'عربي',
+};
+
 export function getFirstTruthyString(
     primaryStr: string | null | undefined,
     secondaryStr: string | null | undefined,

app/src/utils/restRequest/go.ts

@@ -44,7 +44,9 @@ export interface AdditionalOptions {
     formData?: boolean;
     isCsvRequest?: boolean;
     enforceEnglishForQuery?: boolean;
+    // FIXME using the current language should be default behaviour so we might not need this.
     useCurrentLanguageForMutation?: boolean;
+    enforceLanguageForMutation?: Language;
     isExcelRequest?: boolean;
 }
 
@@ -167,6 +169,7 @@ export const processGoOptions: GoContextInterface['transformOptions'] = (
         isExcelRequest,
         enforceEnglishForQuery = false,
         useCurrentLanguageForMutation = false,
+        enforceLanguageForMutation,
     } = extraOptions;
 
     const currentLanguage = getFromStorage<Language>(KEY_LANGUAGE_STORAGE) ?? 'en';
@@ -180,9 +183,17 @@ export const processGoOptions: GoContextInterface['transformOptions'] = (
     if (method === 'GET') {
         // Query
         defaultHeaders['Accept-Language'] = enforceEnglishForQuery ? 'en' : currentLanguage;
-    } else {
+    } else if (method === 'POST' || method === 'PUT' || method === 'PATCH') {
         // Mutation
-        defaultHeaders['Accept-Language'] = useCurrentLanguageForMutation ? currentLanguage : 'en';
+        if (isDefined(enforceLanguageForMutation)) {
+            defaultHeaders['Accept-Language'] = enforceLanguageForMutation;
+        } else if (useCurrentLanguageForMutation) {
+            defaultHeaders['Accept-Language'] = currentLanguage;
+        } else {
+            defaultHeaders['Accept-Language'] = 'en';
+        }
+    } else {
+        defaultHeaders['Accept-Language'] = currentLanguage ?? 'en';
     }
 
     if (formData) {

app/src/views/AccountMyFormsDref/ActiveDrefTable/index.tsx

@@ -10,6 +10,7 @@ import {
     TableBodyContent,
 } from '@ifrc-go/ui';
 import { type RowOptions } from '@ifrc-go/ui';
+import { type Language } from '@ifrc-go/ui/contexts';
 import { useTranslation } from '@ifrc-go/ui/hooks';
 import {
     createDateColumn,
@@ -236,6 +237,7 @@ function ActiveDrefTable(props: Props) {
                         has_final_report,
                         country_details,
                         is_dref_imminent_v2,
+                        starting_language,
                     } = originalDref;
 
                     const is_published = status === DREF_STATUS_APPROVED;
@@ -270,6 +272,7 @@ function ActiveDrefTable(props: Props) {
                         canCreateFinalReport,
                         hasPermissionToApprove: isRegionCoordinator || userMe?.is_superuser,
                         onPublishSuccess: refetchActiveDref,
+                        startingLanguage: starting_language as Language,
                     };
                 },
                 { columnClassName: styles.actions },

app/src/views/AccountMyFormsDref/CompletedDrefTable/index.tsx

@@ -201,7 +201,7 @@ function CompletedDrefTable(props: Props) {
                         dref: datum.dref,
                         glide_code: datum.glide_code,
                         date_of_publication: datum.date_of_publication,
-                        original_language: datum.original_language,
+                        starting_language: datum.starting_language,
                     }),
                 ),
                 {

app/src/views/AccountMyFormsDref/DrefTableActions/i18n.json

@@ -5,6 +5,7 @@
         "dropdownActionFinalizeLabel": "Finalize",
         "dropdownActionAllocationFormLabel": "Allocation Form",
         "dropdownActionAddOpsUpdateLabel": "Add Operational Update",
+        "dropdownActionAddFinalReportLabel": "Add Final Report",
         "dropdownActionCreateFinalReportLabel": "Create Final Report",
         "dropdownActionShareLabel": "Share",
         "dropdownActionExportLabel": "Export",
@@ -16,9 +17,15 @@
         "drefApprovalInProgressTitle": "Approval in progress...",
         "drefAccountCouldNotCreate": "Could not create new operational update",
         "drefAccountCouldNotCreateFinalReport": "Could not create final report",
-        "drefAccountConfirmMessage": "You're about to Approve this DREF. Once approved, it can no longer be edited. Are you sure you want to Approve?",
-        "drefAccountFinalizeConfirmMessage": "You're about to Finalize this DREF. Once finalize, it can no longer be edited. Are you sure you want to Finalize?",
+        "drefAccountConfirmMessage": "You're about to approve this DREF. Once approved, it can no longer be edited. Are you sure you want to approve?",
+        "drefAccountFinalizeConfirmMessage": "You are about to finalize this DREF. Once finalized, the original language will change to English, and it will no longer be editable in the {selectedLanguage} language. Are you sure you want to proceed?",
+        "drefOpsUpdateStartingLanguageLabel": "DREF Starting Language",
+        "dropdownActionNewOpsUpdateConfirmationMessage": "You are about to create a new DREF Operational Update.",
+        "dropdownActionNewOpsUpdateLanguageSelectLanguageMessage": "Please select the language to create the DREF Operation Update.",
+        "dropdownActionNewFinalReportConfirmationMessage": "You are about to create a new DREF Final Report.",
+        "dropdownActionNewFinalReportLanguageSelectLanguageMessage": "Please select the language to create the DREF Final Report.",
         "dropdownActionImminentNewOpsUpdateConfirmationHeading": "Confirm addition of Operational Update",
+        "dropdownActionNewFinalReportConfirmationHeading": "Confirm addition of Final Report",
         "dropdownActionImminentNewOpsUpdateConfirmationMessage": "The DREF type will be changed to Response (from Imminent) for the Operational Update. Once created, you'll be able to change it to other types except Imminent. Are you sure you want to add an Operational Update?"
     }
 }