github.com/argoproj/argo-cd/v3@v3.2.1/ui/src/app/settings/components/repo-details/repo-details.tsx (about) 1 import * as React from 'react'; 2 import {FormField} from 'argo-ui'; 3 import {FormApi, Text} from 'react-form'; 4 import {EditablePanel, EditablePanelItem} from '../../../shared/components'; 5 import * as models from '../../../shared/models'; 6 import {NewHTTPSRepoParams} from '../repos-list/repos-list'; 7 import {AuthSettingsCtx} from '../../../shared/context'; 8 9 export const RepoDetails = (props: {repo: models.Repository; save?: (params: NewHTTPSRepoParams) => Promise<void>}) => { 10 const useAuthSettingsCtx = React.useContext(AuthSettingsCtx); 11 const {repo, save} = props; 12 const write = false; 13 const FormItems = (repository: models.Repository): EditablePanelItem[] => { 14 const items: EditablePanelItem[] = [ 15 { 16 title: 'Type', 17 view: repository.type 18 }, 19 { 20 title: 'Repository URL', 21 view: repository.repo 22 }, 23 { 24 title: 'Name', 25 view: repository.name || '', 26 edit: (formApi: FormApi) => <FormField formApi={formApi} field='name' component={Text} /> 27 }, 28 { 29 title: 'Connection State Details', 30 view: repository.connectionState.message 31 }, 32 { 33 title: 'Username (optional)', 34 view: repository.username || '', 35 edit: (formApi: FormApi) => <FormField formApi={formApi} field='username' component={Text} /> 36 }, 37 { 38 title: 'Password (optional)', 39 view: repository.username ? '******' : '', 40 edit: (formApi: FormApi) => <FormField formApi={formApi} field='password' component={Text} componentProps={{type: 'password'}} /> 41 } 42 ]; 43 44 if (repository.type === 'git') { 45 items.push({ 46 title: 'Bearer token (optional, for BitBucket Data Center only)', 47 view: repository.bearerToken ? '******' : '', 48 edit: (formApi: FormApi) => <FormField formApi={formApi} field='bearerToken' component={Text} componentProps={{type: 'password'}} /> 49 }); 50 } 51 52 if (useAuthSettingsCtx?.hydratorEnabled) { 53 // Insert this item at index 1. 54 const item = { 55 title: 'Write', 56 view: write, 57 edit: (formApi: FormApi) => <FormField formApi={formApi} field='write' component={Text} componentProps={{type: 'checkbox'}} /> 58 }; 59 items.splice(1, 0, item); 60 } 61 62 if (repository.project) { 63 items.splice(repository.name ? 2 : 1, 0, { 64 title: 'Project', 65 view: repository.project 66 }); 67 } 68 69 if (repository.proxy) { 70 items.push({ 71 title: 'Proxy (optional)', 72 view: repository.proxy 73 }); 74 } 75 76 if (repository.noProxy) { 77 items.push({ 78 title: 'NoProxy (optional)', 79 view: repository.noProxy 80 }); 81 } 82 83 return items; 84 }; 85 86 const newRepo = { 87 type: repo.type, 88 name: repo.name || '', 89 url: repo.repo, 90 username: repo.username || '', 91 password: repo.password || '', 92 bearerToken: repo.bearerToken || '', 93 tlsClientCertData: repo.tlsClientCertData || '', 94 tlsClientCertKey: repo.tlsClientCertKey || '', 95 insecure: repo.insecure || false, 96 enableLfs: repo.enableLfs || false, 97 proxy: repo.proxy || '', 98 noProxy: repo.noProxy || '', 99 project: repo.project || '', 100 enableOCI: repo.enableOCI || false, 101 forceHttpBasicAuth: repo.forceHttpBasicAuth || false, 102 useAzureWorkloadIdentity: repo.useAzureWorkloadIdentity || false, 103 insecureOCIForceHttp: repo.insecureOCIForceHttp || false 104 }; 105 106 return ( 107 <EditablePanel 108 values={repo} 109 validate={input => ({ 110 username: !input.username && input.password && 'Username is required if password is given.', 111 password: !input.password && input.username && 'Password is required if username is given.', 112 bearerToken: input.password && input.bearerToken && 'Either the password or the bearer token must be set, but not both.' 113 })} 114 save={async input => { 115 const params: NewHTTPSRepoParams = {...newRepo, write}; 116 params.name = input.name || ''; 117 params.username = input.username || ''; 118 params.password = input.password || ''; 119 params.bearerToken = input.bearerToken || ''; 120 save(params); 121 }} 122 title='CONNECTED REPOSITORY' 123 items={FormItems(repo)} 124 /> 125 ); 126 };