Skeleton bundle component some more

This commit is contained in:
shamoon
2025-11-04 10:25:57 -08:00
parent fa2d289615
commit 378cd95016
5 changed files with 143 additions and 88 deletions

View File

@@ -1,6 +1,6 @@
<div class="modal-header">
<h4 class="modal-title" i18n>Share Selected Documents</h4>
<button type="button" class="btn-close" aria-label="Close" (click)="close()"></button>
<h4 class="modal-title">{{ title }}</h4>
<button type="button" class="btn-close" aria-label="Close" (click)="cancel()"></button>
</div>
<div class="modal-body">
<form [formGroup]="form" class="d-flex flex-column gap-3">
@@ -29,44 +29,47 @@
</div>
<div class="d-flex align-items-center justify-content-between">
<div class="form-check form-switch">
<div class="input-group">
<label class="input-group-text" for="expirationDays"><ng-container i18n>Expires</ng-container>:</label>
<select class="form-select" id="expirationDays" formControlName="expirationDays">
@for (option of expirationOptions; track option.value) {
<option [ngValue]="option.value">{{ option.label }}</option>
}
</select>
</div>
<div class="form-check form-switch w-100 ms-3">
<input
class="form-check-input"
type="checkbox"
role="switch"
id="shareArchiveSwitch"
formControlName="shareArchiveVersion"
[disabled]="archiveOptionDisabled"
/>
<label class="form-check-label" for="shareArchiveSwitch" i18n>Share archive version</label>
<label class="form-check-label" for="shareArchiveSwitch" i18n>Share archive version (if available)</label>
</div>
</div>
@if (archiveOptionDisabled && selectionCount > 0) {
<p class="small text-muted mb-0">
<ng-container i18n>Archive versions are available only when every selected document has one. Missing archive versions: {{ missingArchiveCount }}.</ng-container>
</p>
}
<div class="input-group">
<label class="input-group-text" for="expirationDays"><ng-container i18n>Expires</ng-container>:</label>
<select class="form-select" id="expirationDays" formControlName="expirationDays">
@for (option of expirationOptions; track option.value) {
<option [ngValue]="option.value">{{ option.label }}</option>
}
</select>
</div>
<div class="alert alert-info mb-0" role="alert">
<ng-container i18n>Bulk share link creation is still being prototyped. Saving will close this dialog and return the selected options only.</ng-container>
<ng-container i18n>Bulk share link creation is experimental. Saving will attempt to start the process and show the result as a notification.</ng-container>
</div>
</form>
</div>
<div class="modal-footer flex-column align-items-stretch">
<div class="d-flex justify-content-end gap-2 w-100">
<button type="button" class="btn btn-outline-secondary btn-sm" (click)="close()" i18n>Close</button>
<button type="button" class="btn btn-primary btn-sm" (click)="submit()" i18n>Save options</button>
</div>
<div class="text-muted fst-italic small mt-2">
<ng-container i18n>Large bundles can take significant time to prepare and / or download.</ng-container>
<div class="modal-footer">
<div class="d-flex align-items-center gap-2 w-100">
<div class="text-light fst-italic small">
<ng-container i18n>Large bundles can take significant time to prepare and / or download.</ng-container>
</div>
<button type="button" class="btn btn-outline-secondary btn-sm ms-auto" (click)="cancel()">{{ cancelBtnCaption }}</button>
<button
type="button"
class="btn btn-primary btn-sm d-inline-flex align-items-center gap-2"
(click)="submit()"
[disabled]="loading || !buttonsEnabled">
@if (loading) {
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
}
<span>{{ btnCaption }}</span>
</button>
</div>
</div>