control save button enabled for sharing modal

src/app/vault/bulk-share.component.html

@@ -46,7 +46,7 @@
                 </table>
             </div>
             <div class="modal-footer">
-                <button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
+                <button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave" [ngClass]="{loading:form.loading}">
                     <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
                     <span>{{'save' | i18n}}</span>
                 </button>

src/app/vault/bulk-share.component.ts

@@ -67,12 +67,14 @@ export class BulkShareComponent implements OnInit {
 
     async submit() {
         const checkedCollectionIds = this.collections.filter((c) => (c as any).checked).map((c) => c.id);
+        try {
             this.formPromise = this.cipherService.shareManyWithServer(this.shareableCiphers, this.organizationId,
                 checkedCollectionIds);
             await this.formPromise;
             this.onShared.emit();
             this.analytics.eventTrack.next({ action: 'Bulk Shared Items' });
             this.toasterService.popAsync('success', null, this.i18nService.t('sharedItems'));
+        } catch { }
     }
 
     check(c: CollectionView, select?: boolean) {
@@ -83,4 +85,15 @@ export class BulkShareComponent implements OnInit {
         const collections = select ? this.collections : this.writeableCollections;
         collections.forEach((c) => this.check(c, select));
     }
+
+    get canSave() {
+        if (this.shareableCiphers != null && this.shareableCiphers.length > 0 && this.collections != null) {
+            for (let i = 0; i < this.collections.length; i++) {
+                if ((this.collections[i] as any).checked) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
 }

src/app/vault/share.component.html

@@ -49,7 +49,7 @@
                 </table>
             </div>
             <div class="modal-footer">
-                <button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading" *ngIf="organizations && organizations.length">
+                <button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave" [ngClass]="{loading:form.loading}" *ngIf="organizations && organizations.length">
                     <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
                     <span>{{'save' | i18n}}</span>
                 </button>

src/app/vault/share.component.ts

@@ -97,4 +97,15 @@ export class ShareComponent implements OnInit, OnDestroy {
         const collections = select ? this.collections : this.writeableCollections;
         collections.forEach((c) => this.check(c, select));
     }
+
+    get canSave() {
+        if (this.collections != null) {
+            for (let i = 0; i < this.collections.length; i++) {
+                if ((this.collections[i] as any).checked) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
 }

src/scss/styles.scss

@@ -276,7 +276,7 @@ label:not(.form-check-label):not(.btn) {
         right: 0;
     }
 
-    &:disabled {
+    &:disabled:not(.manual), &.loading {
         .fa-spinner {
             display: flex;
         }