diff --git a/ui/src/app/applications/components/application-create-panel/application-create-panel.tsx b/ui/src/app/applications/components/application-create-panel/application-create-panel.tsx index ffe3c2f61d3fd..e6dcfbc3f0578 100644 --- a/ui/src/app/applications/components/application-create-panel/application-create-panel.tsx +++ b/ui/src/app/applications/components/application-create-panel/application-create-panel.tsx @@ -151,8 +151,8 @@ export const ApplicationCreatePanel = (props: { )) || (
({ - 'metadata.name': !a.metadata.name && 'Application name is required', - 'spec.project': !a.spec.project && 'Project name is required', + 'metadata.name': !a.metadata.name && 'Application Name is required', + 'spec.project': !a.spec.project && 'Project Name is required', 'spec.source.repoURL': !a.spec.source.repoURL && 'Repository URL is required', 'spec.source.targetRevision': !a.spec.source.targetRevision && a.spec.source.hasOwnProperty('chart') && 'Version is required', 'spec.source.path': !a.spec.source.path && !a.spec.source.chart && 'Path is required', @@ -204,7 +204,7 @@ export const ApplicationCreatePanel = (props: {
app.status.sync.status === 'Synced').length }, { - title: 'HEALTHY:', + title: 'HEALTHY', value: applications.filter(app => app.status.health.status === 'Healthy').length }, { - title: 'CLUSTERS:', + title: 'CLUSTERS', value: new Set(applications.map(app => app.spec.destination.server)).size }, { - title: 'NAMESPACES:', + title: 'NAMESPACES', value: new Set(applications.map(app => app.spec.destination.namespace)).size } ]; diff --git a/ui/src/app/settings/components/certs-list/certs-list.tsx b/ui/src/app/settings/components/certs-list/certs-list.tsx index 135172f883376..dde86a0ccee4c 100644 --- a/ui/src/app/settings/components/certs-list/certs-list.tsx +++ b/ui/src/app/settings/components/certs-list/certs-list.tsx @@ -43,10 +43,12 @@ export class CertsList extends React.Component> { items: [ { title: 'Add TLS certificate', + iconClassName: 'fa fa-plus', action: () => (this.showAddTLSCertificate = true) }, { title: 'Add SSH known hosts', + iconClassName: 'fa fa-plus', action: () => (this.showAddSSHKnownHosts = true) } ] @@ -123,33 +125,31 @@ export class CertsList extends React.Component> {
}> -
-
-

Create TLS repository certificate

- this.addTLSCertificate(params as NewTLSCertParams)} - getApi={api => (this.formApiTLS = api)} - preSubmit={(params: NewTLSCertParams) => ({ - serverName: params.serverName, - certData: btoa(params.certData) - })} - validateError={(params: NewTLSCertParams) => ({ - serverName: !params.serverName && 'Repository server name is required', - certData: !params.certData && 'Certificate data is required' - })}> - {formApiTLS => ( - -
- -
-
- -
- - )} - -
-
+
this.addTLSCertificate(params as NewTLSCertParams)} + getApi={api => (this.formApiTLS = api)} + preSubmit={(params: NewTLSCertParams) => ({ + serverName: params.serverName, + certData: btoa(params.certData) + })} + validateError={(params: NewTLSCertParams) => ({ + serverName: !params.serverName && 'Repository Server Name is required', + certData: !params.certData && 'TLS Certificate is required' + })}> + {formApiTLS => ( + +
+

CREATE TLS REPOSITORY CERTIFICATE

+
+ +
+
+ +
+
+
+ )} + > { }> -
-
-

Create SSH known host entries

- -

- Paste SSH known hosts data in the text area below, one entry per line. You can use output from ssh-keyscan or the contents on an{' '} - ssh_known_hosts file verbatim. Lines starting with # will be treated as comments and ignored. -

-

- Make sure there are no linebreaks in the keys. -

-
this.addSSHKnownHosts(params as NewSSHKnownHostParams)} - getApi={api => (this.formApiSSH = api)} - preSubmit={(params: NewSSHKnownHostParams) => ({ - certData: btoa(params.certData) - })} - validateError={(params: NewSSHKnownHostParams) => ({ - certData: !params.certData && 'SSH known hosts data is required' - })}> - {formApiSSH => ( - -
- -
-
- )} - -
-
+
this.addSSHKnownHosts(params as NewSSHKnownHostParams)} + getApi={api => (this.formApiSSH = api)} + preSubmit={(params: NewSSHKnownHostParams) => ({ + certData: btoa(params.certData) + })} + validateError={(params: NewSSHKnownHostParams) => ({ + certData: !params.certData && 'SSH known hosts data is required' + })}> + {formApiSSH => ( + +
+

CREATE SSH KNOWN HOST ENTRIES

+

+ Paste SSH known hosts data in the text area below, one entry per line. You can use output from ssh-keyscan or the contents on + an ssh_known_hosts file verbatim. Lines starting with # will be treated as comments and ignored. +

+

+ Make sure there are no linebreaks in the keys. +

+
+ +
+
+
+ )} + ); diff --git a/ui/src/app/settings/components/gpgkeys-list/gpgkeys-list.tsx b/ui/src/app/settings/components/gpgkeys-list/gpgkeys-list.tsx index cc648d0a9ff1d..248052a6afc3b 100644 --- a/ui/src/app/settings/components/gpgkeys-list/gpgkeys-list.tsx +++ b/ui/src/app/settings/components/gpgkeys-list/gpgkeys-list.tsx @@ -36,6 +36,7 @@ export class GpgKeysList extends React.Component> { items: [ { title: 'Add GnuPG key', + iconClassName: 'fa fa-plus', action: () => (this.showAddGnuPGKey = true) } ] @@ -107,7 +108,6 @@ export class GpgKeysList extends React.Component> { }> -

Add GnuPG public key

this.addGnuPGPublicKey({keyData: params.keyData})} getApi={api => (this.formApi = api)} @@ -115,12 +115,15 @@ export class GpgKeysList extends React.Component> { keyData: params.keyData })} validateError={(params: NewGnuPGPublicKeyParams) => ({ - keyData: !params.keyData && 'Key data is required' + keyData: !params.keyData && 'GnuPG public key data is required' })}> {formApi => ( -
- +
+

ADD GnuPG PUBLIC KEY

+
+ +
)} diff --git a/ui/src/app/settings/components/project-details/project-details.tsx b/ui/src/app/settings/components/project-details/project-details.tsx index ed77aecd70a9d..7bed89c99e928 100644 --- a/ui/src/app/settings/components/project-details/project-details.tsx +++ b/ui/src/app/settings/components/project-details/project-details.tsx @@ -217,6 +217,9 @@ export class ProjectDetails extends React.Component + {' '} {' '} - {' '} {params.get('newRole') === null ? ( {' '} {' '} + {' '} {params.get('newWindow') === null ? ( {' '} {' '} +
}> @@ -74,7 +77,7 @@ export class ProjectsList extends React.Component { defaultValues={{metadata: {}, spec: {}}} getApi={api => (this.formApi = api)} validateError={(p: Project) => ({ - 'metadata.name': !p.metadata.name && 'Project name is required' + 'metadata.name': !p.metadata.name && 'Project Name is required' })} onSubmit={async (proj: Project) => { try { @@ -92,7 +95,7 @@ export class ProjectsList extends React.Component {

GENERAL

- +
diff --git a/ui/src/app/settings/components/repos-list/repos-list.tsx b/ui/src/app/settings/components/repos-list/repos-list.tsx index 3adce4fe49017..0fdd99d384484 100644 --- a/ui/src/app/settings/components/repos-list/repos-list.tsx +++ b/ui/src/app/settings/components/repos-list/repos-list.tsx @@ -263,7 +263,6 @@ export class ReposList extends React.Component, {connec
}> -

Connect repo using HTTPS

services.projects.list('items.metadata.name').then(projects => projects.map(proj => proj.metadata.name).sort())}> {projects => (
, {connec getApi={api => (this.formApiHTTPS = api)} defaultValues={{type: 'git'}} validateError={(params: NewHTTPSRepoParams) => ({ - url: (!params.url && 'Repo URL is required') || (this.credsTemplate && !this.isHTTPSUrl(params.url) && 'Not a valid HTTPS URL'), + url: (!params.url && 'Repository URL is required') || (this.credsTemplate && !this.isHTTPSUrl(params.url) && 'Not a valid HTTPS URL'), name: params.type === 'helm' && !params.name && 'Name is required', password: !params.password && params.username && 'Password is required if username is given.', tlsClientCertKey: !params.tlsClientCertKey && params.tlsClientCertData && 'TLS client cert key is required if TLS client cert is given.' })}> {formApi => ( -
- -
- {formApi.getFormState().values.type === 'helm' && ( +
+

CONNECT REPO USING HTTPS

- +
- )} -
- -
-
- -
-
- -
-
- -
-
- -
-
- -
- {formApi.getFormState().values.type === 'git' && ( - -
- - -
+ {formApi.getFormState().values.type === 'helm' && (
- - +
- - )} -
- + )} +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ {formApi.getFormState().values.type === 'git' && ( + +
+ + +
+
+ + +
+ + )} +
+ +
)} @@ -352,7 +354,6 @@ export class ReposList extends React.Component, {connec
}> -

Connect repo using SSH

services.projects.list('items.metadata.name').then(projects => projects.map(proj => proj.metadata.name).sort())}> {projects => (
, {connec getApi={api => (this.formApiSSH = api)} defaultValues={{type: 'git'}} validateError={(params: NewSSHRepoParams) => ({ - url: !params.url && 'Repo URL is required' + url: !params.url && 'Repository URL is required' })}> {formApi => ( -
- -
-
- -
-
- -
-
- -
-
- - -
-
- - -
-
- +
+

CONNECT REPO USING SSH

+
+ +
+
+ +
+
+ +
+
+ +
+
+ + +
+
+ + +
+
+ +
)} @@ -420,7 +424,6 @@ export class ReposList extends React.Component, {connec
}> -

Connect repo using GitHub App

services.projects.list('items.metadata.name').then(projects => projects.map(proj => proj.metadata.name).sort())}> {projects => (
, {connec getApi={api => (this.formApiGitHubApp = api)} defaultValues={{type: 'git', ghType: 'GitHub'}} validateError={(params: NewGitHubAppRepoParams) => ({ - url: (!params.url && 'Repo URL is required') || (this.credsTemplate && !this.isHTTPSUrl(params.url) && 'Not a valid HTTPS URL'), + url: (!params.url && 'Repository URL is required') || (this.credsTemplate && !this.isHTTPSUrl(params.url) && 'Not a valid HTTPS URL'), githubAppId: !params.githubAppId && 'GitHub App ID is required', githubAppInstallationId: !params.githubAppInstallationId && 'GitHub App installation ID is required', githubAppPrivateKey: !params.githubAppPrivateKey && 'GitHub App private Key is required' })}> {formApi => ( -
- -
- {formApi.getFormState().values.ghType === 'GitHub Enterprise' && ( - -
- -
- - )} -
- -
-
- -
-
- -
-
- -
-
- -
-
- - -
-
- - -
- {formApi.getFormState().values.ghType === 'GitHub Enterprise' && ( - -
- -
-
- -
- - )} -
- +
+

CONNECT REPO USING GITHUB APP

+
+ +
+ {formApi.getFormState().values.ghType === 'GitHub Enterprise' && ( + +
+ +
+ + )} +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + +
+
+ + +
+ {formApi.getFormState().values.ghType === 'GitHub Enterprise' && ( + +
+ +
+
+ +
+ + )} +
+ +
)}