chore: fixed typescript bug

hotosm · Nov 20, 2024 · 9adb878 · 9adb878
1 parent 14ee27e
commit 9adb878
Show file tree

Hide file tree

Showing 11 changed files with 203 additions and 195 deletions.
diff --git a/frontend/src/app/providers/models-provider.tsx b/frontend/src/app/providers/models-provider.tsx
@@ -219,11 +219,11 @@ const ModelsContext = createContext<{
   trainingDatasetCreationInProgress: boolean;
   handleModelCreationAndUpdate: () => void;
   handleTrainingDatasetCreation: () => void;
-  validateEditMode: boolean
+  validateEditMode: boolean;
 }>({
   formData: initialFormState,
-  setFormData: () => { },
-  handleChange: () => { },
+  setFormData: () => {},
+  handleChange: () => {},
   createNewTrainingDatasetMutation: {} as UseMutationResult<
     TTrainingDataset,
     Error,
@@ -238,14 +238,14 @@ const ModelsContext = createContext<{
   >,
   hasLabeledTrainingAreas: false,
   hasAOIsWithGeometry: false,
-  resetState: () => { },
+  resetState: () => {},
   isEditMode: false,
   modelId: "",
   getFullPath: () => "",
-  handleModelCreationAndUpdate: () => { },
+  handleModelCreationAndUpdate: () => {},
   trainingDatasetCreationInProgress: false,
-  handleTrainingDatasetCreation: () => { },
-  validateEditMode: false
+  handleTrainingDatasetCreation: () => {},
+  validateEditMode: false,
 });
 
 export const ModelsProvider: React.FC<{
@@ -292,7 +292,10 @@ export const ModelsProvider: React.FC<{
   );
 
   // Will be used in the route validator component to delay the redirection for a while until the data are retrieved
-  const validateEditMode = useMemo(() => formData.selectedTrainingDatasetId !== "" && formData.tmsURL !== "", [formData])
+  const validateEditMode = useMemo(
+    () => formData.selectedTrainingDatasetId !== "" && formData.tmsURL !== "",
+    [formData],
+  );
 
   // Fetch and prefill model details
   useEffect(() => {
@@ -313,11 +316,7 @@ export const ModelsProvider: React.FC<{
 
   // Fetch and prefill training dataset
   useEffect(() => {
-    if (
-      !isEditMode ||
-      trainingDatasetIsPending ||
-      trainingDatasetIsError
-    )
+    if (!isEditMode || trainingDatasetIsPending || trainingDatasetIsError)
       return;
     handleChange(MODEL_CREATION_FORM_NAME.DATASET_NAME, trainingDataset.name);
     handleChange(
@@ -480,7 +479,7 @@ export const ModelsProvider: React.FC<{
       handleModelCreationAndUpdate,
       handleTrainingDatasetCreation,
       trainingDatasetCreationInProgress,
-      validateEditMode
+      validateEditMode,
     }),
     [
       setFormData,
@@ -497,7 +496,7 @@ export const ModelsProvider: React.FC<{
       handleModelCreationAndUpdate,
       handleTrainingDatasetCreation,
       trainingDatasetCreationInProgress,
-      validateEditMode
+      validateEditMode,
     ],
   );
 

diff --git a/frontend/src/app/routes/models/models-list.tsx b/frontend/src/app/routes/models/models-list.tsx
@@ -59,9 +59,9 @@ const ClearFilters = ({
 }) => {
   const canClearAllFilters = Boolean(
     query[SEARCH_PARAMS.searchQuery] ||
-    query[SEARCH_PARAMS.startDate] ||
-    query[SEARCH_PARAMS.endDate] ||
-    query[SEARCH_PARAMS.id],
+      query[SEARCH_PARAMS.startDate] ||
+      query[SEARCH_PARAMS.endDate] ||
+      query[SEARCH_PARAMS.id],
   );
 
   return (
@@ -252,8 +252,11 @@ export const ModelsPage = () => {
     setQuery(newQuery);
   }, []);
 
-  const { data: mapData, isPending: modelsMapDataIsPending, isError: modelsMapDataIsError } =
-    useModelsMapData();
+  const {
+    data: mapData,
+    isPending: modelsMapDataIsPending,
+    isError: modelsMapDataIsError,
+  } = useModelsMapData();
 
   // Since it's just a static filter, it's better to memoize it.
   const memoizedCategoryFilter = useMemo(
@@ -318,11 +321,21 @@ export const ModelsPage = () => {
     if (query[SEARCH_PARAMS.layout] === LayoutView.LIST) {
       return (
         <div className="col-span-5">
-          <ModelListTableLayout isPending={isPending} models={data?.results} isError={isError} />
+          <ModelListTableLayout
+            isPending={isPending}
+            models={data?.results}
+            isError={isError}
+          />
         </div>
       );
     }
-    return <ModelListGridLayout isPending={isPending} models={data?.results} isError={isError} />;
+    return (
+      <ModelListGridLayout
+        isPending={isPending}
+        models={data?.results}
+        isError={isError}
+      />
+    );
   };
 
   return (

diff --git a/frontend/src/components/layouts/model-forms-layout.tsx b/frontend/src/components/layouts/model-forms-layout.tsx
@@ -20,50 +20,49 @@ import {
 } from "@/app/providers/models-provider";
 import ModelsLayout from "./models-layout";
 
-
 const pages: {
   id: number;
   title: string;
   icon: React.ElementType;
   path: string;
 }[] = [
-    {
-      id: 1,
-      title: MODEL_CREATION_CONTENT.progressStepper.modelDetails,
-      icon: TagsIcon,
-      path: MODELS_ROUTES.DETAILS,
-    },
-    {
-      id: 2,
-      title: MODEL_CREATION_CONTENT.progressStepper.trainingDataset,
-      icon: DatabaseIcon,
-      path: MODELS_ROUTES.TRAINING_DATASET,
-    },
-    {
-      id: 3,
-      title: MODEL_CREATION_CONTENT.progressStepper.trainingArea,
-      icon: SquareShadowIcon,
-      path: MODELS_ROUTES.TRAINING_AREA,
-    },
-    {
-      id: 4,
-      title: MODEL_CREATION_CONTENT.progressStepper.trainingSettings,
-      icon: SettingsIcon,
-      path: MODELS_ROUTES.TRAINING_SETTINGS,
-    },
-    {
-      id: 5,
-      title: MODEL_CREATION_CONTENT.progressStepper.submitModel,
-      icon: CloudIcon,
-      path: MODELS_ROUTES.MODEL_SUMMARY,
-    },
-    {
-      id: 6,
-      title: MODEL_CREATION_CONTENT.progressStepper.confirmation,
-      icon: StarIcon,
-      path: MODELS_ROUTES.CONFIRMATION,
-    },
-  ];
+  {
+    id: 1,
+    title: MODEL_CREATION_CONTENT.progressStepper.modelDetails,
+    icon: TagsIcon,
+    path: MODELS_ROUTES.DETAILS,
+  },
+  {
+    id: 2,
+    title: MODEL_CREATION_CONTENT.progressStepper.trainingDataset,
+    icon: DatabaseIcon,
+    path: MODELS_ROUTES.TRAINING_DATASET,
+  },
+  {
+    id: 3,
+    title: MODEL_CREATION_CONTENT.progressStepper.trainingArea,
+    icon: SquareShadowIcon,
+    path: MODELS_ROUTES.TRAINING_AREA,
+  },
+  {
+    id: 4,
+    title: MODEL_CREATION_CONTENT.progressStepper.trainingSettings,
+    icon: SettingsIcon,
+    path: MODELS_ROUTES.TRAINING_SETTINGS,
+  },
+  {
+    id: 5,
+    title: MODEL_CREATION_CONTENT.progressStepper.submitModel,
+    icon: CloudIcon,
+    path: MODELS_ROUTES.MODEL_SUMMARY,
+  },
+  {
+    id: 6,
+    title: MODEL_CREATION_CONTENT.progressStepper.confirmation,
+    icon: StarIcon,
+    path: MODELS_ROUTES.CONFIRMATION,
+  },
+];
 
 const ModelCreationLayout = () => {
   const { pathname } = useLocation();
@@ -116,10 +115,16 @@ const ModelFormRouteValidator = ({
   currentPageIndex: number;
 }) => {
   const navigate = useNavigate();
-  const { formData, hasLabeledTrainingAreas, getFullPath, validateEditMode, isEditMode } = useModelsContext();
+  const {
+    formData,
+    hasLabeledTrainingAreas,
+    getFullPath,
+    validateEditMode,
+    isEditMode,
+  } = useModelsContext();
 
   useEffect(() => {
-    if (isEditMode && !validateEditMode) return
+    if (isEditMode && !validateEditMode) return;
     if (!pathname || !formData || !currentPageIndex) return;
     const prevRoute = getFullPath(pages[currentPageIndex - 1].path);
     if (pathname.includes(MODELS_ROUTES.TRAINING_DATASET)) {

diff --git a/frontend/src/features/model-creation/components/progress-buttons.tsx b/frontend/src/features/model-creation/components/progress-buttons.tsx
@@ -5,12 +5,7 @@ import {
 } from "@/app/providers/models-provider";
 import { ButtonWithIcon } from "@/components/ui/button";
 import { ChevronDownIcon } from "@/components/ui/icons";
-import {
-  APPLICATION_ROUTES,
-  MODEL_CREATION_CONTENT,
-  MODELS_BASE,
-  MODELS_ROUTES,
-} from "@/utils";
+import { MODEL_CREATION_CONTENT, MODELS_BASE, MODELS_ROUTES } from "@/utils";
 import { useMemo } from "react";
 import { useNavigate } from "react-router-dom";
 import { TrainingDatasetOption } from "@/enums";
@@ -98,11 +93,11 @@ const ProgressButtons: React.FC<ProgressButtonsProps> = ({
     if (currentPath.includes(MODELS_ROUTES.DETAILS)) {
       return (
         formData.modelName.length >=
-        FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.MODEL_NAME]
-          .minLength &&
+          FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.MODEL_NAME]
+            .minLength &&
         formData.modelDescription.length >=
-        FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.MODEL_DESCRIPTION]
-          .minLength
+          FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.MODEL_DESCRIPTION]
+            .minLength
       );
     } else if (currentPath.includes(MODELS_ROUTES.TRAINING_DATASET)) {
       // if the user hasn't selected any of the options, then they can not proceed to next page.
@@ -118,8 +113,8 @@ const ProgressButtons: React.FC<ProgressButtonsProps> = ({
         return (
           formData.tmsURLValidation.valid &&
           formData.datasetName.length >=
-          FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.DATASET_NAME]
-            .minLength
+            FORM_VALIDATION_CONFIG[MODEL_CREATION_FORM_NAME.DATASET_NAME]
+              .minLength
         );
       } else if (
         formData.trainingDatasetOption === TrainingDatasetOption.USE_EXISTING

diff --git a/frontend/src/features/model-creation/components/training-area/training-area-list.tsx b/frontend/src/features/model-creation/components/training-area/training-area-list.tsx
@@ -40,7 +40,6 @@ const TrainingAreaList = ({
             totalLength={data?.count}
             setOffset={setOffset}
             isPlaceholderData={isPlaceholderData}
-
           />
         </div>
       </div>

diff --git a/frontend/src/features/model-creation/components/training-area/training-area.tsx b/frontend/src/features/model-creation/components/training-area/training-area.tsx
@@ -65,7 +65,6 @@ const TrainingAreaForm = () => {
     });
   };
 
-
   return (
     <>
       <FileUploadDialog
-Original file line number
+Diff line change
@@ Expand Up / @@ -40,7 +40,6 @@ const TrainingAreaList = ({ @@
                 totalLength={data?.count}
                 setOffset={setOffset}
                 isPlaceholderData={isPlaceholderData}
               />
             </div>
           </div>
@@ Expand Down @@