</option>
</cds-select>
<ng-template #storageError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('storageClassType', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('storageClassType', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
</ng-template>
</div>
<div class="form-item form-item-append"
cdsRow>
+ <!-- Storage Class Name -->
+ <div cdsCol>
+ <cds-text-label
+ labelInputID="storage_class"
+ i18n
+ [disabled]="editing"
+ [invalid]="
+ storageClassForm.controls.storage_class.invalid &&
+ storageClassForm.controls.storage_class.dirty
+ "
+ [invalidText]="storageClassError"
+ >
+ Storage Class name
+ <input
+ cdsText
+ type="text"
+ formControlName="storage_class"
+ [invalid]="storageClassForm.showError('storage_class', formDir, 'required')"
+ />
+ </cds-text-label>
+ <ng-template #storageClassError>
+ @if (storageClassForm.showError('storage_class', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n>This field is required.</span>
+ }
+ </ng-template>
+ </div>
+ <!-- Zone Group / Region -->
<div cdsCol>
- <!-- Zone Group -->
<cds-select
- label="Zone Group Name"
+ label="Zone Group / Region"
i18n-label
formControlName="zonegroup"
id="zonegroup"
</option>
</cds-select>
<ng-template #zonegroupError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('zonegroup', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('zonegroup', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n>This field is required.</span>
+ }
</ng-template>
</div>
- <div cdsCol>
- <!-- Placement Target -->
- <cds-select
- label="Placement Target"
- i18n-label
- formControlName="placement_target"
- id="placement_target"
- [invalid]="storageClassForm.showError('placement_target', formDir, 'required')"
- [invalidText]="placementError"
- >
- <option [value]="''"
- i18n>--Select--</option>
- <option
- *ngFor="let placementTarget of placementTargets"
- [value]="placementTarget"
- [selected]="placementTarget === storageClassForm.getValue('placement_target')"
- i18n
- >
- {{ placementTarget }}
- </option>
- </cds-select>
- <ng-template #placementError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('placement_target', formDir, 'required')"
- i18n
- >This field is required.</span
- >
- </ng-template>
- </div>
- </div>
- <!-- Storage Class -->
- <div class="form-item">
- <cds-text-label
- labelInputID="storage_class"
- i18n
- [disabled]="editing"
- [invalid]="
- storageClassForm.controls.storage_class.invalid &&
- storageClassForm.controls.storage_class.dirty
- "
- [invalidText]="storageClassError"
- >Name
- <input
- cdsText
- type="text"
- id="storage_class"
- formControlName="storage_class"
- [invalid]="storageClassForm.showError('storage_class', formDir, 'required')"
- />
- </cds-text-label>
- <ng-template #storageClassError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('storage_class', formDir, 'required')"
- i18n
- >This field is required.</span
- >
- </ng-template>
</div>
@if( isTierMatch( TIER_TYPE.CLOUD_TIER, TIER_TYPE.GLACIER )){
<div>
/>
</cds-text-label>
<ng-template #regionError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('region', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('region', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n>This field is required.</span>
+ }
</ng-template>
</div>
<div cdsCol>
<!-- Target Endpoint -->
<cds-text-label
+ labelInputID="target_endpoint"
i18n
- [invalid]="storageClassForm.showError('target_endpoint', formDir, 'required') || storageClassForm.showError('target_endpoint', formDir, 'invalidUrl')"
-
- [invalidText]="
- storageClassForm.controls['target_endpoint'].errors?.['required'] ? 'This field is required.' :
- storageClassForm.controls['target_endpoint'].errors?.['invalidUrl'] ? 'Please enter a valid URL.' : ''
- "
- i18n-invalidText
+ [invalid]="
+ storageClassForm.showError('target_endpoint', formDir, 'invalidURL') ||
+ storageClassForm.showError('target_endpoint', formDir, 'required')
+ "
+ [invalidText]="endpointError"
+ [helperText]="helpTextLabels.targetEndpointText"
>Target Endpoint
<input
cdsText
+ type="text"
+ placeholder="http://ceph-node-00.com:80"
+ i18n-placeholder
+ id="target_endpoint"
formControlName="target_endpoint"
- placeholder="e.g. 192.168.0.10, 192.168.1.0/8"
- [invalid]="storageClassForm.showError('target_endpoint', formDir, 'required') || storageClassForm.showError('target_endpoint', formDir, 'invalidUrl')"
+ [invalid]="
+ storageClassForm.showError('target_endpoint', formDir, 'invalidURL') ||
+ storageClassForm.showError('target_endpoint', formDir, 'required')
+ "
+ [invalidText]="endpointError"
/>
</cds-text-label>
+ <ng-template #endpointError>
+ @if (storageClassForm.showError('target_endpoint', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ } @else if (storageClassForm.showError('target_endpoint', formDir, 'invalidURL')) {
+ <span class="invalid-feedback"
+ i18n> Please enter a valid URL.</span>
+ }
+ </ng-template>
</div>
</div>
<!-- Access Key -->
[invalid]="storageClassForm.showError('access_key', formDir, 'required')"
/>
</cds-password-label>
- <cd-copy-2-clipboard-button class="clipboard"> </cd-copy-2-clipboard-button>
+ <cd-copy-2-clipboard-button class="clipboard"></cd-copy-2-clipboard-button>
<ng-template #accessError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('access_key', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('access_key', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
</ng-template>
</div>
</div>
</cds-password-label>
<cd-copy-2-clipboard-button class="clipboard"> </cd-copy-2-clipboard-button>
<ng-template #secretError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('secret_key', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('secret_key', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
</ng-template>
</div>
</div>
/>
</cds-text-label>
<ng-template #targetError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('target_path', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('target_path', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
</ng-template>
</div>
<div class="form-item">
[invalidText]="readThroughError"
></cds-number>
<ng-template #readThroughError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('read_through_restore_days', formDir, 'pattern')"
- i18n
- >The entered value must be a positive integer.</span
- >
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('read_through_restore_days', formDir, 'lockDays')"
- i18n
- >ReadThrough Restore Days must be positive.</span
- >
+ @if (storageClassForm.showError('read_through_restore_days', formDir, 'pattern')) {
+ <span class="invalid-feedback"
+ i18n>
+ ReadThrough Restore Days must be positive.
+ </span>
+ }
</ng-template>
</div>
<div cdsCol>
i18n>Expedited</option>
</cds-select>
<ng-template #glacierError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('glacier_restore_tier_type', formDir, 'required')"
- i18n
- >This field is required.</span
- >
+ @if (storageClassForm.showError('glacier_restore_tier_type', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
</ng-template>
</div>
<div cdsCol>
>
</cds-number>
<ng-template #glacierRestoreError>
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('glacier_restore_days', formDir, 'pattern')"
- i18n
- >The entered value must be a positive integer.</span
- >
- <span
- class="invalid-feedback"
- *ngIf="storageClassForm.showError('glacier_restore_days', formDir, 'lockDays')"
- i18n
- >Glacier Restore Days must be positive.</span
- >
+ @if (storageClassForm.showError('glacier_restore_days', formDir, 'pattern')) {
+ <span class="invalid-feedback"
+ i18n>
+ The entered value must be a positive integer.
+ </span>
+ }
</ng-template>
</div>
</div>
</div>
- } @if( isTierMatch( TIER_TYPE.CLOUD_TIER, TIER_TYPE.GLACIER )){
+ }
<fieldset>
<div>
<ng-template #title>
id="advanced-fieldset"
(selected)="showAdvanced = !showAdvanced"
>
+ @if( isTierMatch( TIER_TYPE.CLOUD_TIER, TIER_TYPE.GLACIER )){
<!-- Multi Part Sync Threshold -->
<div class="form-item form-item-append"
cdsRow>
}
</ng-container>
</div>
+ }
+ <div class="form-item form-item-append"
+ cdsRow>
+ <div cdsCol>
+ <!-- Placement Target -->
+ <cds-select
+ label="Placement Target"
+ i18n-label
+ formControlName="placement_target"
+ [invalid]="
+ storageClassForm.showError('placement_target', formDir, 'required')
+ "
+ [invalidText]="placementError"
+ >
+ <option [value]="''"
+ i18n>--Select--</option>
+ @for (placementTarget of placementTargets; track placementTarget) {
+ <option
+ [value]="placementTarget"
+ [selected]="
+ placementTarget === storageClassForm.getValue('placement_target')
+ "
+ i18n
+ >
+ {{ placementTarget }}
+ </option>
+ }
+ </cds-select>
+ <ng-template #placementError>
+ @if (storageClassForm.showError('placement_target', formDir, 'required')) {
+ <span class="invalid-feedback"
+ i18n> This field is required. </span>
+ }
+ </ng-template>
+ </div>
+ </div>
</cds-accordion-item>
</cds-accordion>
</fieldset>
</div>
</fieldset>
- } @if( isTierMatch( TIER_TYPE.CLOUD_TIER, TIER_TYPE.GLACIER )){
+ @if( isTierMatch( TIER_TYPE.CLOUD_TIER, TIER_TYPE.GLACIER )){
<cd-alert-panel type="warning"
spacingClass="mb-2">
<span i18n>RGW service would be restarted after creating the storage class.</span>
secret_key: response?.secret,
target_path: response?.target_path,
retain_head_object: this.tierTargetInfo?.val?.retain_head_object || false,
- multipart_sync_threshold: response?.multipart_sync_threshold || '',
- multipart_min_part_size: response?.multipart_min_part_size || '',
allow_read_through: this.tierTargetInfo?.val?.allow_read_through || false,
restore_storage_class: this.tierTargetInfo?.val?.restore_storage_class,
read_through_restore_days: this.tierTargetInfo?.val?.read_through_restore_days,
acl_mappings: this.tierTargetInfo?.val?.s3?.acl_mappings || []
});
- this.acls?.clear();
- if (aclMappings.length > 0) {
- aclMappings.forEach((acl) => {
- this.acls?.push(
- this.formBuilder.group({
- source_id: [acl.val?.source_id || ''],
- dest_id: [acl.val?.dest_id || ''],
- type: [acl.val?.type || AclTypeConst.ID, Validators.required]
- })
- );
- });
- } else {
- this.addAcls();
+ if (
+ this.storageClassForm.get('storageClassType')?.value === TIER_TYPE.CLOUD_TIER ||
+ this.storageClassForm.get('storageClassType')?.value === TIER_TYPE.GLACIER
+ ) {
+ this.acls?.clear();
+ if (aclMappings.length > 0) {
+ aclMappings.forEach((acl) => {
+ this.acls?.push(
+ this.formBuilder.group({
+ source_id: [acl.val?.source_id || ''],
+ dest_id: [acl.val?.dest_id || ''],
+ type: [acl.val?.type || AclTypeConst.ID, Validators.required]
+ })
+ );
+ });
+ } else {
+ this.addAcls();
+ }
}
if (this.tierTargetInfo?.val?.tier_type == TIER_TYPE.GLACIER) {
let glacierResponse = this.tierTargetInfo?.val['s3-glacier'];
this.onAllowReadThroughChange(value);
});
}
-
createForm() {
const self = this;
),
allow_read_through: new FormControl(false),
storageClassType: new FormControl(TIER_TYPE.LOCAL, Validators.required),
- acls: new FormArray([this.createAcls()])
+ acls: new FormArray([])
+ });
+ this.storageClassForm.get('storageClassType')?.valueChanges.subscribe((type: string) => {
+ if (type === TIER_TYPE.CLOUD_TIER) {
+ const aclsArray = this.storageClassForm.get('acls') as FormArray;
+ aclsArray.push(this.createAcls());
+ }
});
}
buildRequest() {
if (this.storageClassForm.errors) return null;
-
const rawFormValue = _.cloneDeep(this.storageClassForm.value);
const zoneGroup = this.storageClassForm.get('zonegroup').value;
const storageClass = this.storageClassForm.get('storage_class').value;
this.removedAclSourceIds.forEach((sourceId: string, index: number) => {
tier_config_rm[`acls[${index}].source_id`] = sourceId;
});
- if (this.aclList.length > rawFormValue.acls.length) {
- this.aclList.forEach((acl: ACL, index: number) => {
+ if (this.aclList?.length > rawFormValue.acls?.length) {
+ this.aclList?.forEach((acl: ACL, index: number) => {
const sourceId = acl?.val?.source_id;
const ifExist = removeAclList.find((acl: ACLVal) => acl?.source_id === sourceId);
projects / ceph-ci.git / commitdiff