Skip to content

Commit

Permalink
Merge branch 'feat/replace-select-v5' into feat/replace-select-v4
Browse files Browse the repository at this point in the history
  • Loading branch information
@shivani170
shivani170 committed Oct 1, 2024
2 parents fd47299 + d91d3a4 commit 1ed48fa
Show file tree
Hide file tree
Showing 6 changed files with 33 additions and 57 deletions.
7 changes: 2 additions & 5 deletions src/components/CIPipelineN/TaskTypeDetailComponent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,8 @@ import {
CustomInput,
ClipboardButton,
SelectPicker,
SelectPickerVariantType,
ComponentSizeType,
} from '@devtron-labs/devtron-fe-common-lib'
import CreatableSelect from 'react-select/creatable'
import { components } from 'react-select'
import { TaskFieldDescription, TaskFieldLabel } from '../ciPipeline/types'
import OutputDirectoryPath from './OutputDirectoryPath'
Expand All @@ -40,10 +38,8 @@ import CustomScript from './CustomScript'
import { ReactComponent as AlertTriangle } from '../../assets/icons/ic-alert-triangle.svg'
import { getCustomOptionSelectionStyle } from '../v2/common/ReactSelect.utils'
import { OptionType } from '../app/types'
import { containerImageSelectStyles } from './ciPipeline.utils'
import { ValidationRules } from '../ciPipeline/validationRules'
import { ReactComponent as Info } from '../../assets/icons/ic-info-filled.svg'
import { ValueContainerImage as ValueContainer } from '../app/details/appDetails/utils'
import { pipelineContext } from '../workflowEditor/workflowEditor'

export const TaskTypeDetailComponent = () => {
Expand Down Expand Up @@ -243,8 +239,9 @@ export const TaskTypeDetailComponent = () => {
/>

<div className="dc__position-rel">
<SelectPicker
<SelectPicker
inputId='container-image-select'
isCreatableSingleSelect

Check failure on line 244 in src/components/CIPipelineN/TaskTypeDetailComponent.tsx

View workflow job for this annotation

GitHub Actions / ci 

Type '{ inputId: string; isCreatableSingleSelect: true; value: OptionType; options: { label: string; value: string; }[]; placeholder: string; onChange: (selectedValue: OptionType) => void; ... 4 more ...; onKeyDown: (event: any) => void; }' is not assignable to type 'IntrinsicAttributes & SelectPickerProps<string, boolean>'.
value={selectedContainerImage}
options={containerImageOptions}
placeholder="Select container image or input value"
Expand Down
32 changes: 7 additions & 25 deletions src/components/app/details/appDetails/utils.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,10 @@
import moment from 'moment'
import React from 'react'
import { components } from 'react-select'
import CreatableSelect from 'react-select/creatable'
import { AggregationKeys } from '../../types'
import { getVersionArr, isVersionLessThanOrEqualToTarget, DayPickerRangeControllerPresets } from '../../../common'
import { ReactComponent as ArrowDown } from '../../../../assets/icons/ic-chevron-down.svg'
import { ChartTypes, AppMetricsTabType, StatusType, StatusTypes } from './appDetails.type'
import { ZERO_TIME_STRING, Nodes, NodeType } from '@devtron-labs/devtron-fe-common-lib'
import { ZERO_TIME_STRING, Nodes, NodeType, SelectPicker } from '@devtron-labs/devtron-fe-common-lib'

export function getAggregator(nodeType: NodeType, defaultAsOtherResources?: boolean): AggregationKeys {
switch (nodeType) {
Expand Down Expand Up @@ -74,13 +72,6 @@ export function getAggregator(nodeType: NodeType, defaultAsOtherResources?: bool
}
}

export const DropdownIndicator = (props) => {
return (
<components.DropdownIndicator {...props}>
<ArrowDown className="icon-dim-20 fcn-6" />
</components.DropdownIndicator>
)
}

const throughputAndLatencySelectStyle = {
container: (base, state) => ({
Expand Down Expand Up @@ -118,8 +109,9 @@ const throughputAndLatencySelectStyle = {

export const ThroughputSelect = (props) => {
return (
<CreatableSelect
className=""
<SelectPicker
isCreatableSingleSelect

Check failure on line 113 in src/components/app/details/appDetails/utils.tsx

View workflow job for this annotation

GitHub Actions / ci 

Type '{ isCreatableSingleSelect: true; inputId: string; placeholder: string; value: { label: any; value: any; }; options: { label: string; value: string; }[]; onChange: any; }' is not assignable to type 'IntrinsicAttributes & SelectPickerProps<any, boolean>'.
inputId="throughput-select"
placeholder="Status Code"
value={{ label: props.status, value: props.status }}
options={[
Expand All @@ -132,19 +124,15 @@ export const ThroughputSelect = (props) => {
{ label: 'Throughput', value: 'Throughput' },
]}
onChange={props.handleStatusChange}
styles={throughputAndLatencySelectStyle}
components={{
IndicatorSeparator: null,
DropdownIndicator,
}}
/>
)
}

export const LatencySelect = (props) => {
return (
<CreatableSelect
className=""
<SelectPicker
inputId='latency-select'
isCreatableSingleSelect

Check failure on line 135 in src/components/app/details/appDetails/utils.tsx

View workflow job for this annotation

GitHub Actions / ci 

Type '{ inputId: string; isCreatableSingleSelect: true; placeholder: string; value: { label: any; value: any; }; options: { label: string; value: string; }[]; onChange: any; }' is not assignable to type 'IntrinsicAttributes & SelectPickerProps<any, boolean>'.
placeholder="Latency"
value={{ label: props.latency, value: props.latency }}
options={[
Expand All @@ -154,12 +142,6 @@ export const LatencySelect = (props) => {
{ label: '95', value: '95' },
]}
onChange={props.handleLatencyChange}
styles={throughputAndLatencySelectStyle}
components={{
IndicatorSeparator: null,
DropdownIndicator,
}}
formatCreateLabel={(inputValue) => inputValue}
/>
)
}
Expand Down
8 changes: 6 additions & 2 deletions src/components/cdPipeline/BuildCD.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ import { useParams, useHistory } from 'react-router-dom'
import yamlJsParser from 'yaml'
import error from '../../assets/icons/misc/errorInfo.svg'
import { ReactComponent as AlertTriangle } from '../../assets/icons/ic-alert-triangle.svg'
import { ENV_ALREADY_EXIST_ERROR, TriggerType, URLS, ViewType } from '../../config'
import { ENV_ALREADY_EXIST_ERROR, RegistryPayloadWithSelectType, TriggerType, URLS, ViewType } from '../../config'
import { GeneratedHelmPush } from './cdPipeline.types'
import { createClusterEnvGroup, getDeploymentAppType, importComponentFromFELibrary, Select } from '../common'
import { Info } from '../common/icons/Icons'
Expand Down Expand Up @@ -335,7 +335,11 @@ export default function BuildCD({
formDataError.containerRegistryError = validationRules.containerRegistry(
selectedRegistry.id || formData.containerRegistryName,
)
form.selectedRegistry = selectedRegistry
form.selectedRegistry = { ...selectedRegistry,
value: selectedRegistry.id,
label: selectedRegistry.id,
startIcon: <div className={`dc__registry-icon ${selectedRegistry.registryType}`} />
} as RegistryPayloadWithSelectType
form.containerRegistryName = selectedRegistry.id
setFormData(form)
setFormDataErrorObj(formDataError)
Expand Down
14 changes: 10 additions & 4 deletions src/components/cdPipeline/CDPipeline.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ import {
import { useEffect, useMemo, useRef, useState } from 'react'
import { Redirect, Route, Switch, useParams, useRouteMatch } from 'react-router-dom'
import { ReactComponent as Close } from '../../assets/icons/ic-close.svg'
import { CDDeploymentTabText, SourceTypeMap, TriggerType, ViewType } from '../../config'
import { CDDeploymentTabText, RegistryPayloadType, SourceTypeMap, TriggerType, ViewType } from '../../config'
import {
FloatingVariablesSuggestions,
getPluginIdsFromBuildStage,
Expand Down Expand Up @@ -582,6 +582,9 @@ export default function CDPipeline({
}
}
}
const _dockerRegistries: RegistryPayloadType = dockerRegistries.find(
(dockerRegistry) => dockerRegistry.id === pipelineConfigFromRes.containerRegistryName,
)
form.preStageConfigMapSecretNames = {
configMaps: pipelineConfigFromRes.preStageConfigMapSecretNames.configMaps
? pipelineConfigFromRes.preStageConfigMapSecretNames.configMaps.map((configmap) => {
Expand Down Expand Up @@ -624,9 +627,12 @@ export default function CDPipeline({
pipelineConfigFromRes.deploymentAppType === DeploymentAppTypes.MANIFEST_PUSH
? GeneratedHelmPush.PUSH
: GeneratedHelmPush.DO_NOT_PUSH
form.selectedRegistry = dockerRegistries.find(
(dockerRegistry) => dockerRegistry.id === pipelineConfigFromRes.containerRegistryName,
)
form.selectedRegistry = {
..._dockerRegistries,
value: _dockerRegistries?.id,
label: _dockerRegistries?.id,
startIcon: <div className={`dc__registry-icon ${_dockerRegistries?.registryType}`} /> || null,
}
}

const responseCode = () => {
Expand Down
25 changes: 5 additions & 20 deletions src/components/ciConfig/CIBuildpackBuildOptions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,7 @@

import { useEffect, useState } from 'react'
import { components } from 'react-select'
import CreatableSelect from 'react-select/creatable'
import { CIBuildType, ComponentSizeType, CustomInput, InfoIconTippy, SelectPicker, SelectPickerVariantType } from '@devtron-labs/devtron-fe-common-lib'
import {
DropdownIndicator,
getCommonSelectStyle,
Option,
} from '../v2/common/ReactSelect.utils'
import { CIBuildType, ComponentSizeType, CustomInput, InfoIconTippy, SelectPicker } from '@devtron-labs/devtron-fe-common-lib'
import { ReactComponent as GitLab } from '../../assets/icons/git/gitlab.svg'
import { ReactComponent as Git } from '../../assets/icons/git/git.svg'
import { ReactComponent as GitHub } from '../../assets/icons/git/github.svg'
Expand Down Expand Up @@ -469,8 +463,6 @@ export default function CIBuildpackBuildOptions({
)
}

const formatCreateLabel = (inputValue: string) => `Use '${inputValue}'`

const projectPathVal = readOnly ? ciBuildConfig.buildPackConfig?.projectPath : projectPath.value

if (readOnly) {
Expand Down Expand Up @@ -616,6 +608,7 @@ export default function CIBuildpackBuildOptions({
isSearchable={false}
onChange={handleVersionSelection}
size={ComponentSizeType.large}
isCreatableSingleSelect

Check failure on line 611 in src/components/ciConfig/CIBuildpackBuildOptions.tsx

View workflow job for this annotation

GitHub Actions / ci 

Type '{ inputId: string; classNamePrefix: string; isLoading: boolean; options: { description: string; infoText?: string; value: string; label: string; startIcon?: ReactElement<any, string | JSXElementConstructor<any>>; category?: number; icon?: string; }[]; ... 4 more ...; isCreatableSingleSelect: true; }' is not assignable to type 'IntrinsicAttributes & SelectPickerProps<string, boolean>'.
/>
</div>
</div>
Expand All @@ -625,25 +618,17 @@ export default function CIBuildpackBuildOptions({
<BuilderTippy />
</label>

<CreatableSelect
<SelectPicker
inputId="build-pack-builder"
isCreatableSingleSelect

Check failure on line 623 in src/components/ciConfig/CIBuildpackBuildOptions.tsx

View workflow job for this annotation

GitHub Actions / ci 

Type '{ inputId: string; isCreatableSingleSelect: true; classNamePrefix: string; placeholder: string; isLoading: boolean; options: BuilderIdOptionType[]; value: BuilderIdOptionType; onChange: (selected: BuilderIdOptionType) => void; }' is not assignable to type 'IntrinsicAttributes & SelectPickerProps<string, boolean>'.
classNamePrefix="build-pack-select-builder-dropdown"
placeholder={CI_BUILDPACK_OPTION_TEXTS.BuilderTippyContent.selectBuilder}
className="m-0"
tabIndex={3}
isLoading={!builderLanguageSupportMap?.[buildersAndFrameworks.selectedLanguage?.value]}
options={
builderLanguageSupportMap?.[buildersAndFrameworks.selectedLanguage?.value]
?.BuilderLanguageMetadata
}
value={buildersAndFrameworks.selectedBuilder}
formatCreateLabel={formatCreateLabel}
styles={getCommonSelectStyle(BUILDER_SELECT_STYLES)}
components={{
IndicatorSeparator: null,
DropdownIndicator,
Option,
MenuList: menuListComponent,
}}
onChange={handleBuilderSelection}
/>
</div>
Expand Down
4 changes: 3 additions & 1 deletion src/config/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
* limitations under the License.
*/

import { DOCUMENTATION_HOME_PAGE, DOCUMENTATION_VERSION, ToastManager } from '@devtron-labs/devtron-fe-common-lib'
import { DOCUMENTATION_HOME_PAGE, DOCUMENTATION_VERSION, SelectPickerOptionType, ToastManager } from '@devtron-labs/devtron-fe-common-lib'
export const DEFAULT_STATUS = 'checking'
export const DEFAULT_STATUS_TEXT = 'Checking Status'
export const DEFAULTK8SVERSION = 'v1.16.0'
Expand Down Expand Up @@ -570,6 +570,8 @@ export interface RegistryPayloadType {
}
}

export interface RegistryPayloadWithSelectType extends RegistryPayloadType, SelectPickerOptionType {}

export const RegistryType = {
DOCKER_HUB: 'docker-hub',
ACR: 'acr',
Expand Down

0 comments on commit 1ed48fa

Please sign in to comment.