From d734e04950ff9af589d63e30d3fdac852d62b728 Mon Sep 17 00:00:00 2001
From: frozenhelium <ankit.mehta@togglecorp.com>
Date: Tue, 20 Aug 2024 17:53:01 +0545
Subject: [PATCH] Fix rating visibility in the strategic priorities page

- Fix duplicate volunteers label in field report details page
---
 .changeset/light-lies-flash.md                |  6 ++
 .../index.tsx                                 | 99 +++++++++++++------
 .../PublicCountryPreparedness/index.tsx       | 24 +++--
 .../EpidemicNumericDetails/index.tsx          |  2 +-
 4 files changed, 89 insertions(+), 42 deletions(-)
 create mode 100644 .changeset/light-lies-flash.md

diff --git a/.changeset/light-lies-flash.md b/.changeset/light-lies-flash.md
new file mode 100644
index 000000000..3b6f01425
--- /dev/null
+++ b/.changeset/light-lies-flash.md
@@ -0,0 +1,6 @@
+---
+"go-web-app": patch
+---
+
+- Fix duplication volunteer label in the Field Report details
+- Fix rating visibility in the Country > NS Overview > Strategic priorities page
diff --git a/app/src/views/CountryNsOverviewStrategicPriorities/index.tsx b/app/src/views/CountryNsOverviewStrategicPriorities/index.tsx
index 6fa65c9e0..089a2e80f 100644
--- a/app/src/views/CountryNsOverviewStrategicPriorities/index.tsx
+++ b/app/src/views/CountryNsOverviewStrategicPriorities/index.tsx
@@ -20,6 +20,8 @@ import {
 
 import Link from '#components/Link';
 import WikiLink from '#components/WikiLink';
+import useCountry from '#hooks/domain/useCountry';
+import usePermissions from '#hooks/domain/usePermissions';
 import useDebouncedValue from '#hooks/useDebouncedValue';
 import { type CountryOutletContext } from '#utils/outletContext';
 import { useRequest } from '#utils/restRequest';
@@ -34,6 +36,20 @@ export function Component() {
     const { countryId, countryResponse } = useOutletContext<CountryOutletContext>();
     const strings = useTranslation(i18n);
 
+    const {
+        isCountryPerAdmin,
+        isSuperUser,
+        isRegionPerAdmin,
+        isGuestUser,
+    } = usePermissions();
+
+    const countryDetails = useCountry({ id: Number(countryId) });
+    const regionId = isDefined(countryDetails) ? Number(countryDetails?.region) : undefined;
+
+    const isPerAdmin = isSuperUser
+        || (!isGuestUser && isCountryPerAdmin(Number(countryId)))
+        || (!isGuestUser && isRegionPerAdmin(regionId));
+
     const {
         pending: publicPerStatsPending,
         response: publicPerStatsResponse,
@@ -266,20 +282,34 @@ export function Component() {
                             numPreferredGridContentColumns={5}
                         >
                             {strengthComponents?.map(
-                                (strengthComponent) => (
-                                    <Container
-                                        heading={strengthComponent?.component_details.title}
-                                        headingLevel={5}
-                                        key={strengthComponent.component}
-                                        withHeaderBorder
-                                        withInternalPadding
-                                        icons={<CheckboxFillIcon className={styles.icon} />}
-                                        withoutWrapInHeading
-                                        className={styles.strengthComponent}
-                                    >
-                                        {strengthComponent?.rating_details?.title}
-                                    </Container>
-                                ),
+                                (strengthComponent) => {
+                                    if (!isPerAdmin) {
+                                        return (
+                                            <Container
+                                                key={strengthComponent.component}
+                                                withInternalPadding
+                                                className={styles.strengthComponent}
+                                            >
+                                                {strengthComponent?.component_details.title}
+                                            </Container>
+                                        );
+                                    }
+
+                                    return (
+                                        <Container
+                                            heading={strengthComponent?.rating_details?.title}
+                                            headingLevel={5}
+                                            key={strengthComponent.component}
+                                            withHeaderBorder
+                                            withInternalPadding
+                                            icons={<CheckboxFillIcon className={styles.icon} />}
+                                            withoutWrapInHeading
+                                            className={styles.strengthComponent}
+                                        >
+                                            {strengthComponent?.component_details.title}
+                                        </Container>
+                                    );
+                                },
                             )}
                         </Container>
                     )}
@@ -291,20 +321,33 @@ export function Component() {
                             numPreferredGridContentColumns={5}
                         >
                             {keyDevelopmentComponents?.map(
-                                (keyDevelopmentComponent) => (
-                                    <Container
-                                        heading={keyDevelopmentComponent?.component_details.title}
-                                        headingLevel={5}
-                                        key={keyDevelopmentComponent.component}
-                                        withHeaderBorder
-                                        withInternalPadding
-                                        icons={<CheckboxFillIcon className={styles.icon} />}
-                                        withoutWrapInHeading
-                                        className={styles.priorityComponent}
-                                    >
-                                        {keyDevelopmentComponent?.rating_details?.title}
-                                    </Container>
-                                ),
+                                (keyDevelopmentComponent) => {
+                                    if (!isPerAdmin) {
+                                        return (
+                                            <Container
+                                                key={keyDevelopmentComponent.component}
+                                                withInternalPadding
+                                                className={styles.priorityComponent}
+                                            >
+                                                {keyDevelopmentComponent?.component_details.title}
+                                            </Container>
+                                        );
+                                    }
+                                    return (
+                                        <Container
+                                            heading={keyDevelopmentComponent?.rating_details?.title}
+                                            headingLevel={5}
+                                            key={keyDevelopmentComponent.component}
+                                            withHeaderBorder
+                                            withInternalPadding
+                                            icons={<CheckboxFillIcon className={styles.icon} />}
+                                            withoutWrapInHeading
+                                            className={styles.priorityComponent}
+                                        >
+                                            {keyDevelopmentComponent?.component_details.title}
+                                        </Container>
+                                    );
+                                },
                             )}
                         </Container>
                     )}
diff --git a/app/src/views/CountryPreparedness/PublicCountryPreparedness/index.tsx b/app/src/views/CountryPreparedness/PublicCountryPreparedness/index.tsx
index 45b4644e1..4f0252f62 100644
--- a/app/src/views/CountryPreparedness/PublicCountryPreparedness/index.tsx
+++ b/app/src/views/CountryPreparedness/PublicCountryPreparedness/index.tsx
@@ -1,5 +1,4 @@
 import {
-    Fragment,
     useCallback,
     useMemo,
 } from 'react';
@@ -246,18 +245,17 @@ function PublicCountryPreparedness() {
                 >
                     {componentsToBeStrengthened.map(
                         (priorityComponent) => (
-                            <Fragment key={priorityComponent.id}>
-                                <Heading
-                                    className={styles.heading}
-                                    level={5}
-                                >
-                                    {getFormattedComponentName({
-                                        component_num: priorityComponent.componentNumber,
-                                        component_letter: priorityComponent.componentLetter,
-                                        title: priorityComponent.label,
-                                    })}
-                                </Heading>
-                            </Fragment>
+                            <Heading
+                                key={priorityComponent.id}
+                                className={styles.heading}
+                                level={5}
+                            >
+                                {getFormattedComponentName({
+                                    component_num: priorityComponent.componentNumber,
+                                    component_letter: priorityComponent.componentLetter,
+                                    title: priorityComponent.label,
+                                })}
+                            </Heading>
                         ),
                     )}
                 </Container>
diff --git a/app/src/views/FieldReportDetails/EpidemicNumericDetails/index.tsx b/app/src/views/FieldReportDetails/EpidemicNumericDetails/index.tsx
index 52b7418ca..9c087a090 100644
--- a/app/src/views/FieldReportDetails/EpidemicNumericDetails/index.tsx
+++ b/app/src/views/FieldReportDetails/EpidemicNumericDetails/index.tsx
@@ -50,7 +50,7 @@ function EpidemicNumericDetails(props: Props) {
                 value={value?.gov_num_assisted}
             />
             <KeyFigure
-                label={strings.epidemicVolunteersLabel}
+                label={strings.epidemicLocalStaffLabel}
                 value={value?.num_localstaff}
             />
             <KeyFigure