Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -151,6 +151,7 @@ interface Props {
value: PartialAdminLevel;
isPublished?: boolean;
adminLevelOptions?: AdminLevelType[];
onAdminLevelAddSuccess: () => void;
}

function AddAdminLevelForm(props: Props) {
Expand All @@ -160,6 +161,7 @@ function AddAdminLevelForm(props: Props) {
onSave,
value: valueFromProps,
isPublished,
onAdminLevelAddSuccess,
onDelete,
} = props;

Expand Down Expand Up @@ -268,6 +270,7 @@ function AddAdminLevelForm(props: Props) {
}

if (isDefined(result) && ok) {
onAdminLevelAddSuccess();
alert.show(
'Admin level is successfully updated!',
{ variant: 'success' },
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ interface Props {
adminLevelOptions?: AdminLevelType[];
name: string;
regionId: string;
onAdminLevelAddSuccess: () => void;
}

function AddAdminLevelPane(props: Props) {
Expand All @@ -28,6 +29,7 @@ function AddAdminLevelPane(props: Props) {
isPublished,
adminLevelOptions,
name,
onAdminLevelAddSuccess,
regionId,
} = props;

Expand All @@ -36,6 +38,7 @@ function AddAdminLevelPane(props: Props) {
name={name}
>
<AddAdminLevelForm
onAdminLevelAddSuccess={onAdminLevelAddSuccess}
regionId={regionId}
value={value}
onSave={onSave}
Expand Down
123 changes: 107 additions & 16 deletions app/views/ProjectEdit/GeoAreas/RegionCard/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
IoTrashBinOutline,
IoInformationCircleOutline,
IoAdd,
IoReload,
} from 'react-icons/io5';
import {
gql,
Expand All @@ -37,6 +38,7 @@ import {
List,
useAlert,
} from '@the-deep/deep-ui';
import NonFieldError from '#components/NonFieldError';
import {
RegionsForGeoAreasQuery,
PublishRegionMutation,
Expand All @@ -48,6 +50,8 @@ import {
DeleteRegionMutationVariables,
DeleteAdminLevelMutation,
DeleteAdminLevelMutationVariables,
RetriggerRegionMutation,
RetriggerRegionMutationVariables,
} from '#generated/types';
import {
ObjectError,
Expand All @@ -74,6 +78,15 @@ const PUBLISH_REGION = gql`
}
`;

const RETRIGGER_REGION = gql`
mutation RetriggerRegion($regionId: ID!) {
retriggerRegion(regionId: $regionId) {
ok
errors
}
}
`;

const DELETE_REGION = gql`
mutation DeleteRegion($projectId: ID!, $regionId: [ID!]) {
project(id: $projectId) {
Expand Down Expand Up @@ -122,7 +135,7 @@ const DELETE_ADMIN_LEVEL = gql`
}
`;

interface Props {
export interface Props {
region: Region;
className?: string;
activeProject: string;
Expand All @@ -135,8 +148,10 @@ interface Props {
onAdminLevelUpdate?: () => void;
navigationDisabled?: boolean;
isPublished: boolean;
onAdminLevelAddSuccess: () => void;
onRegionRetriggerSuccess: () => void;
onRegionPublishSuccess: () => void;
onRegionRemoveSuccess: () => void;
onRegionDeleteSuccess: () => void;
}

function RegionCard(props: Props) {
Expand All @@ -153,8 +168,10 @@ function RegionCard(props: Props) {
onTempAdminLevelChange,
navigationDisabled,
onAdminLevelUpdate,
onAdminLevelAddSuccess,
onRegionRetriggerSuccess,
onRegionPublishSuccess,
onRegionRemoveSuccess,
onRegionDeleteSuccess,
} = props;

// setting this so that when user add an admin level, it is updated
Expand Down Expand Up @@ -226,6 +243,48 @@ function RegionCard(props: Props) {
},
);

const [
retriggerRegion,
{
loading: retriggerRegionPending,
},
] = useMutation<RetriggerRegionMutation, RetriggerRegionMutationVariables>(
RETRIGGER_REGION,
{
onCompleted: (response) => {
if (!response.retriggerRegion) {
return;
}

const { ok, errors } = response.retriggerRegion;

if (errors) {
const formError = transformToFormError(
removeNull(response.retriggerRegion.errors) as ObjectError[],
);
alert.show(
formError?.[internal] as string,
{ variant: 'error' },
);
}

if (ok) {
alert.show(
'Selected region retrigger successfully',
{ variant: 'success' },
);
onRegionRetriggerSuccess();
}
},
onError: () => {
alert.show(
'Failed to retrigger region.',
{ variant: 'error' },
);
},
},
);

const [
deleteAdminLevel,
{
Expand Down Expand Up @@ -300,7 +359,7 @@ function RegionCard(props: Props) {
'Region is successfully deleted!',
{ variant: 'success' },
);
onRegionRemoveSuccess();
onRegionDeleteSuccess();
}
},
onError: () => {
Expand All @@ -312,6 +371,19 @@ function RegionCard(props: Props) {
},
);

const handleRegionRetriggerClick = useCallback(
() => {
if (region.id) {
retriggerRegion({
variables: {
regionId: region.id,
},
});
}
},
[retriggerRegion, region],
);

const handleDeleteRegionClick = useCallback(
() => {
if (region.id) {
Expand Down Expand Up @@ -460,13 +532,15 @@ function RegionCard(props: Props) {
isPublished,
adminLevelOptions: adminLevels,
regionId: region.id,
onAdminLevelAddSuccess,
}),
[
region.id,
isPublished,
adminLevels,
handleAdminLevelSave,
handleAdminLevelDelete,
onAdminLevelAddSuccess,
],
);

Expand Down Expand Up @@ -497,20 +571,36 @@ function RegionCard(props: Props) {
onExpansionChange={handleExpansion}
expansionTriggerArea="arrow"
headerActions={(
<QuickActionConfirmButton
name="deleteButton"
title="Remove geo area from this project"
onConfirm={handleDeleteRegionClick}
message="Removing the geo area will remove all the tagged geo data under your project.
The removal of tags cannot be undone.
Are you sure you want to remove this geo area from the project?"
showConfirmationInitially={false}
disabled={navigationDisabled}
>
<IoTrashBinOutline />
</QuickActionConfirmButton>
<>
{!isPublished && region.status === 'FAILED' && (
<QuickActionConfirmButton
name="retrigger"
title="Retrigger region"
message="Are you sure you want to retrigger the selected region?"
onConfirm={handleRegionRetriggerClick}
disabled={retriggerRegionPending}
>
<IoReload />
</QuickActionConfirmButton>
)}
<QuickActionConfirmButton
name="deleteButton"
title="Remove geo area from this project"
onConfirm={handleDeleteRegionClick}
message="Removing the geo area will remove all the tagged geo data under your project.
The removal of tags cannot be undone.
Are you sure you want to remove this geo area from the project?"
showConfirmationInitially={false}
disabled={navigationDisabled}
>
<IoTrashBinOutline />
</QuickActionConfirmButton>
</>
)}
>
{!isPublished && region.status === 'FAILED' && (
<NonFieldError error="An error occurred. Please check all values and retrigger the action" />
)}
{!isPublished && (
<Message
icon={(<IoInformationCircleOutline />)}
Expand Down Expand Up @@ -547,6 +637,7 @@ function RegionCard(props: Props) {
navigationDisabled
|| pendingPublishRegion
|| adminLevels.length < 1
|| region.status === 'FAILED'
)}
>
Publish Area
Expand Down
28 changes: 24 additions & 4 deletions app/views/ProjectEdit/GeoAreas/index.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useCallback, useState } from 'react';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import {
IoAdd,
} from 'react-icons/io5';
Expand All @@ -21,7 +21,7 @@ import {
import _ts from '#ts';

import RegionsMap from './RegionsMap';
import RegionCard from './RegionCard';
import RegionCard, { Props as RegionCardProps } from './RegionCard';
import CustomGeoAddModal from './CustomGeoAddModal';

import styles from './styles.css';
Expand All @@ -47,6 +47,7 @@ const REGIONS_FOR_GEO_AREAS = gql`
}
title
public
status
}
}
}
Expand Down Expand Up @@ -97,6 +98,8 @@ function GeoAreas(props: Props) {
data: regions,
loading: regionsLoading,
refetch: regionsRefetch,
startPolling,
stopPolling,
} = useQuery<RegionsForGeoAreasQuery, RegionsForGeoAreasQueryVariables>(
REGIONS_FOR_GEO_AREAS,
{
Expand All @@ -106,6 +109,21 @@ function GeoAreas(props: Props) {
},
);

const shouldPoll = useMemo(() => regions?.project?.regions?.some(
(region) => region.status === 'INITIATED',
), [regions?.project?.regions]);

useEffect(
() => {
if (shouldPoll) {
startPolling(500);
} else {
stopPolling();
}
},
[shouldPoll, startPolling, stopPolling],
);

const handleRegionSet = useCallback(
(value: string | undefined) => {
setActiveRegion(value);
Expand Down Expand Up @@ -137,7 +155,7 @@ function GeoAreas(props: Props) {
);

const regionRendererParams = useCallback(
(_: number, data: Region) => {
(_: number, data: Region): RegionCardProps => {
const isExpanded = data.id === activeRegion;
return {
region: data,
Expand All @@ -151,7 +169,9 @@ function GeoAreas(props: Props) {
onTempAdminLevelChange: isExpanded ? setTempAdminLevel : undefined,
onAdminLevelUpdate: isExpanded ? updateMapTriggerId : undefined,
onRegionPublishSuccess: regionsRefetch,
onRegionRemoveSuccess: regionsRefetch,
onRegionDeleteSuccess: regionsRefetch,
onAdminLevelAddSuccess: regionsRefetch,
onRegionRetriggerSuccess: regionsRefetch,
navigationDisabled,
};
},
Expand Down
Loading