Skip to content

Commit 5552518

Browse files
authored
Merge pull request #2654 from devtron-labs/feat/authentication-type
feat: add authentication type radio button
2 parents cb9869f + ea08525 commit 5552518

File tree

4 files changed

+75
-37
lines changed

4 files changed

+75
-37
lines changed

src/components/dockerRegistry/Docker.tsx

Lines changed: 70 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ import {
5353
RegistryIcon,
5454
ComponentSizeType,
5555
PasswordField,
56+
OtherRegistryAuthenticationType,
5657
} from '@devtron-labs/devtron-fe-common-lib'
5758
import Tippy from '@tippyjs/react'
5859
import { useHistory, useParams, useRouteMatch } from 'react-router-dom'
@@ -100,6 +101,7 @@ import { VALIDATION_STATUS, ValidateForm } from '../common/ValidateForm/Validate
100101
const RegistryHelmPushCheckbox = importComponentFromFELibrary('RegistryHelmPushCheckbox')
101102
const RemoteConnectionRadio = importComponentFromFELibrary('RemoteConnectionRadio')
102103
const getRemoteConnectionConfig = importComponentFromFELibrary('getRemoteConnectionConfig', noop, 'function')
104+
const AuthenticationTypeRadio = importComponentFromFELibrary('AuthenticationTypeRadio', null, 'function')
103105

104106
enum CERTTYPE {
105107
SECURE = 'secure',
@@ -259,6 +261,7 @@ const CollapsedList = ({
259261
repositoryList = [],
260262
disabledFields = [],
261263
ociRegistryConfig,
264+
credentialsType,
262265
...rest
263266
}) => {
264267
const [collapsed, toggleCollapse] = useState(true)
@@ -338,6 +341,7 @@ const CollapsedList = ({
338341
isPublic,
339342
disabledFields,
340343
ociRegistryConfig,
344+
credentialsType,
341345
}}
342346
/>
343347
)}
@@ -377,6 +381,7 @@ const DockerForm = ({
377381
: {
378382
CONTAINER: OCIRegistryConfigConstants.PULL_PUSH,
379383
},
384+
credentialsType: authCredentialsType,
380385
...rest
381386
}) => {
382387
const re = PATTERNS.APP_NAME
@@ -539,6 +544,9 @@ const DockerForm = ({
539544
const [registryStorageType, setRegistryStorageType] = useState<string>(
540545
isPublic ? RegistryStorageType.OCI_PUBLIC : RegistryStorageType.OCI_PRIVATE,
541546
)
547+
const [authenticationType, setAuthenticationType] = useState<OtherRegistryAuthenticationType>(
548+
id && authCredentialsType ? authCredentialsType : OtherRegistryAuthenticationType.USERNAME_PASSWORD,
549+
)
542550

543551
const InitialValueOfIsContainerStore: boolean =
544552
ociRegistryConfig?.CONTAINER === OCIRegistryConfigConstants.PULL_PUSH
@@ -712,6 +720,11 @@ const DockerForm = ({
712720
}
713721
}
714722

723+
const handleChangeOtherRegistryAuthType = (e) => {
724+
const updatedAuthType = e.target.value as OtherRegistryAuthenticationType
725+
setAuthenticationType(updatedAuthType)
726+
}
727+
715728
function fetchAWSRegion(): string {
716729
const pattern =
717730
registryStorageType === RegistryStorageType.OCI_PUBLIC
@@ -805,8 +818,12 @@ const DockerForm = ({
805818
...(registryStorageType !== RegistryStorageType.OCI_PUBLIC &&
806819
selectedDockerRegistryType.value === RegistryType.OTHER
807820
? {
808-
username: trimmedUsername,
809-
password: parsePassword(customState.password.value),
821+
...(authenticationType === OtherRegistryAuthenticationType.USERNAME_PASSWORD
822+
? {
823+
username: trimmedUsername,
824+
password: parsePassword(customState.password.value),
825+
}
826+
: {}),
810827
connection: state.advanceSelect.value,
811828
cert: state.advanceSelect.value !== CERTTYPE.SECURE_WITH_CERT ? '' : state.certInput.value,
812829
}
@@ -839,6 +856,9 @@ const DockerForm = ({
839856
customState.remoteConnectionConfig.connectionMethod.value,
840857
sshConnectionType,
841858
),
859+
...(AuthenticationTypeRadio && selectedDockerRegistryType.value === RegistryType.OTHER
860+
? { credentialsType: authenticationType }
861+
: {}),
842862
}
843863
}
844864

@@ -1003,6 +1023,7 @@ const DockerForm = ({
10031023
let error = false
10041024
if (
10051025
registryStorageType === RegistryStorageType.OCI_PRIVATE &&
1026+
authenticationType === OtherRegistryAuthenticationType.USERNAME_PASSWORD &&
10061027
(!customState.username.value || !(customState.password.value || id))
10071028
) {
10081029
setCustomState((st) => ({
@@ -1605,47 +1626,61 @@ const DockerForm = ({
16051626
</>
16061627
)
16071628
}
1629+
1630+
const isUserNamePasswordRequired =
1631+
selectedDockerRegistryType.value === RegistryType.OTHER
1632+
? authenticationType === OtherRegistryAuthenticationType.USERNAME_PASSWORD
1633+
: true
1634+
16081635
return (
16091636
<>
1610-
<div className={`${isGCROrGCP ? '' : 'form__row--two-third'}`}>
1611-
<div className="form__row">
1612-
<CustomInput
1613-
name="username"
1614-
required
1615-
value={customState.username.value || selectedDockerRegistryType.id.defaultValue}
1616-
error={customState.username.error}
1617-
onChange={customHandleChange}
1618-
label={selectedDockerRegistryType.id.label}
1619-
disabled={!!selectedDockerRegistryType.id.defaultValue}
1620-
placeholder={
1621-
selectedDockerRegistryType.id.placeholder
1622-
? selectedDockerRegistryType.id.placeholder
1623-
: 'Enter username'
1624-
}
1625-
/>
1626-
</div>
1627-
<div className="form__row">
1628-
{(selectedDockerRegistryType.value === RegistryType.DOCKER_HUB ||
1629-
selectedDockerRegistryType.value === RegistryType.ACR ||
1630-
selectedDockerRegistryType.value === RegistryType.QUAY ||
1631-
selectedDockerRegistryType.value === RegistryType.OTHER) && (
1632-
<PasswordField
1633-
shouldShowDefaultPlaceholderOnBlur={!!id}
1634-
name="password"
1637+
{AuthenticationTypeRadio && selectedDockerRegistryType.value === RegistryType.OTHER && (
1638+
<AuthenticationTypeRadio
1639+
authenticationType={authenticationType}
1640+
handleChangeOtherRegistryAuthType={handleChangeOtherRegistryAuthType}
1641+
/>
1642+
)}
1643+
{isUserNamePasswordRequired && (
1644+
<div className={`${isGCROrGCP ? '' : 'form__row--two-third'}`}>
1645+
<div className="form__row">
1646+
<CustomInput
1647+
name="username"
16351648
required
1636-
value={customState.password.value}
1637-
error={customState.password.error}
1649+
value={customState.username.value || selectedDockerRegistryType.id.defaultValue}
1650+
error={customState.username.error}
16381651
onChange={customHandleChange}
1639-
label={selectedDockerRegistryType.password.label}
1652+
label={selectedDockerRegistryType.id.label}
1653+
disabled={!!selectedDockerRegistryType.id.defaultValue}
16401654
placeholder={
1641-
selectedDockerRegistryType.password.placeholder
1642-
? selectedDockerRegistryType.password.placeholder
1643-
: 'Enter password/token'
1655+
selectedDockerRegistryType.id.placeholder
1656+
? selectedDockerRegistryType.id.placeholder
1657+
: 'Enter username'
16441658
}
16451659
/>
1646-
)}
1660+
</div>
1661+
<div className="form__row">
1662+
{(selectedDockerRegistryType.value === RegistryType.DOCKER_HUB ||
1663+
selectedDockerRegistryType.value === RegistryType.ACR ||
1664+
selectedDockerRegistryType.value === RegistryType.QUAY ||
1665+
selectedDockerRegistryType.value === RegistryType.OTHER) && (
1666+
<PasswordField
1667+
shouldShowDefaultPlaceholderOnBlur={!!id}
1668+
name="password"
1669+
required
1670+
value={customState.password.value}
1671+
error={customState.password.error}
1672+
onChange={customHandleChange}
1673+
label={selectedDockerRegistryType.password.label}
1674+
placeholder={
1675+
selectedDockerRegistryType.password.placeholder
1676+
? selectedDockerRegistryType.password.placeholder
1677+
: 'Enter password/token'
1678+
}
1679+
/>
1680+
)}
1681+
</div>
16471682
</div>
1648-
</div>
1683+
)}
16491684
{isGCROrGCP && (
16501685
<Textarea
16511686
label={selectedDockerRegistryType.password.label}

src/components/dockerRegistry/service.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
import { post, put, get, trash } from '@devtron-labs/devtron-fe-common-lib'
1818
import { Routes } from '../../config'
1919

20+
// Dead code
2021
export function getDockerRegistryConfig(id: string): Promise<any> {
2122
const URL = `${Routes.DOCKER_REGISTRY_CONFIG}/${id}`
2223
return get(URL)

src/config/constants.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
ToastManager,
2222
ROUTES as COMMON_ROUTES,
2323
EnvResourceType,
24+
OtherRegistryAuthenticationType,
2425
} from '@devtron-labs/devtron-fe-common-lib'
2526
export const DEFAULT_STATUS = 'checking'
2627
export const DEFAULT_STATUS_TEXT = 'Checking Status'
@@ -471,6 +472,7 @@ export type OCIRegistryStorageConfigType = {
471472
CONTAINER?: OCIRegistryStorageActionType
472473
CHART?: OCIRegistryStorageActionType
473474
}
475+
474476
export const OCIRegistryConfigConstants: Record<string, OCIRegistryStorageActionType> = {
475477
PULL: 'PULL',
476478
PUSH: 'PUSH',
@@ -541,6 +543,7 @@ export interface RegistryPayloadType {
541543
sshAuthKey: string
542544
}
543545
}
546+
credentialsType?: OtherRegistryAuthenticationType
544547
}
545548

546549
export interface RegistryPayloadWithSelectType extends RegistryPayloadType, SelectPickerOptionType {}

src/services/service.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -250,8 +250,7 @@ export function getDockerRegistryStatus(isStorageActionPush?: boolean): Promise<
250250
}
251251

252252
export function getDockerRegistryList(): Promise<ResponseType> {
253-
const URL = `${Routes.DOCKER_REGISTRY_CONFIG}`
254-
return get(URL)
253+
return get(Routes.DOCKER_REGISTRY_CONFIG)
255254
}
256255

257256
export function getAppOtherEnvironmentMin(

0 commit comments

Comments
 (0)