diff --git a/src/app/organizations/vault/collections.component.ts b/src/app/organizations/vault/collections.component.ts
index 10abc41b20..bc8ee6ed20 100644
--- a/src/app/organizations/vault/collections.component.ts
+++ b/src/app/organizations/vault/collections.component.ts
@@ -1,12 +1,10 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { ApiService } from 'jslib/abstractions/api.service';
 import { CipherService } from 'jslib/abstractions/cipher.service';
 import { CollectionService } from 'jslib/abstractions/collection.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 
 import { CipherData } from 'jslib/models/data/cipherData';
 import { Cipher } from 'jslib/models/domain/cipher';
@@ -22,10 +20,10 @@ import { CollectionsComponent as BaseCollectionsComponent } from '../../vault/co
 export class CollectionsComponent extends BaseCollectionsComponent {
     organization: Organization;
 
-    constructor(collectionService: CollectionService, analytics: Angulartics2,
-        toasterService: ToasterService, i18nService: I18nService,
-        cipherService: CipherService, private apiService: ApiService) {
-        super(collectionService, analytics, toasterService, i18nService, cipherService);
+    constructor(collectionService: CollectionService, platformUtilsService: PlatformUtilsService,
+        i18nService: I18nService, cipherService: CipherService,
+        private apiService: ApiService) {
+        super(collectionService, platformUtilsService, i18nService, cipherService);
     }
 
     protected async loadCipher() {
diff --git a/src/app/vault/collections.component.ts b/src/app/vault/collections.component.ts
index 741614d506..2870cc7f0a 100644
--- a/src/app/vault/collections.component.ts
+++ b/src/app/vault/collections.component.ts
@@ -1,72 +1,31 @@
 import {
     Component,
-    EventEmitter,
-    Input,
     OnDestroy,
-    OnInit,
-    Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { CipherService } from 'jslib/abstractions/cipher.service';
 import { CollectionService } from 'jslib/abstractions/collection.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 
-import { CipherView } from 'jslib/models/view/cipherView';
 import { CollectionView } from 'jslib/models/view/collectionView';
 
-import { Cipher } from 'jslib/models/domain/cipher';
+import { CollectionsComponent as BaseCollectionsComponent } from 'jslib/angular/components/collections.component';
 
 @Component({
     selector: 'app-vault-collections',
     templateUrl: 'collections.component.html',
 })
-export class CollectionsComponent implements OnInit, OnDestroy {
-    @Input() cipherId: string;
-    @Output() onSavedCollections = new EventEmitter();
-
-    formPromise: Promise<any>;
-    cipher: CipherView;
-    collectionIds: string[];
-    collections: CollectionView[] = [];
-
-    protected cipherDomain: Cipher;
-
-    constructor(protected collectionService: CollectionService, protected analytics: Angulartics2,
-        protected toasterService: ToasterService, protected i18nService: I18nService,
-        protected cipherService: CipherService) { }
-
-    async ngOnInit() {
-        this.cipherDomain = await this.loadCipher();
-        this.collectionIds = this.loadCipherCollections();
-        this.cipher = await this.cipherDomain.decrypt();
-        this.collections = await this.loadCollections();
-
-        this.selectAll(false);
-        if (this.collectionIds != null) {
-            this.collections.forEach((c) => {
-                (c as any).checked = this.collectionIds != null && this.collectionIds.indexOf(c.id) > -1;
-            });
-        }
+export class CollectionsComponent extends BaseCollectionsComponent implements OnDestroy {
+    constructor(collectionService: CollectionService, platformUtilsService: PlatformUtilsService,
+        i18nService: I18nService, cipherService: CipherService) {
+        super(collectionService, platformUtilsService, i18nService, cipherService);
     }
 
     ngOnDestroy() {
         this.selectAll(false);
     }
 
-    async submit() {
-        this.cipherDomain.collectionIds = this.collections
-            .filter((c) => !!(c as any).checked)
-            .map((c) => c.id);
-        this.formPromise = this.saveCollections();
-        await this.formPromise;
-        this.onSavedCollections.emit();
-        this.analytics.eventTrack.next({ action: 'Edited Cipher Collections' });
-        this.toasterService.popAsync('success', null, this.i18nService.t('editedItem'));
-    }
-
     check(c: CollectionView, select?: boolean) {
         (c as any).checked = select == null ? !(c as any).checked : select;
     }
@@ -74,21 +33,4 @@ export class CollectionsComponent implements OnInit, OnDestroy {
     selectAll(select: boolean) {
         this.collections.forEach((c) => this.check(c, select));
     }
-
-    protected loadCipher() {
-        return this.cipherService.get(this.cipherId);
-    }
-
-    protected loadCipherCollections() {
-        return this.cipherDomain.collectionIds;
-    }
-
-    protected async loadCollections() {
-        const allCollections = await this.collectionService.getAllDecrypted();
-        return allCollections.filter((c) => !c.readOnly && c.organizationId === this.cipher.organizationId);
-    }
-
-    protected saveCollections() {
-        return this.cipherService.saveCollectionsWithServer(this.cipherDomain);
-    }
 }