refactor (frontend): TS types added to splitTasks (#1301)

hotosm · Feb 29, 2024 · 2e46493 · 2e46493
1 parent f946181
commit 2e46493
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 31 deletions.
diff --git a/src/frontend/src/components/createnewproject/SplitTasks.tsx b/src/frontend/src/components/createnewproject/SplitTasks.tsx
@@ -41,30 +41,24 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
   const [taskGenerationStatus, setTaskGenerationStatus] = useState(false);
 
   const divRef = useRef(null);
-  const splitTasksSelection = CoreModules.useAppSelector((state) => state.createproject.splitTasksSelection);
-  const drawnGeojson = CoreModules.useAppSelector((state) => state.createproject.drawnGeojson);
-  const projectDetails = CoreModules.useAppSelector((state) => state.createproject.projectDetails);
+  const splitTasksSelection = useAppSelector((state) => state.createproject.splitTasksSelection);
+  const drawnGeojson = useAppSelector((state) => state.createproject.drawnGeojson);
+  const projectDetails = useAppSelector((state) => state.createproject.projectDetails);
   const dataExtractGeojson = useAppSelector((state) => state.createproject.dataExtractGeojson);
 
-  const generateQrSuccess: any = CoreModules.useAppSelector((state) => state.createproject.generateQrSuccess);
-  const projectDetailsResponse = CoreModules.useAppSelector((state) => state.createproject.projectDetailsResponse);
-  const generateProjectLog: any = CoreModules.useAppSelector((state) => state.createproject.generateProjectLog);
-  const dividedTaskGeojson = CoreModules.useAppSelector((state) => state.createproject.dividedTaskGeojson);
-  const projectDetailsLoading = CoreModules.useAppSelector((state) => state.createproject.projectDetailsLoading);
-  const generateProjectLogLoading = CoreModules.useAppSelector(
-    (state) => state.createproject.generateProjectLogLoading,
-  );
-  const dividedTaskLoading = CoreModules.useAppSelector((state) => state.createproject.dividedTaskLoading);
-  const taskSplittingGeojsonLoading = CoreModules.useAppSelector(
-    (state) => state.createproject.taskSplittingGeojsonLoading,
-  );
-  const isTasksGenerated = CoreModules.useAppSelector((state) => state.createproject.isTasksGenerated);
-  const isFgbFetching = CoreModules.useAppSelector((state) => state.createproject.isFgbFetching);
-  const toggleSplittedGeojsonEdit = CoreModules.useAppSelector(
-    (state) => state.createproject.toggleSplittedGeojsonEdit,
-  );
+  const generateQrSuccess = useAppSelector((state) => state.createproject.generateQrSuccess);
+  const projectDetailsResponse = useAppSelector((state) => state.createproject.projectDetailsResponse);
+  const generateProjectLog = useAppSelector((state) => state.createproject.generateProjectLog);
+  const dividedTaskGeojson = useAppSelector((state) => state.createproject.dividedTaskGeojson);
+  const projectDetailsLoading = useAppSelector((state) => state.createproject.projectDetailsLoading);
+  const generateProjectLogLoading = useAppSelector((state) => state.createproject.generateProjectLogLoading);
+  const dividedTaskLoading = useAppSelector((state) => state.createproject.dividedTaskLoading);
+  const taskSplittingGeojsonLoading = useAppSelector((state) => state.createproject.taskSplittingGeojsonLoading);
+  const isTasksGenerated = useAppSelector((state) => state.createproject.isTasksGenerated);
+  const isFgbFetching = useAppSelector((state) => state.createproject.isFgbFetching);
+  const toggleSplittedGeojsonEdit = useAppSelector((state) => state.createproject.toggleSplittedGeojsonEdit);
 
-  const toggleStep = (step, url) => {
+  const toggleStep = (step: number, url: string) => {
     dispatch(CommonActions.SetCurrentStepFormStep({ flag: flag, step: step }));
     navigate(url);
   };
@@ -92,7 +86,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
     dispatch(CreateProjectActions.SetIndividualProjectDetailsData(formValues));
     const hashtags = projectDetails.hashtags;
     const arrayHashtag = hashtags
-      .split('#')
+      ?.split('#')
       .map((item) => item.trim())
       .filter(Boolean);
 
@@ -177,10 +171,6 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
         }),
       );
     } else if (splitTasksSelection === task_split_type['task_splitting_algorithm']) {
-      // const a = document.createElement('a');
-      // a.href = URL.createObjectURL(drawnGeojsonFile);
-      // a.download = 'test.json';
-      // a.click();
       dispatch(
         TaskSplittingPreviewService(
           `${import.meta.env.VITE_API_URL}/projects/task-split`,
@@ -311,7 +301,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
               <div className="fmtm-flex fmtm-flex-col fmtm-gap-6 lg:fmtm-w-[40%] fmtm-justify-between">
                 <div>
                   <RadioButton
-                    value={splitTasksSelection?.toString()}
+                    value={splitTasksSelection?.toString() || ''}
                     topic="Select an option to split the task"
                     options={alogrithmList}
                     direction="column"

diff --git a/src/frontend/src/store/types/ICreateProject.ts b/src/frontend/src/store/types/ICreateProject.ts
@@ -1,7 +1,9 @@
+import { task_split_type } from '@/types/enums';
+
 export type CreateProjectStateTypes = {
   editProjectDetails: EditProjectDetailsTypes;
   editProjectResponse?: EditProjectResponseTypes | null;
-  projectDetails: ProjectDetailsTypes;
+  projectDetails: Partial<ProjectDetailsTypes>;
   projectDetailsResponse: EditProjectResponseTypes | null;
   projectDetailsLoading: boolean;
   editProjectDetailsLoading: boolean;
@@ -17,7 +19,7 @@ export type CreateProjectStateTypes = {
   generateProjectLog: GenerateProjectLogTypes | null;
   createProjectStep: number;
   dividedTaskLoading: boolean;
-  dividedTaskGeojson: string | null;
+  dividedTaskGeojson: null | GeoJSONFeatureTypes;
   formUpdateLoading: boolean;
   taskSplittingGeojsonLoading: boolean;
   taskSplittingGeojson: TaskSplittingGeojsonTypes | null;
@@ -28,12 +30,12 @@ export type CreateProjectStateTypes = {
   validateCustomFormResponse: ValidateCustomFormResponse | null;
   uploadAreaSelection: string;
   totalAreaSelection: string | null;
-  splitTasksSelection: string | null;
+  splitTasksSelection: task_split_type | null;
   dataExtractGeojson: GeoJSONFeatureTypes | null;
   createProjectValidations: {};
   isUnsavedChanges: boolean;
   canSwitchCreateProjectSteps: boolean;
-  isTasksGenerated: {};
+  isTasksGenerated: Record<string, any>;
   isFgbFetching: boolean;
   toggleSplittedGeojsonEdit: boolean;
   customFileValidity: boolean;
@@ -53,6 +55,7 @@ export type GeoJSONFeatureTypes = {
   properties: Record<string, any>;
   id: string;
   bbox: null | number[];
+  features?: [];
 };
 
 export type ProjectTaskTypes = {
@@ -110,6 +113,10 @@ export type ProjectDetailsTypes = {
   data_extract_options?: string;
   form_ways?: string;
   organisation_id?: number | null;
+  formWays?: string;
+  formCategorySelection?: string;
+  average_buildings_per_task?: number;
+  dataExtractWays?: string;
 };
 
 export type ProjectAreaTypes = {
@@ -152,4 +159,5 @@ export type DrawnGeojsonTypes = {
   type: string;
   properties: null;
   geometry: GeometryTypes;
+  features?: [];
 };