Change fields to field(s)

Move error summary below form
Add error summary
2025-12-06 00:03:28 +00:00 · 2022-05-30 13:47:02 +02:00 · 2022-05-23 17:15:21 +02:00 · 2022-05-23 15:27:49 +02:00 · 2022-05-20 16:57:55 +02:00 · 2022-05-17 22:19:27 +02:00
59 changed files with 384 additions and 474 deletions
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -19,8 +19,8 @@ jobs:
    name: Setup
    runs-on: ubuntu-20.04
    outputs:
-      release_version: ${{ steps.version.outputs.version }}
-      tag_version: ${{ steps.version.outputs.version }}
+      release_version: ${{ steps.version.outputs.package }}
+      tag_version: ${{ steps.version.outputs.tag }}
      branch_name: ${{ steps.branch.outputs.branch_name }}
    steps:
      - name: Branch check
@@ -38,11 +38,20 @@ jobs:

      - name: Check Release Version
        id: version
-        uses: bitwarden/gh-actions/release-version-check@ea9fab01d76940267b4147cc1c4542431246b9f6
-        with:
-          release-type: ${{ github.event.inputs.release_type }}
-          project-type: ts
-          file: package.json
+        run: |
+          version=$( jq -r ".version" package.json)
+          previous_release_tag_version=$(
+            curl -sL https://api.github.com/repos/$GITHUB_REPOSITORY/releases/latest | jq -r ".tag_name"
+          )
+
+          if [ "v$version" == "$previous_release_tag_version" ] && \
+          [ "${{ github.event.inputs.release_type }}" == "Initial Release" ]; then
+            echo "[!] Already released v$version. Please bump version to continue"
+            exit 1
+          fi
+
+          echo "::set-output name=package::$version"
+          echo "::set-output name=tag::v$version"

      - name: Get branch name
        id: branch
--- a/README.md
+++ b/README.md
@@ -1,6 +1,8 @@
-> **Archived**
+> **Repository Reorganization in Progress**
 >
-> This repository is archived, please go to https://github.com/bitwarden/clients for future development.
+> We are currently migrating some projects over to a mono repository. For existing PR's we will be providing documentation on how to move/migrate them. To minimize the overhead we are actively reviewing open PRs. If possible please ensure any pending comments are resolved as soon as possible.
+>
+> New pull requests created during this transition period may not get addressed —if needed, please create a new PR after the reorganization is complete.

 <p align="center">
    <img src="https://raw.githubusercontent.com/bitwarden/brand/master/screenshots/web-vault-macbook.png" alt="" width="600" height="358" />
--- a/bitwarden_license/src/app/organizations/organizations-routing.module.ts
+++ b/bitwarden_license/src/app/organizations/organizations-routing.module.ts
@@ -22,16 +22,14 @@ const routes: Routes = [
        component: ManageComponent,
        canActivate: [PermissionsGuard],
        data: {
-          permissions: NavigationPermissionsService.getPermissions("manage"),
+          permissions: NavigationPermissionsService.getPermissions("manage").concat(
+            Permissions.ManageSso
+          ),
        },
        children: [
          {
            path: "sso",
            component: SsoComponent,
-            canActivate: [PermissionsGuard],
-            data: {
-              permissions: [Permissions.ManageSso],
-            },
          },
        ],
      },
--- a/crowdin.yml
+++ b/crowdin.yml
@@ -15,4 +15,3 @@ files:
        en-GB: en_GB
        en-IN: en_IN
        sr-CY: sr_CY
-        sr-CS: sr_CS
--- a/2
+++ b/2
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "@bitwarden/web-vault",
-  "version": "2022.05.0",
+  "version": "2.28.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@bitwarden/web-vault",
-      "version": "2022.05.0",
+      "version": "2.28.1",
      "hasInstallScript": true,
      "license": "GPL-3.0",
      "dependencies": {
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@bitwarden/web-vault",
-  "version": "2022.05.0",
+  "version": "2.28.1",
  "license": "GPL-3.0",
  "repository": "https://github.com/bitwarden/web",
  "scripts": {
--- a/src/app/accounts/register.component.html
+++ b/src/app/accounts/register.component.html
@@ -101,7 +101,7 @@
      <div [ngClass]="{ 'col-5': layout, 'col-12': !layout }">
        <div class="row justify-content-md-center mt-5">
          <div [ngClass]="{ 'col-5': !layout, 'col-12': layout }">
-            <h1 class="lead text-center mb-4" *ngIf="!layout">{{ "createAccount" | i18n }}</h1>
+            <p class="lead text-center mb-4" *ngIf="!layout">{{ "createAccount" | i18n }}</p>
            <div class="card d-block">
              <div class="card-body">
                <app-callout
--- a/src/app/common/base.events.component.ts
+++ b/src/app/common/base.events.component.ts
@@ -122,20 +122,17 @@ export abstract class BaseEventsComponent {
        const userId = r.actingUserId == null ? r.userId : r.actingUserId;
        const eventInfo = await this.eventService.getEventInfo(r);
        const user = this.getUserName(r, userId);
-        const userName = user != null ? user.name : this.i18nService.t("unknown");
-
        return new EventView({
          message: eventInfo.message,
          humanReadableMessage: eventInfo.humanReadableMessage,
          appIcon: eventInfo.appIcon,
          appName: eventInfo.appName,
          userId: userId,
-          userName: r.installationId != null ? `Installation: ${r.installationId}` : userName,
+          userName: user != null ? user.name : this.i18nService.t("unknown"),
          userEmail: user != null ? user.email : "",
          date: r.date,
          ip: r.ipAddress,
          type: r.type,
-          installationId: r.installationId,
        });
      })
    );
--- a/src/app/components/organization-switcher.component.html
+++ b/src/app/components/organization-switcher.component.html
@@ -46,7 +46,7 @@
  <bit-menu #orgPickerMenu>
    <ul aria-labelledby="pickerButton" class="tw-p-0 tw-m-0">
      <li *ngFor="let org of organizations" class="tw-list-none tw-flex tw-flex-col" role="none">
-        <a bitMenuItem [routerLink]="['/organizations', org.id]">
+        <a bit-menu-item [routerLink]="['/organizations', org.id]">
          <i
            class="bwi bwi-check mr-2"
            [ngClass]="org.id === activeOrganization.id ? 'visible' : 'invisible'"
@@ -58,7 +58,7 @@
      </li>
      <bit-menu-divider></bit-menu-divider>
      <li class="tw-list-none" role="none">
-        <a bitMenuItem routerLink="/create-organization">
+        <a bit-menu-item routerLink="/create-organization">
          <i class="bwi bwi-plus mr-2"></i>
          {{ "newOrganization" | i18n }}</a
        >
--- a/src/app/components/premium-badge.component.ts
+++ b/src/app/components/premium-badge.component.ts
@@ -5,7 +5,7 @@ import { MessagingService } from "jslib-common/abstractions/messaging.service";
@Component({
  selector: "app-premium-badge",
  template: `
-    <button *appNotPremium bitBadge badgeType="success" (click)="premiumRequired()">
+    <button *appNotPremium bit-badge badgeType="success" (click)="premiumRequired()">
      {{ "premium" | i18n }}
    </button>
  `,
--- a/src/app/layouts/footer.component.html
+++ b/src/app/layouts/footer.component.html
@@ -1,6 +1,6 @@
 <div class="container footer text-muted">
  <div class="row">
-    <div class="col">&copy; {{ year }} Bitwarden Inc.</div>
+    <div class="col">&copy; {{ year }}, Bitwarden Inc.</div>
    <div class="col text-center"></div>
    <div class="col text-right">
      {{ "versionNumber" | i18n: version }}
--- a/src/app/layouts/frontend-layout.component.html
+++ b/src/app/layouts/frontend-layout.component.html
@@ -1,5 +1,5 @@
 <router-outlet></router-outlet>
 <div class="container my-5 text-muted text-center">
-  &copy; {{ year }} Bitwarden Inc. <br />
+  &copy; {{ year }}, Bitwarden Inc. <br />
  {{ "versionNumber" | i18n: version }}
 </div>
--- a/src/app/layouts/navbar.component.html
+++ b/src/app/layouts/navbar.component.html
@@ -65,24 +65,24 @@
              </div>
            </div>
            <bit-menu-divider></bit-menu-divider>
-            <a bitMenuItem routerLink="/settings/account">
+            <a bit-menu-item routerLink="/settings/account">
              <i class="bwi bwi-fw bwi-user" aria-hidden="true"></i>
              {{ "accountSettings" | i18n }}
            </a>
-            <a bitMenuItem href="https://bitwarden.com/help/" target="_blank" rel="noopener">
+            <a bit-menu-item href="https://bitwarden.com/help/" target="_blank" rel="noopener">
              <i class="bwi bwi-fw bwi-question-circle" aria-hidden="true"></i>
              {{ "getHelp" | i18n }}
            </a>
-            <a bitMenuItem href="https://bitwarden.com/download/" target="_blank" rel="noopener">
+            <a bit-menu-item href="https://bitwarden.com/download/" target="_blank" rel="noopener">
              <i class="bwi bwi-fw bwi-download" aria-hidden="true"></i>
              {{ "getApps" | i18n }}
            </a>
            <bit-menu-divider></bit-menu-divider>
-            <button bitMenuItem type="button" (click)="lock()">
+            <button bit-menu-item type="button" (click)="lock()">
              <i class="bwi bwi-fw bwi-lock" aria-hidden="true"></i>
              {{ "lockNow" | i18n }}
            </button>
-            <button bitMenuItem type="button" (click)="logOut()">
+            <button bit-menu-item type="button" (click)="logOut()">
              <i class="bwi bwi-fw bwi-sign-out" aria-hidden="true"></i>
              {{ "logOut" | i18n }}
            </button>
--- a/src/app/modules/loose-components.module.ts
+++ b/src/app/modules/loose-components.module.ts
@@ -114,6 +114,7 @@ import { EmergencyAccessTakeoverComponent } from "../settings/emergency-access-t
 import { EmergencyAccessViewComponent } from "../settings/emergency-access-view.component";
 import { EmergencyAccessComponent } from "../settings/emergency-access.component";
 import { EmergencyAddEditComponent } from "../settings/emergency-add-edit.component";
+import { LinkSsoComponent } from "../settings/link-sso.component";
 import { OrganizationPlansComponent } from "../settings/organization-plans.component";
 import { PaymentMethodComponent } from "../settings/payment-method.component";
 import { PaymentComponent } from "../settings/payment.component";
@@ -222,6 +223,7 @@ import { OrganizationBadgeModule } from "./vault/modules/organization-badge/orga
    HintComponent,
    ImportComponent,
    InactiveTwoFactorReportComponent,
+    LinkSsoComponent,
    LockComponent,
    LoginComponent,
    MasterPasswordPolicyComponent,
@@ -381,6 +383,7 @@ import { OrganizationBadgeModule } from "./vault/modules/organization-badge/orga
    HintComponent,
    ImportComponent,
    InactiveTwoFactorReportComponent,
+    LinkSsoComponent,
    LockComponent,
    LoginComponent,
    MasterPasswordPolicyComponent,
--- a/src/app/modules/organizations/users/enroll-master-password-reset.component.html
+++ b/src/app/modules/organizations/users/enroll-master-password-reset.component.html
@@ -1,59 +0,0 @@
-<div
-  class="modal fade"
-  role="dialog"
-  aria-modal="true"
-  aria-labelledby="enrollMasterPasswordResetTitle"
->
-  <div class="modal-dialog modal-dialog-scrollable" role="document">
-    <form
-      class="modal-content"
-      #form
-      (ngSubmit)="submit()"
-      [appApiAction]="formPromise"
-      ngNativeValidate
-    >
-      <div class="modal-header">
-        <h2 class="modal-title" id="enrollMasterPasswordResetTitle">
-          {{ (isEnrolled ? "withdrawPasswordReset" : "enrollPasswordReset") | i18n }}
-        </h2>
-        <button
-          type="button"
-          class="close"
-          data-dismiss="modal"
-          appA11yTitle="{{ 'close' | i18n }}"
-        >
-          <span aria-hidden="true">&times;</span>
-        </button>
-      </div>
-      <div class="modal-body">
-        <app-callout type="warning" *ngIf="!isEnrolled">
-          {{ "resetPasswordEnrollmentWarning" | i18n }}
-        </app-callout>
-        <app-user-verification [(ngModel)]="verification" name="secret"> </app-user-verification>
-      </div>
-      <div class="modal-footer">
-        <button bitButton buttonType="primary" type="submit" [disabled]="form.loading">
-          <i
-            class="bwi bwi-spinner bwi-spin"
-            title="{{ 'loading' | i18n }}"
-            *ngIf="form.loading"
-          ></i>
-          <span>
-            {{ "submit" | i18n }}
-          </span>
-        </button>
-        <button
-          bitButton
-          buttonType="secondary"
-          type="button"
-          data-dismiss="modal"
-          appA11yTitle="{{ 'close' | i18n }}"
-        >
-          <span>
-            {{ "cancel" | i18n }}
-          </span>
-        </button>
-      </div>
-    </form>
-  </div>
-</div>
--- a/src/app/modules/organizations/users/enroll-master-password-reset.component.ts
+++ b/src/app/modules/organizations/users/enroll-master-password-reset.component.ts
@@ -1,97 +0,0 @@
-import { Component } from "@angular/core";
-
-import { ModalRef } from "jslib-angular/components/modal/modal.ref";
-import { ModalConfig } from "jslib-angular/services/modal.service";
-import { ApiService } from "jslib-common/abstractions/api.service";
-import { CryptoService } from "jslib-common/abstractions/crypto.service";
-import { I18nService } from "jslib-common/abstractions/i18n.service";
-import { LogService } from "jslib-common/abstractions/log.service";
-import { PlatformUtilsService } from "jslib-common/abstractions/platformUtils.service";
-import { SyncService } from "jslib-common/abstractions/sync.service";
-import { UserVerificationService } from "jslib-common/abstractions/userVerification.service";
-import { Utils } from "jslib-common/misc/utils";
-import { Organization } from "jslib-common/models/domain/organization";
-import { OrganizationUserResetPasswordEnrollmentRequest } from "jslib-common/models/request/organizationUserResetPasswordEnrollmentRequest";
-import { Verification } from "jslib-common/types/verification";
-
-@Component({
-  selector: "app-enroll-master-password-reset",
-  templateUrl: "enroll-master-password-reset.component.html",
-})
-export class EnrollMasterPasswordReset {
-  organization: Organization;
-
-  verification: Verification;
-  formPromise: Promise<any>;
-
-  constructor(
-    private userVerificationService: UserVerificationService,
-    private apiService: ApiService,
-    private platformUtilsService: PlatformUtilsService,
-    private i18nService: I18nService,
-    private cryptoService: CryptoService,
-    private syncService: SyncService,
-    private logService: LogService,
-    private modalRef: ModalRef,
-    config: ModalConfig
-  ) {
-    this.organization = config.data.organization;
-  }
-
-  async submit() {
-    let toastStringRef = "withdrawPasswordResetSuccess";
-
-    this.formPromise = this.userVerificationService
-      .buildRequest(this.verification, OrganizationUserResetPasswordEnrollmentRequest)
-      .then(async (request) => {
-        // Set variables
-        let keyString: string = null;
-
-        // Enrolling
-        if (!this.organization.resetPasswordEnrolled) {
-          // Retrieve Public Key
-          const orgKeys = await this.apiService.getOrganizationKeys(this.organization.id);
-          if (orgKeys == null) {
-            throw new Error(this.i18nService.t("resetPasswordOrgKeysError"));
-          }
-
-          const publicKey = Utils.fromB64ToArray(orgKeys.publicKey);
-
-          // RSA Encrypt user's encKey.key with organization public key
-          const encKey = await this.cryptoService.getEncKey();
-          const encryptedKey = await this.cryptoService.rsaEncrypt(encKey.key, publicKey.buffer);
-          keyString = encryptedKey.encryptedString;
-          toastStringRef = "enrollPasswordResetSuccess";
-
-          // Create request and execute enrollment
-          request.resetPasswordKey = keyString;
-          await this.apiService.putOrganizationUserResetPasswordEnrollment(
-            this.organization.id,
-            this.organization.userId,
-            request
-          );
-        } else {
-          // Withdrawal
-          request.resetPasswordKey = keyString;
-          await this.apiService.putOrganizationUserResetPasswordEnrollment(
-            this.organization.id,
-            this.organization.userId,
-            request
-          );
-        }
-
-        await this.syncService.fullSync(true);
-      });
-    try {
-      await this.formPromise;
-      this.platformUtilsService.showToast("success", null, this.i18nService.t(toastStringRef));
-      this.modalRef.close();
-    } catch (e) {
-      this.logService.error(e);
-    }
-  }
-
-  get isEnrolled(): boolean {
-    return this.organization.resetPasswordEnrolled;
-  }
-}
--- a/src/app/modules/organizations/users/organization-user.module.ts
+++ b/src/app/modules/organizations/users/organization-user.module.ts
@@ -1,14 +0,0 @@
-import { ScrollingModule } from "@angular/cdk/scrolling";
-import { NgModule } from "@angular/core";
-
-import { LooseComponentsModule } from "../../loose-components.module";
-import { SharedModule } from "../../shared.module";
-
-import { EnrollMasterPasswordReset } from "./enroll-master-password-reset.component";
-
-@NgModule({
-  imports: [SharedModule, ScrollingModule, LooseComponentsModule],
-  declarations: [EnrollMasterPasswordReset],
-  exports: [EnrollMasterPasswordReset],
-})
-export class OrganizationUserModule {}
--- a/src/app/modules/shared.module.ts
+++ b/src/app/modules/shared.module.ts
@@ -53,7 +53,13 @@ import localeZhTw from "@angular/common/locales/zh-Hant";
 import { NgModule } from "@angular/core";
 import { FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { RouterModule } from "@angular/router";
-import { BadgeModule, ButtonModule, CalloutModule, MenuModule } from "@bitwarden/components";
+import {
+  BadgeModule,
+  ButtonModule,
+  CalloutModule,
+  FormFieldModule,
+  MenuModule,
+} from "@bitwarden/components";
 import { InfiniteScrollModule } from "ngx-infinite-scroll";
 import { ToastrModule } from "ngx-toastr";

@@ -126,6 +132,7 @@ registerLocaleData(localeZhTw, "zh-TW");
    BadgeModule,
    ButtonModule,
    MenuModule,
+    FormFieldModule,
  ],
  exports: [
    CommonModule,
@@ -136,6 +143,7 @@ registerLocaleData(localeZhTw, "zh-TW");
    ReactiveFormsModule,
    RouterModule,
    BadgeModule,
+    FormFieldModule,
    ButtonModule,
    CalloutModule,
    ToastrModule,
--- a/src/app/modules/vault-filter/components/collection-filter.component.html
+++ b/src/app/modules/vault-filter/components/collection-filter.component.html
@@ -16,7 +16,7 @@
        aria-hidden="true"
      ></i>
    </button>
-    <h3 class="filter-title">&nbsp;{{ collectionsGrouping.name | i18n }}</h3>
+    <h3 class="filter-title">{{ collectionsGrouping.name | i18n }}</h3>
  </div>
  <ul id="collection-filters" *ngIf="!isCollapsed(collectionsGrouping)" class="filter-options">
    <ng-template #recursiveCollections let-collections>
@@ -31,7 +31,7 @@
          <button
            class="toggle-button"
            *ngIf="c.children.length"
-            (click)="toggleCollapse(c.node)"
+            (click)="collapse(c.node)"
            title="{{ 'toggleCollapse' | i18n }}"
            [attr.aria-expanded]="!isCollapsed(c.node)"
            [attr.aria-controls]="c.node.name + '_children'"
@@ -51,7 +51,7 @@
              class="bwi bwi-collection bwi-fw"
              aria-hidden="true"
            ></i
-            >&nbsp;{{ c.node.name }}
+            >{{ c.node.name }}
          </button>
        </span>
        <ul
--- a/src/app/modules/vault-filter/components/folder-filter.component.html
+++ b/src/app/modules/vault-filter/components/folder-filter.component.html
@@ -16,7 +16,9 @@
        }"
      ></i>
    </button>
-    <h3 class="filter-title">&nbsp;{{ "folders" | i18n }}</h3>
+    <h3 class="filter-title">
+      {{ "folders" | i18n }}
+    </h3>
    <button
      class="text-muted ml-auto add-button"
      (click)="addFolder()"
@@ -54,7 +56,7 @@
          </button>
          <button class="filter-button" (click)="applyFilter(f.node)">
            <i *ngIf="f.children.length === 0" class="bwi bwi-fw bwi-folder" aria-hidden="true"></i
-            >&nbsp;{{ f.node.name }}
+            >{{ f.node.name }}
          </button>
          <button
            class="edit-button"
--- a/src/app/modules/vault-filter/components/organization-filter.component.html
+++ b/src/app/modules/vault-filter/components/organization-filter.component.html
@@ -14,7 +14,7 @@
          <span class="filter-buttons">
            <a href="#" routerLink="/create-organization" class="filter-button">
              <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-              &nbsp;{{ "newOrganization" | i18n }}
+              {{ "newOrganization" | i18n }}
            </a>
          </span>
        </li>
@@ -45,6 +45,14 @@
        >
          &nbsp;{{ organizationGrouping.name | i18n }}
        </button>
+        <a
+          href="#"
+          routerLink="/create-organization"
+          class="text-muted ml-auto create-organization-link"
+          appA11yTitle="{{ 'newOrganization' | i18n }}"
+        >
+          <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
+        </a>
      </div>
      <ul id="organization-filters" *ngIf="!isCollapsed" class="filter-options">
        <li
@@ -67,14 +75,6 @@
            </ng-container>
          </span>
        </li>
-        <li class="filter-option">
-          <span class="filter-buttons">
-            <a href="#" routerLink="/create-organization" class="filter-button">
-              <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-              &nbsp;{{ "newOrganization" | i18n }}
-            </a>
-          </span>
-        </li>
      </ul>
    </ng-container>
    <ng-container *ngSwitchCase="'singleOrganizationAndPersonalOwnershipPolicies'">
@@ -110,6 +110,15 @@
        >
          &nbsp;{{ organizationGrouping.name | i18n }}
        </button>
+        <a
+          href="#"
+          routerLink="/create-organization"
+          class="text-muted ml-auto create-organization-link"
+          appA11yTitle="{{ 'newOrganization' | i18n }}"
+          *ngIf="!(displayMode === 'singleOrganizationPolicy')"
+        >
+          <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
+        </a>
      </div>
      <ul id="organization-filters" *ngIf="!isCollapsed" class="filter-options">
        <li class="filter-option" [ngClass]="{ active: activeFilter.myVaultOnly }">
@@ -140,14 +149,6 @@
            </ng-container>
          </span>
        </li>
-        <li class="filter-option" *ngIf="!(displayMode === 'singleOrganizationPolicy')">
-          <span class="filter-buttons">
-            <a href="#" routerLink="/create-organization" class="filter-button">
-              <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-              &nbsp;{{ "newOrganization" | i18n }}
-            </a>
-          </span>
-        </li>
      </ul>
    </ng-container>
  </ng-container>
--- a/src/app/modules/vault-filter/components/organization-options.component.ts
+++ b/src/app/modules/vault-filter/components/organization-options.component.ts
@@ -1,17 +1,17 @@
 import { Component, Input } from "@angular/core";

-import { ModalService } from "jslib-angular/services/modal.service";
 import { ApiService } from "jslib-common/abstractions/api.service";
+import { CryptoService } from "jslib-common/abstractions/crypto.service";
 import { I18nService } from "jslib-common/abstractions/i18n.service";
 import { LogService } from "jslib-common/abstractions/log.service";
 import { PlatformUtilsService } from "jslib-common/abstractions/platformUtils.service";
 import { PolicyService } from "jslib-common/abstractions/policy.service";
 import { SyncService } from "jslib-common/abstractions/sync.service";
 import { PolicyType } from "jslib-common/enums/policyType";
+import { Utils } from "jslib-common/misc/utils";
 import { Organization } from "jslib-common/models/domain/organization";
 import { Policy } from "jslib-common/models/domain/policy";
-
-import { EnrollMasterPasswordReset } from "../../organizations/users/enroll-master-password-reset.component";
+import { OrganizationUserResetPasswordEnrollmentRequest } from "jslib-common/models/request/organizationUserResetPasswordEnrollmentRequest";

@Component({
  selector: "app-organization-options",
@@ -29,8 +29,8 @@ export class OrganizationOptionsComponent {
    private i18nService: I18nService,
    private apiService: ApiService,
    private syncService: SyncService,
+    private cryptoService: CryptoService,
    private policyService: PolicyService,
-    private modalService: ModalService,
    private logService: LogService
  ) {}

@@ -113,11 +113,70 @@ export class OrganizationOptionsComponent {
  }

  async toggleResetPasswordEnrollment(org: Organization) {
-    this.modalService.open(EnrollMasterPasswordReset, {
-      allowMultipleModals: true,
-      data: {
-        organization: org,
-      },
-    });
+    // Set variables
+    let keyString: string = null;
+    let toastStringRef = "withdrawPasswordResetSuccess";
+
+    // Enrolling
+    if (!org.resetPasswordEnrolled) {
+      // Alert user about enrollment
+      const confirmed = await this.platformUtilsService.showDialog(
+        this.i18nService.t("resetPasswordEnrollmentWarning"),
+        null,
+        this.i18nService.t("yes"),
+        this.i18nService.t("no"),
+        "warning"
+      );
+      if (!confirmed) {
+        return;
+      }
+
+      // Retrieve Public Key
+      this.actionPromise = this.apiService
+        .getOrganizationKeys(org.id)
+        .then(async (response) => {
+          if (response == null) {
+            throw new Error(this.i18nService.t("resetPasswordOrgKeysError"));
+          }
+
+          const publicKey = Utils.fromB64ToArray(response.publicKey);
+
+          // RSA Encrypt user's encKey.key with organization public key
+          const encKey = await this.cryptoService.getEncKey();
+          const encryptedKey = await this.cryptoService.rsaEncrypt(encKey.key, publicKey.buffer);
+          keyString = encryptedKey.encryptedString;
+          toastStringRef = "enrollPasswordResetSuccess";
+
+          // Create request and execute enrollment
+          const request = new OrganizationUserResetPasswordEnrollmentRequest();
+          request.resetPasswordKey = keyString;
+          return this.apiService.putOrganizationUserResetPasswordEnrollment(
+            org.id,
+            org.userId,
+            request
+          );
+        })
+        .then(() => {
+          return this.syncService.fullSync(true);
+        });
+    } else {
+      // Withdrawal
+      const request = new OrganizationUserResetPasswordEnrollmentRequest();
+      request.resetPasswordKey = keyString;
+      this.actionPromise = this.apiService
+        .putOrganizationUserResetPasswordEnrollment(org.id, org.userId, request)
+        .then(() => {
+          return this.syncService.fullSync(true);
+        });
+    }
+
+    try {
+      await this.actionPromise;
+      this.platformUtilsService.showToast("success", null, this.i18nService.t(toastStringRef));
+      await this.load();
+    } catch (e) {
+      this.platformUtilsService.showToast("error", this.i18nService.t("errorOccurred"), e.message);
+      this.logService.error(e);
+    }
  }
 }
--- a/src/app/modules/vault-filter/components/type-filter.component.html
+++ b/src/app/modules/vault-filter/components/type-filter.component.html
@@ -15,7 +15,9 @@
      }"
    ></i>
  </button>
-  <h3>&nbsp;{{ "types" | i18n }}</h3>
+  <h3>
+    {{ "types" | i18n }}
+  </h3>
 </div>
 <ul id="type-filters" *ngIf="!isCollapsed" class="filter-options">
  <li
@@ -24,14 +26,14 @@
  >
    <span class="filter-buttons">
      <button class="filter-button" (click)="applyFilter(cipherTypeEnum.Login)">
-        <i class="bwi bwi-fw bwi-globe" aria-hidden="true"></i>&nbsp;{{ "typeLogin" | i18n }}
+        <i class="bwi bwi-fw bwi-globe" aria-hidden="true"></i>{{ "typeLogin" | i18n }}
      </button>
    </span>
  </li>
  <li class="filter-option" [ngClass]="{ active: activeFilter.cipherType === cipherTypeEnum.Card }">
    <span class="filter-buttons">
      <button class="filter-button" (click)="applyFilter(cipherTypeEnum.Card)">
-        <i class="bwi bwi-fw bwi-credit-card" aria-hidden="true"></i>&nbsp;{{ "typeCard" | i18n }}
+        <i class="bwi bwi-fw bwi-credit-card" aria-hidden="true"></i>{{ "typeCard" | i18n }}
      </button>
    </span>
  </li>
@@ -41,7 +43,7 @@
  >
    <span class="filter-buttons">
      <button class="filter-button" (click)="applyFilter(cipherTypeEnum.Identity)">
-        <i class="bwi bwi-fw bwi-id-card" aria-hidden="true"></i>&nbsp;{{ "typeIdentity" | i18n }}
+        <i class="bwi bwi-fw bwi-id-card" aria-hidden="true"></i>{{ "typeIdentity" | i18n }}
      </button>
    </span>
  </li>
@@ -51,9 +53,7 @@
  >
    <span class="filter-buttons">
      <button class="filter-button" (click)="applyFilter(cipherTypeEnum.SecureNote)">
-        <i class="bwi bwi-fw bwi-sticky-note" aria-hidden="true"></i>&nbsp;{{
-          "typeSecureNote" | i18n
-        }}
+        <i class="bwi bwi-fw bwi-sticky-note" aria-hidden="true"></i>{{ "typeSecureNote" | i18n }}
      </button>
    </span>
  </li>
--- a/src/app/modules/vault-filter/organization-vault-filter.component.ts
+++ b/src/app/modules/vault-filter/organization-vault-filter.component.ts
@@ -1,28 +0,0 @@
-import { Component, Input } from "@angular/core";
-
-import { Organization } from "jslib-common/models/domain/organization";
-
-import { VaultFilterComponent } from "./vault-filter.component";
-
-@Component({
-  selector: "app-organization-vault-filter",
-  templateUrl: "vault-filter.component.html",
-})
-export class OrganizationVaultFilterComponent extends VaultFilterComponent {
-  hideOrganizations = true;
-  hideFavorites = true;
-  hideFolders = true;
-
-  organization: Organization;
-
-  async initCollections() {
-    if (this.organization.canEditAnyCollection) {
-      return await this.vaultFilterService.buildAdminCollections(this.organization.id);
-    }
-    return await this.vaultFilterService.buildCollections(this.organization.id);
-  }
-
-  async reloadCollectionsAndFolders() {
-    this.collections = await this.initCollections();
-  }
-}
--- a/src/app/modules/vault-filter/vault-filter.component.html
+++ b/src/app/modules/vault-filter/vault-filter.component.html
@@ -27,6 +27,7 @@
        appAutofocus
      />
      <app-organization-filter
+        *ngIf="showOrgFilter"
        [hide]="hideOrganizations"
        [activeFilter]="activeFilter"
        [collapsedFilterNodes]="collapsedFilterNodes"
@@ -38,7 +39,7 @@
      ></app-organization-filter>
      <div class="filter">
        <app-status-filter
-          [hideFavorites]="hideFavorites"
+          [hideFavorites]="!showFavorites"
          [hideTrash]="hideTrash"
          [activeFilter]="activeFilter"
          (onFilterChange)="applyFilter($event)"
@@ -54,7 +55,7 @@
      </div>
      <div class="filter">
        <app-folder-filter
-          [hide]="hideFolders"
+          [hide]="!showFolders"
          [activeFilter]="activeFilter"
          [collapsedFilterNodes]="collapsedFilterNodes"
          [folderNodes]="folders"
--- a/src/app/modules/vault-filter/vault-filter.component.ts
+++ b/src/app/modules/vault-filter/vault-filter.component.ts
@@ -1,26 +1,44 @@
-import { Component, EventEmitter, Output } from "@angular/core";
+import { Component, EventEmitter, Input, Output } from "@angular/core";

 import { VaultFilterComponent as BaseVaultFilterComponent } from "jslib-angular/modules/vault-filter/vault-filter.component";
-
-import { VaultFilterService } from "./vault-filter.service";
+import { VaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
+import { Organization } from "jslib-common/models/domain/organization";

@Component({
  selector: "app-vault-filter",
  templateUrl: "vault-filter.component.html",
 })
 export class VaultFilterComponent extends BaseVaultFilterComponent {
+  @Input() showOrgFilter = true;
+  @Input() showFolders = true;
+  @Input() showFavorites = true;
+
  @Output() onSearchTextChanged = new EventEmitter<string>();

  searchPlaceholder: string;
  searchText = "";

-  constructor(protected vaultFilterService: VaultFilterService) {
-    // This empty constructor is required to provide the web vaultFilterService subclass to super()
-    // TODO: refactor this to use proper dependency injection
+  organization: Organization;
+
+  constructor(vaultFilterService: VaultFilterService) {
    super(vaultFilterService);
  }

  searchTextChanged() {
    this.onSearchTextChanged.emit(this.searchText);
  }
+
+  // This method exists because the vault component gets its data mixed up during the initial sync on first login. It looks for data before the sync is complete.
+  // It should be removed as soon as doing so makes sense.
+  async reloadOrganizations() {
+    this.organizations = await this.vaultFilterService.buildOrganizations();
+    this.activePersonalOwnershipPolicy =
+      await this.vaultFilterService.checkForPersonalOwnershipPolicy();
+    this.activeSingleOrganizationPolicy =
+      await this.vaultFilterService.checkForSingleOrganizationPolicy();
+  }
+
+  async initCollections() {
+    return await this.vaultFilterService.buildCollections(this.organization?.id);
+  }
 }
--- a/src/app/modules/vault-filter/vault-filter.module.ts
+++ b/src/app/modules/vault-filter/vault-filter.module.ts
@@ -1,17 +1,22 @@
 import { NgModule } from "@angular/core";

+import { VaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
+import { CipherService } from "jslib-common/abstractions/cipher.service";
+import { CollectionService } from "jslib-common/abstractions/collection.service";
+import { FolderService } from "jslib-common/abstractions/folder.service";
+import { OrganizationService } from "jslib-common/abstractions/organization.service";
+import { PolicyService } from "jslib-common/abstractions/policy.service";
+import { StateService } from "jslib-common/abstractions/state.service";
+
 import { SharedModule } from "../shared.module";

 import { CollectionFilterComponent } from "./components/collection-filter.component";
 import { FolderFilterComponent } from "./components/folder-filter.component";
-import { LinkSsoComponent } from "./components/link-sso.component";
 import { OrganizationFilterComponent } from "./components/organization-filter.component";
 import { OrganizationOptionsComponent } from "./components/organization-options.component";
 import { StatusFilterComponent } from "./components/status-filter.component";
 import { TypeFilterComponent } from "./components/type-filter.component";
-import { OrganizationVaultFilterComponent } from "./organization-vault-filter.component";
 import { VaultFilterComponent } from "./vault-filter.component";
-import { VaultFilterService } from "./vault-filter.service";

@NgModule({
  imports: [SharedModule],
@@ -23,10 +28,21 @@ import { VaultFilterService } from "./vault-filter.service";
    OrganizationOptionsComponent,
    StatusFilterComponent,
    TypeFilterComponent,
-    OrganizationVaultFilterComponent,
-    LinkSsoComponent,
  ],
-  exports: [VaultFilterComponent, OrganizationVaultFilterComponent],
-  providers: [VaultFilterService],
+  exports: [VaultFilterComponent],
+  providers: [
+    {
+      provide: VaultFilterService,
+      useClass: VaultFilterService,
+      deps: [
+        StateService,
+        OrganizationService,
+        FolderService,
+        CipherService,
+        CollectionService,
+        PolicyService,
+      ],
+    },
+  ],
 })
 export class VaultFilterModule {}
--- a/src/app/modules/vault-filter/vault-filter.service.ts
+++ b/src/app/modules/vault-filter/vault-filter.service.ts
@@ -1,54 +1,3 @@
-import { Injectable } from "@angular/core";
-
-import { DynamicTreeNode } from "jslib-angular/modules/vault-filter/models/dynamic-tree-node.model";
 import { VaultFilterService as BaseVaultFilterService } from "jslib-angular/modules/vault-filter/vault-filter.service";
-import { ApiService } from "jslib-common/abstractions/api.service";
-import { CipherService } from "jslib-common/abstractions/cipher.service";
-import { CollectionService } from "jslib-common/abstractions/collection.service";
-import { FolderService } from "jslib-common/abstractions/folder.service";
-import { OrganizationService } from "jslib-common/abstractions/organization.service";
-import { PolicyService } from "jslib-common/abstractions/policy.service";
-import { StateService } from "jslib-common/abstractions/state.service";
-import { CollectionData } from "jslib-common/models/data/collectionData";
-import { Collection } from "jslib-common/models/domain/collection";
-import { CollectionDetailsResponse } from "jslib-common/models/response/collectionResponse";
-import { CollectionView } from "jslib-common/models/view/collectionView";

-@Injectable()
-export class VaultFilterService extends BaseVaultFilterService {
-  constructor(
-    stateService: StateService,
-    organizationService: OrganizationService,
-    folderService: FolderService,
-    cipherService: CipherService,
-    collectionService: CollectionService,
-    policyService: PolicyService,
-    protected apiService: ApiService
-  ) {
-    super(
-      stateService,
-      organizationService,
-      folderService,
-      cipherService,
-      collectionService,
-      policyService
-    );
-  }
-
-  async buildAdminCollections(organizationId: string) {
-    let result: CollectionView[] = [];
-    const collectionResponse = await this.apiService.getCollections(organizationId);
-    if (collectionResponse?.data != null && collectionResponse.data.length) {
-      const collectionDomains = collectionResponse.data.map(
-        (r: CollectionDetailsResponse) => new Collection(new CollectionData(r))
-      );
-      result = await this.collectionService.decryptMany(collectionDomains);
-    }
-
-    const nestedCollections = await this.collectionService.getAllNested(result);
-    return new DynamicTreeNode<CollectionView>({
-      fullList: result,
-      nestedList: nestedCollections,
-    });
-  }
-}
+export class VaultFilterService extends BaseVaultFilterService {}
--- a/src/app/modules/vault/modules/individual-vault/individual-vault.component.ts
+++ b/src/app/modules/vault/modules/individual-vault/individual-vault.component.ts
@@ -58,6 +58,7 @@ export class IndividualVaultComponent implements OnInit, OnDestroy {
  updateKeyModalRef: ViewContainerRef;

  favorites = false;
+  type: CipherType = null;
  folderId: string = null;
  collectionId: string = null;
  organizationId: string = null;
@@ -326,7 +327,7 @@ export class IndividualVaultComponent implements OnInit, OnDestroy {

  async addCipher() {
    const component = await this.editCipher(null);
-    component.type = this.activeFilter.cipherType;
+    component.type = this.type;
    component.folderId = this.folderId === "none" ? null : this.folderId;
    if (this.activeFilter.selectedCollectionId != null) {
      const collection = this.filterComponent.collections.fullList.filter(
@@ -398,7 +399,7 @@ export class IndividualVaultComponent implements OnInit, OnDestroy {
    if (queryParams == null) {
      queryParams = {
        favorites: this.favorites ? true : null,
-        type: this.activeFilter.cipherType,
+        type: this.type,
        folderId: this.folderId,
        collectionId: this.collectionId,
        deleted: this.deleted ? true : null,
--- a/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html
+++ b/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html
@@ -1,5 +1,5 @@
 <button
-  bitBadge
+  bit-badge
  [style.color]="textColor"
  [style.background-color]="color"
  appA11yTitle="{{ organizationName }}"
--- a/src/app/modules/vault/modules/organization-vault/organization-vault.component.html
+++ b/src/app/modules/vault/modules/organization-vault/organization-vault.component.html
@@ -4,12 +4,15 @@
      <div class="groupings">
        <div class="content">
          <div class="inner-content">
-            <app-organization-vault-filter
+            <app-vault-filter
              #vaultFilter
+              [showFolders]="false"
+              [showFavorites]="false"
              [activeFilter]="activeFilter"
+              [showOrgFilter]="false"
              (onFilterChange)="applyVaultFilter($event)"
              (onSearchTextChanged)="filterSearchText($event)"
-            ></app-organization-vault-filter>
+            ></app-vault-filter>
          </div>
        </div>
      </div>
--- a/src/app/modules/vault/modules/organization-vault/organization-vault.component.ts
+++ b/src/app/modules/vault/modules/organization-vault/organization-vault.component.ts
@@ -29,7 +29,7 @@ import { AddEditComponent } from "../../../../organizations/vault/add-edit.compo
 import { AttachmentsComponent } from "../../../../organizations/vault/attachments.component";
 import { CiphersComponent } from "../../../../organizations/vault/ciphers.component";
 import { CollectionsComponent } from "../../../../organizations/vault/collections.component";
-import { OrganizationVaultFilterComponent } from "../../../vault-filter/organization-vault-filter.component";
+import { VaultFilterComponent } from "../../../vault-filter/vault-filter.component";
 import { VaultService } from "../../vault.service";

 const BroadcasterSubscriptionId = "OrgVaultComponent";
@@ -39,8 +39,7 @@ const BroadcasterSubscriptionId = "OrgVaultComponent";
  templateUrl: "organization-vault.component.html",
 })
 export class OrganizationVaultComponent implements OnInit, OnDestroy {
-  @ViewChild("vaultFilter", { static: true })
-  vaultFilterComponent: OrganizationVaultFilterComponent;
+  @ViewChild("vaultFilter", { static: true }) vaultFilterComponent: VaultFilterComponent;
  @ViewChild(CiphersComponent, { static: true }) ciphersComponent: CiphersComponent;
  @ViewChild("attachments", { read: ViewContainerRef, static: true })
  attachmentsModalRef: ViewContainerRef;
@@ -58,11 +57,6 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
  trashCleanupWarning: string = null;
  activeFilter: VaultFilter = new VaultFilter();

-  // This is a hack to avoid redundant api calls that fetch OrganizationVaultFilterComponent collections
-  // When it makes sense to do so we should leverage some other communication method for change events that isn't directly tied to the query param for organizationId
-  // i.e. exposing the VaultFiltersService to the OrganizationSwitcherComponent to make relevant updates from a change event instead of just depending on the router
-  firstLoaded = true;
-
  constructor(
    private route: ActivatedRoute,
    private organizationService: OrganizationService,
@@ -101,7 +95,11 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
                case "syncCompleted":
                  if (message.successfully) {
                    await Promise.all([
-                      this.vaultFilterComponent.reloadCollectionsAndFolders(),
+                      this.vaultFilterComponent.reloadCollectionsAndFolders(
+                        new VaultFilter({
+                          selectedOrganizationId: this.organization.id,
+                        } as Partial<VaultFilter>)
+                      ),
                      this.ciphersComponent.refresh(),
                    ]);
                    this.changeDetectorRef.detectChanges();
@@ -111,12 +109,9 @@ export class OrganizationVaultComponent implements OnInit, OnDestroy {
            });
          });
        }
-
-        if (!this.firstLoaded) {
-          await this.vaultFilterComponent.reloadCollectionsAndFolders();
-        }
-        this.firstLoaded = false;
-
+        await this.vaultFilterComponent.reloadCollectionsAndFolders(
+          new VaultFilter({ selectedOrganizationId: this.organization.id } as Partial<VaultFilter>)
+        );
        await this.ciphersComponent.reload();

        if (qParams.viewEvents != null) {
--- a/src/app/organizations/manage/user-add-edit.component.html
+++ b/src/app/organizations/manage/user-add-edit.component.html
@@ -52,7 +52,7 @@
            target="_blank"
            rel="noopener"
            appA11yTitle="{{ 'learnMore' | i18n }}"
-            href="https://bitwarden.com/help/user-types-access-control/"
+            href="https://bitwarden.com/help/provider-users/"
          >
            <i class="bwi bwi-question-circle" aria-hidden="true"></i>
          </a>
--- a/src/app/organizations/settings/account.component.html
+++ b/src/app/organizations/settings/account.component.html
@@ -14,62 +14,50 @@
  #form
  (ngSubmit)="submit()"
  [appApiAction]="formPromise"
-  ngNativeValidate
+  [formGroup]="formData"
 >
  <div class="row">
    <div class="col-6">
-      <div class="form-group">
-        <label for="name">{{ "organizationName" | i18n }}</label>
-        <input
-          id="name"
-          class="form-control"
-          type="text"
-          name="Name"
-          [(ngModel)]="org.name"
-          [disabled]="selfHosted"
-        />
-      </div>
-      <div class="form-group">
-        <label for="billingEmail">{{ "billingEmail" | i18n }}</label>
-        <input
-          id="billingEmail"
-          class="form-control"
-          type="text"
-          name="BillingEmail"
-          [(ngModel)]="org.billingEmail"
-          [disabled]="selfHosted || !canManageBilling"
-        />
-      </div>
-      <div class="form-group">
-        <label for="businessName">{{ "businessName" | i18n }}</label>
-        <input
-          id="businessName"
-          class="form-control"
-          type="text"
-          name="BusinessName"
-          [(ngModel)]="org.businessName"
-          [disabled]="selfHosted || !canManageBilling"
-        />
-      </div>
-      <div class="form-group">
-        <label for="identifier">{{ "identifier" | i18n }}</label>
-        <input
-          id="identifier"
-          class="form-control"
-          type="text"
-          name="Identifier"
-          [(ngModel)]="org.identifier"
-        />
-      </div>
+      <bit-form-field>
+        <bit-label>{{ "organizationName" | i18n }}</bit-label>
+        <input bitInput type="text" formControlName="name" />
+      </bit-form-field>
+
+      <bit-form-field>
+        <bit-label>{{ "billingEmail" | i18n }}</bit-label>
+        <input bitInput type="email" formControlName="billingEmail" />
+      </bit-form-field>
+
+      <bit-form-field>
+        <bit-label>{{ "businessName" | i18n }}</bit-label>
+        <input bitInput type="text" formControlName="businessName" />
+      </bit-form-field>
+
+      <bit-form-field>
+        <bit-label>{{ "identifier" | i18n }}</bit-label>
+        <input bitInput type="text" formControlName="identifier" />
+      </bit-form-field>
    </div>
    <div class="col-6">
-      <app-avatar data="{{ org.name }}" dynamic="true" size="75" fontSize="35"></app-avatar>
+      <app-avatar
+        [data]="formData.get('name').value"
+        dynamic="true"
+        size="75"
+        fontSize="35"
+      ></app-avatar>
    </div>
  </div>
-  <button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
+  <button
+    type="submit"
+    bit-button
+    buttonType="primary"
+    class="btn-submit"
+    [disabled]="form.loading"
+  >
    <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
    <span>{{ "save" | i18n }}</span>
  </button>
+  <bit-error-summary *ngIf="showErrorSummary" [formGroup]="formData"></bit-error-summary>
 </form>
 <ng-container *ngIf="canUseApi">
  <div class="secondary-header border-0 mb-0">
--- a/src/app/organizations/settings/account.component.ts
+++ b/src/app/organizations/settings/account.component.ts
@@ -1,4 +1,5 @@
 import { Component, ViewChild, ViewContainerRef } from "@angular/core";
+import { FormBuilder, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";

 import { ModalService } from "jslib-angular/services/modal.service";
@@ -41,10 +42,19 @@ export class AccountComponent {
  org: OrganizationResponse;
  formPromise: Promise<any>;
  taxFormPromise: Promise<any>;
+  showErrorSummary = false;

  private organizationId: string;

+  formData = this.formBuilder.group({
+    name: ["", [Validators.required]],
+    billingEmail: ["", [Validators.required, Validators.email]],
+    businessName: [],
+    identifier: [],
+  });
+
  constructor(
+    private formBuilder: FormBuilder,
    private modalService: ModalService,
    private apiService: ApiService,
    private i18nService: I18nService,
@@ -60,6 +70,12 @@ export class AccountComponent {
  async ngOnInit() {
    this.selfHosted = this.platformUtilsService.isSelfHost();

+    if (this.selfHosted) {
+      this.formData.disable();
+    } else {
+      this.formData.enable();
+    }
+
    this.route.parent.parent.params.subscribe(async (params) => {
      this.organizationId = params.organizationId;
      this.canManageBilling = (
@@ -68,6 +84,13 @@ export class AccountComponent {
      try {
        this.org = await this.apiService.getOrganization(this.organizationId);
        this.canUseApi = this.org.useApi;
+
+        this.formData.setValue({
+          name: this.org.name,
+          billingEmail: this.org.billingEmail,
+          businessName: this.org.businessName,
+          identifier: this.org.identifier,
+        });
      } catch (e) {
        this.logService.error(e);
      }
@@ -76,12 +99,19 @@ export class AccountComponent {
  }

  async submit() {
+    this.formData.markAllAsTouched();
+    this.showErrorSummary = true;
+
+    if (!this.formData.valid) {
+      return;
+    }
+
    try {
      const request = new OrganizationUpdateRequest();
-      request.name = this.org.name;
-      request.businessName = this.org.businessName;
-      request.billingEmail = this.org.billingEmail;
-      request.identifier = this.org.identifier;
+      request.name = this.formData.get("name").value;
+      request.businessName = this.formData.get("businessName").value;
+      request.billingEmail = this.formData.get("billingEmail").value;
+      request.identifier = this.formData.get("identifier").value;

      // Backfill pub/priv key if necessary
      if (!this.org.hasPublicAndPrivateKeys) {
--- a/src/app/oss.module.ts
+++ b/src/app/oss.module.ts
@@ -2,7 +2,6 @@ import { NgModule } from "@angular/core";

 import { LooseComponentsModule } from "./modules/loose-components.module";
 import { OrganizationManageModule } from "./modules/organizations/manage/organization-manage.module";
-import { OrganizationUserModule } from "./modules/organizations/users/organization-user.module";
 import { PipesModule } from "./modules/pipes/pipes.module";
 import { SharedModule } from "./modules/shared.module";
 import { VaultFilterModule } from "./modules/vault-filter/vault-filter.module";
@@ -16,7 +15,6 @@ import { OrganizationBadgeModule } from "./modules/vault/modules/organization-ba
    OrganizationBadgeModule,
    PipesModule,
    OrganizationManageModule,
-    OrganizationUserModule,
  ],
  exports: [LooseComponentsModule, VaultFilterModule, OrganizationBadgeModule, PipesModule],
  bootstrap: [],
--- a/src/app/reports/breach-report.component.html
+++ b/src/app/reports/breach-report.component.html
@@ -17,7 +17,13 @@
      <small class="form-text text-muted">{{ "breachCheckUsernameEmail" | i18n }}</small>
    </div>
  </div>
-  <button bitButton buttonType="primary" class="btn-submit" type="submit" [disabled]="form.loading">
+  <button
+    bit-button
+    buttonType="primary"
+    class="btn-submit"
+    type="submit"
+    [disabled]="form.loading"
+  >
    <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
    <span>{{ "checkBreaches" | i18n }}</span>
  </button>
--- a/src/app/reports/exposed-passwords-report.component.html
+++ b/src/app/reports/exposed-passwords-report.component.html
@@ -3,7 +3,7 @@
 </div>
 <p>{{ "exposedPasswordsReportDesc" | i18n }}</p>
 <button
-  bitButton
+  bit-button
  buttonType="primary"
  type="button"
  class="btn-submit"
--- a/src/app/reports/report-card.component.html
+++ b/src/app/reports/report-card.component.html
@@ -15,7 +15,7 @@
      <p class="tw-mb-0">{{ report.description | i18n }}</p>
    </div>
    <span
-      bitBadge
+      bit-badge
      badgeType="success"
      class="tw-absolute tw-left-2 tw-top-2 tw-leading-none"
      *ngIf="premium"
--- a/src/app/reports/reports.component.html
+++ b/src/app/reports/reports.component.html
@@ -3,7 +3,7 @@

  <div class="row mt-4">
    <div class="col">
-      <a bitButton routerLink="./" *ngIf="!homepage">
+      <a bit-button routerLink="./" *ngIf="!homepage">
        <i class="bwi bwi-angle-left" aria-hidden="true"></i>
        {{ "backToReports" | i18n }}
      </a>
--- a/src/app/send/access.component.html
+++ b/src/app/send/access.component.html
@@ -1,7 +1,7 @@
 <form #form (ngSubmit)="load()" [appApiAction]="formPromise" class="container" ngNativeValidate>
  <div class="row justify-content-center mt-5">
    <div class="col-12">
-      <h1 class="lead text-center mb-4">Bitwarden Send</h1>
+      <p class="lead text-center mb-4">Bitwarden Send</p>
    </div>
    <div class="col-12 text-center" *ngIf="creatorIdentifier != null">
      <p>{{ "sendCreatorIdentifier" | i18n: creatorIdentifier }}</p>
--- a/src/app/send/send.component.html
+++ b/src/app/send/send.component.html
@@ -23,7 +23,7 @@
            <ul class="filter-options">
              <li class="filter-option" [ngClass]="{ active: selectedAll }">
                <span class="filter-buttons">
-                  <button bitButton class="filter-button" appStopClick (click)="selectAll()">
+                  <button bit-button class="filter-button" appStopClick (click)="selectAll()">
                    <i class="bwi bwi-fw bwi-filter"></i>{{ "allSends" | i18n }}
                  </button>
                </span>
@@ -38,7 +38,7 @@
              <li class="filter-option" [ngClass]="{ active: selectedType === sendType.Text }">
                <span class="filter-buttons">
                  <button
-                    bitButton
+                    bit-button
                    class="filter-button"
                    appStopClick
                    (click)="selectType(sendType.Text)"
@@ -50,7 +50,7 @@
              <li class="filter-option" [ngClass]="{ active: selectedType === sendType.File }">
                <span class="filter-buttons">
                  <button
-                    bitButton
+                    bit-button
                    class="filter-button"
                    appStopClick
                    (click)="selectType(sendType.File)"
@@ -160,15 +160,19 @@
                <i class="bwi bwi-ellipsis-v bwi-lg" aria-hidden="true"></i>
              </button>
              <bit-menu #sendOptions>
-                <button bitMenuItem (click)="copy(s)">
+                <button bit-menu-item (click)="copy(s)">
                  <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                  {{ "copySendLink" | i18n }}
                </button>
-                <button bitMenuItem (click)="removePassword(s)" *ngIf="s.password && !disableSend">
+                <button
+                  bit-menu-item
+                  (click)="removePassword(s)"
+                  *ngIf="s.password && !disableSend"
+                >
                  <i class="bwi bwi-fw bwi-close" aria-hidden="true"></i>
                  {{ "removePassword" | i18n }}
                </button>
-                <button bitMenuItem (click)="delete(s)">
+                <button bit-menu-item (click)="delete(s)">
                  <span class="tw-text-danger">
                    <i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
                    {{ "delete" | i18n }}
--- a/src/app/services/event.service.ts
+++ b/src/app/services/event.service.ts
@@ -307,9 +307,6 @@ export class EventService {
      case EventType.Organization_DisabledKeyConnector:
        msg = humanReadableMsg = this.i18nService.t("disabledKeyConnector");
        break;
-      case EventType.Organization_SponsorshipsSynced:
-        msg = humanReadableMsg = this.i18nService.t("sponsorshipsSynced");
-        break;
      // Policies
      case EventType.Policy_Updated: {
        msg = this.i18nService.t("modifiedPolicyId", this.formatPolicyId(ev));
--- a/src/app/settings/account.component.html
+++ b/src/app/settings/account.component.html
@@ -14,13 +14,13 @@
 <div class="card border-danger">
  <div class="card-body">
    <p>{{ "dangerZoneDesc" | i18n }}</p>
-    <button bitButton buttonType="danger" (click)="deauthorizeSessions()">
+    <button bit-button buttonType="danger" (click)="deauthorizeSessions()">
      {{ "deauthorizeSessions" | i18n }}
    </button>
-    <button bitButton buttonType="danger" (click)="purgeVault()">
+    <button bit-button buttonType="danger" (click)="purgeVault()">
      {{ "purgeVault" | i18n }}
    </button>
-    <button bitButton buttonType="danger" (click)="deleteAccount()">
+    <button bit-button buttonType="danger" (click)="deleteAccount()">
      {{ "deleteAccount" | i18n }}
    </button>
  </div>
--- a/src/app/settings/change-kdf.component.html
+++ b/src/app/settings/change-kdf.component.html
@@ -71,7 +71,7 @@
      </div>
    </div>
  </div>
-  <button bitButton buttonType="primary" class="btn-submit" [disabled]="form.loading">
+  <button bit-button buttonType="primary" class="btn-submit" [disabled]="form.loading">
    <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
    <span>{{ "changeKdf" | i18n }}</span>
  </button>
--- a/src/app/settings/change-password.component.html
+++ b/src/app/settings/change-password.component.html
@@ -87,7 +87,7 @@
      </a>
    </div>
  </div>
-  <button bitButton buttonType="primary" class="btn-submit" [disabled]="form.loading">
+  <button bit-button buttonType="primary" class="btn-submit" [disabled]="form.loading">
    <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
    <span>{{ "changeMasterPassword" | i18n }}</span>
  </button>
--- a/src/app/modules/vault-filter/components/link-sso.component.html
+++ b/src/app/modules/vault-filter/components/link-sso.component.html
--- a/src/app/modules/vault-filter/components/link-sso.component.ts
+++ b/src/app/modules/vault-filter/components/link-sso.component.ts
--- a/src/app/settings/payment-method.component.html
+++ b/src/app/settings/payment-method.component.html
@@ -3,7 +3,7 @@
    {{ "paymentMethod" | i18n }}
  </h1>
  <button
-    bitButton
+    bit-button
    buttonType="secondary"
    (click)="load()"
    class="tw-ml-auto"
@@ -28,7 +28,7 @@
    <strong>{{ creditOrBalance | currency: "$" }}</strong>
  </p>
  <p>{{ "creditAppliedDesc" | i18n }}</p>
-  <button bitButton buttonType="secondary" (click)="addCredit()" *ngIf="!showAddCredit">
+  <button bit-button buttonType="secondary" (click)="addCredit()" *ngIf="!showAddCredit">
    {{ "addCredit" | i18n }}
  </button>
  <app-add-credit
@@ -56,7 +56,7 @@
      {{ paymentSource.description }}
    </p>
  </ng-container>
-  <button bitButton buttonType="secondary" (click)="changePayment()" *ngIf="!showAdjustPayment">
+  <button bit-button buttonType="secondary" (click)="changePayment()" *ngIf="!showAdjustPayment">
    {{ (paymentSource ? "changePaymentMethod" : "addPaymentMethod") | i18n }}
  </button>
  <app-adjust-payment
--- a/src/app/settings/premium.component.html
+++ b/src/app/settings/premium.component.html
@@ -48,7 +48,7 @@
    {{ "premiumPrice" | i18n: (premiumPrice | currency: "$") }}
  </p>
  <a
-    bitButton
+    bit-button
    href="https://vault.bitwarden.com/#/settings/premium"
    target="_blank"
    rel="noopener"
@@ -69,7 +69,7 @@
      }}</small>
    </div>
    <button
-      bitButton
+      bit-button
      buttonType="primary"
      type="submit"
      class="btn-submit"
@@ -125,7 +125,13 @@
    </p>
  </div>
  <small class="text-muted font-italic">{{ "paymentChargedAnnually" | i18n }}</small>
-  <button bitButton buttonType="primary" type="submit" class="btn-submit" [disabled]="form.loading">
+  <button
+    bit-button
+    buttonType="primary"
+    type="submit"
+    class="btn-submit"
+    [disabled]="form.loading"
+  >
    <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
    <span>{{ "submit" | i18n }}</span>
  </button>
--- a/src/app/settings/security-keys.component.html
+++ b/src/app/settings/security-keys.component.html
@@ -8,10 +8,10 @@
 <p>
  {{ "userApiKeyDesc" | i18n }}
 </p>
-<button bitButton buttonType="secondary" (click)="viewUserApiKey()">
+<button bit-button buttonType="secondary" (click)="viewUserApiKey()">
  {{ "viewApiKey" | i18n }}
 </button>
-<button bitButton buttonType="secondary" (click)="rotateUserApiKey()">
+<button bit-button buttonType="secondary" (click)="rotateUserApiKey()">
  {{ "rotateApiKey" | i18n }}
 </button>
 <ng-template #viewUserApiKeyTemplate></ng-template>
--- a/src/app/settings/two-factor-setup.component.html
+++ b/src/app/settings/two-factor-setup.component.html
@@ -5,7 +5,7 @@
 <p *ngIf="organizationId">{{ "twoStepLoginOrganizationDesc" | i18n }}</p>
 <bit-callout type="warning" *ngIf="!organizationId">
  <p>{{ "twoStepLoginRecoveryWarning" | i18n }}</p>
-  <button bitButton buttonType="secondary" (click)="recoveryCode()">
+  <button bit-button buttonType="secondary" (click)="recoveryCode()">
    {{ "viewRecoveryCode" | i18n }}
  </button>
 </bit-callout>
@@ -45,7 +45,7 @@
    </div>
    <div class="ml-auto">
      <button
-        bitButton
+        bit-button
        buttonType="secondary"
        [disabled]="!canAccessPremium && p.premium"
        (click)="manage(p.type)"
--- a/src/app/settings/user-billing-history.component.html
+++ b/src/app/settings/user-billing-history.component.html
@@ -3,7 +3,7 @@
    {{ "billingHistory" | i18n }}
  </h1>
  <button
-    bitButton
+    bit-button
    buttonType="secondary"
    (click)="load()"
    class="tw-ml-auto"
--- a/src/app/settings/user-subscription.component.html
+++ b/src/app/settings/user-subscription.component.html
@@ -39,7 +39,7 @@
  >
    <p>{{ "subscriptionPendingCanceled" | i18n }}</p>
    <button
-      bitButton
+      bit-button
      type="button"
      buttonType="secondary"
      #reinstateBtn
@@ -63,7 +63,7 @@
        <dt>{{ "status" | i18n }}</dt>
        <dd>
          <span class="text-capitalize">{{ (subscription && subscription.status) || "-" }}</span>
-          <span bitBadge badgeType="warning" *ngIf="subscriptionMarkedForCancel">{{
+          <span bit-badge badgeType="warning" *ngIf="subscriptionMarkedForCancel">{{
            "pendingCancellation" | i18n
          }}</span>
        </dd>
@@ -96,11 +96,11 @@
  </div>
  <ng-container *ngIf="selfHosted">
    <div>
-      <button type="button" bitButton buttonType="secondary" (click)="updateLicense()">
+      <button type="button" bit-button buttonType="secondary" (click)="updateLicense()">
        {{ "updateLicense" | i18n }}
      </button>
      <a
-        bitButton
+        bit-button
        buttonType="secondary"
        href="https://vault.bitwarden.com/#/settings/subscription"
        target="_blank"
@@ -131,7 +131,7 @@
  <ng-container *ngIf="!selfHosted">
    <div class="d-flex">
      <button
-        bitButton
+        bit-button
        type="button"
        buttonType="secondary"
        (click)="downloadLicense()"
@@ -140,7 +140,7 @@
        {{ "downloadLicense" | i18n }}
      </button>
      <button
-        bitButton
+        bit-button
        #cancelBtn
        type="button"
        buttonType="danger"
@@ -171,11 +171,11 @@
    <ng-container *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
      <div class="mt-3">
        <div class="d-flex" *ngIf="!showAdjustStorage">
-          <button bitButton type="button" buttonType="secondary" (click)="adjustStorage(true)">
+          <button bit-button type="button" buttonType="secondary" (click)="adjustStorage(true)">
            {{ "addStorage" | i18n }}
          </button>
          <button
-            bitButton
+            bit-button
            type="button"
            buttonType="secondary"
            class="tw-ml-1"
--- a/src/app/tools/generator.component.ts
+++ b/src/app/tools/generator.component.ts
@@ -40,13 +40,11 @@ export class GeneratorComponent extends BaseGeneratorComponent {
      route,
      window
    );
-    if (platformUtilsService.isSelfHost()) {
-      // Cannot use Firefox Relay on self hosted web vaults due to CORS issues with Firefox Relay API
-      this.forwardOptions.splice(
-        this.forwardOptions.findIndex((o) => o.value === "firefoxrelay"),
-        1
-      );
-    }
+    // Cannot use Firefox Relay on the web vault yet due to CORS issues with Firefox Relay API
+    this.forwardOptions.splice(
+      this.forwardOptions.findIndex((o) => o.value === "firefoxrelay"),
+      1
+    );
  }

  async history() {
--- a/src/app/vault/ciphers.component.html
+++ b/src/app/vault/ciphers.component.html
@@ -64,12 +64,12 @@
          </button>
          <bit-menu #cipherOptions>
            <ng-container *ngIf="c.type === cipherType.Login && !c.isDeleted">
-              <button bitMenuItem (click)="copy(c, c.login.username, 'username', 'Username')">
+              <button bit-menu-item (click)="copy(c, c.login.username, 'username', 'Username')">
                <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                {{ "copyUsername" | i18n }}
              </button>
              <button
-                bitMenuItem
+                bit-menu-item
                (click)="copy(c, c.login.password, 'password', 'Password')"
                *ngIf="c.viewPassword"
              >
@@ -77,24 +77,24 @@
                {{ "copyPassword" | i18n }}
              </button>
              <button
-                bitMenuItem
+                bit-menu-item
                (click)="copy(c, c.login.totp, 'verificationCodeTotp', 'TOTP')"
                *ngIf="displayTotpCopyButton(c)"
              >
                <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                {{ "copyVerificationCode" | i18n }}
              </button>
-              <button bitMenuItem *ngIf="c.login.canLaunch" (click)="launch(c.login.launchUri)">
+              <button bit-menu-item *ngIf="c.login.canLaunch" (click)="launch(c.login.launchUri)">
                <i class="bwi bwi-fw bwi-share-square" aria-hidden="true"></i>
                {{ "launch" | i18n }}
              </button>
            </ng-container>
-            <button bitMenuItem (click)="attachments(c)">
+            <button bit-menu-item (click)="attachments(c)">
              <i class="bwi bwi-fw bwi-paperclip" aria-hidden="true"></i>
              {{ "attachments" | i18n }}
            </button>
            <button
-              bitMenuItem
+              bit-menu-item
              *ngIf="((!organization && !c.organizationId) || organization) && !c.isDeleted"
              (click)="clone(c)"
            >
@@ -102,26 +102,26 @@
              {{ "clone" | i18n }}
            </button>
            <button
-              bitMenuItem
+              bit-menu-item
              *ngIf="!organization && !c.organizationId && !c.isDeleted"
              (click)="share(c)"
            >
              <i class="bwi bwi-fw bwi-arrow-circle-right" aria-hidden="true"></i>
              {{ "moveToOrganization" | i18n }}
            </button>
-            <button bitMenuItem *ngIf="c.organizationId && !c.isDeleted" (click)="collections(c)">
+            <button bit-menu-item *ngIf="c.organizationId && !c.isDeleted" (click)="collections(c)">
              <i class="bwi bwi-fw bwi-collection" aria-hidden="true"></i>
              {{ "collections" | i18n }}
            </button>
-            <button bitMenuItem *ngIf="c.organizationId && accessEvents" (click)="events(c)">
+            <button bit-menu-item *ngIf="c.organizationId && accessEvents" (click)="events(c)">
              <i class="bwi bwi-fw bwi-file-text" aria-hidden="true"></i>
              {{ "eventLogs" | i18n }}
            </button>
-            <button bitMenuItem (click)="restore(c)" *ngIf="c.isDeleted">
+            <button bit-menu-item (click)="restore(c)" *ngIf="c.isDeleted">
              <i class="bwi bwi-fw bwi-undo" aria-hidden="true"></i>
              {{ "restore" | i18n }}
            </button>
-            <button bitMenuItem (click)="delete(c)">
+            <button bit-menu-item (click)="delete(c)">
              <span class="tw-text-danger">
                <i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
                {{ (c.isDeleted ? "permanentlyDelete" : "delete") | i18n }}
--- a/src/locales/en/messages.json
+++ b/src/locales/en/messages.json
@@ -4163,7 +4163,7 @@
    "message": "Password reset success!"
  },
  "resetPasswordEnrollmentWarning": {
-    "message": "Enrollment will allow organization administrators to change your master password"
+    "message": "Enrollment will allow organization administrators to change your master password. Are you sure you want to enroll?"
  },
  "resetPasswordPolicy": {
    "message": "Master Password Reset"
@@ -4674,8 +4674,8 @@
  "removeSponsorshipSuccess": {
    "message": "Sponsorship Removed"
  },
-  "ssoKeyConnectorError": {
-    "message": "Key Connector error: make sure Key Connector is available and working correctly."
+  "ssoKeyConnectorUnavailable": {
+    "message": "Unable to reach the Key Connector, try again later."
  },
  "keyConnectorUrl": {
    "message": "Key Connector URL"
@@ -5041,9 +5041,6 @@
    "message": "Last Sync",
    "Description": "Used as a prefix to indicate the last time a sync occured. Example \"Last sync 1968-11-16 00:00:00\""
  },
-  "sponsorshipsSynced": {
-    "message": "Self-hosted sponsorships synced."
-  },
  "billingManagedByProvider": {
    "message": "Managed by $PROVIDER$",
    "placeholders": {
@@ -5069,5 +5066,20 @@
  },
  "apiAccessToken": {
    "message": "API Access Token"
+  },
+  "inputRequired": {
+    "message": "Input is required."
+  },
+  "inputEmail": {
+    "message": "Input is not an email-address."
+  },
+  "fieldsNeedAttention": {
+    "message": "$COUNT$ field(s) above need your attention.",
+    "placeholders": {
+      "count": {
+        "content": "$1",
+        "example": "4"
+      }
+    }
  }
 }
--- a/src/scss/vault-filters.scss
+++ b/src/scss/vault-filters.scss
@@ -14,6 +14,14 @@
    font-size: $font-size-base;
  }

+  a.create-organization-link {
+    &:hover {
+      @include themify($themes) {
+        color: themed("iconHover") !important;
+      }
+    }
+  }
+
  button {
    @extend .no-btn;
  }
Author	SHA1	Message	Date
Hinton	283f295481	Change fields to field(s)	2022-05-30 13:47:02 +02:00
Hinton	749ead5863	Move error summary below form	2022-05-23 17:15:21 +02:00
Hinton	8d369bcf84	Add error summary	2022-05-23 15:27:49 +02:00
Hinton	aa7fb1befb	Add input i18n	2022-05-20 16:57:55 +02:00
Hinton	43ca31e0ae	Validate before submit	2022-05-17 22:19:27 +02:00
Hinton	0dfc8c5a0b	Merge branch 'master' of github.com:bitwarden/web into feature/cl-forms # Conflicts: # jslib	2022-05-17 21:59:13 +02:00
Hinton	c1801dfc61	Merge branch 'master' of github.com:bitwarden/web into feature/cl-forms # Conflicts: # jslib	2022-05-10 16:40:13 +02:00
Hinton	59a53740a4	Merge branch 'master' of github.com:bitwarden/web into feature/cl-forms # Conflicts: # jslib # src/app/organizations/settings/account.component.html # src/app/organizations/settings/account.component.ts # src/app/oss.module.ts	2022-05-10 14:51:10 +02:00
Hinton	dd2c2b9720	Update Accounts form to use reactive forms and bit-form-field	2022-05-03 11:21:42 +02:00