From 22f9fcd52e9abb6ee8925d205382ddbcfffe550a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 09:56:44 +0100 Subject: [PATCH 01/15] renames protected areas to conservation areas --- app/components/scenarios/item/component.tsx | 2 +- app/hoc/scenarios.ts | 5 ++-- app/hooks/map/constants.tsx | 4 ++-- app/hooks/map/index.ts | 2 +- app/hooks/scenarios/index.ts | 2 +- app/layout/info/upload-wdpas.tsx | 2 +- app/layout/project/navigation/constants.ts | 8 +++---- app/layout/project/navigation/hooks.tsx | 20 ++++++++-------- app/layout/project/navigation/types.ts | 2 +- .../actions-menu/index.tsx | 6 ++--- .../bulk-action-menu/index.tsx | 2 +- .../bulk-action-menu/utils.ts | 0 .../footer/index.tsx | 4 ++-- .../{wdpas => conservation-areas}/index.tsx | 8 ++----- .../modals/delete/index.tsx | 16 ++++++------- .../modals/edit/index.tsx | 6 ++--- .../modals/upload/index.tsx | 2 +- .../project/inventory-panel/constants.ts | 18 +++++++-------- .../sidebar/project/scenarios-list/index.tsx | 11 +++++---- .../scenarios-list/scenario-item/index.tsx | 2 +- .../scenario-item/settings/index.tsx | 2 +- .../project/scenarios-list/types/constants.ts | 2 +- .../categories/index.tsx | 23 ++++++++++--------- .../categories/pa-uploader/index.tsx | 10 ++++---- .../index.tsx | 0 .../pa-selected/index.tsx | 0 .../threshold/index.tsx | 16 ++++++------- .../grid-setup/gap-analysis/index.tsx | 4 ++-- .../show/scenarios/settings/component.tsx | 2 +- .../show/scenarios/types/constants.ts | 2 +- app/layout/scenarios/edit/map/component.tsx | 2 +- .../scenarios/edit/status/actions/done.tsx | 13 +++++++++-- .../scenarios/edit/status/actions/failure.tsx | 1 - app/layout/scenarios/edit/status/constants.ts | 4 ++-- app/layout/scenarios/new/name/index.tsx | 2 +- .../reports/solutions/pu-status/index.tsx | 3 +-- .../reports/solutions/resume/index.tsx | 2 +- .../projects/[pid]/scenarios/[sid]/edit.tsx | 4 ++-- ...ected-areas.svg => conservation-areas.svg} | 0 app/svgs/sidebar/protected-area.svg | 3 --- 40 files changed, 110 insertions(+), 107 deletions(-) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/actions-menu/index.tsx (96%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/bulk-action-menu/index.tsx (97%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/bulk-action-menu/utils.ts (100%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/footer/index.tsx (85%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/index.tsx (96%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/modals/delete/index.tsx (87%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/modals/edit/index.tsx (96%) rename app/layout/project/sidebar/project/inventory-panel/{wdpas => conservation-areas}/modals/upload/index.tsx (99%) rename app/layout/project/sidebar/scenario/grid-setup/{protected-areas => conservation-areas}/categories/index.tsx (94%) rename app/layout/project/sidebar/scenario/grid-setup/{protected-areas => conservation-areas}/categories/pa-uploader/index.tsx (97%) rename app/layout/project/sidebar/scenario/grid-setup/{protected-areas => conservation-areas}/index.tsx (100%) rename app/layout/project/sidebar/scenario/grid-setup/{protected-areas => conservation-areas}/pa-selected/index.tsx (100%) rename app/layout/project/sidebar/scenario/grid-setup/{protected-areas => conservation-areas}/threshold/index.tsx (94%) rename app/svgs/navigation/{protected-areas.svg => conservation-areas.svg} (100%) delete mode 100644 app/svgs/sidebar/protected-area.svg diff --git a/app/components/scenarios/item/component.tsx b/app/components/scenarios/item/component.tsx index bd78e53237..0c30a0a055 100644 --- a/app/components/scenarios/item/component.tsx +++ b/app/components/scenarios/item/component.tsx @@ -122,7 +122,7 @@ export const Item: React.FC = ({ const clone = jobs.find((j) => j.kind === 'clone'); const run = jobs.find((j) => j.kind === 'run'); - // PROTECTED AREAS + // Conservation areas if (planningAreaProtectedCalculation && planningAreaProtectedCalculation.status === 'running') return 'pa-running'; if (planningAreaProtectedCalculation && planningAreaProtectedCalculation.status === 'failure') diff --git a/app/hoc/scenarios.ts b/app/hoc/scenarios.ts index 47c2212cdd..c79b77fba6 100644 --- a/app/hoc/scenarios.ts +++ b/app/hoc/scenarios.ts @@ -1,9 +1,10 @@ import { QueryClient } from 'react-query'; -import { NAVIGATION_TREE } from 'layout/project/navigation/constants'; import { Session } from 'next-auth'; import { getSession } from 'next-auth/react'; import { dehydrate } from 'react-query/hydration'; + +import { NAVIGATION_TREE } from 'layout/project/navigation/constants'; import { Project } from 'types/api/project'; import { Scenario } from 'types/api/scenario'; @@ -276,7 +277,7 @@ export function withSolutions(getServerSidePropsFunc?: Function) { return { props: {}, redirect: { - destination: `/projects/${pid}/scenarios/${sid}/edit?tab=protected-areas`, + destination: `/projects/${pid}/scenarios/${sid}/edit?tab=conservation-areas`, permanent: false, }, }; diff --git a/app/hooks/map/constants.tsx b/app/hooks/map/constants.tsx index 3f062bc1af..a306526ea2 100644 --- a/app/hooks/map/constants.tsx +++ b/app/hooks/map/constants.tsx @@ -190,7 +190,7 @@ export const LEGEND_LAYERS = { return { id: 'wdpa-preview', - name: 'Protected areas preview', + name: 'Conservation areas preview', icon: ( { - push(`/projects/${projectId}/scenarios/${id}/edit?tab=protected-areas`); + push(`/projects/${projectId}/scenarios/${id}/edit?tab=conservation-areas`); }, }; }); diff --git a/app/layout/info/upload-wdpas.tsx b/app/layout/info/upload-wdpas.tsx index 491be9a9d6..d5e249457f 100644 --- a/app/layout/info/upload-wdpas.tsx +++ b/app/layout/info/upload-wdpas.tsx @@ -2,7 +2,7 @@ export const UploadWDPAsInfoButtonContent = (): JSX.Element => { return (

- When uploading shapefiles of protected areas, please make sure that: + When uploading shapefiles of conservation areas, please make sure that:

  • this is a single zip file that includes all the components of a single shapefile;
    • diff --git a/app/layout/project/navigation/constants.ts b/app/layout/project/navigation/constants.ts index 907bbb7df2..73579c1e52 100644 --- a/app/layout/project/navigation/constants.ts +++ b/app/layout/project/navigation/constants.ts @@ -1,10 +1,10 @@ import { NavigationTreeCategories } from './types'; export const TABS = { - 'project-protected-areas': 'protected-areas', + 'project-conservation-areas': 'conservation-areas', 'project-cost-surface': 'cost-surface', 'project-features': 'features', - 'scenario-protected-areas': 'protected-areas', + 'scenario-conservation-areas': 'conservation-areas', 'scenario-cost-surface': 'cost-surface', 'scenario-planning-unit-status': 'planning-unit-status', 'scenario-features': 'features', @@ -19,12 +19,12 @@ export const TABS = { export const NAVIGATION_TREE = { user: [], inventory: [ - TABS['project-protected-areas'], + TABS['project-conservation-areas'], TABS['project-cost-surface'], TABS['project-features'], ], gridSetup: [ - TABS['scenario-protected-areas'], + TABS['scenario-conservation-areas'], TABS['scenario-cost-surface'], TABS['scenario-planning-unit-status'], TABS['scenario-features'], diff --git a/app/layout/project/navigation/hooks.tsx b/app/layout/project/navigation/hooks.tsx index 1654d7a581..1eb0f57804 100644 --- a/app/layout/project/navigation/hooks.tsx +++ b/app/layout/project/navigation/hooks.tsx @@ -1,11 +1,11 @@ import { useRouter } from 'next/router'; import BLM_CALIBRATION_SVG from 'svgs/navigation/blm-calibration.svg?sprite'; +import CONSERVATION_AREAS_SVG from 'svgs/navigation/conservation-areas.svg?sprite'; import COST_SURFACE_SVG from 'svgs/navigation/cost-surface.svg?sprite'; import FEATURES_SVG from 'svgs/navigation/features.svg?sprite'; import OVERVIEW_SVG from 'svgs/navigation/overview.svg?sprite'; import PLANNING_UNITS_SVG from 'svgs/navigation/planning-units.svg?sprite'; -import PROTECTED_AREA_SVG from 'svgs/navigation/protected-areas.svg?sprite'; import TARGET_SVG from 'svgs/navigation/target.svg?sprite'; import { TABS } from './constants'; @@ -20,13 +20,13 @@ export const useInventoryItems = (): SubMenuItem[] => { return [ { - name: 'Protected areas', - route: `/projects/${pid}?tab=${TABS['project-protected-areas']}`, - icon: PROTECTED_AREA_SVG, - selected: isProjectRoute && tab === TABS['project-protected-areas'], + name: 'Conservation Areas', + route: `/projects/${pid}?tab=${TABS['project-conservation-areas']}`, + icon: CONSERVATION_AREAS_SVG, + selected: isProjectRoute && tab === TABS['project-conservation-areas'], }, { - name: 'Cost surface', + name: 'Cost Surface', route: `/projects/${pid}?tab=${TABS['project-cost-surface']}`, icon: COST_SURFACE_SVG, selected: isProjectRoute && tab === TABS['project-cost-surface'], @@ -47,10 +47,10 @@ export const useGridSetupItems = (): SubMenuItem[] => { return [ { - name: 'Protected Areas', - route: `/projects/${pid}/scenarios/${sid}/edit?tab=${TABS['scenario-protected-areas']}`, - icon: PROTECTED_AREA_SVG, - selected: isScenarioRoute && tab === TABS['scenario-protected-areas'], + name: 'Conservation Areas', + route: `/projects/${pid}/scenarios/${sid}/edit?tab=${TABS['scenario-conservation-areas']}`, + icon: CONSERVATION_AREAS_SVG, + selected: isScenarioRoute && tab === TABS['scenario-conservation-areas'], }, { name: 'Planning Unit Status', diff --git a/app/layout/project/navigation/types.ts b/app/layout/project/navigation/types.ts index 5f82491fff..cc6defe446 100644 --- a/app/layout/project/navigation/types.ts +++ b/app/layout/project/navigation/types.ts @@ -5,4 +5,4 @@ export type NavigationTreeCategories = | 'solutions' | 'marxanSettings'; -export type NavigationInventoryTabs = 'protected-areas' | 'cost-surface' | 'features'; +export type NavigationInventoryTabs = 'conservation-areas' | 'cost-surface' | 'features'; diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/actions-menu/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/actions-menu/index.tsx similarity index 96% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/actions-menu/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/actions-menu/index.tsx index 70b5306040..ca7ec4cc6d 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/actions-menu/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/actions-menu/index.tsx @@ -2,8 +2,8 @@ import { ComponentProps, useCallback, useState } from 'react'; import Icon from 'components/icon'; import Modal from 'components/modal/component'; -import DeleteModal from 'layout/project/sidebar/project/inventory-panel/wdpas/modals/delete'; -import EditModal from 'layout/project/sidebar/project/inventory-panel/wdpas/modals/edit'; +import DeleteModal from 'layout/project/sidebar/project/inventory-panel/conservation-areas/modals/delete'; +import EditModal from 'layout/project/sidebar/project/inventory-panel/conservation-areas/modals/edit'; import { cn } from 'utils/cn'; import DELETE_SVG from 'svgs/ui/new-layout/delete.svg?sprite'; @@ -57,7 +57,7 @@ const ActionsMenu = ({ handleModal('edit', false)} diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/index.tsx similarity index 97% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/index.tsx index d94376fa66..c488ef2d16 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/index.tsx @@ -3,7 +3,7 @@ import { useCallback, useState } from 'react'; import Button from 'components/button'; import Icon from 'components/icon'; import Modal from 'components/modal/component'; -import DeleteModal from 'layout/project/sidebar/project/inventory-panel/wdpas/modals/delete'; +import DeleteModal from 'layout/project/sidebar/project/inventory-panel/conservation-areas/modals/delete'; import { WDPA } from 'types/api/wdpa'; import DELETE_SVG from 'svgs/ui/new-layout/delete.svg?sprite'; diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/utils.ts b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/utils.ts similarity index 100% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/utils.ts rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/utils.ts diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/footer/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/footer/index.tsx similarity index 85% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/footer/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/footer/index.tsx index 2b021b957c..e6321a579e 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/footer/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/footer/index.tsx @@ -1,4 +1,4 @@ -const ProtectedAreasFooter = (): JSX.Element => { +const ConservationAreasFooter = (): JSX.Element => { return (

    @@ -21,4 +21,4 @@ const ProtectedAreasFooter = (): JSX.Element => { ); }; -export default ProtectedAreasFooter; +export default ConservationAreasFooter; diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/index.tsx similarity index 96% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/index.tsx index fafa53a26b..fa231a3178 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/index.tsx @@ -21,11 +21,7 @@ const WDPA_TABLE_COLUMNS = [ }, ]; -const InventoryPanelProtectedAreas = ({ - noData: noDataMessage, -}: { - noData: string; -}): JSX.Element => { +const ConservationAreasTable = ({ noData: noDataMessage }: { noData: string }): JSX.Element => { const dispatch = useAppDispatch(); const { @@ -146,4 +142,4 @@ const InventoryPanelProtectedAreas = ({ ); }; -export default InventoryPanelProtectedAreas; +export default ConservationAreasTable; diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/delete/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/delete/index.tsx similarity index 87% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/modals/delete/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/delete/index.tsx index 52536876fd..53e3bce964 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/delete/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/delete/index.tsx @@ -12,7 +12,7 @@ import { useProjectWDPAs } from 'hooks/wdpa'; import { Button } from 'components/button/component'; import Icon from 'components/icon/component'; import { ModalProps } from 'components/modal'; -import { bulkDeleteWDPAFromProject } from 'layout/project/sidebar/project/inventory-panel/wdpas/bulk-action-menu/utils'; +import { bulkDeleteWDPAFromProject } from 'layout/project/sidebar/project/inventory-panel/conservation-areas/bulk-action-menu/utils'; import { WDPA } from 'types/api/wdpa'; import ALERT_SVG from 'svgs/ui/new-layout/alert.svg?sprite'; @@ -38,7 +38,7 @@ const DeleteModal = ({ const WDPAsNames = selectedWDPAs.map(({ name }) => name); - // ? the user will be able to delete the protected areas only if they are not being used by any scenario. + // ? the user will be able to delete the conservation areas only if they are not being used by any scenario. const haveScenarioAssociated = selectedWDPAs.some(({ scenarioUsageCount }) => Boolean(scenarioUsageCount) ); @@ -56,7 +56,7 @@ const DeleteModal = ({ 'delete-bulk-project-wdpas', <>

    Success

    -

    The protected areas were deleted successfully.

    +

    The conservation areas were deleted successfully.

    , { level: 'success', @@ -68,7 +68,7 @@ const DeleteModal = ({ 'delete-bulk-project-wdpas', <>

    Error!

    -

    Something went wrong deleting the protected areas

    +

    Something went wrong deleting the conservation areas

    , { level: 'error', @@ -79,14 +79,14 @@ const DeleteModal = ({ return (
    -

    {`Delete protected area${ +

    {`Delete conservation area${ selectedWDPAIds.length > 1 ? 's' : '' }`}

    {selectedWDPAIds.length > 1 ? (

    - Are you sure you want to delete the following protected areas?
    + Are you sure you want to delete the following conservation areas?
    This action cannot be undone.
      @@ -97,7 +97,7 @@ const DeleteModal = ({
    ) : ( - Are you sure you want to delete "{WDPAsNames[0]}" protected area?
    + Are you sure you want to delete "{WDPAsNames[0]}" conservation area?
    This action cannot be undone.     )} @@ -105,7 +105,7 @@ const DeleteModal = ({

    - A protected area can be deleted ONLY if it's not being used by any scenario + A conservation area can be deleted ONLY if it's not being used by any scenario

    diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/edit/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/edit/index.tsx similarity index 96% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/modals/edit/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/edit/index.tsx index d10fa5c7db..f8e19a28ca 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/edit/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/edit/index.tsx @@ -51,7 +51,7 @@ const EditModal = ({ 'success-edit-wdpa', <>

    Success!

    -

    Protected area edited

    +

    Conservation area edited

    , { level: 'success', @@ -63,7 +63,7 @@ const EditModal = ({ 'error-edit-wdpa', <>

    Error!

    -

    It is not possible to edit this protected area

    +

    It is not possible to edit this conservation area

    , { level: 'error', @@ -89,7 +89,7 @@ const EditModal = ({ return (
    -

    Edit protected area

    +

    Edit conservation area

    name="name" validate={composeValidators([{ presence: true }])}> diff --git a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/upload/index.tsx b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/upload/index.tsx similarity index 99% rename from app/layout/project/sidebar/project/inventory-panel/wdpas/modals/upload/index.tsx rename to app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/upload/index.tsx index 40f026ed27..93929be41b 100644 --- a/app/layout/project/sidebar/project/inventory-panel/wdpas/modals/upload/index.tsx +++ b/app/layout/project/sidebar/project/inventory-panel/conservation-areas/modals/upload/index.tsx @@ -188,7 +188,7 @@ export const WDPAUploadModal = ({
    -

    Upload protected area

    +

    Upload conservation area

    diff --git a/app/layout/project/sidebar/project/inventory-panel/constants.ts b/app/layout/project/sidebar/project/inventory-panel/constants.ts index 2daa375733..2cbe47eaf2 100644 --- a/app/layout/project/sidebar/project/inventory-panel/constants.ts +++ b/app/layout/project/sidebar/project/inventory-panel/constants.ts @@ -1,5 +1,8 @@ import { NavigationInventoryTabs } from 'layout/project/navigation/types'; +import ConservationAreasTable from './conservation-areas'; +import ConservationAreasFooter from './conservation-areas/footer'; +import WDPAUploadModal from './conservation-areas/modals/upload'; import CostSurfaceTable from './cost-surfaces'; import CostSurfaceInfo from './cost-surfaces/info'; import CostSurfaceUploadModal from './cost-surfaces/modals/upload'; @@ -7,17 +10,14 @@ import FeaturesTable from './features'; import FeaturesInfo from './features/info'; import FeatureUploadModal from './features/modals/upload'; import { InventoryPanel } from './types'; -import ProtectedAreasTable from './wdpas'; -import ProtectedAreasFooter from './wdpas/footer'; -import WDPAUploadModal from './wdpas/modals/upload'; export const INVENTORY_TABS = { - 'protected-areas': { - title: 'Protected Areas', - search: 'Search protected areas', - noData: 'No protected areas found.', - TableComponent: ProtectedAreasTable, - FooterComponent: ProtectedAreasFooter, + 'conservation-areas': { + title: 'Conservation Areas', + search: 'Search conservation areas', + noData: 'No conservation areas found.', + TableComponent: ConservationAreasTable, + FooterComponent: ConservationAreasFooter, UploadModalComponent: WDPAUploadModal, }, 'cost-surface': { diff --git a/app/layout/project/sidebar/project/scenarios-list/index.tsx b/app/layout/project/sidebar/project/scenarios-list/index.tsx index 4926fae3b1..d5e84f421d 100644 --- a/app/layout/project/sidebar/project/scenarios-list/index.tsx +++ b/app/layout/project/sidebar/project/scenarios-list/index.tsx @@ -28,6 +28,7 @@ import Loading from 'components/loading'; import Modal from 'components/modal'; import { ScrollArea } from 'components/scroll-area'; import HelpBeacon from 'layout/help/beacon'; +import { TABS } from 'layout/project/navigation/constants'; import NoResults from 'layout/project/sidebar/project/inventory-panel/components/no-results'; import ScenarioToolbar from 'layout/project/sidebar/project/scenarios-list/toolbar'; import Section from 'layout/section'; @@ -324,19 +325,19 @@ export const ScenariosList: React.FC = () => {

    Before we can show you any results, we‘ll need you to{' '} - upload some features, protected areas or cost surface + upload some features, conservation areas or cost surface {' '} that are essential to the analysis.

    - -
    Upload Protected Areas
    + +
    Upload Conservation Areas
    - +
    Upload Cost Surface
    - +
    Upload Features
    diff --git a/app/layout/project/sidebar/project/scenarios-list/scenario-item/index.tsx b/app/layout/project/sidebar/project/scenarios-list/scenario-item/index.tsx index 9768fb8911..42b219a8dc 100644 --- a/app/layout/project/sidebar/project/scenarios-list/scenario-item/index.tsx +++ b/app/layout/project/sidebar/project/scenarios-list/scenario-item/index.tsx @@ -66,7 +66,7 @@ export const ScenarioItem: React.FC = ({ const clone = jobs.find((j) => j.kind === 'clone'); const run = jobs.find((j) => j.kind === 'run'); - // PROTECTED AREAS + // Conversation areas if (planningAreaProtectedCalculation && planningAreaProtectedCalculation.status === 'running') return 'pa-running'; if (planningAreaProtectedCalculation && planningAreaProtectedCalculation.status === 'failure') diff --git a/app/layout/project/sidebar/project/scenarios-list/scenario-item/settings/index.tsx b/app/layout/project/sidebar/project/scenarios-list/scenario-item/settings/index.tsx index 4620a65d3a..428ae0e935 100644 --- a/app/layout/project/sidebar/project/scenarios-list/scenario-item/settings/index.tsx +++ b/app/layout/project/sidebar/project/scenarios-list/scenario-item/settings/index.tsx @@ -45,7 +45,7 @@ const ScenarioSettings = ({ id }: { id: Scenario['id'] }): JSX.Element => { return (
    -
    Protected areas:
    +
    Conservation areas:
    {protectedAreas?.length || '-'}
    diff --git a/app/layout/project/sidebar/project/scenarios-list/types/constants.ts b/app/layout/project/sidebar/project/scenarios-list/types/constants.ts index 12d714c576..b185b08da2 100644 --- a/app/layout/project/sidebar/project/scenarios-list/types/constants.ts +++ b/app/layout/project/sidebar/project/scenarios-list/types/constants.ts @@ -26,7 +26,7 @@ export const SCENARIO_TYPES = [ height: 20, }, subtitle: - 'Prioritizes for multiple actions simultaneously (e.g. protected areas, community-use, and sustainable use zones).', + 'Prioritizes for multiple actions simultaneously (e.g. conservation areas, community-use, and sustainable use zones).', disclaimer: 'This approach is more data and process intensive.', disabled: true, }, diff --git a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/index.tsx similarity index 94% rename from app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/index.tsx rename to app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/index.tsx index c42cd79b48..72928245c1 100644 --- a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/index.tsx +++ b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/index.tsx @@ -101,7 +101,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { 'save-scenario-wdpa', <>

    Success!

    -

    Scenario protected areas saved

    +

    Scenario conservation areas saved

    , { level: 'success', @@ -116,7 +116,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { 'error-scenario-wdpa', <>

    Error!

    -

    Scenario protected areas not saved

    +

    Scenario conservation areas not saved

    , { level: 'error', @@ -215,7 +215,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => {
    Grid Setup

    - Protected Areas + Conservation Areas

    {

    IUCN categories

    - You can select to include protected areas from any or all of - the IUCN categories that exist in your planning area: + You can select to include conservation areas from any or all + of the IUCN categories that exist in your planning area:

      @@ -302,8 +302,9 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { {WDPA_CATEGORIES_OPTIONS.length < 1 && (
      - This planning area doesn't have any protected areas categories - associated with it. You can upload a new one using the button below. + This planning area doesn't have any conservation areas + categories associated with it. You can upload a new one using the + button below.
      )} @@ -339,7 +340,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { clearSelectionActive clearSelectionLabel="Clear selection" batchSelectionActive - batchSelectionLabel="All protected areas" + batchSelectionLabel="All conservation areas" disabled={!editable} selected={values.wdpaIucnCategories} options={ORDERED_WDPA_CATEGORIES_OPTIONS} @@ -364,7 +365,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { )} @@ -373,7 +374,7 @@ export const WDPACategories = ({ onContinue }): JSX.Element => { )} diff --git a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/pa-uploader/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/pa-uploader/index.tsx similarity index 97% rename from app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/pa-uploader/index.tsx rename to app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/pa-uploader/index.tsx index 2d45258227..e98dd77ad5 100644 --- a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/categories/pa-uploader/index.tsx +++ b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/categories/pa-uploader/index.tsx @@ -115,10 +115,10 @@ export const ProtectedAreaUploader = ({ input }): JSX.Element => { await queryClient.invalidateQueries(['protected-areas']); addToast( - 'success-upload-protected-area', + 'success-upload-conservation-area', <>

      Success!

      -

      Protected area uploaded

      +

      Conservation area uploaded

      , { level: 'success', @@ -134,7 +134,7 @@ export const ProtectedAreaUploader = ({ input }): JSX.Element => { setSuccessFile(null); addToast( - 'error-upload-protected-area', + 'error-upload-conservation-area', <>

      Error!

        @@ -164,7 +164,7 @@ export const ProtectedAreaUploader = ({ input }): JSX.Element => { return ( { @@ -191,7 +191,7 @@ export const ProtectedAreaUploader = ({ input }): JSX.Element => { {' '}

        - When uploading shapefiles of protected areas, please make sure that: + When uploading shapefiles of conservation areas, please make sure that:

        • diff --git a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/index.tsx similarity index 100% rename from app/layout/project/sidebar/scenario/grid-setup/protected-areas/index.tsx rename to app/layout/project/sidebar/scenario/grid-setup/conservation-areas/index.tsx diff --git a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/pa-selected/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/pa-selected/index.tsx similarity index 100% rename from app/layout/project/sidebar/scenario/grid-setup/protected-areas/pa-selected/index.tsx rename to app/layout/project/sidebar/scenario/grid-setup/conservation-areas/pa-selected/index.tsx diff --git a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/threshold/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/threshold/index.tsx similarity index 94% rename from app/layout/project/sidebar/scenario/grid-setup/protected-areas/threshold/index.tsx rename to app/layout/project/sidebar/scenario/grid-setup/conservation-areas/threshold/index.tsx index a3cc8eab0a..4ea6b33ae3 100644 --- a/app/layout/project/sidebar/scenario/grid-setup/protected-areas/threshold/index.tsx +++ b/app/layout/project/sidebar/scenario/grid-setup/conservation-areas/threshold/index.tsx @@ -138,7 +138,7 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme 'save-scenario-wdpa', <>

          Success!

          -

          Scenario protected areas threshold saved

          +

          Conservation areas threshold saved

          , { level: 'success', @@ -150,7 +150,7 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme 'error-scenario-wdpa', <>

          Error!

          -

          Scenario protected areas threshold not saved

          +

          Conservation areas threshold not saved

          , { level: 'error', @@ -200,7 +200,7 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme
          Grid Setup

          - Protected Areas Treshold + Conservation Areas Threshold

          @@ -230,12 +230,12 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme

          - Threshold for Protected Areas + Threshold for conservation areas

          @@ -256,7 +256,7 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme

          Refers to what percentage of a planning unit must be covered by a - protected area to be considered “protected”. + conservation area to be considered “protected”.

          void }): JSX.Eleme {areGlobalPAreasSelected && ( @@ -292,7 +292,7 @@ export const WDPAThreshold = ({ onGoBack }: { onGoBack: () => void }): JSX.Eleme {areProjectPAreasSelected && ( diff --git a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx index fb8f9e2198..6ce537584e 100644 --- a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx +++ b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx @@ -40,8 +40,8 @@ export const GridSetupGAPAnalysis = (): JSX.Element => {

          The result shows the percentage of each feature that is currently inside your selected conservation network (the conservation areas you added in{' '} - Protected Areas) and will inform you of the amount of conservation action - still needed to achieve your targets. + Conservation Areas) and will inform you of the amount of conservation + action still needed to achieve your targets.

          diff --git a/app/layout/projects/show/scenarios/settings/component.tsx b/app/layout/projects/show/scenarios/settings/component.tsx index 1ff5b90ab7..b3e2fc30c5 100644 --- a/app/layout/projects/show/scenarios/settings/component.tsx +++ b/app/layout/projects/show/scenarios/settings/component.tsx @@ -52,7 +52,7 @@ export const ProjectScenariosSettings: React.FC = return (

          -
          Protected areas:
          +
          Conservation areas:
          {protectedAreas?.length || '-'}
          diff --git a/app/layout/projects/show/scenarios/types/constants.ts b/app/layout/projects/show/scenarios/types/constants.ts index 12d714c576..b185b08da2 100644 --- a/app/layout/projects/show/scenarios/types/constants.ts +++ b/app/layout/projects/show/scenarios/types/constants.ts @@ -26,7 +26,7 @@ export const SCENARIO_TYPES = [ height: 20, }, subtitle: - 'Prioritizes for multiple actions simultaneously (e.g. protected areas, community-use, and sustainable use zones).', + 'Prioritizes for multiple actions simultaneously (e.g. conservation areas, community-use, and sustainable use zones).', disclaimer: 'This approach is more data and process intensive.', disabled: true, }, diff --git a/app/layout/scenarios/edit/map/component.tsx b/app/layout/scenarios/edit/map/component.tsx index 0e802d735b..3ab7383087 100644 --- a/app/layout/scenarios/edit/map/component.tsx +++ b/app/layout/scenarios/edit/map/component.tsx @@ -275,7 +275,7 @@ export const ScenariosEditMap = (): JSX.Element => { options: { wdpaIucnCategories: protectedAreas, wdpaThreshold: - tab === TABS['scenario-protected-areas'] + tab === TABS['scenario-conservation-areas'] ? wdpaThreshold * 100 : scenarioData?.wdpaThreshold, puAction, diff --git a/app/layout/scenarios/edit/status/actions/done.tsx b/app/layout/scenarios/edit/status/actions/done.tsx index 5f7a1b07e1..b4cc2a5014 100644 --- a/app/layout/scenarios/edit/status/actions/done.tsx +++ b/app/layout/scenarios/edit/status/actions/done.tsx @@ -91,7 +91,6 @@ export const useScenarioActionsDone = () => { ] ); - // Protected Areas const onUploadedProtectedAreaDone = useCallback( (JOB_REF) => { scenarioMutation.mutate( @@ -173,7 +172,17 @@ export const useScenarioActionsDone = () => { } ); }, - [sid, scenarioMutation, scenarioData?.metadata, dispatch, setJob, setCache, addToast, setSubTab] + [ + sid, + scenarioMutation, + scenarioData?.metadata, + dispatch, + setJob, + setCache, + addToast, + setSubTab, + queryClient, + ] ); // Cost surface diff --git a/app/layout/scenarios/edit/status/actions/failure.tsx b/app/layout/scenarios/edit/status/actions/failure.tsx index 5b87d2af4b..d6642e022e 100644 --- a/app/layout/scenarios/edit/status/actions/failure.tsx +++ b/app/layout/scenarios/edit/status/actions/failure.tsx @@ -61,7 +61,6 @@ export const useScenarioActionsFailure = () => { ); }, [sid, scenarioMutation, scenarioData?.metadata, dispatch, setJob, addToast]); - // Protected Areas const onUploadedProtectedAreaFailure = useCallback(() => { scenarioMutation.mutate( { diff --git a/app/layout/scenarios/edit/status/constants.ts b/app/layout/scenarios/edit/status/constants.ts index 4b2e62a177..8a1728ceae 100644 --- a/app/layout/scenarios/edit/status/constants.ts +++ b/app/layout/scenarios/edit/status/constants.ts @@ -1,5 +1,5 @@ export const TEXTS_RUNNING = { - planningAreaProtectedCalculation: () => 'Calculating the protected areas percentages...', + planningAreaProtectedCalculation: () => 'Calculating the conservation areas percentages...', features: () => 'Processing the features...', planningUnitsInclusion: () => 'Processing inclusion/exclusion of planning units...', costSurface: () => 'Processing cost surface...', @@ -10,7 +10,7 @@ export const TEXTS_RUNNING = { }; export const TEXTS_FAILURE = { - planningAreaProtectedCalculation: () => 'Fail Calculating the protected areas percentages', + planningAreaProtectedCalculation: () => 'Fail Calculating the conservation areas percentages', features: () => 'Fail Processing the features', planningUnitsInclusion: () => 'Fail Processing inclusion/exclusion of planning units', costSurface: () => 'Fail Processing cost surface', diff --git a/app/layout/scenarios/new/name/index.tsx b/app/layout/scenarios/new/name/index.tsx index b398e47b01..cd490475a4 100644 --- a/app/layout/scenarios/new/name/index.tsx +++ b/app/layout/scenarios/new/name/index.tsx @@ -70,7 +70,7 @@ export const ScenariosSidebarName = (): JSX.Element => { } ); - push(`/projects/${pid}/scenarios/${data.id}/edit?tab=protected-areas`); + push(`/projects/${pid}/scenarios/${data.id}/edit?tab=conservation-areas`); plausible('New scenario', { props: { userId: `${user.id}`, diff --git a/app/layout/scenarios/reports/solutions/pu-status/index.tsx b/app/layout/scenarios/reports/solutions/pu-status/index.tsx index 08c1a5c85a..4dfac5025d 100644 --- a/app/layout/scenarios/reports/solutions/pu-status/index.tsx +++ b/app/layout/scenarios/reports/solutions/pu-status/index.tsx @@ -5,7 +5,6 @@ import { useRouter } from 'next/router'; import { useScenarioPU } from 'hooks/scenarios'; import PUStatusReportMap from 'layout/scenarios/reports/solutions/pu-status/map'; -import { cn } from 'utils/cn'; export const PUStatusReport = (): JSX.Element => { const { query } = useRouter(); @@ -21,7 +20,7 @@ export const PUStatusReport = (): JSX.Element => {

          Locked in/out areas

          -

          Protected areas

          +

          Conservation areas

          diff --git a/app/layout/scenarios/reports/solutions/resume/index.tsx b/app/layout/scenarios/reports/solutions/resume/index.tsx index 2883c3b52a..6b87469fbc 100644 --- a/app/layout/scenarios/reports/solutions/resume/index.tsx +++ b/app/layout/scenarios/reports/solutions/resume/index.tsx @@ -78,7 +78,7 @@ export const ResumePage = (): JSX.Element => {
          -

          Protected Areas:

          +

          Conservation Areas:

          {protectedAreaQuery.data?.map(({ name }) => name).join(', ')}

          diff --git a/app/pages/projects/[pid]/scenarios/[sid]/edit.tsx b/app/pages/projects/[pid]/scenarios/[sid]/edit.tsx index d180541ae9..f2bdd9879c 100644 --- a/app/pages/projects/[pid]/scenarios/[sid]/edit.tsx +++ b/app/pages/projects/[pid]/scenarios/[sid]/edit.tsx @@ -18,11 +18,11 @@ import { TABS } from 'layout/project/navigation/constants'; import Sidebar from 'layout/project/sidebar'; import AdvancedSettingsBLMCalibration from 'layout/project/sidebar/scenario/advanced-settings/blm-calibration'; import AdvancedSettingsOverview from 'layout/project/sidebar/scenario/advanced-settings/overview'; +import GridSetupProtectedAreas from 'layout/project/sidebar/scenario/grid-setup/conservation-areas'; import GridSetupCostSurface from 'layout/project/sidebar/scenario/grid-setup/cost-surface'; import GridSetupFeatures from 'layout/project/sidebar/scenario/grid-setup/features'; import GridSetupGAPAnalysis from 'layout/project/sidebar/scenario/grid-setup/gap-analysis'; import GridSetupPlanningUnits from 'layout/project/sidebar/scenario/grid-setup/planning-unit-status'; -import GridSetupProtectedAreas from 'layout/project/sidebar/scenario/grid-setup/protected-areas'; import SolutionsOverview from 'layout/project/sidebar/scenario/solutions/overview'; import SolutionsTargetAchievements from 'layout/project/sidebar/scenario/solutions/target-achievement'; import ProjectStatus from 'layout/projects/show/status/component'; @@ -91,7 +91,7 @@ const EditScenarioPage = (): JSX.Element => { {!tab && } {/* // ? grid setup */} - {tab === TABS['scenario-protected-areas'] && } + {tab === TABS['scenario-conservation-areas'] && } {tab === TABS['scenario-cost-surface'] && } {tab === TABS['scenario-planning-unit-status'] && } {[TABS['scenario-features'], TABS['scenario-features-targets-spf']].includes(tab) && ( diff --git a/app/svgs/navigation/protected-areas.svg b/app/svgs/navigation/conservation-areas.svg similarity index 100% rename from app/svgs/navigation/protected-areas.svg rename to app/svgs/navigation/conservation-areas.svg diff --git a/app/svgs/sidebar/protected-area.svg b/app/svgs/sidebar/protected-area.svg deleted file mode 100644 index c4d9901fdd..0000000000 --- a/app/svgs/sidebar/protected-area.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - From b186786407503ce08f943a3989320d78293f1186 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 11:24:34 +0100 Subject: [PATCH 02/15] scenario legend: solution over frequency --- app/layout/scenarios/edit/map/legend/hooks/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/layout/scenarios/edit/map/legend/hooks/index.ts b/app/layout/scenarios/edit/map/legend/hooks/index.ts index 9526639066..2260d9b530 100644 --- a/app/layout/scenarios/edit/map/legend/hooks/index.ts +++ b/app/layout/scenarios/edit/map/legend/hooks/index.ts @@ -529,8 +529,8 @@ export const useScenarioLegend = () => { useLockOutLegend(), useLockAvailableLegend(), useWDPAPreviewLegend(), - useFrequencyLegend(), useSolutionsLegend(), + useFrequencyLegend(), ], subgroups: [ { From b2f9eede1f1423c48506f720933cbe62c40a1b55 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 11:40:53 +0100 Subject: [PATCH 03/15] scenario overview: replaces Planning with Planning Units --- app/layout/solutions/selected/component.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/layout/solutions/selected/component.tsx b/app/layout/solutions/selected/component.tsx index 914f874e06..8196677a12 100644 --- a/app/layout/solutions/selected/component.tsx +++ b/app/layout/solutions/selected/component.tsx @@ -51,7 +51,7 @@ export const SelectedSolution: React.FC = ({ )}
          -
          +

          Score:

          {scoreValue}

          @@ -65,7 +65,7 @@ export const SelectedSolution: React.FC = ({

          {missingValues}

          -

          Planning:

          +

          Planning Units:

          {planningUnits}

          From c4788db1e0ea790767c4ee4e512aee697efd4c44 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 12:44:07 +0100 Subject: [PATCH 04/15] fixes text color --- app/components/button/component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/button/component.tsx b/app/components/button/component.tsx index 3c2bb8ddd0..872479e08d 100644 --- a/app/components/button/component.tsx +++ b/app/components/button/component.tsx @@ -13,7 +13,7 @@ const THEME = { secondary: 'text-white bg-gray-700 hover:bg-gray-600 active:bg-gray-400 border border-gray-700 hover:border-gray-600 active:border-gray-400 active:outline active:outline-offset-2 active:outline-gray-700', 'secondary-alt': - 'text-white bg-transparent hover:bg-transparent active:bg-transparent border border-gray-600 hover:border-gray-400 active:border-gray-300', + 'text-black bg-transparent hover:bg-transparent active:bg-transparent border border-gray-600 hover:border-gray-400 active:border-gray-300', tertiary: 'text-black bg-gray-200 hover:bg-gray-100 hover:border-gray-100 hover:text-white', From 913a7d8a3f173f5d21599d5725bdb9182977d5f5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 13:10:51 +0100 Subject: [PATCH 05/15] makes scrollbar color more prominent --- app/components/map/component.tsx | 2 +- app/components/scroll-area/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/map/component.tsx b/app/components/map/component.tsx index 3a04c087b5..9a31a0ef8d 100644 --- a/app/components/map/component.tsx +++ b/app/components/map/component.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useState, useRef, useCallback } from 'react'; -import ReactMapGL, { FlyToInterpolator, TRANSITION_EVENTS, ViewportProps } from 'react-map-gl'; +import ReactMapGL, { FlyToInterpolator, TRANSITION_EVENTS } from 'react-map-gl'; import { fitBounds } from '@math.gl/web-mercator'; import { easeCubic } from 'd3-ease'; diff --git a/app/components/scroll-area/index.tsx b/app/components/scroll-area/index.tsx index 308711d4bd..b0ca7d8286 100644 --- a/app/components/scroll-area/index.tsx +++ b/app/components/scroll-area/index.tsx @@ -37,7 +37,7 @@ const ScrollBar = React.forwardRef< )} {...props} > - + )); ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName; From ac69bfb59d29388ef6ba0e1685f689e31540a8d0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Fri, 26 Jan 2024 10:13:15 +0100 Subject: [PATCH 06/15] adds map scale --- app/components/map/scale/index.tsx | 17 +++++++++++++++++ .../project/reports/comparison/map/index.tsx | 15 ++++++++++----- app/layout/projects/new/map/component.tsx | 14 +++++++++----- app/layout/projects/show/map/index.tsx | 18 ++++++++++++------ app/layout/scenarios/edit/map/component.tsx | 3 ++- app/layout/scenarios/new/map/component.tsx | 2 ++ .../scenarios/reports/blm/map/component.tsx | 10 +++++++--- .../reports/frequency/map/component.tsx | 10 +++++++--- .../solutions/best-solution/map/index.tsx | 10 +++++++--- .../solutions/cost-surface/map/index.tsx | 10 +++++++--- .../different-solutions/map/index.tsx | 10 +++++++--- .../reports/solutions/frequency/map/index.tsx | 10 +++++++--- .../reports/solutions/grid/map/index.tsx | 10 +++++++--- .../reports/solutions/pu-status/map/index.tsx | 10 +++++++--- .../selected-solution-page/map/index.tsx | 10 +++++++--- app/styles/globals.css | 11 +++-------- 16 files changed, 118 insertions(+), 52 deletions(-) create mode 100644 app/components/map/scale/index.tsx diff --git a/app/components/map/scale/index.tsx b/app/components/map/scale/index.tsx new file mode 100644 index 0000000000..d003eecf48 --- /dev/null +++ b/app/components/map/scale/index.tsx @@ -0,0 +1,17 @@ +import { ComponentProps } from 'react'; + +import { ScaleControl } from 'react-map-gl'; + +import { cn } from 'utils/cn'; + +const MapScale = ({ className, ...props }: ComponentProps): JSX.Element => ( + +); + +export default MapScale; diff --git a/app/layout/project/reports/comparison/map/index.tsx b/app/layout/project/reports/comparison/map/index.tsx index be2e23a049..8b6660b488 100644 --- a/app/layout/project/reports/comparison/map/index.tsx +++ b/app/layout/project/reports/comparison/map/index.tsx @@ -14,6 +14,7 @@ import { useProject } from 'hooks/projects'; import { useScenarios } from 'hooks/scenarios'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ScreenshotComparisionMap = ({ id }: { id: string }): JSX.Element => { const [cache] = useState(Date.now()); @@ -145,11 +146,15 @@ export const ScreenshotComparisionMap = ({ id }: { id: string }): JSX.Element => > {(map) => { return ( - - {LAYERS.map((l) => ( - - ))} - + <> + + {LAYERS.map((l) => ( + + ))} + + + + ); }} diff --git a/app/layout/projects/new/map/component.tsx b/app/layout/projects/new/map/component.tsx index a8d355a152..400081b53e 100644 --- a/app/layout/projects/new/map/component.tsx +++ b/app/layout/projects/new/map/component.tsx @@ -21,6 +21,7 @@ import Controls from 'components/map/controls'; import FitBoundsControl from 'components/map/controls/fit-bounds'; import LoadingControl from 'components/map/controls/loading'; import ZoomControl from 'components/map/controls/zoom'; +import MapScale from 'components/map/scale'; import type { NewProjectFields } from 'layout/projects/new/form'; import { MapProps } from 'types/map'; import { centerMap } from 'utils/map'; @@ -167,11 +168,14 @@ export const ProjectNewMap = ({ > {(map) => { return ( - - {LAYERS.map((l) => ( - - ))} - + <> + + {LAYERS.map((l) => ( + + ))} + + + ); }} diff --git a/app/layout/projects/show/map/index.tsx b/app/layout/projects/show/map/index.tsx index 722873101e..b10cc610d9 100644 --- a/app/layout/projects/show/map/index.tsx +++ b/app/layout/projects/show/map/index.tsx @@ -1,6 +1,6 @@ import { ComponentProps, useCallback, useEffect, useMemo, useState, useRef } from 'react'; -import { useQueryClient } from 'react-query'; +import { ScaleControl } from 'react-map-gl'; import { useRouter } from 'next/router'; @@ -50,6 +50,7 @@ import LegendTypeBasic from 'components/map/legend/types/basic'; import LegendTypeChoropleth from 'components/map/legend/types/choropleth'; import LegendTypeGradient from 'components/map/legend/types/gradient'; import LegendTypeMatrix from 'components/map/legend/types/matrix'; +import MapScale from 'components/map/scale'; import HelpBeacon from 'layout/help/beacon'; import { Scenario } from 'types/api/scenario'; import { MapProps } from 'types/map'; @@ -525,11 +526,14 @@ export const ProjectMap = (): JSX.Element => { > {(map) => { return ( - - {LAYERS.map((l) => ( - - ))} - + <> + + {LAYERS.map((l) => ( + + ))} + + + ); }} @@ -639,6 +643,8 @@ export const ProjectMap = (): JSX.Element => {
          + + {!!SCENARIOS_RUNNED.sid1Options.length && !tab && (
          { const { isSidebarOpen } = useAppSelector((state) => state['/projects/[id]']); const accessToken = useAccessToken(); - // const queryClient = useQueryClient(); const { query } = useRouter(); @@ -581,6 +581,7 @@ export const ScenariosEditMap = (): JSX.Element => { {/* Drawing editor */} + ); }} diff --git a/app/layout/scenarios/new/map/component.tsx b/app/layout/scenarios/new/map/component.tsx index 75cb61b01c..a1c09d74b0 100644 --- a/app/layout/scenarios/new/map/component.tsx +++ b/app/layout/scenarios/new/map/component.tsx @@ -23,6 +23,7 @@ import LegendTypeBasic from 'components/map/legend/types/basic'; import LegendTypeChoropleth from 'components/map/legend/types/choropleth'; import LegendTypeGradient from 'components/map/legend/types/gradient'; import LegendTypeMatrix from 'components/map/legend/types/matrix'; +import MapScale from 'components/map/scale'; import ScenariosDrawingManager from 'layout/scenarios/edit/map/drawing-manager'; import { MapProps } from 'types/map'; import { centerMap } from 'utils/map'; @@ -150,6 +151,7 @@ export const ScenarioNewMap = (): JSX.Element => { {/* Drawing editor */} + ); }} diff --git a/app/layout/scenarios/reports/blm/map/component.tsx b/app/layout/scenarios/reports/blm/map/component.tsx index aeade2f7a9..4a3cba20d0 100644 --- a/app/layout/scenarios/reports/blm/map/component.tsx +++ b/app/layout/scenarios/reports/blm/map/component.tsx @@ -14,6 +14,7 @@ import { useBBOX, useScenarioBlmLayer } from 'hooks/map'; import { useProject } from 'hooks/projects'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export interface ScreenshotBLMMapProps { id: string; @@ -117,9 +118,12 @@ export const ScreenshotBLMMap: React.FC = ({ > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/frequency/map/component.tsx b/app/layout/scenarios/reports/frequency/map/component.tsx index 34cab167df..55ed681b31 100644 --- a/app/layout/scenarios/reports/frequency/map/component.tsx +++ b/app/layout/scenarios/reports/frequency/map/component.tsx @@ -14,6 +14,7 @@ import { useBBOX, usePUGridLayer } from 'hooks/map'; import { useProject } from 'hooks/projects'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export interface ScreenshotBLMMapProps { id: string; @@ -118,9 +119,12 @@ export const ScreenshotBLMMap: React.FC = ({ > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx b/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx index 8b6913317e..f9da308ebf 100644 --- a/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx @@ -14,6 +14,7 @@ import { useProject } from 'hooks/projects'; import { useBestSolution } from 'hooks/solutions'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ReportMap = ({ id }: { id: string }): JSX.Element => { const accessToken = useAccessToken(); @@ -111,9 +112,12 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx b/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx index c5fb0e5b50..f4bd5d1253 100644 --- a/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx @@ -14,6 +14,7 @@ import { useBBOX, useCostSurfaceLayer } from 'hooks/map'; import { useProject } from 'hooks/projects'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; const minZoom = 2; const maxZoom = 20; @@ -119,9 +120,12 @@ export const CostSurfaceReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx b/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx index d5bbf3137c..10ade6e053 100644 --- a/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx @@ -13,6 +13,7 @@ import { useBBOX, usePUGridLayer } from 'hooks/map'; import { useProject } from 'hooks/projects'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ReportMap = ({ id, runId }: { id: string; runId: number }): JSX.Element => { const accessToken = useAccessToken(); @@ -108,9 +109,12 @@ export const ReportMap = ({ id, runId }: { id: string; runId: number }): JSX.Ele > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/frequency/map/index.tsx b/app/layout/scenarios/reports/solutions/frequency/map/index.tsx index dd3cbb86f0..5891bd026a 100644 --- a/app/layout/scenarios/reports/solutions/frequency/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/frequency/map/index.tsx @@ -14,6 +14,7 @@ import { useProject } from 'hooks/projects'; import { useScenario } from 'hooks/scenarios'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ReportMap = ({ id }: { id: string }): JSX.Element => { const [cache] = useState(Date.now()); @@ -112,9 +113,12 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/grid/map/index.tsx b/app/layout/scenarios/reports/solutions/grid/map/index.tsx index 8a465484e8..a7b3ab3856 100644 --- a/app/layout/scenarios/reports/solutions/grid/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/grid/map/index.tsx @@ -13,6 +13,7 @@ import { useBBOX, usePUGridLayer } from 'hooks/map'; import { useProject } from 'hooks/projects'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ReportMap = ({ id }: { id: string }): JSX.Element => { const accessToken = useAccessToken(); @@ -108,9 +109,12 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx b/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx index 705d3f0bc7..78a02529a1 100644 --- a/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx @@ -15,6 +15,7 @@ import { useScenario, useScenarioPU } from 'hooks/scenarios'; import { useWDPACategories } from 'hooks/wdpa'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ReportMap = ({ id }: { id: string }): JSX.Element => { const accessToken = useAccessToken(); @@ -128,9 +129,12 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/layout/scenarios/reports/solutions/selected-solution-page/map/index.tsx b/app/layout/scenarios/reports/solutions/selected-solution-page/map/index.tsx index 3824c64f2d..1412b4b217 100644 --- a/app/layout/scenarios/reports/solutions/selected-solution-page/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/selected-solution-page/map/index.tsx @@ -16,6 +16,7 @@ import { useScenario } from 'hooks/scenarios'; import { useBestSolution, useSolution } from 'hooks/solutions'; import Map from 'components/map'; +import MapScale from 'components/map/scale'; export const ScenariosReportMap = ({ id }: { id: string }): JSX.Element => { const accessToken = useAccessToken(); @@ -124,9 +125,12 @@ export const ScenariosReportMap = ({ id }: { id: string }): JSX.Element => { > {(map) => { return ( - - - + <> + + + + + ); }} diff --git a/app/styles/globals.css b/app/styles/globals.css index 9db17ecdcf..04b005b01a 100644 --- a/app/styles/globals.css +++ b/app/styles/globals.css @@ -596,13 +596,8 @@ a.mapboxgl-ctrl-logo.mapboxgl-compact { display: none; } .mapboxgl-ctrl-scale { - background-color: hsla(0, 0%, 100%, 0.75); - font-size: 10px; - border: 2px solid #333; - border-top: #333; - padding: 0 5px; - color: #333; - box-sizing: border-box; + background-color: hsla(0, 0%, 100%, 0.50); + @apply text-xs text-center text-gray-900 uppercase !w-20; } .mapboxgl-popup { position: absolute; @@ -812,4 +807,4 @@ a.mapboxgl-ctrl-logo.mapboxgl-compact { .modal-checkbox-list { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ -} \ No newline at end of file +} From 15fbf5e90f5e2873b0ea78dac521ffeecf5a7665 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Mon, 29 Jan 2024 16:17:37 +0100 Subject: [PATCH 07/15] report feedback --- app/components/button/component.tsx | 2 +- .../target-achievement/toolbar/component.tsx | 2 +- .../projects/show/map/legend/hooks/index.ts | 4 - .../solutions/advanced-settings/constants.ts | 4 + .../solutions/best-solution/map/index.tsx | 2 +- .../reports/solutions/cost-surface/index.tsx | 5 +- .../solutions/cost-surface/map/index.tsx | 2 +- .../different-solutions/first/index.tsx | 82 +++---- .../different-solutions/map/index.tsx | 2 +- .../reports/solutions/frequency/map/index.tsx | 2 +- .../reports/solutions/gap-analysis/index.tsx | 12 +- .../reports/solutions/grid/map/index.tsx | 2 +- .../reports/solutions/header/index.tsx | 2 +- .../reports/solutions/pu-status/index.tsx | 2 +- .../reports/solutions/pu-status/map/index.tsx | 2 +- app/package.json | 4 +- app/pages/reports/[pid]/[sid]/solutions.tsx | 18 +- app/yarn.lock | 216 +++++++++--------- 18 files changed, 179 insertions(+), 186 deletions(-) diff --git a/app/components/button/component.tsx b/app/components/button/component.tsx index 872479e08d..3c2bb8ddd0 100644 --- a/app/components/button/component.tsx +++ b/app/components/button/component.tsx @@ -13,7 +13,7 @@ const THEME = { secondary: 'text-white bg-gray-700 hover:bg-gray-600 active:bg-gray-400 border border-gray-700 hover:border-gray-600 active:border-gray-400 active:outline active:outline-offset-2 active:outline-gray-700', 'secondary-alt': - 'text-black bg-transparent hover:bg-transparent active:bg-transparent border border-gray-600 hover:border-gray-400 active:border-gray-300', + 'text-white bg-transparent hover:bg-transparent active:bg-transparent border border-gray-600 hover:border-gray-400 active:border-gray-300', tertiary: 'text-black bg-gray-200 hover:bg-gray-100 hover:border-gray-100 hover:text-white', diff --git a/app/layout/project/sidebar/scenario/solutions/target-achievement/toolbar/component.tsx b/app/layout/project/sidebar/scenario/solutions/target-achievement/toolbar/component.tsx index 9c3eaf3b76..d6b4623774 100644 --- a/app/layout/project/sidebar/scenario/solutions/target-achievement/toolbar/component.tsx +++ b/app/layout/project/sidebar/scenario/solutions/target-achievement/toolbar/component.tsx @@ -30,7 +30,7 @@ export const ScenarioGapAnalysis: React.FC theme="dark" size="sm" defaultValue={search} - placeholder="Search by feature name..." + placeholder="Search target" aria-label="Search" onChange={onChangeDebounced} /> diff --git a/app/layout/projects/show/map/legend/hooks/index.ts b/app/layout/projects/show/map/legend/hooks/index.ts index 3363d1f388..734f837cff 100644 --- a/app/layout/projects/show/map/legend/hooks/index.ts +++ b/app/layout/projects/show/map/legend/hooks/index.ts @@ -1,5 +1,3 @@ -import { useQueryClient } from 'react-query'; - import { useRouter } from 'next/router'; import { useAppDispatch, useAppSelector } from 'store/hooks'; @@ -124,8 +122,6 @@ export const useFeaturesLegend = () => { const { query } = useRouter(); const { pid, sid } = query as { pid: string; sid: string }; - // const queryClient = useQueryClient(); - const featureColors = useColorFeatures(pid, sid); const dispatch = useAppDispatch(); diff --git a/app/layout/scenarios/reports/solutions/advanced-settings/constants.ts b/app/layout/scenarios/reports/solutions/advanced-settings/constants.ts index 0f724d9719..4b0052976c 100644 --- a/app/layout/scenarios/reports/solutions/advanced-settings/constants.ts +++ b/app/layout/scenarios/reports/solutions/advanced-settings/constants.ts @@ -80,4 +80,8 @@ export const SCENARIO_PARAMETERS = [ description: 'Clumping rule', value: 'CLUMPTYPE', }, + { + description: 'BLM', + value: 'BLM', + }, ]; diff --git a/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx b/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx index f9da308ebf..826855d0b9 100644 --- a/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/best-solution/map/index.tsx @@ -116,7 +116,7 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { - + ); }} diff --git a/app/layout/scenarios/reports/solutions/cost-surface/index.tsx b/app/layout/scenarios/reports/solutions/cost-surface/index.tsx index 6bf0302159..47232c9965 100644 --- a/app/layout/scenarios/reports/solutions/cost-surface/index.tsx +++ b/app/layout/scenarios/reports/solutions/cost-surface/index.tsx @@ -17,14 +17,13 @@ export const CostSurfaceReport = (): JSX.Element => { pid, {}, { - select: (data) => - data.filter((cs) => cs.scenarios.filter((s) => s.id === sid).length > 0)?.[0], + select: (data) => data.filter((cs) => cs.scenarios.find((s) => s.id === sid))?.[0], } ); const LEGEND = useMemo(() => { return { - name: 'Cost layer', + name: costSurfaceQuery.data?.name, settingsManager: null, items: [ { diff --git a/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx b/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx index f4bd5d1253..a4f8913cf3 100644 --- a/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/cost-surface/map/index.tsx @@ -124,7 +124,7 @@ export const CostSurfaceReportMap = ({ id }: { id: string }): JSX.Element => { - + ); }} diff --git a/app/layout/scenarios/reports/solutions/different-solutions/first/index.tsx b/app/layout/scenarios/reports/solutions/different-solutions/first/index.tsx index c1807b588f..30df84b18a 100644 --- a/app/layout/scenarios/reports/solutions/different-solutions/first/index.tsx +++ b/app/layout/scenarios/reports/solutions/different-solutions/first/index.tsx @@ -2,69 +2,59 @@ import React from 'react'; import { useRouter } from 'next/router'; -import { useBestSolution, useMostDifferentSolutions } from 'hooks/solutions'; +import { useBestSolution } from 'hooks/solutions'; import Icon from 'components/icon/component'; import DifferentSolutionReportMap from 'layout/scenarios/reports/solutions/different-solutions/map'; -import { cn } from 'utils/cn'; import STAR_SVG from 'svgs/ui/star.svg?sprite'; +const SOLUTION_INFO_BOX_CLASSES = 'border-l-[3px] border-primary-500 pl-2'; + export const DifferentSolutionsPage = (): JSX.Element => { const { query } = useRouter(); const { sid } = query as { sid: string }; - const mostDifSolutionsQuery = useMostDifferentSolutions(sid); - const bestSolutionQuery = useBestSolution(sid, {}); - const SOLUTION_INFO_BOX_CLASSES = 'border-l-[3px] border-primary-500 pl-2'; - return (
          -

          Five most different solutions

          +

          Best Solution

          - {mostDifSolutionsQuery.data?.slice(0, 2).map((solution) => { - return ( -
          - -
          -
          -

          Run {solution.runId}

          -
          -

          Best solution

          - -
          -
          -
          -

          - Score: {solution.score} -

          -
          -
          -

          - Missing: {solution.missingValues} -

          -
          -
          -

          - Cost: {solution.cost} -

          -
          -
          -

          - PlanningUnits: {solution.cost} -

          -
          +
          + +
          +
          +

          Run {bestSolutionQuery.data?.runId}

          +
          +

          Best solution

          +
          - ); - })} +
          +

          + Score: {bestSolutionQuery.data?.scoreValue} +

          +
          +
          +

          + Missing:{' '} + {bestSolutionQuery.data?.missingValues} +

          +
          +
          +

          + Cost: {bestSolutionQuery.data?.costValue} +

          +
          +
          +

          + PlanningUnits:{' '} + {bestSolutionQuery.data?.costValue} +

          +
          +
          +
          ); diff --git a/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx b/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx index 10ade6e053..da81f10a4f 100644 --- a/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/different-solutions/map/index.tsx @@ -113,7 +113,7 @@ export const ReportMap = ({ id, runId }: { id: string; runId: number }): JSX.Ele - + ); }} diff --git a/app/layout/scenarios/reports/solutions/frequency/map/index.tsx b/app/layout/scenarios/reports/solutions/frequency/map/index.tsx index 5891bd026a..8d02da6283 100644 --- a/app/layout/scenarios/reports/solutions/frequency/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/frequency/map/index.tsx @@ -117,7 +117,7 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { - + ); }} diff --git a/app/layout/scenarios/reports/solutions/gap-analysis/index.tsx b/app/layout/scenarios/reports/solutions/gap-analysis/index.tsx index 24c9444d54..53dc6bf7ac 100644 --- a/app/layout/scenarios/reports/solutions/gap-analysis/index.tsx +++ b/app/layout/scenarios/reports/solutions/gap-analysis/index.tsx @@ -32,12 +32,16 @@ export const GapAnalysisPage = (): JSX.Element => { {feature.name} - {(feature.current.percent * 100).toFixed(0)}% ({feature.current.value} - {feature.current.unit}) + {(feature.current.percent * 100).toFixed(0)}% + {feature.current.value && ( + {`${feature.current.value} ${feature.current.unit}`} + )} - {(feature.target.percent * 100).toFixed(0)}% ({feature.target.value} - {feature.target.unit}) + {(feature.target.percent * 100).toFixed(0)}% + {feature.current.value && ( + {`${feature.current.value} ${feature.current.unit}`} + )}
          { - + ); }} diff --git a/app/layout/scenarios/reports/solutions/header/index.tsx b/app/layout/scenarios/reports/solutions/header/index.tsx index fbfb9955e8..1b6d330c1e 100644 --- a/app/layout/scenarios/reports/solutions/header/index.tsx +++ b/app/layout/scenarios/reports/solutions/header/index.tsx @@ -44,7 +44,7 @@ export const ReportHeader = (): JSX.Element => {

          Marxan platform version:

          -

          V.0.0.1

          +

          V.2.0.35

          diff --git a/app/layout/scenarios/reports/solutions/pu-status/index.tsx b/app/layout/scenarios/reports/solutions/pu-status/index.tsx index 4dfac5025d..c1c15642e8 100644 --- a/app/layout/scenarios/reports/solutions/pu-status/index.tsx +++ b/app/layout/scenarios/reports/solutions/pu-status/index.tsx @@ -19,7 +19,7 @@ export const PUStatusReport = (): JSX.Element => {

          Locked in/out areas

          -
          +

          Conservation areas

          diff --git a/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx b/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx index 78a02529a1..3accbffc74 100644 --- a/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx +++ b/app/layout/scenarios/reports/solutions/pu-status/map/index.tsx @@ -133,7 +133,7 @@ export const ReportMap = ({ id }: { id: string }): JSX.Element => { - + ); }} diff --git a/app/package.json b/app/package.json index 32822edc6e..19073ea2cc 100644 --- a/app/package.json +++ b/app/package.json @@ -1,6 +1,6 @@ { - "name": "app", - "version": "0.4.0", + "name": "marxan-app", + "version": "2.0.35", "private": true, "scripts": { "dev": "next dev", diff --git a/app/pages/reports/[pid]/[sid]/solutions.tsx b/app/pages/reports/[pid]/[sid]/solutions.tsx index b1b4f6b103..3860e87b2c 100644 --- a/app/pages/reports/[pid]/[sid]/solutions.tsx +++ b/app/pages/reports/[pid]/[sid]/solutions.tsx @@ -8,7 +8,7 @@ import AdvancedSettingsPage from 'layout/scenarios/reports/solutions/advanced-se import BestSolutionPage from 'layout/scenarios/reports/solutions/best-solution'; import CostSurfaceReport from 'layout/scenarios/reports/solutions/cost-surface'; import DifferentSolutionsFirstPage from 'layout/scenarios/reports/solutions/different-solutions/first'; -import DifferentSolutionsSecondPage from 'layout/scenarios/reports/solutions/different-solutions/second'; +// import DifferentSolutionsSecondPage from 'layout/scenarios/reports/solutions/different-solutions/second'; import FeaturesPage from 'layout/scenarios/reports/solutions/features'; import FrequencyPage from 'layout/scenarios/reports/solutions/frequency'; import GapAnalysisPage from 'layout/scenarios/reports/solutions/gap-analysis'; @@ -53,20 +53,20 @@ const MainReport: React.FC = () => { {/* PAGE 5 */}
          - +
          + + +
          {/* PAGE 6 */}
          - +
          {/* PAGE 7 */}
          -
          - - -
          +
          {/* PAGE 8 */}
          @@ -79,10 +79,10 @@ const MainReport: React.FC = () => {
          {/* PAGE 10 */} -
          + {/*
          -
          +
          */} {/* PAGE 11 */}
          diff --git a/app/yarn.lock b/app/yarn.lock index 54c906907c..d9a6ddc999 100644 --- a/app/yarn.lock +++ b/app/yarn.lock @@ -4070,114 +4070,6 @@ __metadata: languageName: node linkType: hard -"app@workspace:.": - version: 0.0.0-use.local - resolution: "app@workspace:." - dependencies: - "@artsy/fresnel": 6.1.0 - "@dnd-kit/core": 6.0.8 - "@dnd-kit/modifiers": 6.0.1 - "@dnd-kit/sortable": 7.0.2 - "@dnd-kit/utilities": 3.2.1 - "@egjs/react-flicking": ^4.2.2 - "@math.gl/web-mercator": ^3.3.2 - "@playwright/test": 1.36.2 - "@popperjs/core": ^2.6.0 - "@radix-ui/react-collapsible": 1.0.3 - "@radix-ui/react-popover": 1.0.6 - "@radix-ui/react-scroll-area": 1.0.4 - "@radix-ui/react-switch": 1.0.3 - "@react-aria/button": ^3.3.0 - "@react-aria/dialog": ^3.1.2 - "@react-aria/focus": ^3.2.3 - "@react-aria/i18n": ^3.2.0 - "@react-aria/interactions": ^3.3.2 - "@react-aria/overlays": ^3.6.1 - "@react-aria/searchfield": ^3.1.1 - "@react-aria/slider": ^3.0.0 - "@react-aria/utils": ^3.5.0 - "@react-aria/visually-hidden": ^3.2.1 - "@react-stately/searchfield": ^3.1.1 - "@react-stately/slider": ^3.0.0 - "@reduxjs/toolkit": 1.9.5 - "@tailwindcss/forms": 0.5.3 - "@tanem/react-nprogress": ^4.0.8 - "@tippyjs/react": 4.2.6 - "@turf/area": 6.5.0 - "@types/chroma-js": 2.4.1 - "@types/d3": ^6.3.0 - "@types/lodash": 4.14.192 - "@types/mapbox-gl": 2.7.15 - "@types/node": 18.15.11 - "@types/react": 18.0.32 - "@types/react-map-gl": 6.1.3 - "@typescript-eslint/eslint-plugin": 5.58.0 - "@typescript-eslint/parser": 5.57.0 - "@vizzuality/layer-manager-plugin-mapboxgl": 2.0.3 - "@vizzuality/layer-manager-provider-carto": 2.0.3 - "@vizzuality/layer-manager-react": 2.0.3 - autoprefixer: ^10.0.2 - axios: 1.6.0 - chroma-js: ^2.4.2 - clsx: 1.2.1 - cookie: ^0.4.1 - d3: ^6.5.0 - d3-ease: ^2.0.0 - date-fns: ^2.19.0 - deck.gl: 7.3.6 - downshift: ^6.0.15 - eslint: 8.38.0 - eslint-config-next: 13.3.0 - eslint-config-prettier: 8.8.0 - eslint-plugin-prettier: 4.2.1 - fast-password-entropy: ^1.1.1 - final-form: 4.20.9 - framer-motion: 6.3.15 - fuse.js: ^6.4.6 - husky: ^4.3.0 - jsona: ^1.9.2 - jsonwebtoken: ^9.0.0 - lint-staged: ^10.5.2 - lodash: ^4.17.20 - luma.gl: 7.3.2 - next: 13.5.1 - next-auth: 4.24.5 - next-compose-plugins: ^2.2.1 - next-optimized-images: ^2.6.2 - next-plausible: ^2.0.0 - popmotion: 9.3.1 - postcss: 8.4.31 - prettier: 2.8.7 - prettier-plugin-tailwindcss: 0.2.7 - react: 18.2.0 - react-aria: ^3.3.0 - react-cookie: 4.1.1 - react-dom: 18.2.0 - react-dropzone: ^11.3.1 - react-final-form: 6.5.9 - react-icons: 4.11.0 - react-intersection-observer: ^8.31.1 - react-map-gl: ^6.1.13 - react-map-gl-draw: 0.21.1 - react-modal: ^3.12.1 - react-paginate: ^8.1.2 - react-popper: ^2.2.4 - react-query: 3.39.3 - react-redux: 8.1.2 - react-resize-detector: ^6.7.3 - react-table: ^7.7.0 - rooks: 7.14.1 - svg-sprite-loader: 6.0.11 - svgo: 3.0.2 - svgo-loader: 4.0.0 - tailwind-merge: 1.13.2 - tailwindcss: 3.3.1 - typescript: 5.0.3 - use-debounce: ^6.0.1 - validate.js: ^0.13.1 - languageName: unknown - linkType: soft - "aproba@npm:^1.0.3 || ^2.0.0": version: 2.0.0 resolution: "aproba@npm:2.0.0" @@ -8653,6 +8545,114 @@ __metadata: languageName: node linkType: hard +"marxan-app@workspace:.": + version: 0.0.0-use.local + resolution: "marxan-app@workspace:." + dependencies: + "@artsy/fresnel": 6.1.0 + "@dnd-kit/core": 6.0.8 + "@dnd-kit/modifiers": 6.0.1 + "@dnd-kit/sortable": 7.0.2 + "@dnd-kit/utilities": 3.2.1 + "@egjs/react-flicking": ^4.2.2 + "@math.gl/web-mercator": ^3.3.2 + "@playwright/test": 1.36.2 + "@popperjs/core": ^2.6.0 + "@radix-ui/react-collapsible": 1.0.3 + "@radix-ui/react-popover": 1.0.6 + "@radix-ui/react-scroll-area": 1.0.4 + "@radix-ui/react-switch": 1.0.3 + "@react-aria/button": ^3.3.0 + "@react-aria/dialog": ^3.1.2 + "@react-aria/focus": ^3.2.3 + "@react-aria/i18n": ^3.2.0 + "@react-aria/interactions": ^3.3.2 + "@react-aria/overlays": ^3.6.1 + "@react-aria/searchfield": ^3.1.1 + "@react-aria/slider": ^3.0.0 + "@react-aria/utils": ^3.5.0 + "@react-aria/visually-hidden": ^3.2.1 + "@react-stately/searchfield": ^3.1.1 + "@react-stately/slider": ^3.0.0 + "@reduxjs/toolkit": 1.9.5 + "@tailwindcss/forms": 0.5.3 + "@tanem/react-nprogress": ^4.0.8 + "@tippyjs/react": 4.2.6 + "@turf/area": 6.5.0 + "@types/chroma-js": 2.4.1 + "@types/d3": ^6.3.0 + "@types/lodash": 4.14.192 + "@types/mapbox-gl": 2.7.15 + "@types/node": 18.15.11 + "@types/react": 18.0.32 + "@types/react-map-gl": 6.1.3 + "@typescript-eslint/eslint-plugin": 5.58.0 + "@typescript-eslint/parser": 5.57.0 + "@vizzuality/layer-manager-plugin-mapboxgl": 2.0.3 + "@vizzuality/layer-manager-provider-carto": 2.0.3 + "@vizzuality/layer-manager-react": 2.0.3 + autoprefixer: ^10.0.2 + axios: 1.6.0 + chroma-js: ^2.4.2 + clsx: 1.2.1 + cookie: ^0.4.1 + d3: ^6.5.0 + d3-ease: ^2.0.0 + date-fns: ^2.19.0 + deck.gl: 7.3.6 + downshift: ^6.0.15 + eslint: 8.38.0 + eslint-config-next: 13.3.0 + eslint-config-prettier: 8.8.0 + eslint-plugin-prettier: 4.2.1 + fast-password-entropy: ^1.1.1 + final-form: 4.20.9 + framer-motion: 6.3.15 + fuse.js: ^6.4.6 + husky: ^4.3.0 + jsona: ^1.9.2 + jsonwebtoken: ^9.0.0 + lint-staged: ^10.5.2 + lodash: ^4.17.20 + luma.gl: 7.3.2 + next: 13.5.1 + next-auth: 4.24.5 + next-compose-plugins: ^2.2.1 + next-optimized-images: ^2.6.2 + next-plausible: ^2.0.0 + popmotion: 9.3.1 + postcss: 8.4.31 + prettier: 2.8.7 + prettier-plugin-tailwindcss: 0.2.7 + react: 18.2.0 + react-aria: ^3.3.0 + react-cookie: 4.1.1 + react-dom: 18.2.0 + react-dropzone: ^11.3.1 + react-final-form: 6.5.9 + react-icons: 4.11.0 + react-intersection-observer: ^8.31.1 + react-map-gl: ^6.1.13 + react-map-gl-draw: 0.21.1 + react-modal: ^3.12.1 + react-paginate: ^8.1.2 + react-popper: ^2.2.4 + react-query: 3.39.3 + react-redux: 8.1.2 + react-resize-detector: ^6.7.3 + react-table: ^7.7.0 + rooks: 7.14.1 + svg-sprite-loader: 6.0.11 + svgo: 3.0.2 + svgo-loader: 4.0.0 + tailwind-merge: 1.13.2 + tailwindcss: 3.3.1 + typescript: 5.0.3 + use-debounce: ^6.0.1 + validate.js: ^0.13.1 + languageName: unknown + linkType: soft + "match-sorter@npm:^6.0.2": version: 6.2.0 resolution: "match-sorter@npm:6.2.0" From 2dda346fc4bb90a540946c2c21ecf45dc4a65964 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Tue, 30 Jan 2024 11:43:30 +0100 Subject: [PATCH 08/15] adds admin panel link to user menu --- .../project/navigation/user-menu/index.tsx | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/app/layout/project/navigation/user-menu/index.tsx b/app/layout/project/navigation/user-menu/index.tsx index 5c38ff5ede..61c7bf1245 100644 --- a/app/layout/project/navigation/user-menu/index.tsx +++ b/app/layout/project/navigation/user-menu/index.tsx @@ -18,6 +18,7 @@ import { Switch } from 'components/forms/switch'; import Icon from 'components/icon'; import { cn } from 'utils/cn'; +import USERS_SVG from 'svgs/admin/users.svg?sprite'; import COMMUNITY_SVG from 'svgs/navigation/community.svg?sprite'; import DOCUMENTATION_SVG from 'svgs/navigation/documentation.svg?sprite'; import HELP_GUIDE_SVG from 'svgs/navigation/help-guide.svg?sprite'; @@ -128,6 +129,29 @@ export const UserMenu = (): JSX.Element => {
          • + {user.isAdmin && ( +
        • + +
          + +
          +
          +

          + Admin panel +

          + + Manage users and published projects. + +
          + +
          • + )}
        • From 5e659cd0cedbf18627ae31fcb1403018d528b5c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Tue, 30 Jan 2024 11:43:30 +0100 Subject: [PATCH 09/15] adds admin panel link to user menu --- .../project/navigation/user-menu/index.tsx | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/app/layout/project/navigation/user-menu/index.tsx b/app/layout/project/navigation/user-menu/index.tsx index 5c38ff5ede..61c7bf1245 100644 --- a/app/layout/project/navigation/user-menu/index.tsx +++ b/app/layout/project/navigation/user-menu/index.tsx @@ -18,6 +18,7 @@ import { Switch } from 'components/forms/switch'; import Icon from 'components/icon'; import { cn } from 'utils/cn'; +import USERS_SVG from 'svgs/admin/users.svg?sprite'; import COMMUNITY_SVG from 'svgs/navigation/community.svg?sprite'; import DOCUMENTATION_SVG from 'svgs/navigation/documentation.svg?sprite'; import HELP_GUIDE_SVG from 'svgs/navigation/help-guide.svg?sprite'; @@ -128,6 +129,29 @@ export const UserMenu = (): JSX.Element => {
          • + {user.isAdmin && ( +
        • + +
          + +
          +
          +

          + Admin panel +

          + + Manage users and published projects. + +
          + +
          • + )}
        • From 5935880ef044eeba602bd4da1bd934c89d845db7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Tue, 30 Jan 2024 11:43:30 +0100 Subject: [PATCH 10/15] adds admin panel link to user menu --- .../project/navigation/user-menu/index.tsx | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/app/layout/project/navigation/user-menu/index.tsx b/app/layout/project/navigation/user-menu/index.tsx index 5c38ff5ede..61c7bf1245 100644 --- a/app/layout/project/navigation/user-menu/index.tsx +++ b/app/layout/project/navigation/user-menu/index.tsx @@ -18,6 +18,7 @@ import { Switch } from 'components/forms/switch'; import Icon from 'components/icon'; import { cn } from 'utils/cn'; +import USERS_SVG from 'svgs/admin/users.svg?sprite'; import COMMUNITY_SVG from 'svgs/navigation/community.svg?sprite'; import DOCUMENTATION_SVG from 'svgs/navigation/documentation.svg?sprite'; import HELP_GUIDE_SVG from 'svgs/navigation/help-guide.svg?sprite'; @@ -128,6 +129,29 @@ export const UserMenu = (): JSX.Element => {
          • + {user.isAdmin && ( +
        • + +
          + +
          +
          +

          + Admin panel +

          + + Manage users and published projects. + +
          + +
          • + )}
        • From 794ee4e2192373b6273b5d37e6542d1fd0193305 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Thu, 25 Jan 2024 10:05:52 +0100 Subject: [PATCH 11/15] updates text of upcoming changes banner --- app/layout/upcoming-changes/index.ts | 1 - .../upcoming-changes/{component.tsx => index.tsx} | 10 ++++++---- 2 files changed, 6 insertions(+), 5 deletions(-) delete mode 100644 app/layout/upcoming-changes/index.ts rename app/layout/upcoming-changes/{component.tsx => index.tsx} (67%) diff --git a/app/layout/upcoming-changes/index.ts b/app/layout/upcoming-changes/index.ts deleted file mode 100644 index b404d7fd44..0000000000 --- a/app/layout/upcoming-changes/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './component'; diff --git a/app/layout/upcoming-changes/component.tsx b/app/layout/upcoming-changes/index.tsx similarity index 67% rename from app/layout/upcoming-changes/component.tsx rename to app/layout/upcoming-changes/index.tsx index 2dddc432ed..725a411728 100644 --- a/app/layout/upcoming-changes/component.tsx +++ b/app/layout/upcoming-changes/index.tsx @@ -22,10 +22,12 @@ export const UpcomingChangesBanner = (): JSX.Element => {

          - MaPP is undergoing a transformation with an enhanced interface and new features released - by the end of January 2024! Your existing projects - will seamlessly transition to the new version. For any concerns, feel free to reach out - to us. Stay tuned for a better planning experience! + Attention users: MaPP has undergone a transformative + upgrade, introducing an enhanced interface and new features. The new version is live, + with all improvements implemented as of January 25th. Your existing projects have + seamlessly transitioned to the improved MaPP. If you encounter any issues, please + don't hesitate to reach out to us. Thank you and get ready to enjoy an enhanced + planning experience!

          - -
          - {calibrationResultsQuery.data?.map((cr) => { - return ( -
          - {cr.pngData && Blm Image} -
          -
          -

          BLM:

          -

          {cr.blmValue}

          -
          -
          -

          COST:

          -

          {cr.cost}

          -
          -
          -
          - ); - })} -
          ); }; diff --git a/app/layout/scenarios/reports/solutions/calibration-results/index.tsx b/app/layout/scenarios/reports/solutions/calibration-results/index.tsx new file mode 100644 index 0000000000..cf16dbc7e4 --- /dev/null +++ b/app/layout/scenarios/reports/solutions/calibration-results/index.tsx @@ -0,0 +1,47 @@ +import Image from 'next/image'; +import { useRouter } from 'next/router'; + +import { useScenarioCalibrationResults } from 'hooks/scenarios'; + +import BlmChart from 'layout/project/sidebar/scenario/advanced-settings/blm-calibration/chart'; + +const CalibrationResultsReport = (): JSX.Element => { + const { query } = useRouter(); + const { sid } = query as { sid: string }; + + const calibrationResultsQuery = useScenarioCalibrationResults(sid); + + const chartData = [...calibrationResultsQuery.data].sort((a, b) => a.cost - b.cost); + + return ( +
          +
          + {calibrationResultsQuery.data?.map((cr) => { + return ( +
          + {cr.pngData && Blm Image} +
          +
          +

          BLM:

          +

          {cr.blmValue}

          +
          +
          +

          COST:

          +

          {cr.cost}

          +
          +
          +
          + ); + })} +
          + {chartData?.length > 0 && ( +
          +

          Calibration results

          + {}} /> +
          + )} +
          + ); +}; + +export default CalibrationResultsReport; diff --git a/app/pages/reports/[pid]/[sid]/solutions.tsx b/app/pages/reports/[pid]/[sid]/solutions.tsx index 3860e87b2c..4119b73c90 100644 --- a/app/pages/reports/[pid]/[sid]/solutions.tsx +++ b/app/pages/reports/[pid]/[sid]/solutions.tsx @@ -6,6 +6,7 @@ import Head from 'layout/head'; import MetaIcons from 'layout/meta-icons'; import AdvancedSettingsPage from 'layout/scenarios/reports/solutions/advanced-settings'; import BestSolutionPage from 'layout/scenarios/reports/solutions/best-solution'; +import CalibrationResultsReport from 'layout/scenarios/reports/solutions/calibration-results'; import CostSurfaceReport from 'layout/scenarios/reports/solutions/cost-surface'; import DifferentSolutionsFirstPage from 'layout/scenarios/reports/solutions/different-solutions/first'; // import DifferentSolutionsSecondPage from 'layout/scenarios/reports/solutions/different-solutions/second'; @@ -66,29 +67,34 @@ const MainReport: React.FC = () => { {/* PAGE 7 */}
          - +
          {/* PAGE 8 */}
          - +
          {/* PAGE 9 */}
          - +
          {/* PAGE 10 */} +
          + + +
          + {/* PAGE 11 */} {/*
          */} - {/* PAGE 11 */} + {/* PAGE 12 */}
          - {/* PAGE 12 */} + {/* PAGE 13 */}
          From a6b5defa612afad76198d5d5a8a2986d448ca09c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Tue, 30 Jan 2024 17:12:29 +0100 Subject: [PATCH 15/15] solutions report: fixes height of calibration results chart --- .../reports/solutions/calibration-results/index.tsx | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/app/layout/scenarios/reports/solutions/calibration-results/index.tsx b/app/layout/scenarios/reports/solutions/calibration-results/index.tsx index cf16dbc7e4..e143d48b11 100644 --- a/app/layout/scenarios/reports/solutions/calibration-results/index.tsx +++ b/app/layout/scenarios/reports/solutions/calibration-results/index.tsx @@ -34,12 +34,14 @@ const CalibrationResultsReport = (): JSX.Element => { ); })}
          - {chartData?.length > 0 && ( -
          -

          Calibration results

          - {}} /> +
          +

          Calibration results

          +
          + {chartData?.length > 0 && ( + {}} /> + )}
          - )} +
          ); };