Impl [General] Hide unimplemented UI elements (#188)

mlrun · Jul 27, 2020 · a2809f7 · a2809f7
1 parent dea909e
commit a2809f7
Show file tree

Hide file tree

Showing 5 changed files with 83 additions and 54 deletions.
diff --git a/src/components/CreateJobPage/createJobPage.scss b/src/components/CreateJobPage/createJobPage.scss
@@ -11,20 +11,26 @@
     padding: 18px;
     background-color: $white;
 
-    .header-link {
-      display: flex;
-      align-items: center;
+    .header {
+      &-link {
+        display: flex;
+        align-items: center;
+
+        &__title {
+          margin: 0 18px;
+          font-weight: 500;
+          font-size: 20px;
+          line-height: 23px;
+          color: $primary
+        }
 
-      &__title {
-        margin: 0 18px;
-        font-weight: 500;
-        font-size: 20px;
-        line-height: 23px;
-        color: $primary
+        &__icon {
+          margin-bottom: -4px;
+        }
       }
 
-      &__icon {
-        margin-bottom: -4px;
+      &-buttons {
+        display: none;
       }
     }
   }

diff --git a/src/components/FilterMenu/FilterMenu.js b/src/components/FilterMenu/FilterMenu.js
@@ -91,46 +91,65 @@ const FilterMenu = ({
   return (
     <>
       <div className="filters">
-        {filters.map(filter =>
-          filter === 'tree' ? (
-            <ArtifactFilterTree
-              key={filter}
-              value={valueFilterTree || 'Latest'}
-              label="Tree:"
-              items={itemsFilterTree}
-              match={match}
-              onChange={handleChangeArtifactFilterTree}
-              page={page}
-            />
-          ) : filter === 'labels' || filter === 'name' ? (
-            <Input
-              type="text"
-              label={filter === 'labels' ? 'labels:' : 'name:'}
-              placeholder={filter === 'labels' ? 'key1=value1,…' : ''}
-              key={filter}
-              onChange={filter === 'labels' ? setLabels : setName}
-              value={filter === 'labels' ? labels : name}
-              onKeyDown={onKeyDown}
-            />
-          ) : (
-            <Select
-              options={selectOptions[filter]}
-              label={`${filter.replace(/([A-Z])/g, ' $1')}:`}
-              key={filter}
-              selectedId={
-                (filter === 'status' && stateFilter) ||
-                (filter === 'groupBy' && groupFilter)
-              }
-              selectType={filter === 'status' ? 'checkbox' : ''}
-              match={match}
-              onClick={
-                (filter === 'status' && setStateFilter) ||
-                (filter === 'groupBy' && setGroupFilter)
-              }
-              page={page}
-            />
-          )
-        )}
+        {filters.map(filter => {
+          switch (filter) {
+            case 'tree':
+              return (
+                <ArtifactFilterTree
+                  key={filter}
+                  value={valueFilterTree || 'Latest'}
+                  label="Tree:"
+                  items={itemsFilterTree}
+                  match={match}
+                  onChange={handleChangeArtifactFilterTree}
+                  page={page}
+                />
+              )
+            case 'labels':
+              return (
+                <Input
+                  type="text"
+                  label="labels:"
+                  placeholder="key1=value1,…"
+                  key={filter}
+                  onChange={setLabels}
+                  value={labels}
+                  onKeyDown={onKeyDown}
+                />
+              )
+            case 'name':
+              return (
+                <Input
+                  type="text"
+                  label="name:"
+                  key={filter}
+                  onChange={setName}
+                  value={name}
+                  onKeyDown={onKeyDown}
+                />
+              )
+            default:
+              return (
+                <Select
+                  className={filter === 'period' ? 'period-filter' : ''}
+                  options={selectOptions[filter]}
+                  label={`${filter.replace(/([A-Z])/g, ' $1')}:`}
+                  key={filter}
+                  selectedId={
+                    (filter === 'status' && stateFilter) ||
+                    (filter === 'groupBy' && groupFilter)
+                  }
+                  selectType={filter === 'status' ? 'checkbox' : ''}
+                  match={match}
+                  onClick={
+                    (filter === 'status' && setStateFilter) ||
+                    (filter === 'groupBy' && setGroupFilter)
+                  }
+                  page={page}
+                />
+              )
+          }
+        })}
         {page === FUNCTIONS_PAGE && (
           <CheckBox
             className="filters-checkbox"

diff --git a/src/components/FilterMenu/filterMenu.scss b/src/components/FilterMenu/filterMenu.scss
@@ -27,6 +27,10 @@
   .filters-checkbox {
     margin-bottom: 15px;
   }
+
+  .period-filter {
+    display: none;
+  }
 }
 
 .buttons {

diff --git a/src/components/ScheduleJob/ScheduleJob.js b/src/components/ScheduleJob/ScheduleJob.js
@@ -32,7 +32,7 @@ const ScheduleJob = ({ handleRunJob, match, setOpenScheduleJob }) => {
   })
   const [date, setDate] = useState('')
   const [time, setTime] = useState('')
-  const [isRecurring, setIsRecurring] = useState('')
+  const [isRecurring, setIsRecurring] = useState('recurring')
   const [recurringState, recurringDispatch] = useReducer(
     recurringReducer,
     initialState

diff --git a/src/components/ScheduleJobSimple/scheduleJobSimple.scss b/src/components/ScheduleJobSimple/scheduleJobSimple.scss
@@ -6,7 +6,7 @@
     min-width: 230px;
 
     &_container {
-      display: flex;
+      display: none;
     }
   }
 
@@ -16,7 +16,7 @@
   }
 
   .checkbox_container {
-    display: flex;
+    display: none;
     margin: 23px 0;
     padding: 10px 10px 10px 0;
   }