feat(cert): ce teasers for ca cert [EE-5252] (#8769)

pull/8798/head
Matt Hook 2023-04-13 15:32:58 +12:00 committed by GitHub
parent e60635bf32
commit ded8ce48a8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 112 additions and 27 deletions

View File

@ -11,7 +11,10 @@
<div class="actionBar">
<form class="form-horizontal" name="addUserHelmRepoForm">
<div class="form-group">
<span class="col-sm-12 text-muted small"> Add a Helm repository. All Helm charts in the repository will be added to the list. </span>
<span class="col-sm-12 text-muted small">
<pr-icon icon="'info'" mode="'primary'"></pr-icon>
Add a Helm repository. All Helm charts in the repository will be added to the list.
</span>
</div>
<div class="form-group mb-2">

View File

@ -13,7 +13,7 @@ function SSLServiceFactory(SSL) {
return SSL.get().$promise;
}
function upload(httpEnabled, cert, key) {
return SSL.upload({ httpEnabled, cert, key }).$promise;
function upload(SSLPayload) {
return SSL.upload(SSLPayload).$promise;
}
}

View File

@ -1,5 +1,6 @@
import angular from 'angular';
import { sslCertificate } from './ssl-certificate';
import { sslCaFileSettings } from './ssl-ca-file-settings';
export default angular.module('portainer.settings.general', []).component('sslCertificateSettings', sslCertificate).name;
export default angular.module('portainer.settings.general', []).component('sslCertificateSettings', sslCertificate).component('sslCaFileSettings', sslCaFileSettings).name;

View File

@ -0,0 +1,6 @@
import controller from './ssl-ca-file-settings-controller.js';
export const sslCaFileSettings = {
templateUrl: './ssl-ca-file-settings.html',
controller,
};

View File

@ -0,0 +1,9 @@
import { FeatureId } from '@/react/portainer/feature-flags/enums';
class SslCaFileSettingsController {
/* @ngInject */
constructor() {
this.limitedFeature = FeatureId.CA_FILE;
}
}
export default SslCaFileSettingsController;

View File

@ -0,0 +1,43 @@
<div class="be-indicator-container limited-be">
<div class="overlay">
<div class="limited-be-link vertical-center"
><be-feature-indicator feature="$ctrl.limitedFeature"></be-feature-indicator
><portainer-tooltip message="'This feature is currently limited to Business Edition users only. '"></portainer-tooltip
></div>
<div class="limited-be-content">
<rd-widget>
<rd-widget-header icon="key" title-text="Certificate Authority file for Kubernetes Helm repositories"></rd-widget-header>
<rd-widget-body>
<form class="form-horizontal" name="$ctrl.sslForm">
<span class="small text-muted vertical-center mb-3">
<pr-icon icon="'info'" mode="'primary'"></pr-icon>
Provide an additional CA file containing certificate(s) for HTTPS connections to Helm repositories.
</span>
<!-- SSL Cert -->
<div class="form-group">
<div class="col-sm-12 flex items-center">
<span class="space-right control-label col-sm-3 col-lg-2 !p-0 text-left">
CA File
<portainer-tooltip message="'Select a CA file containing your X.509 certificate(s), commonly a crt, cer or pem file.'"></portainer-tooltip>
</span>
<button class="btn btn-sm btn-primary !ml-0"> Select a file </button>
<span class="ml-1 flex h-full items-center">
<pr-icon icon="'x-circle'" class-name="'icon-danger'"></pr-icon>
</span>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button type="button" class="btn btn-primary btn-sm !ml-0">
<span>Apply changes</span>
</button>
</div>
</div>
</form>
</rd-widget-body>
</rd-widget>
</div>
</div>
</div>

View File

@ -21,9 +21,8 @@ class SslCertificateController {
reloadingPage: false,
};
const pemPattern = '.pem';
this.certFilePattern = `${pemPattern},.crt,.cer,.cert`;
this.keyFilePattern = `${pemPattern},.key`;
this.certFilePattern = `.pem,.crt,.cer,.cert`;
this.keyFilePattern = `.pem,.key`;
this.save = this.save.bind(this);
this.onChangeForceHTTPS = this.onChangeForceHTTPS.bind(this);
@ -46,7 +45,7 @@ class SslCertificateController {
const cert = this.formValues.certFile ? await this.formValues.certFile.text() : null;
const key = this.formValues.keyFile ? await this.formValues.keyFile.text() : null;
const httpEnabled = !this.formValues.forceHTTPS;
await this.SSLService.upload(httpEnabled, cert, key);
await this.SSLService.upload({ httpEnabled, cert, key });
await new Promise((resolve) => setTimeout(resolve, 2000));
location.reload();

View File

@ -16,22 +16,33 @@
label="'Force HTTPS only'"
on-change="($ctrl.onChangeForceHTTPS)"
field-class="'col-sm-12'"
label-class="'col-sm-2'"
label-class="'col-sm-3 col-lg-2'"
></por-switch-field>
</div>
<div class="form-group">
<span class="col-sm-12 control-label"> Provide a new SSL Certificate to replace the existing one that is used for HTTPS connections. </span>
</div>
<span class="small text-muted vertical-center my-3">
<pr-icon icon="'info'" mode="'primary'"></pr-icon>
Provide a new SSL Certificate to replace the existing one that is used for HTTPS connections.
</span>
<!-- SSL Cert -->
<div class="form-group">
<span class="col-sm-12"> Upload a X.509 certificate, commonly a crt, a cer, or a pem file. </span>
</div>
<div class="form-group">
<div class="col-sm-12">
<button class="btn btn-sm btn-primary" ngf-select ng-model="$ctrl.formValues.certFile" ngf-pattern="$ctrl.certFilePattern" name="certFile"> Select file </button>
<span style="margin-left: 5px">
<div class="col-sm-12 flex items-center">
<span class="space-right control-label col-sm-3 col-lg-2 !p-0 text-left">
SSL/TLS certificate
<portainer-tooltip message="'Select an X.509 certificate file, commonly a crt, cer or pem file.'"></portainer-tooltip>
</span>
<button
class="btn btn-sm btn-primary !ml-0"
ngf-select
ng-model="$ctrl.formValues.certFile"
ngf-pattern="$ctrl.certFilePattern"
name="certFile"
ngf-accept="$ctrl.certFilePattern"
>
Select a file
</button>
<span class="ml-1 flex h-full items-center">
{{ $ctrl.formValues.certFile.name }}
<pr-icon icon="'x-circle'" class-name="'icon-danger'" ng-if="!$ctrl.formValues.certFile"></pr-icon>
</span>
@ -48,14 +59,24 @@
</div>
</div>
<!-- SSL Key -->
<div class="form-group">
<span class="col-sm-12"> Upload a private key, commonly a key, or a pem file. </span>
</div>
<div class="form-group">
<div class="col-sm-12">
<button class="btn btn-sm btn-primary" ngf-select ng-model="$ctrl.formValues.keyFile" ngf-pattern="$ctrl.keyFilePattern" name="keyFile"> Select file </button>
<span style="margin-left: 5px">
<div class="col-sm-12 flex items-center">
<span class="space-right control-label col-sm-3 col-lg-2 !p-0 text-left">
SSL/TLS private key
<portainer-tooltip message="'Select a private key file, commonly a key, or pem file.'"></portainer-tooltip>
</span>
<button
class="btn btn-sm btn-primary !ml-0"
ngf-select
ng-model="$ctrl.formValues.keyFile"
ngf-pattern="$ctrl.keyFilePattern"
name="keyFile"
ngf-accept="$ctrl.certFilePattern"
>
Select a file
</button>
<span class="ml-1 flex h-full items-center">
{{ $ctrl.formValues.keyFile.name }}
<pr-icon icon="'x-circle'" class-name="'icon-danger'" ng-if="!$ctrl.formValues.keyFile"></pr-icon>
</span>
@ -76,7 +97,7 @@
<div class="col-sm-12">
<button
type="button"
class="btn btn-primary btn-sm"
class="btn btn-primary btn-sm !ml-0"
ng-disabled="$ctrl.state.actionInProgress || !$ctrl.isFormChanged()"
ng-click="$ctrl.save()"
button-spinner="$ctrl.state.actionInProgress"

View File

@ -208,6 +208,7 @@
</div>
</div>
<ssl-ca-file-settings></ssl-ca-file-settings>
<ssl-certificate-settings ng-show="state.showHTTPS"></ssl-certificate-settings>
<div class="row">

View File

@ -40,4 +40,5 @@ export enum FeatureId {
K8S_ROLLING_RESTART = 'k8s-rolling-restart',
K8SINSTALL = 'k8s-install',
K8S_ANNOTATIONS = 'k8s-annotations',
CA_FILE = 'ca-file',
}

View File

@ -45,6 +45,7 @@ export async function init(edition: Edition) {
[FeatureId.K8S_ADM_ONLY_USR_INGRESS_DEPLY]: Edition.BE,
[FeatureId.K8S_ROLLING_RESTART]: Edition.BE,
[FeatureId.K8S_ANNOTATIONS]: Edition.BE,
[FeatureId.CA_FILE]: Edition.BE,
};
state.currentEdition = currentEdition;