Skip to content

Commit 8a30da0

Browse files
Ash-expAsh-exp
committed
fixed: registry issues
1 parent 3f3dce5 commit 8a30da0

File tree

2 files changed

+155
-127
lines changed

2 files changed

+155
-127
lines changed

‎src/components/dockerRegistry/Docker.tsx

Lines changed: 145 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ import {
4444
RegistryType,
4545
EA_MODE_REGISTRY_TITLE_DESCRIPTION_CONTENT,
4646
URLS,
47+
PATTERNS,
4748
} from '../../config'
4849
import Tippy from '@tippyjs/react'
4950
import { ReactComponent as Dropdown } from '../../assets/icons/ic-chevron-down.svg'
@@ -64,6 +65,7 @@ import { ReactComponent as InfoIcon } from '../../assets/icons/info-filled.svg'
6465
import { VALIDATION_STATUS, ValidateForm } from '../common/ValidateForm/ValidateForm'
6566
import { ReactComponent as ErrorInfo } from '../../assets/icons/misc/errorInfo.svg'
6667
import { ReactComponent as AlertTriangle } from '../../assets/icons/ic-alert-triangle.svg'
68+
import { SwitchTransition } from 'react-transition-group'
6769

6870
const RegistryHelmPushCheckbox = importComponentFromFELibrary('RegistryHelmPushCheckbox')
6971

@@ -322,18 +324,15 @@ function DockerForm({
322324
},
323325
...rest
324326
}) {
327+
const re = PATTERNS.APP_NAME
328+
const regExp = new RegExp(re)
325329
const { state, disable, handleOnChange, handleOnSubmit } = useForm(
326330
{
327-
id: { value: id, error: '' },
328331
registryType: { value: registryType || 'ecr', error: '' },
329332
advanceSelect: { value: connection || CERTTYPE.SECURE, error: '' },
330333
certInput: { value: cert || '', error: '' },
331334
},
332335
{
333-
id: {
334-
required: true,
335-
validator: { error: 'Do not use "/" ', regex: /^[^/]+$/ },
336-
},
337336
registryType: {
338337
required: true,
339338
validator: { error: 'Type is required', regex: /^.*$/ },
@@ -361,6 +360,7 @@ function DockerForm({
361360
: password
362361

363362
const [customState, setCustomState] = useState({
363+
id: { value: id, error: '' },
364364
awsAccessKeyId: { value: awsAccessKeyId, error: '' },
365365
awsSecretAccessKey: {
366366
value: id && !awsSecretAccessKey ? DEFAULT_SECRET_PLACEHOLDER : awsSecretAccessKey,
@@ -372,8 +372,29 @@ function DockerForm({
372372
value: id && !password ? DEFAULT_SECRET_PLACEHOLDER : regPass,
373373
error: '',
374374
},
375-
repositoryList: { value: repositoryList.join(',') || '', error: '' },
375+
repositoryList: {
376+
value: repositoryList.join(', ') || '',
377+
error: '',
378+
},
376379
})
380+
const customStateValidator = {
381+
id: [
382+
{ error: 'Name is required', regex: /^(?=.*).{1,}$/ },
383+
{
384+
error: "Start with alphabet; End with alphanumeric; Use only lowercase; Allowed:(-); Do not use 'spaces'",
385+
regex: regExp,
386+
},
387+
{ error: 'Minimum 3 and Maximum 30 characters required', regex: /^.{3,30}$/ }
388+
],
389+
registryUrl: [{ error: "Registry URL is required; Do not use 'spaces'", regex: /^(?=.*).{1,}$/ }],
390+
repositoryList: [
391+
{ error: "Registry List is required", regex: /^(?=.*).{1,}$/ },
392+
{ error: "Do not use 'spaces' or ',' at the start or at the end; new lines are not allowed", regex: /^(?!.*[\s,]$)(?!^[\s,]).*?(?<!\s)$/ },
393+
{ error: "Use only one 'space' after ','", regex: /^(?!.*,\s{2,}).*/ },
394+
{ error: "Consecutive ',' are not allowed", regex: /^(?!.*,{2,}).*/ },
395+
{ error: "Repository name cannot be empty and must be separated by ','", regex: /^(?!.*,\s{1,},).*/ }
396+
],
397+
}
377398

378399
const clusterlistMap = new Map()
379400

@@ -443,24 +464,36 @@ function DockerForm({
443464
? `${URLS.CHARTS_DISCOVER}?registryId=${id}`
444465
: URLS.CHARTS_DISCOVER
445466

446-
function customHandleChange(e) {
447-
setCustomState((st) => ({ ...st, [e.target.name]: { value: e.target.value, error: '' } }))
467+
const customHandleChange = (e): void => {
468+
updateWithCustomStateValidation(e.target.name, e.target.value)
469+
}
470+
471+
const updateWithCustomStateValidation = (name: string, value: any): Boolean => {
472+
let errorMessage: string = ''
473+
customStateValidator[name]?.forEach((validator) => {
474+
if (!validator.regex.test(value)) {
475+
errorMessage = validator.error
476+
return
477+
}
478+
})
479+
setCustomState((st) => ({ ...st, [name]: { value, error: errorMessage } }))
480+
return !!errorMessage
448481
}
449482

450483
const handleRegistryTypeChange = (selectedRegistry) => {
451484
setSelectedDockerRegistryType(selectedRegistry)
452485
setCustomState((st) => ({
453486
...st,
454-
username: { value: selectedRegistry.id.defaultValue, error: '' },
455487
registryUrl: { value: selectedRegistry.defaultRegistryURL, error: '' },
488+
username: { value: selectedRegistry.id.defaultValue, error: '' },
489+
password: { value: selectedRegistry.password.defaultValue, error: '' },
490+
awsAccessKeyId: { value: "", error: '' },
491+
awsSecretAccessKey: { value: "", error: '' },
456492
}))
457493
}
458494

459495
const handleRepositoryListChange = (e) => {
460-
setCustomState((st) => ({
461-
...st,
462-
repositoryList: { value: e.target?.value || '', error: '' },
463-
}))
496+
updateWithCustomStateValidation("repositoryList", e.target.value)
464497
}
465498

466499
const onECRAuthTypeChange = (e) => {
@@ -527,7 +560,7 @@ function DockerForm({
527560
? { CHART: OCIRegistryConfigConstants.PULL }
528561
: OCIRegistryStorageConfig
529562
return {
530-
id: state.id.value,
563+
id: customState.id.value,
531564
pluginId: 'cd.go.artifact.docker.registry',
532565
registryType: selectedDockerRegistryType.value,
533566
isDefault:
@@ -547,7 +580,10 @@ function DockerForm({
547580
(registryStorageType === RegistryStorageType.OCI_PUBLIC ||
548581
OCIRegistryStorageConfig?.CHART === OCIRegistryConfigConstants.PULL_PUSH ||
549582
OCIRegistryStorageConfig?.CHART === OCIRegistryConfigConstants.PULL)
550-
? customState.repositoryList?.value.split(',') || []
583+
? customState.repositoryList?.value
584+
.trim()
585+
.replace(', ', ',')
586+
.split(',') || []
551587
: null,
552588
registryUrl: customState.registryUrl.value
553589
?.trim()
@@ -694,133 +730,115 @@ function DockerForm({
694730
}
695731
}
696732

697-
function onValidation() {
698-
if (selectedDockerRegistryType.value === RegistryType.ECR) {
699-
if ( registryStorageType === RegistryStorageType.OCI_PRIVATE &&
700-
(!isIAMAuthType &&
701-
(!customState.awsAccessKeyId.value || !(customState.awsSecretAccessKey.value || id))) ||
702-
!customState.registryUrl.value
703-
) {
704-
setCustomState((st) => ({
705-
...st,
706-
awsAccessKeyId: { ...st.awsAccessKeyId, error: st.awsAccessKeyId.value ? '' : 'Mandatory' },
707-
awsSecretAccessKey: {
708-
...st.awsSecretAccessKey,
709-
error: id || st.awsSecretAccessKey.value ? '' : 'Mandatory',
710-
},
711-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
712-
}))
713-
return
714-
}
715-
if (!customState.registryUrl.value) {
716-
setCustomState((st) => ({
717-
...st,
718-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
719-
}))
720-
return
721-
}
722-
} else if (selectedDockerRegistryType.value === RegistryType.DOCKER_HUB) {
723-
if (
724-
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
725-
(!customState.username.value || !(customState.password.value || id))
726-
) {
727-
setCustomState((st) => ({
728-
...st,
729-
username: { ...st.username, error: st.username.value ? '' : 'Mandatory' },
730-
password: { ...st.password, error: id || st.password.value ? '' : 'Mandatory' },
731-
}))
732-
return
733-
}
734-
if (!customState.registryUrl.value) {
735-
setCustomState((st) => ({
736-
...st,
737-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
738-
}))
739-
return
740-
}
741-
} else if (
742-
selectedDockerRegistryType.value === RegistryType.ARTIFACT_REGISTRY ||
743-
selectedDockerRegistryType.value === RegistryType.GCR
744-
) {
745-
const isValidJsonFile = isValidJson(customState.password.value) || id
746-
const isValidJsonStr = isValidJsonFile ? '' : 'Invalid JSON'
747-
if (
748-
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
749-
(!customState.username.value || !(customState.password.value || id) || !isValidJsonFile)
750-
) {
751-
setCustomState((st) => ({
752-
...st,
753-
username: { ...st.username, error: st.username.value ? '' : 'Mandatory' },
754-
password: {
755-
...st.password,
756-
error: id || st.password.value ? isValidJsonStr : 'Mandatory',
757-
},
758-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
759-
}))
760-
return
761-
}
762-
if (!customState.registryUrl.value) {
763-
setCustomState((st) => ({
764-
...st,
765-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
766-
}))
767-
return
768-
}
769-
} else if (
770-
selectedDockerRegistryType.value === RegistryType.ACR ||
771-
selectedDockerRegistryType.value === RegistryType.QUAY ||
772-
selectedDockerRegistryType.value === RegistryType.OTHER
773-
) {
774-
let error = false
775-
if (registryStorageType !== RegistryStorageType.OCI_PUBLIC) {
733+
function onValidation() {
734+
// Custom state validation for Registry Id
735+
if (!id && updateWithCustomStateValidation("id", customState.id.value)) {
736+
return
737+
} else if (!customState.id.value ) {
738+
setCustomState((st) => ({
739+
...st,
740+
id: { ...st.id, error: 'Name is required' },
741+
}))
742+
return
743+
} else if (customState.id.value.includes("/")) {
744+
setCustomState((st) => ({
745+
...st,
746+
id: { ...st.id, error: 'Do not use "/"' },
747+
}))
748+
return
749+
}
750+
751+
// Custom state validation for Registry URL
752+
if (updateWithCustomStateValidation("registryUrl",customState.registryUrl.value)) {
753+
return
754+
}
755+
switch (selectedDockerRegistryType.value) {
756+
case RegistryType.ECR:
757+
if (registryStorageType === RegistryStorageType.OCI_PRIVATE &&
758+
(!isIAMAuthType &&
759+
(!customState.awsAccessKeyId.value || !(customState.awsSecretAccessKey.value || id)))
760+
) {
761+
setCustomState((st) => ({
762+
...st,
763+
awsAccessKeyId: { ...st.awsAccessKeyId, error: st.awsAccessKeyId.value ? '' : 'Mandatory' },
764+
awsSecretAccessKey: {
765+
...st.awsSecretAccessKey,
766+
error: id || st.awsSecretAccessKey.value ? '' : 'Mandatory',
767+
},
768+
}))
769+
return
770+
}
771+
break;
772+
case RegistryType.DOCKER_HUB:
776773
if (
777-
!customState.username.value ||
778-
!(customState.password.value || id) ||
779-
!customState.registryUrl.value
774+
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
775+
(!customState.username.value || !(customState.password.value || id))
780776
) {
781777
setCustomState((st) => ({
782778
...st,
783779
username: { ...st.username, error: st.username.value ? '' : 'Mandatory' },
784780
password: { ...st.password, error: id || st.password.value ? '' : 'Mandatory' },
785-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
786781
}))
787-
error = true
782+
return
783+
}
784+
break
785+
case RegistryType.ARTIFACT_REGISTRY:
786+
case RegistryType.GCR:
787+
const isValidJsonFile = isValidJson(customState.password.value) || id
788+
const isValidJsonStr = isValidJsonFile ? '' : 'Invalid JSON'
789+
if (
790+
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
791+
(!customState.username.value || !(customState.password.value || id) || !isValidJsonFile)
792+
) {
793+
setCustomState((st) => ({
794+
...st,
795+
username: { ...st.username, error: st.username.value ? '' : 'Mandatory' },
796+
password: {
797+
...st.password,
798+
error: id || st.password.value ? isValidJsonStr : 'Mandatory',
799+
},
800+
}))
801+
return
788802
}
789-
} else {
790-
if (!customState.registryUrl.value) {
803+
break
804+
case RegistryType.ACR:
805+
case RegistryType.QUAY:
806+
case RegistryType.OTHER:
807+
let error = false
808+
if (
809+
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
810+
(!customState.username.value || !(customState.password.value || id))
811+
) {
791812
setCustomState((st) => ({
792813
...st,
793-
registryUrl: { ...st.registryUrl, error: st.registryUrl.value ? '' : 'Mandatory' },
814+
username: { ...st.username, error: st.username.value ? '' : 'Mandatory' },
815+
password: { ...st.password, error: id || st.password.value ? '' : 'Mandatory' },
794816
}))
795817
error = true
796818
}
797-
}
798819

799-
if (
800-
selectedDockerRegistryType.value === RegistryType.OTHER &&
801-
state.advanceSelect.value === CERTTYPE.SECURE_WITH_CERT
802-
) {
803-
if (state.certInput.value === '') {
804-
if (!toggleCollapsedAdvancedRegistry) {
805-
setToggleCollapsedAdvancedRegistry(not)
820+
if (
821+
selectedDockerRegistryType.value === RegistryType.OTHER &&
822+
state.advanceSelect.value === CERTTYPE.SECURE_WITH_CERT
823+
) {
824+
if (state.certInput.value === '') {
825+
if (!toggleCollapsedAdvancedRegistry) {
826+
setToggleCollapsedAdvancedRegistry(not)
827+
}
828+
setCertInputError('Mandatory')
829+
error = true
830+
} else {
831+
setCertInputError('')
806832
}
807-
setCertInputError('Mandatory')
808-
error = true
809-
} else {
810-
setCertInputError('')
811833
}
812-
}
813-
if (error) {
814-
return
815-
}
834+
if (error) {
835+
return
836+
}
837+
break
816838
}
817839
if (selectedDockerRegistryType.value !== RegistryType.GCR) {
818840
if (showHelmPull || registryStorageType === RegistryStorageType.OCI_PUBLIC) {
819-
setCustomState((st) => ({
820-
...st,
821-
repositoryList: { ...st.repositoryList, error: st.repositoryList?.value ? '' : 'Mandatory' },
822-
}))
823-
if (customState.repositoryList?.value === '') {
841+
if (updateWithCustomStateValidation("repositoryList", customState.repositoryList.value)) {
824842
return
825843
}
826844
}
@@ -1236,7 +1254,7 @@ function DockerForm({
12361254
className="form__textarea"
12371255
name="repositoryList"
12381256
autoFocus={true}
1239-
value={customState.repositoryList?.value.trim()}
1257+
value={customState.repositoryList?.value}
12401258
autoComplete="off"
12411259
tabIndex={3}
12421260
onChange={handleRepositoryListChange}
@@ -1630,11 +1648,11 @@ function DockerForm({
16301648
labelClassName="dc__required-field"
16311649
name="id"
16321650
autoFocus={true}
1633-
value={state.id.value}
1651+
value={customState.id.value}
16341652
autoComplete="off"
1635-
error={state.id.error}
1653+
error={customState.id.error}
16361654
tabIndex={1}
1637-
onChange={handleOnChange}
1655+
onChange={customHandleChange}
16381656
label="Name"
16391657
disabled={!!id}
16401658
placeholder="e.g. Registry name"

0 commit comments

Comments
 (0)