From e7f60da3917b2ec20c29571326e0234cc2f93bd9 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Tue, 9 Jan 2024 08:59:54 +0545 Subject: [PATCH 01/19] fix: backend import error fix --- src/backend/app/projects/project_schemas.py | 1 + 1 file changed, 1 insertion(+) diff --git a/src/backend/app/projects/project_schemas.py b/src/backend/app/projects/project_schemas.py index 02c1fdaa1d..7fba4a445d 100644 --- a/src/backend/app/projects/project_schemas.py +++ b/src/backend/app/projects/project_schemas.py @@ -28,6 +28,7 @@ from app.models.enums import ProjectPriority, ProjectStatus, TaskSplitType from app.tasks import tasks_schemas from app.users.user_schemas import User +from pydantic.functional_validators import field_validator class ODKCentral(BaseModel): From 73c06aafa0e457c82b14d2ceafbfedac1f26317a Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Tue, 9 Jan 2024 09:01:19 +0545 Subject: [PATCH 02/19] fix (vectorLayer): style - conditionaly apply style on onModify present --- .../OpenLayersComponent/Layers/VectorLayer.js | 37 ++++++++++--------- 1 file changed, 20 insertions(+), 17 deletions(-) diff --git a/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js b/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js index 546bd7fddf..fc388d4d92 100644 --- a/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js +++ b/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js @@ -191,22 +191,26 @@ const VectorLayer = ({ useEffect(() => { if (!vectorLayer || !style.visibleOnMap || setStyle) return; - vectorLayer.setStyle((feature, resolution) => [ - new Style({ - image: new CircleStyle({ - radius: 5, - fill: new Fill({ - color: 'orange', - }), - }), - geometry: function (feature) { - // return the coordinates of the first ring of the polygon - const coordinates = feature.getGeometry().getCoordinates()[0]; - return new MultiPoint(coordinates); - }, - }), - getStyles({ style, feature, resolution }), - ]); + vectorLayer.setStyle((feature, resolution) => { + return onModify + ? [ + new Style({ + image: new CircleStyle({ + radius: 5, + fill: new Fill({ + color: 'orange', + }), + }), + geometry: function (feature) { + // return the coordinates of the first ring of the polygon + const coordinates = feature.getGeometry().getCoordinates()[0]; + return new MultiPoint(coordinates); + }, + }), + getStyles({ style, feature, resolution }), + ] + : [getStyles({ style, feature, resolution })]; + }); }, [vectorLayer, style, setStyle]); useEffect(() => { @@ -254,7 +258,6 @@ const VectorLayer = ({ }); function pointerMovefn(event) { vectorLayer.getFeatures(event.pixel).then((features) => { - console.log(selection, 'selection'); if (!features.length) { selection = {}; hoverEffect(undefined, vectorLayer); From 9d45249eedb35d6fab15abf471461344a1b23860 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Tue, 9 Jan 2024 09:04:31 +0545 Subject: [PATCH 03/19] fix (splitTasks): map - edit added to splitted taskLayer --- .../src/components/createnewproject/SplitTasks.tsx | 5 +++++ src/frontend/src/views/NewDefineAreaMap.tsx | 7 ++++--- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx index 22234d128d..730caa5a21 100644 --- a/src/frontend/src/components/createnewproject/SplitTasks.tsx +++ b/src/frontend/src/components/createnewproject/SplitTasks.tsx @@ -426,6 +426,11 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo splittedGeojson={dividedTaskGeojson} uploadedOrDrawnGeojsonFile={drawnGeojson} buildingExtractedGeojson={dataExtractGeojson} + onModify={(geojson) => { + handleCustomChange('drawnGeojson', geojson); + dispatch(CreateProjectActions.SetDrawnGeojson(JSON.parse(geojson))); + setGeojsonFile(null); + }} /> {generateProjectLog ? ( diff --git a/src/frontend/src/views/NewDefineAreaMap.tsx b/src/frontend/src/views/NewDefineAreaMap.tsx index 72d0b8d82e..15364b012e 100644 --- a/src/frontend/src/views/NewDefineAreaMap.tsx +++ b/src/frontend/src/views/NewDefineAreaMap.tsx @@ -7,11 +7,12 @@ import { GeoJSONFeatureTypes } from '../store/types/ICreateProject'; type NewDefineAreaMapProps = { drawToggle?: boolean; - splittedGeojson: GeoJSONFeatureTypes; + splittedGeojson: GeoJSONFeatureTypes | null; uploadedOrDrawnGeojsonFile: GeoJSONFeatureTypes; buildingExtractedGeojson?: GeoJSONFeatureTypes; lineExtractedGeojson?: GeoJSONFeatureTypes; - onDraw?: () => void; + onDraw?: (geojson: any, area: number) => void; + onModify?: (geojson: any, area?: number) => void; }; const NewDefineAreaMap = ({ drawToggle, @@ -51,7 +52,7 @@ const NewDefineAreaMap = ({ constrainResolution: true, duration: 500, }} - zoomToLayer + onModify={onModify} /> )} {isDrawOrGeojsonFile && !splittedGeojson && ( From ba154f1c3bc67c816c51a6548f3d0da19a82b26f Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Tue, 9 Jan 2024 10:00:38 +0545 Subject: [PATCH 04/19] fix (splitTasks): onModify - edited geojson set to dividedTaskGeojson state --- src/frontend/src/components/createnewproject/SplitTasks.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx index 730caa5a21..360d1afb78 100644 --- a/src/frontend/src/components/createnewproject/SplitTasks.tsx +++ b/src/frontend/src/components/createnewproject/SplitTasks.tsx @@ -130,7 +130,6 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo } else { projectData = { ...projectData, task_split_dimension: projectDetails.dimension }; } - console.log(projectData, 'projectData'); dispatch( CreateProjectService( `${import.meta.env.VITE_API_URL}/projects/create_project`, @@ -428,7 +427,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo buildingExtractedGeojson={dataExtractGeojson} onModify={(geojson) => { handleCustomChange('drawnGeojson', geojson); - dispatch(CreateProjectActions.SetDrawnGeojson(JSON.parse(geojson))); + dispatch(CreateProjectActions.SetDividedTaskGeojson(JSON.parse(geojson))); setGeojsonFile(null); }} /> From f3140d4ae53878d0e1b3b552125311a92e800186 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 10:44:13 +0545 Subject: [PATCH 05/19] feat (createNewProject): only enable generate task btn if fgb file fetch is completed --- .../src/components/createnewproject/DataExtract.tsx | 11 +++++++++++ .../src/components/createnewproject/SplitTasks.tsx | 4 +++- src/frontend/src/store/slices/CreateProjectSlice.ts | 4 ++++ src/frontend/src/store/types/ICreateProject.ts | 1 + 4 files changed, 19 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/components/createnewproject/DataExtract.tsx b/src/frontend/src/components/createnewproject/DataExtract.tsx index 42e57c2a85..26ff708935 100644 --- a/src/frontend/src/components/createnewproject/DataExtract.tsx +++ b/src/frontend/src/components/createnewproject/DataExtract.tsx @@ -46,6 +46,7 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo const projectAreaBlob = new Blob([JSON.stringify(drawnGeojson)], { type: 'application/json' }); const drawnGeojsonFile = new File([projectAreaBlob], 'outline.json', { type: 'application/json' }); + dispatch(CreateProjectActions.SetFgbFetchingStatus(true)); // Create form and POST endpoint const dataExtractRequestFormData = new FormData(); dataExtractRequestFormData.append('geojson_file', drawnGeojsonFile); @@ -67,8 +68,18 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo const uint8ArrayData = new Uint8Array(binaryData); // Deserialize the binary data const geojsonExtract = await fgbGeojson.deserialize(uint8ArrayData); + dispatch(CreateProjectActions.SetFgbFetchingStatus(false)); await dispatch(CreateProjectActions.setDataExtractGeojson(geojsonExtract)); } catch (error) { + dispatch( + CommonActions.SetSnackBar({ + open: true, + message: 'Error to generate FGB file.', + variant: 'error', + duration: 2000, + }), + ); + dispatch(CreateProjectActions.SetFgbFetchingStatus(false)); // TODO add error message for user console.error('Error getting data extract:', error); } diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx index 360d1afb78..5f0da11efe 100644 --- a/src/frontend/src/components/createnewproject/SplitTasks.tsx +++ b/src/frontend/src/components/createnewproject/SplitTasks.tsx @@ -61,6 +61,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo (state) => state.createproject.taskSplittingGeojsonLoading, ); const isTasksGenerated = CoreModules.useAppSelector((state) => state.createproject.isTasksGenerated); + const isFgbFetching = CoreModules.useAppSelector((state) => state.createproject.isFgbFetching); const toggleStep = (step, url) => { dispatch(CommonActions.SetCurrentStepFormStep({ flag: flag, step: step })); @@ -379,7 +380,8 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo icon={} disabled={ splitTasksSelection === task_split_type['task_splitting_algorithm'] && - !formValues?.average_buildings_per_task + !formValues?.average_buildings_per_task && + isFgbFetching ? true : false } diff --git a/src/frontend/src/store/slices/CreateProjectSlice.ts b/src/frontend/src/store/slices/CreateProjectSlice.ts index 7f9cc75856..84bde5e607 100755 --- a/src/frontend/src/store/slices/CreateProjectSlice.ts +++ b/src/frontend/src/store/slices/CreateProjectSlice.ts @@ -48,6 +48,7 @@ export const initialState: CreateProjectStateTypes = { isUnsavedChanges: false, canSwitchCreateProjectSteps: false, isTasksGenerated: { divide_on_square: false, task_splitting_algorithm: false }, + isFgbFetching: false, }; const CreateProject = createSlice({ @@ -215,6 +216,9 @@ const CreateProject = createSlice({ [action.payload.key]: action.payload.value, }; }, + SetFgbFetchingStatus(state, action) { + state.isFgbFetching = action.payload; + }, }, }); diff --git a/src/frontend/src/store/types/ICreateProject.ts b/src/frontend/src/store/types/ICreateProject.ts index 900dff66de..bd7fd27e08 100644 --- a/src/frontend/src/store/types/ICreateProject.ts +++ b/src/frontend/src/store/types/ICreateProject.ts @@ -34,6 +34,7 @@ export type CreateProjectStateTypes = { isUnsavedChanges: boolean; canSwitchCreateProjectSteps: boolean; isTasksGenerated: {}; + isFgbFetching: boolean; }; export type ValidateCustomFormResponse = { detail: { message: string; possible_reason: string }; From 937ae6aceb348fc14768d8e90171d4abdf0efddf Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 13:29:58 +0545 Subject: [PATCH 06/19] fix (createNewProject): splitTasks - logic fix --- src/frontend/src/components/createnewproject/SplitTasks.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx index 5f0da11efe..55e92b5ff6 100644 --- a/src/frontend/src/components/createnewproject/SplitTasks.tsx +++ b/src/frontend/src/components/createnewproject/SplitTasks.tsx @@ -379,8 +379,8 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo className="" icon={} disabled={ - splitTasksSelection === task_split_type['task_splitting_algorithm'] && - !formValues?.average_buildings_per_task && + (splitTasksSelection === task_split_type['task_splitting_algorithm'] && + !formValues?.average_buildings_per_task) || isFgbFetching ? true : false From 55ec79cc0bb86ae501c6145aea1a508e961136e7 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 14:12:40 +0545 Subject: [PATCH 07/19] fix (createNewProject): splitTasks - clear dividedTaskGeojson, splitTasksSelection, and dataExtractGeojson state on previous click --- src/frontend/src/components/createnewproject/SplitTasks.tsx | 1 + src/frontend/src/store/slices/CreateProjectSlice.ts | 5 +++++ 2 files changed, 6 insertions(+) diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx index 55e92b5ff6..4a4bd0596c 100644 --- a/src/frontend/src/components/createnewproject/SplitTasks.tsx +++ b/src/frontend/src/components/createnewproject/SplitTasks.tsx @@ -64,6 +64,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customLineUpload, custo const isFgbFetching = CoreModules.useAppSelector((state) => state.createproject.isFgbFetching); const toggleStep = (step, url) => { + dispatch(CreateProjectActions.ClearProjectStepState()); dispatch(CommonActions.SetCurrentStepFormStep({ flag: flag, step: step })); navigate(url); }; diff --git a/src/frontend/src/store/slices/CreateProjectSlice.ts b/src/frontend/src/store/slices/CreateProjectSlice.ts index 84bde5e607..64affe948d 100755 --- a/src/frontend/src/store/slices/CreateProjectSlice.ts +++ b/src/frontend/src/store/slices/CreateProjectSlice.ts @@ -219,6 +219,11 @@ const CreateProject = createSlice({ SetFgbFetchingStatus(state, action) { state.isFgbFetching = action.payload; }, + ClearProjectStepState(state) { + state.dividedTaskGeojson = null; + state.splitTasksSelection = null; + state.dataExtractGeojson = null; + }, }, }); From df682b763db13f8f4d97ae97af3f50bf1e00567d Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 15:03:40 +0545 Subject: [PATCH 08/19] feat (createNewProject): splitTasks - show loader and message until FGB file is fetching --- src/frontend/src/views/NewDefineAreaMap.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/frontend/src/views/NewDefineAreaMap.tsx b/src/frontend/src/views/NewDefineAreaMap.tsx index 15364b012e..3ca368ed37 100644 --- a/src/frontend/src/views/NewDefineAreaMap.tsx +++ b/src/frontend/src/views/NewDefineAreaMap.tsx @@ -4,6 +4,8 @@ import { MapContainer as MapComponent } from '../components/MapComponent/OpenLay import LayerSwitcherControl from '../components/MapComponent/OpenLayersComponent/LayerSwitcher/index.js'; import { VectorLayer } from '../components/MapComponent/OpenLayersComponent/Layers'; import { GeoJSONFeatureTypes } from '../store/types/ICreateProject'; +import CoreModules from '../shared/CoreModules.js'; +import { Loader2 } from 'lucide-react'; type NewDefineAreaMapProps = { drawToggle?: boolean; @@ -30,6 +32,7 @@ const NewDefineAreaMap = ({ maxZoom: 25, }); const isDrawOrGeojsonFile = drawToggle || uploadedOrDrawnGeojsonFile; + const isFgbFetching = CoreModules.useAppSelector((state) => state.createproject.isFgbFetching); return (
@@ -116,6 +119,12 @@ const NewDefineAreaMap = ({ zoomToLayer /> )} + {isFgbFetching && ( +
+ +

Data extraction is currently in progress.

+
+ )}
); From b7f105cef78233e16d5cb4995c09782102a0d8cc Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 15:04:30 +0545 Subject: [PATCH 09/19] fix (createNewProject): taskSplit - display error on taskSplit fail --- src/frontend/src/api/CreateProjectService.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/frontend/src/api/CreateProjectService.ts b/src/frontend/src/api/CreateProjectService.ts index 3a8d302de9..b54f2203ca 100755 --- a/src/frontend/src/api/CreateProjectService.ts +++ b/src/frontend/src/api/CreateProjectService.ts @@ -352,6 +352,14 @@ const TaskSplittingPreviewService: Function = ( dispatch(CreateProjectActions.SetIsTasksGenerated({ key: 'task_splitting_algorithm', value: true })); dispatch(CreateProjectActions.GetTaskSplittingPreview(resp)); } catch (error) { + dispatch( + CommonActions.SetSnackBar({ + open: true, + message: 'Task generation failed. Please try again', + variant: 'error', + duration: 2000, + }), + ); dispatch(CreateProjectActions.GetTaskSplittingPreviewLoading(false)); } finally { dispatch(CreateProjectActions.GetTaskSplittingPreviewLoading(false)); From 4214f9264971945a446c39e6df6bb3aa9600ad66 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Thu, 11 Jan 2024 15:37:33 +0545 Subject: [PATCH 10/19] fix vectorLayer: on modifyEnd return area of boundary as well --- .../MapComponent/OpenLayersComponent/Layers/VectorLayer.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js b/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js index fc388d4d92..e3cb4c26d7 100644 --- a/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js +++ b/src/frontend/src/components/MapComponent/OpenLayersComponent/Layers/VectorLayer.js @@ -74,8 +74,10 @@ const VectorLayer = ({ dataProjection: 'EPSG:4326', featureProjection: 'EPSG:3857', }); + const geometry = vectorLayer.getSource().getFeatures()?.[0].getGeometry(); + const area = formatArea(geometry); - onModify(geoJSONString); + onModify(geoJSONString, area); }); map.addInteraction(modify); map.addInteraction(select); From 6a615bd187de484a614ec3957243532007c1c9ab Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Fri, 12 Jan 2024 11:50:10 +0545 Subject: [PATCH 11/19] fix button: loading text added to the button --- src/frontend/src/components/common/Button.tsx | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/src/frontend/src/components/common/Button.tsx b/src/frontend/src/components/common/Button.tsx index 49168f80e7..a5f69f748d 100644 --- a/src/frontend/src/components/common/Button.tsx +++ b/src/frontend/src/components/common/Button.tsx @@ -12,6 +12,7 @@ interface IButton { icon?: React.ReactNode; isLoading?: boolean; disabled?: boolean; + loadingText?: string; } const btnStyle = (btnType, className) => { @@ -24,13 +25,25 @@ const btnStyle = (btnType, className) => { case 'other': return `fmtm-py-1 fmtm-px-5 fmtm-bg-red-500 fmtm-text-white fmtm-rounded-lg hover:fmtm-bg-red-600`; case 'disabled': - return `fmtm-py-1 fmtm-px-4 fmtm-text-white fmtm-rounded-lg fmtm-bg-gray-400 fmtm-cursor-not-allowed`; + return `fmtm-py-1 fmtm-px-4 fmtm-text-white fmtm-rounded-lg fmtm-bg-gray-400 fmtm-cursor-not-allowed ${className}`; default: return 'fmtm-primary'; } }; -const Button = ({ btnText, btnType, type, onClick, disabled, className, count, dataTip, icon, isLoading }: IButton) => ( +const Button = ({ + btnText, + btnType, + type, + onClick, + disabled, + className, + count, + dataTip, + icon, + isLoading, + loadingText, +}: IButton) => (
From 7ba236207865eca23df8a226863e57f44515a4f6 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Fri, 12 Jan 2024 16:01:06 +0545 Subject: [PATCH 16/19] fix (createNewProject): dataExtract - clear file state on reset click or if generateDataExtract click --- .../createnewproject/DataExtract.tsx | 36 ++++++++++++++----- 1 file changed, 28 insertions(+), 8 deletions(-) diff --git a/src/frontend/src/components/createnewproject/DataExtract.tsx b/src/frontend/src/components/createnewproject/DataExtract.tsx index c885a1af1c..17c46ce04e 100644 --- a/src/frontend/src/components/createnewproject/DataExtract.tsx +++ b/src/frontend/src/components/createnewproject/DataExtract.tsx @@ -43,7 +43,7 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo const isFgbFetching = useAppSelector((state) => state.createproject.isFgbFetching); const submission = () => { - if (featureType !== formValues?.dataExtractFeatureType) { + if (featureType !== formValues?.dataExtractFeatureType && formValues.dataExtractWays === 'osm_data_extract') { dispatch( CommonActions.SetSnackBar({ open: true, @@ -61,6 +61,11 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo // First go to next page, to not block UX navigate('/split-tasks'); }; + + const resetFile = (setDataExtractToState) => { + setDataExtractToState(null); + }; + const { handleSubmit, handleCustomChange, @@ -70,6 +75,12 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo // Generate OSM data extract const generateDataExtract = async () => { + // Remove custom extract file if available in state + resetFile(setCustomPolygonUpload); + resetFile(setCustomLineUpload); + handleCustomChange('customLineUpload', null); + handleCustomChange('customPolygonUpload', null); + // Get OSM data extract if required if (extractWays === 'osm_data_extract') { // Create a file object from the project area Blob @@ -186,10 +197,6 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo await dispatch(CreateProjectActions.setDataExtractGeojson(extractFeatCol)); }; - const resetFile = (setDataExtractToState) => { - setDataExtractToState(null); - }; - useEffect(() => { dispatch(FormCategoryService(`${import.meta.env.VITE_API_URL}/central/list-forms`)); }, []); @@ -227,6 +234,7 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo direction="column" value={extractWays} onChangeData={(value) => { + handleCustomChange('dataExtractWays', value); setExtractWays(value); }} errorMsg={errors.dataExtractWays} @@ -262,8 +270,13 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo onChange={(e) => { changeFileHandler(e, setCustomPolygonUpload); handleCustomChange('customPolygonUpload', e.target.files[0]); + handleCustomChange('dataExtractFeatureType', ''); + setFeatureType(''); + }} + onResetFile={() => { + resetFile(setCustomPolygonUpload); + handleCustomChange('customPolygonUpload', null); }} - onResetFile={() => resetFile(setCustomPolygonUpload)} customFile={customPolygonUpload} btnText="Upload Polygons" accept=".geojson,.json,.fgb" @@ -275,7 +288,10 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo changeFileHandler(e, setCustomLineUpload); handleCustomChange('customLineUpload', e.target.files[0]); }} - onResetFile={() => resetFile(setCustomLineUpload)} + onResetFile={() => { + resetFile(setCustomLineUpload); + handleCustomChange('customLineUpload', null); + }} customFile={customLineUpload} btnText="Upload Lines" accept=".geojson,.json,.fgb" @@ -299,7 +315,11 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo type="submit" className="fmtm-font-bold" dataTip={`${!dataExtractGeojson ? 'Please Generate Data Extract First.' : ''}`} - disabled={!dataExtractGeojson ? true : false} + disabled={ + !dataExtractGeojson || (extractWays === 'osm_data_extract' && !formValues?.dataExtractFeatureType) + ? true + : false + } />
From d42fe8d844277c48cc7801d496576660d32747e4 Mon Sep 17 00:00:00 2001 From: NSUWAL123 Date: Fri, 12 Jan 2024 18:01:43 +0545 Subject: [PATCH 17/19] fix (createNewProject): customLine, customPolygon file state clear on AOI edit --- .../src/components/createnewproject/DataExtract.tsx | 11 ++++++++++- .../src/components/createnewproject/UploadArea.tsx | 4 +++- src/frontend/src/store/slices/CreateProjectSlice.ts | 1 + src/frontend/src/views/CreateNewProject.tsx | 10 +++++++++- 4 files changed, 23 insertions(+), 3 deletions(-) diff --git a/src/frontend/src/components/createnewproject/DataExtract.tsx b/src/frontend/src/components/createnewproject/DataExtract.tsx index 17c46ce04e..856c428094 100644 --- a/src/frontend/src/components/createnewproject/DataExtract.tsx +++ b/src/frontend/src/components/createnewproject/DataExtract.tsx @@ -142,6 +142,15 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo }, [formValues?.dataExtractWays, formValues?.dataExtractFeatureType]); const toggleStep = (step, url) => { + if (url === '/select-form') { + dispatch( + CreateProjectActions.SetIndividualProjectDetailsData({ + ...formValues, + dataExtractWays: extractWays, + dataExtractFeatureType: null, + }), + ); + } dispatch(CommonActions.SetCurrentStepFormStep({ flag: flag, step: step })); navigate(url); }; @@ -232,7 +241,7 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo topic="You may choose to use OSM data or upload your own data extract" options={dataExtractOptions} direction="column" - value={extractWays} + value={formValues.dataExtractWays} onChangeData={(value) => { handleCustomChange('dataExtractWays', value); setExtractWays(value); diff --git a/src/frontend/src/components/createnewproject/UploadArea.tsx b/src/frontend/src/components/createnewproject/UploadArea.tsx index 89c4e55bbc..2bcba1ce65 100644 --- a/src/frontend/src/components/createnewproject/UploadArea.tsx +++ b/src/frontend/src/components/createnewproject/UploadArea.tsx @@ -31,7 +31,7 @@ const uploadAreaOptions = [ }, ]; -const UploadArea = ({ flag, geojsonFile, setGeojsonFile }) => { +const UploadArea = ({ flag, geojsonFile, setGeojsonFile, setCustomLineUpload, setCustomPolygonUpload }) => { const dispatch = useDispatch(); const navigate = useNavigate(); // const [uploadAreaFile, setUploadAreaFile] = useState(null); @@ -265,6 +265,8 @@ const UploadArea = ({ flag, geojsonFile, setGeojsonFile }) => { dispatch(CreateProjectActions.SetDrawnGeojson(JSON.parse(geojson))); dispatch(CreateProjectActions.SetTotalAreaSelection(area)); dispatch(CreateProjectActions.ClearProjectStepState()); + setCustomLineUpload(null); + setCustomPolygonUpload(null); setGeojsonFile(null); }} /> diff --git a/src/frontend/src/store/slices/CreateProjectSlice.ts b/src/frontend/src/store/slices/CreateProjectSlice.ts index 64affe948d..5de2a1cea2 100755 --- a/src/frontend/src/store/slices/CreateProjectSlice.ts +++ b/src/frontend/src/store/slices/CreateProjectSlice.ts @@ -223,6 +223,7 @@ const CreateProject = createSlice({ state.dividedTaskGeojson = null; state.splitTasksSelection = null; state.dataExtractGeojson = null; + state.projectDetails = { ...state.projectDetails, customLineUpload: null, customPolygonUpload: null }; }, }, }); diff --git a/src/frontend/src/views/CreateNewProject.tsx b/src/frontend/src/views/CreateNewProject.tsx index 14f6ac96bb..271d9b4dc1 100644 --- a/src/frontend/src/views/CreateNewProject.tsx +++ b/src/frontend/src/views/CreateNewProject.tsx @@ -61,7 +61,15 @@ const CreateNewProject = () => { case '/create-project': return ; case '/upload-area': - return ; + return ( + + ); case '/select-form': return ( Date: Tue, 16 Jan 2024 14:07:27 +0545 Subject: [PATCH 18/19] fix (createNewProject): dataExtract - clear previous extractGeojson, customLine, customPolygon on generate extract, btn disable state update --- .../createnewproject/DataExtract.tsx | 35 +++++++++++++------ 1 file changed, 24 insertions(+), 11 deletions(-) diff --git a/src/frontend/src/components/createnewproject/DataExtract.tsx b/src/frontend/src/components/createnewproject/DataExtract.tsx index 856c428094..fd2dd1553c 100644 --- a/src/frontend/src/components/createnewproject/DataExtract.tsx +++ b/src/frontend/src/components/createnewproject/DataExtract.tsx @@ -75,14 +75,11 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo // Generate OSM data extract const generateDataExtract = async () => { - // Remove custom extract file if available in state - resetFile(setCustomPolygonUpload); - resetFile(setCustomLineUpload); - handleCustomChange('customLineUpload', null); - handleCustomChange('customPolygonUpload', null); - // Get OSM data extract if required if (extractWays === 'osm_data_extract') { + // Remove current data extract + dispatch(CreateProjectActions.setDataExtractGeojson(null)); + // Create a file object from the project area Blob const projectAreaBlob = new Blob([JSON.stringify(drawnGeojson)], { type: 'application/json' }); const drawnGeojsonFile = new File([projectAreaBlob], 'outline.json', { type: 'application/json' }); @@ -98,13 +95,15 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo ); const fgbUrl = response.data.url; - // Append url to project data + // Append url to project data & remove custom files dispatch( CreateProjectActions.SetIndividualProjectDetailsData({ ...formValues, data_extract_type: fgbUrl, dataExtractWays: extractWays, dataExtractFeatureType: featureType, + customLineUpload: null, + customPolygonUpload: null, }), ); @@ -147,7 +146,7 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo CreateProjectActions.SetIndividualProjectDetailsData({ ...formValues, dataExtractWays: extractWays, - dataExtractFeatureType: null, + dataExtractFeatureType: featureType, }), ); } @@ -266,11 +265,22 @@ const DataExtract = ({ flag, customLineUpload, setCustomLineUpload, customPolygo