4109 - ODP edit: Methods used MultiSelect refactor (#4110)

openforis · Nov 13, 2024 · edbccb6 · edbccb6
1 parent 1028acc
commit edbccb6
Show file tree

Hide file tree

Showing 8 changed files with 8 additions and 216 deletions.
diff --git a/src/client/components/MultiSelect/MultiSelect.scss b/src/client/components/MultiSelect/MultiSelect.scss
diff --git a/src/client/components/MultiSelect/MultiSelect.tsx b/src/client/components/MultiSelect/MultiSelect.tsx
diff --git a/src/client/components/MultiSelect/index.ts b/src/client/components/MultiSelect/index.ts
diff --git a/src/client/components/MultiSelect/option.ts b/src/client/components/MultiSelect/option.ts
diff --git a/src/client/pages/OriginalDataPoint/OriginalDataPointSection.scss b/src/client/pages/OriginalDataPoint/OriginalDataPointSection.scss
@@ -22,19 +22,6 @@
 // custom data grid
 .odp__section {
   .data-grid {
-    // TODO: multi select refactor style
-    .multi-select__closed-content {
-      padding: $spacing-xxs;
-    }
-
-    // TODO: multi select refactor style
-    .multi-select__opened {
-      border-radius: unset;
-      top: -1px;
-      left: -1px;
-      width: calc(100% + 2px);
-    }
-
     svg.icon-reference-files {
       stroke: none;
     }

diff --git a/src/client/pages/OriginalDataPoint/components/DataSources/MethodsUsed/MethodsUsed.tsx b/src/client/pages/OriginalDataPoint/components/DataSources/MethodsUsed/MethodsUsed.tsx
@@ -5,8 +5,7 @@ import { ODPDataSourceMethod, OriginalDataPoint } from 'meta/assessment/original
 import { Topics } from 'meta/messageCenter'
 
 import { DataCell, DataRow, DataRowAction, DataRowActionType } from 'client/components/DataGrid'
-import MultiSelect from 'client/components/MultiSelect'
-import { Option } from 'client/components/MultiSelect/option'
+import Select, { Option } from 'client/components/Inputs/Select'
 import { useShowReviewIndicator } from 'client/pages/OriginalDataPoint/hooks/useShowReviewIndicator'
 
 import { useIsDisabled } from '../hooks/useIsDisabled'
@@ -59,11 +58,12 @@ const MethodsUsed: React.FC<Props> = (props: Props) => {
     <DataRow actions={actions}>
       <DataCell header>{t('nationalDataPoint.methodsUsed')}</DataCell>
       <DataCell lastCol>
-        <MultiSelect
+        <Select
           disabled={disabled}
+          isMulti
           onChange={onChange}
           options={options}
-          values={originalDataPoint.dataSourceMethods ?? []}
+          value={originalDataPoint.dataSourceMethods ?? []}
         />
       </DataCell>
     </DataRow>

diff --git a/src/client/pages/Print/style.scss b/src/client/pages/Print/style.scss
@@ -49,10 +49,6 @@
     padding: 10px 0;
   }
 
-  .multi-select__placeholder {
-    display: none;
-  }
-
   .assessment-section__table-title {
     margin-bottom: 16px;
   }

diff --git a/src/client/styles/rtl.scss b/src/client/styles/rtl.scss
@@ -97,11 +97,6 @@
     left: 24px;
   }
 
-  .multi-select__opened-item-label {
-    margin-right: 6px;
-    margin-left: initial;
-  }
-
   .edit-user__form-label {
     padding-right: initial;
     padding-left: 14px;
@@ -159,10 +154,10 @@
     margin-right: 4px;
   }
 
-  .multi-select,
-  .multi-select:not([disabled]) {
-    background-position: left 10px top 50%;
-  }
+  //.multi-select,
+  //.multi-select:not([disabled]) {
+  //  background-position: left 10px top 50%;
+  //}
 
   .autosave-status {
     right: initial;