github.com/argoproj/argo-cd@v1.8.7/ui/src/app/settings/components/project-role-edit-panel/project-role-edit-panel.tsx (about) 1 import {FormField} from 'argo-ui'; 2 import * as React from 'react'; 3 import {Form, FormApi, Text} from 'react-form'; 4 5 import * as models from '../../../shared/models'; 6 import {CreateJWTTokenParams, DeleteJWTTokenParams, ProjectRoleParams} from '../../../shared/services'; 7 import {ProjectRoleGroupsEdit} from '../project-role-groups-edit/project-role-groups-edit'; 8 import {ProjectRoleJWTTokens} from '../project-role-jwt-tokens/project-role-jwt-tokens'; 9 import {ProjectRolePoliciesEdit} from '../project-role-policies-edit/project-role-policies-edit'; 10 11 interface ProjectRoleDefaultParams { 12 projName: string; 13 role?: models.ProjectRole; 14 newRole: boolean; 15 deleteRole: boolean; 16 jwtTokens: models.JwtToken[]; 17 } 18 19 interface ProjectRoleEditPanelProps { 20 nameReadonly?: boolean; 21 submit: (params: ProjectRoleParams) => any; 22 createJWTToken: (params: CreateJWTTokenParams) => void; 23 deleteJWTToken: (params: DeleteJWTTokenParams) => void; 24 hideJWTToken: () => void; 25 token: string; 26 getApi?: (formApi: FormApi) => void; 27 defaultParams: ProjectRoleDefaultParams; 28 } 29 30 export const ProjectRoleEditPanel = (props: ProjectRoleEditPanelProps) => { 31 return ( 32 <div className='project-role-edit-panel'> 33 <Form 34 onSubmit={props.submit} 35 getApi={props.getApi} 36 defaultValues={{ 37 projName: props.defaultParams.projName, 38 roleName: (props.defaultParams.role && props.defaultParams.role.name) || '', 39 description: (props.defaultParams.role && props.defaultParams.role.description) || '', 40 policies: (props.defaultParams.role && props.defaultParams.role.policies) || [], 41 jwtTokens: (props.defaultParams.role && props.defaultParams.jwtTokens) || [], 42 groups: (props.defaultParams.role && props.defaultParams.role.groups) || [] 43 }} 44 validateError={(params: ProjectRoleParams) => ({ 45 projName: !params.projName && 'Project name is required', 46 roleName: !params.roleName && 'Role name is required' 47 })}> 48 {api => ( 49 <form onSubmit={api.submitForm} role='form' className='width-control'> 50 <div className='argo-form-row'> 51 <FormField formApi={api} label='Role Name' componentProps={{readOnly: props.nameReadonly}} field='roleName' component={Text} /> 52 </div> 53 <div className='argo-form-row'> 54 <FormField formApi={api} label='Role Description' field='description' component={Text} /> 55 </div> 56 <ProjectRolePoliciesEdit 57 projName={api.values.projName} 58 roleName={api.values.roleName} 59 formApi={api} 60 policies={api.values.policies} 61 newRole={props.defaultParams.newRole} 62 /> 63 <ProjectRoleGroupsEdit 64 projName={api.values.projName} 65 roleName={api.values.roleName} 66 formApi={api} 67 groups={api.values.groups} 68 newRole={props.defaultParams.newRole} 69 /> 70 </form> 71 )} 72 </Form> 73 {!props.defaultParams.newRole && props.defaultParams.role !== undefined ? ( 74 <ProjectRoleJWTTokens 75 projName={props.defaultParams.projName} 76 roleName={props.defaultParams.role.name} 77 tokens={props.defaultParams.jwtTokens as models.JwtToken[]} 78 token={props.token} 79 createJWTToken={props.createJWTToken} 80 deleteJWTToken={props.deleteJWTToken} 81 hideJWTToken={props.hideJWTToken} 82 /> 83 ) : null} 84 </div> 85 ); 86 };