Update permission to delete local unit

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

@@ -219,12 +219,15 @@ function BaseMapPointInput<NAME extends string>(props: Props<NAME>) {
     const [searchResult, setSearchResult] = useState<LocationSearchResult | undefined>();
 
     const center = useMemo(() => {
-        if (isNotDefined(searchResult)) {
-            return undefined;
+        if (isDefined(value?.lng) && isDefined(value?.lat)) {
+            return [value.lng, value.lat] satisfies [number, number];
+        }
+        if (isDefined(searchResult)) {
+            return [+searchResult.lon, +searchResult.lat] satisfies [number, number];
         }
 
-        return [+searchResult.lon, +searchResult.lat] satisfies [number, number];
-    }, [searchResult]);
+        return undefined;
+    }, [searchResult, value?.lng, value?.lat]);
 
     return (
         <div className={_cs(styles.baseMapPointInput, className)}>

app/src/hooks/domain/usePermissions.ts

@@ -1,8 +1,16 @@
 import { useMemo } from 'react';
-import { isDefined } from '@togglecorp/fujs';
+import {
+    isDefined,
+    isNotDefined,
+} from '@togglecorp/fujs';
 
+import { type GlobalEnums } from '#contexts/domain';
 import useUserMe from '#hooks/domain/useUserMe';
 
+type OrganizationType = NonNullable<GlobalEnums['api_profile_org_types']>[number]['key'];
+
+const canEditLocalUnitOrganization: OrganizationType[] = ['NTLS', 'DLGN', 'SCRT'];
+
 function usePermissions() {
     const userMe = useUserMe();
 
@@ -96,6 +104,19 @@ function usePermissions() {
                 )
             );
 
+            const canEditLocalUnit = (
+                countryId: number | undefined,
+            ) => {
+                if (isGuestUser
+                    || isNotDefined(countryId)
+                    || isNotDefined(userMe?.profile.org_type)) return false;
+
+                return (
+                    userMe?.profile.country?.id === countryId
+                    && canEditLocalUnitOrganization.includes(userMe?.profile.org_type)
+                );
+            };
+
             const isPerAdmin = !isGuestUser
                 && ((userMe?.is_per_admin_for_countries.length ?? 0) > 0
                     || (userMe?.is_per_admin_for_regions.length ?? 0) > 0);
@@ -126,6 +147,7 @@ function usePermissions() {
                 isSuperUser,
                 isGuestUser,
                 isRegionalOrCountryAdmin,
+                canEditLocalUnit,
             };
         },
         [userMe],

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitImportModal/i18n.json

@@ -7,11 +7,13 @@
         "closeButtonLabel": "Close",
         "localUnitTypeInputLabel": "Local unit type",
         "uploadFileSectionTitle": "Upload xlsx file",
-        "uploadFileSectionDescription": "Please make sure to select a supported file format (xlsx) with size less than 10MB",
+        "uploadFileSectionDescription": "Please make sure to select a supported file format (xlsx, xlsm) with size less than 10MB",
         "selectFileButtonLabel": "Select a file",
         "cancelUploadButtonLabel": "Cancel",
         "startUploadButtonLabel": "Upload",
         "contentStructureDescription": "The contents in the xlsx should follow the structure provided in {templateLink}.",
+        "contentStructureNoteLabel": "Note",
+        "contentStructureNote": "To enable multi-select functionality in certain fields, please click \"Enable Macros\" when prompted after opening the downloaded template file.",
         "templateLinkLabel": "this template",
         "noPermissionBothDescription": "You don't have permission and this unit is not externally managed.",
         "noPermissionErrorDescription": "You do not have the permission to upload local unit data",

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitImportModal/index.tsx

@@ -14,6 +14,7 @@ import {
     Modal,
     RawFileInput,
     SelectInput,
+    TextOutput,
 } from '@ifrc-go/ui';
 import { useTranslation } from '@ifrc-go/ui/hooks';
 import {
@@ -230,24 +231,32 @@ function LocalUnitBulkUploadModal(props: Props) {
                     withInternalPadding
                     footerContent={(
                         <div className={styles.fileStructureDescription}>
-                            {resolveToComponent(
-                                strings.contentStructureDescription,
-                                {
-                                    templateLink: (
-                                        <Link
-                                            external
-                                            href={localUnitType === TYPE_HEALTH_CARE
-                                                ? bulkUploadHealthTemplate?.template_url
-                                                : bulkUploadDefaultTemplate?.template_url}
-                                            variant="tertiary"
-                                            iconsContainerClassName={styles.downloadLink}
-                                            withUnderline
-                                        >
-                                            {strings.templateLinkLabel}
-                                        </Link>
-                                    ),
-                                },
-                            )}
+                            <span>
+                                {resolveToComponent(
+                                    strings.contentStructureDescription,
+                                    {
+                                        templateLink: (
+                                            <Link
+                                                external
+                                                href={localUnitType === TYPE_HEALTH_CARE
+                                                    ? bulkUploadHealthTemplate?.template_url
+                                                    : bulkUploadDefaultTemplate?.template_url}
+                                                variant="tertiary"
+                                                iconsContainerClassName={styles.downloadLink}
+                                                withUnderline
+                                            >
+                                                {strings.templateLinkLabel}
+                                            </Link>
+                                        ),
+                                    },
+                                )}
+                            </span>
+                            <TextOutput
+                                strongLabel
+                                valueType="text"
+                                label={strings.contentStructureNoteLabel}
+                                value={strings.contentStructureNote}
+                            />
                         </div>
                     )}
                 >
@@ -258,7 +267,7 @@ function LocalUnitBulkUploadModal(props: Props) {
                     {isNotDefined(bulkUploadFile) && (
                         <RawFileInput
                             name="file"
-                            accept=".xlsx"
+                            accept=".xlsx, .xlsm"
                             onChange={setBulkUploadFile}
                             variant="secondary"
                             disabled={

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitImportModal/styles.module.css

@@ -4,6 +4,12 @@
         background-color: var(--go-ui-color-background);
     }
 
+    .file-structure-description {
+        display: flex;
+        flex-direction: column;
+        gap: var(--go-ui-spacing-md);
+    }
+
     .upload-section {
         display: flex;
         align-items: start;

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitValidateButton/i18n.json

@@ -0,0 +1,6 @@
+{
+    "namespace": "countryNsOverviewContextAndStructure",
+    "strings": {
+        "localUnitReviewButtonLabel": "Review"
+    }
+}

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitValidateButton/index.tsx

@@ -1,8 +1,10 @@
 import { Button } from '@ifrc-go/ui';
+import { useTranslation } from '@ifrc-go/ui/hooks';
 import { _cs } from '@togglecorp/fujs';
 
 import { VALIDATED } from '../common';
 
+import i18n from './i18n.json';
 import styles from './styles.module.css';
 
 interface Props {
@@ -13,11 +15,12 @@ interface Props {
 function LocalUnitValidateButton(props: Props) {
     const {
         status,
-        // statusDetails,
         onClick,
         hasValidatePermission,
     } = props;
 
+    const strings = useTranslation(i18n);
+
     const isValidated = status === VALIDATED;
 
     if (isValidated || !hasValidatePermission) {
@@ -36,9 +39,8 @@ function LocalUnitValidateButton(props: Props) {
                 !hasValidatePermission
                 || isValidated
             }
-            // FIXME: use translations
         >
-            Review
+            {strings.localUnitReviewButtonLabel}
         </Button>
     );
 }

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitsFormModal/LocalUnitsForm/index.tsx

@@ -159,6 +159,7 @@ function LocalUnitsForm(props: Props) {
         isLocalUnitGlobalValidatorByType,
         isLocalUnitRegionValidatorByType,
         isLocalUnitCountryValidatorByType,
+        canEditLocalUnit,
     } = usePermissions();
 
     const { api_visibility_choices: visibilityOptions } = useGlobalEnums();
@@ -382,19 +383,18 @@ function LocalUnitsForm(props: Props) {
         },
     });
 
-    const hasValidatePermission = isAuthenticated && (
-        isSuperUser
-        || isLocalUnitGlobalValidatorByType(value.type)
-        || isLocalUnitCountryValidatorByType(countryResponse?.id, value.type)
-        || isLocalUnitRegionValidatorByType(countryResponse?.region, value.type)
-    );
+    const hasValidatePermission = isAuthenticated
+        && !isExternallyManaged
+        && (isSuperUser
+            || isLocalUnitGlobalValidatorByType(value.type)
+            || isLocalUnitCountryValidatorByType(countryResponse?.id, value.type)
+            || isLocalUnitRegionValidatorByType(countryResponse?.region, value.type)
+        );
 
     const hasUpdatePermission = isCountryAdmin(countryResponse?.id)
         || isRegionAdmin(countryResponse?.region)
-        || hasValidatePermission;
-
-    const hasDeletePermission = isCountryAdmin(countryResponse?.id)
-        || hasValidatePermission;
+        || hasValidatePermission
+        || canEditLocalUnit(countryResponse?.id);
 
     const handleFormSubmit = useCallback(
         () => {
@@ -543,21 +543,21 @@ function LocalUnitsForm(props: Props) {
                 <Portal container={actionsContainerRef.current}>
                     {isDefined(localUnitDetailsResponse) && (
                         <>
-                            {hasDeletePermission && (
-                                <Button
-                                    name={undefined}
-                                    onClick={setShowDeleteLocalUnitModalTrue}
-                                    variant="secondary"
-                                >
-                                    {strings.localUnitDeleteButtonLabel}
-                                </Button>
-                            )}
                             {hasValidatePermission && (
-                                <LocalUnitValidateButton
-                                    onClick={setShowValidateLocalUnitModalTrue}
-                                    status={localUnitDetailsResponse.status}
-                                    hasValidatePermission={hasValidatePermission}
-                                />
+                                <>
+                                    <Button
+                                        name={undefined}
+                                        onClick={setShowDeleteLocalUnitModalTrue}
+                                        variant="secondary"
+                                    >
+                                        {strings.localUnitDeleteButtonLabel}
+                                    </Button>
+                                    <LocalUnitValidateButton
+                                        onClick={setShowValidateLocalUnitModalTrue}
+                                        status={localUnitDetailsResponse.status}
+                                        hasValidatePermission={hasValidatePermission}
+                                    />
+                                </>
                             )}
                             {readOnlyFromProps
                                 && isEditable
@@ -1439,6 +1439,7 @@ function LocalUnitsForm(props: Props) {
                                                 className={styles.diffContainer}
                                             >
                                                 <TextInput
+                                                    required
                                                     name="other_training_facilities"
                                                     label={strings.otherTrainingFacilities}
                                                     value={value.health?.other_training_facilities}

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitsTable/LocalUnitTableActions/index.tsx

@@ -66,6 +66,7 @@ function LocalUnitsTableActions(props: Props) {
         isGuestUser,
         isCountryAdmin,
         isRegionAdmin,
+        canEditLocalUnit,
     } = usePermissions();
 
     const isLocked = status !== VALIDATED;
@@ -86,7 +87,7 @@ function LocalUnitsTableActions(props: Props) {
             || isLocalUnitRegionValidatorByType(countryDetails?.region, localUnitType));
 
     const hasAddEditLocalUnitPermission = !isLocked && (
-        (hasValidatePermission || countryAdmin || regionAdmin)
+        (hasValidatePermission || countryAdmin || regionAdmin || canEditLocalUnit(countryId))
     && !isBulkUploadLocalUnit);
 
     const [readOnlyLocalUnitModal, setReadOnlyLocalUnitModal] = useState(false);
@@ -168,7 +169,7 @@ function LocalUnitsTableActions(props: Props) {
                         >
                             {strings.localUnitActionsView}
                         </DropdownMenuItem>
-                        {((hasValidatePermission || countryAdmin)
+                        {(hasValidatePermission
                             && !isBulkUploadLocalUnit) && (
                             <DropdownMenuItem
                                 type="button"
@@ -178,7 +179,7 @@ function LocalUnitsTableActions(props: Props) {
                                 {strings.localUnitActionsDelete}
                             </DropdownMenuItem>
                         )}
-                        {hasAddEditLocalUnitPermission && (
+                        {(hasAddEditLocalUnitPermission) && (
                             <DropdownMenuItem
                                 type="button"
                                 name={localUnitId}

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitsTable/i18n.json

@@ -4,9 +4,6 @@
         "localUnitsTableName": "Name",
         "localUnitsTableAddress": "Address",
         "localUnitsTableType": "Type",
-        "localUnitsTableFocal": "Focal Person",
-        "localUnitsTableStatus": "Status",
-        "localUnitsTablePhoneNumber": "Phone Number",
-        "localUnitsTableEmail": "Email"
+        "localUnitsTableStatus": "Status"
     }
 }

app/src/views/CountryNsOverviewContextAndStructure/NationalSocietyLocalUnits/LocalUnitsTable/index.tsx

@@ -134,21 +134,6 @@ function LocalUnitsTable(props: Props) {
                     (item) => item.type_details.name,
                     { columnClassName: styles.type },
                 ),
-                createStringColumn<LocalUnitsTableListItem, number>(
-                    'focal',
-                    strings.localUnitsTableFocal,
-                    (item) => getFirstTruthyString(item.focal_person_loc, item.focal_person_en),
-                ),
-                createStringColumn<LocalUnitsTableListItem, number>(
-                    'phone',
-                    strings.localUnitsTablePhoneNumber,
-                    (item) => item.phone,
-                ),
-                createStringColumn<LocalUnitsTableListItem, number>(
-                    'email',
-                    strings.localUnitsTableEmail,
-                    (item) => item.email,
-                ),
                 createElementColumn<LocalUnitsTableListItem, number, LocalUnitStatusProps>(
                     'status',
                     strings.localUnitsTableStatus,
@@ -227,9 +212,6 @@ function LocalUnitsTable(props: Props) {
         strings.localUnitsTableAddress,
         strings.localUnitsTableName,
         strings.localUnitsTableType,
-        strings.localUnitsTableFocal,
-        strings.localUnitsTablePhoneNumber,
-        strings.localUnitsTableEmail,
         strings.localUnitsTableStatus,
         refetchLocalUnits,
     ]);