From 36a905d8e83d7031e62aa9b6560ad3905649bb39 Mon Sep 17 00:00:00 2001 From: illia prokopchuk Date: Tue, 10 Oct 2023 10:15:41 +0300 Subject: [PATCH] Fix [Functions panel] The "Save" and "Deploy" buttons shouldn't be enabled --- src/common/Input/input.scss | 11 +++++--- src/common/RangeInput/RangeInput.js | 6 ++-- .../FeatureSetsPanel/FeatureSetsPanel.js | 2 ++ .../FeatureSetsPanelTargetStore.js | 10 ++++++- .../FeatureSetsPanelTargetStoreView.js | 14 +++++++--- .../FunctionsPanelResources.js | 3 +- .../PartitionFields/PartitionFields.js | 28 ++++++++----------- 7 files changed, 46 insertions(+), 28 deletions(-) diff --git a/src/common/Input/input.scss b/src/common/Input/input.scss index c94425ed4..a08008ae7 100644 --- a/src/common/Input/input.scss +++ b/src/common/Input/input.scss @@ -5,6 +5,7 @@ .input { @import '../../scss/main.scss'; + @include fieldWrapperOld; &::placeholder { @@ -143,6 +144,7 @@ &.active-label { top: 9px; + height: auto; font-weight: 700; font-size: 10px; line-height: 12px; @@ -154,13 +156,14 @@ } &-floating { - display: flex; - align-items: center; position: absolute; - top: 15px; + top: unset; left: 16px; + display: flex; + align-items: center; + height: 100%; color: $topaz; - transition: 300ms ease all; + transition: 300ms linear all; } &_disabled { diff --git a/src/common/RangeInput/RangeInput.js b/src/common/RangeInput/RangeInput.js index f402b8fd5..1430c0f58 100644 --- a/src/common/RangeInput/RangeInput.js +++ b/src/common/RangeInput/RangeInput.js @@ -122,8 +122,10 @@ const RangeInput = ({ min={min} max={max} onChange={value => { - setInputValue(Number(value)) - onChange(Number(value)) + const targetValue = value.length === 0 ? '' : Number(value) + + setInputValue(targetValue) + onChange(targetValue) }} tip={tip} required={required} diff --git a/src/components/FeatureSetsPanel/FeatureSetsPanel.js b/src/components/FeatureSetsPanel/FeatureSetsPanel.js index 331217c23..c3c52c7bf 100644 --- a/src/components/FeatureSetsPanel/FeatureSetsPanel.js +++ b/src/components/FeatureSetsPanel/FeatureSetsPanel.js @@ -56,7 +56,9 @@ const FeatureSetsPanel = ({ isOnlineTargetPathValid: true, isOfflineTargetPathValid: true, isExternalOfflineTargetPathValid: true, + isOfflinePartitionBucketsValid: true, isOfflinePartitionColumnsValid: true, + isExternalOfflinePartitionBucketsValid: true, isExternalOfflinePartitionColumnsValid: true, isTargetStoreValid: true, isTimestampKeyValid: true, diff --git a/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStore.js b/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStore.js index b4e1e01cf..a44bf8eee 100644 --- a/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStore.js +++ b/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStore.js @@ -20,7 +20,7 @@ such restriction. import React, { useCallback, useEffect, useMemo, useState } from 'react' import { connect, useSelector } from 'react-redux' import PropTypes from 'prop-types' -import { cloneDeep, isEmpty } from 'lodash' +import { cloneDeep, isEmpty, isNumber } from 'lodash' import FeatureSetsPanelTargetStoreView from './FeatureSetsPanelTargetStoreView' import { ConfirmDialog } from 'igz-controls/components' @@ -253,6 +253,14 @@ const FeatureSetsPanelTargetStore = ({ } })) + setValidation(state => ({ + ...state, + [kind === PARQUET + ? 'isOfflinePartitionBucketsValid' + : 'isExternalOfflinePartitionBucketsValid']: + isNumber(key_bucketing_number) && Number(key_bucketing_number) >= 0 + })) + setNewFeatureSetTarget( featureStore.newFeatureSet.spec.targets.map(targetKind => { if (targetKind.name === kind) { diff --git a/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStoreView.js b/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStoreView.js index 49dc083bb..170103839 100644 --- a/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStoreView.js +++ b/src/components/FeatureSetsPanel/FeatureSetsPanelTargetStore/FeatureSetsPanelTargetStoreView.js @@ -335,7 +335,7 @@ const FeatureSetsPanelTargetStoreView = ({ partitionRadioButtonsState={partitionRadioButtonsState.parquet} rangeOnChange={value => handleKeyBucketingNumberChange(value, PARQUET)} selectedPartitionKind={selectedPartitionKind.parquet} - setValidation={value => + setPartitionColumnsValidation={value => setValidation(state => ({ ...state, isOfflinePartitionColumnsValid: value @@ -347,7 +347,10 @@ const FeatureSetsPanelTargetStoreView = ({ triggerPartitionAdvancedCheckboxes={value => triggerPartitionAdvancedCheckboxes(value, PARQUET) } - validation={validation.isOfflinePartitionColumnsValid} + validation={{ + partitionBuckets: validation.isOfflinePartitionBucketsValid, + partitionColumns: validation.isOfflinePartitionColumnsValid + }} /> @@ -436,7 +439,7 @@ const FeatureSetsPanelTargetStoreView = ({ handleKeyBucketingNumberChange(value, EXTERNAL_OFFLINE) } selectedPartitionKind={selectedPartitionKind.externalOffline} - setValidation={value => + setPartitionColumnsValidation={value => setValidation(state => ({ ...state, isExternalOfflinePartitionColumnsValid: value @@ -448,7 +451,10 @@ const FeatureSetsPanelTargetStoreView = ({ triggerPartitionAdvancedCheckboxes={value => triggerPartitionAdvancedCheckboxes(value, EXTERNAL_OFFLINE) } - validation={validation.isExternalOfflinePartitionColumnsValid} + validation={{ + partitionBuckets: validation.isExternalOfflinePartitionBucketsValid, + partitionColumns: validation.isExternalOfflinePartitionColumnsValid + }} /> diff --git a/src/elements/FunctionsPanelResources/FunctionsPanelResources.js b/src/elements/FunctionsPanelResources/FunctionsPanelResources.js index 2b7ce7818..a1650cea7 100644 --- a/src/elements/FunctionsPanelResources/FunctionsPanelResources.js +++ b/src/elements/FunctionsPanelResources/FunctionsPanelResources.js @@ -19,6 +19,7 @@ such restriction. */ import React, { useEffect, useMemo, useState } from 'react' import { connect } from 'react-redux' +import { isNumber } from 'lodash' import PropTypes from 'prop-types' import FunctionsPanelResourcesView from './FunctionsPanelResourcesView' @@ -371,7 +372,7 @@ const FunctionsPanelResources = ({ const setGpuValue = value => { let isValid = true - if (value && Number(value) <= 0) { + if (isNumber(value) && Number(value) <= 0) { isValid = false } diff --git a/src/elements/PartitionFields/PartitionFields.js b/src/elements/PartitionFields/PartitionFields.js index 1a9ded840..c2c562f68 100644 --- a/src/elements/PartitionFields/PartitionFields.js +++ b/src/elements/PartitionFields/PartitionFields.js @@ -41,7 +41,7 @@ const PartitionFields = ({ partitionRadioButtonsState, rangeOnChange, selectedPartitionKind, - setValidation, + setPartitionColumnsValidation, timePartitioningGranularityChange, triggerPartitionAdvancedCheckboxes, validation @@ -76,19 +76,18 @@ const PartitionFields = ({ labelType="floatingLabel" label="Number of Buckets" required + invalid={!validation.partitionBuckets} min={0} onChange={rangeOnChange} tip={ - If you partition by key and the number of unique keys is very - high it is recommended to use buckets for better performance. In - this case the path would be - path/bucket-num/year=/month=/day= etc.. In case the - value is 0 then no bucketing will be done and your data will be - partitioned by key. + If you partition by key and the number of unique keys is very high it is recommended + to use buckets for better performance. In this case the path would be + path/bucket-num/year=/month=/day= etc.. In case the value is 0 then no + bucketing will be done and your data will be partitioned by key. } - value={data.key_bucketing_number || 1} + value={data.key_bucketing_number} /> )} {selectedPartitionKind.includes('byTime') && ( @@ -105,12 +104,12 @@ const PartitionFields = ({