Remove old 'release' ref in workflow (#1328 )

(cherry picked from commit 75984a2e37)
Bumped version to 2.25.0 (#1327 )
2025-12-06 00:03:28 +00:00 · 2021-12-07 22:52:00 -05:00 · 2021-12-07 19:13:44 -08:00 · 2021-12-01 20:48:44 -05:00 · 2021-11-24 15:12:49 -06:00 · 2021-11-24 15:48:20 -05:00
182 changed files with 15899 additions and 4190 deletions
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -0,0 +1,32 @@
+## Type of change
+- [ ] Bug fix
+- [ ] New feature development
+- [ ] Tech debt (refactoring, code cleanup, dependency upgrades, etc)
+- [ ] Build/deploy pipeline (DevOps)
+- [ ] Other
+
+## Objective
+<!--Describe what the purpose of this PR is. For example: what bug you're fixing or what new feature you're adding-->
+
+
+
+## Code changes
+<!--Explain the changes you've made to each file or major component. This should help the reviewer understand your changes-->
+<!--Also refer to any related changes or PRs in other repositories-->
+
+* **file.ext:** Description of what was changed and why
+
+## Screenshots
+<!--Required for any UI changes. Delete if not applicable-->
+
+
+
+## Testing requirements
+<!--What functionality requires testing by QA? This includes testing new behavior and regression testing-->
+
+
+
+## Before you submit
+- [ ] I have checked for **linting** errors (`npm run lint`) (required)
+- [ ] This change requires a **documentation update** (notify the documentation team)
+- [ ] This change has particular **deployment requirements** (notify the DevOps team)
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -182,7 +182,7 @@ jobs:
          echo "GitHub event: $GITHUB_EVENT"

      - name: Setup DCT
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
        id: setup-dct
        uses: bitwarden/gh-actions/setup-docker-trust@a8c384a05a974c05c48374c818b004be221d43ff
        with:
@@ -228,26 +228,37 @@ jobs:
        if: github.ref == 'refs/heads/master'
        run: docker tag bitwarden/web bitwarden/web:dev

+      - name: Tag release branch
+        if: github.ref == 'refs/heads/release'
+        run: docker tag bitwarden/web bitwarden/web:latest
+
      - name: List Docker images
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
        run: docker images

-      - name: Push rc images
+      - name: Push rc image
        if: github.ref == 'refs/heads/rc'
        run: docker push bitwarden/web:rc
        env:
          DOCKER_CONTENT_TRUST: 1
          DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}

-      - name: Push dev images
+      - name: Push dev image
        if: github.ref == 'refs/heads/master'
        run: docker push bitwarden/web:dev
        env:
          DOCKER_CONTENT_TRUST: 1
          DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}

+      - name: Push latest image
+        if: github.ref == 'refs/heads/release'
+        run: docker push bitwarden/web:latest
+        env:
+          DOCKER_CONTENT_TRUST: 1
+          DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}
+
      - name: Log out of Docker
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
        run: docker logout


@@ -405,6 +416,45 @@ jobs:
        run: npm run build:bit:cloud


+  crowdin-push:
+    name: Crowdin Push
+    if: github.ref == 'refs/heads/master'
+    needs:
+      - build-oss-selfhost
+      - build-cloud
+      - build-commercial-selfhost
+      - build-qa
+    runs-on: ubuntu-20.04
+    env:
+      _CROWDIN_PROJECT_ID: "308189"
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@5a4ac9002d0be2fb38bd78e4b4dbde5606d7042f  # v2.3.4
+
+      - name: Login to Azure
+        uses: Azure/login@77f1b2e3fb80c0e8645114159d17008b8a2e475a
+        with:
+          creds: ${{ secrets.AZURE_PROD_KV_CREDENTIALS }}
+
+      - name: Retrieve secrets
+        id: retrieve-secrets
+        uses: Azure/get-keyvault-secrets@80ccd3fafe5662407cc2e55f202ee34bfff8c403
+        with:
+          keyvault: "bitwarden-prod-kv"
+          secrets: "crowdin-api-token"
+
+      - name: Upload Sources
+        uses: crowdin/github-action@e39093fd75daae7859c68eded4b43d42ec78d8ea  # v1.3.2
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CROWDIN_API_TOKEN: ${{ steps.retrieve-secrets.outputs.crowdin-api-token }}
+        with:
+          config: crowdin.yml
+          crowdin_branch_name: master
+          upload_sources: true
+          upload_translations: false
+
+
  check-failures:
    name: Check for failures
    if: always()
@@ -416,6 +466,7 @@ jobs:
      - build-cloud
      - build-commercial-selfhost
      - build-qa
+      - crowdin-push
      - windows
    steps:
      - name: Check if any job failed
@@ -426,8 +477,9 @@ jobs:
          BUILD_OSS_SELFHOST_STATUS: ${{ needs.build-oss-selfhost.result }}
          BUILD_CLOUD_STATUS: ${{ needs.build-cloud.result }}
          BUILD_COMMERCIAL_SELFHOST_STATUS: ${{ needs.build-commercial-selfhost.result }}
-          BUILD_QA: ${{ needs.build-qa.result }}
-          WINDOWS: ${{ needs.windows.result }}
+          BUILD_QA_STATUS: ${{ needs.build-qa.result }}
+          CROWDIN_PUSH_STATUS: ${{ needs.crowdin-push.result }}
+          WINDOWS_STATUS: ${{ needs.windows.result }}
        run: |
          if [ "$CLOC_STATUS" = "failure" ]; then
              exit 1
@@ -439,9 +491,11 @@ jobs:
              exit 1
          elif [ "$BUILD_COMMERCIAL_SELFHOST_STATUS" = "failure" ]; then
              exit 1
-          elif [ "$BUILD_QA" = "failure" ]; then
+          elif [ "$BUILD_QA_STATUS" = "failure" ]; then
              exit 1
-          elif [ "$WINDOWS" = "failure" ]; then
+          elif [ "$CROWDIN_PUSH_STATUS" = "failure" ]; then
+              exit 1
+          elif [ "$WINDOWS_STATUS" = "failure" ]; then
              exit 1
          fi

--- a/.github/workflows/crowdin-pull.yml
+++ b/.github/workflows/crowdin-pull.yml
@@ -1,15 +1,15 @@
 ---
-name: Crowdin Sync
+name: Crowdin Pull

 on:
  workflow_dispatch:
    inputs: {}
-# schedule:
-#   - cron: '0 0 * * *'
+  schedule:
+    - cron: '0 0 * * 5'

 jobs:
-  crowdin-sync:
-    name: Autosync
+  crowdin-pull:
+    name: Pull
    runs-on: ubuntu-20.04
    env:
      _CROWDIN_PROJECT_ID: "308189"
@@ -30,7 +30,7 @@ jobs:
          secrets: "crowdin-api-token"

      - name: Download translations
-        uses: crowdin/github-action@e39093fd75daae7859c68eded4b43d42ec78d8ea
+        uses: crowdin/github-action@e39093fd75daae7859c68eded4b43d42ec78d8ea  # v1.3.2
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          CROWDIN_API_TOKEN: ${{ steps.retrieve-secrets.outputs.crowdin-api-token }}
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -12,12 +12,13 @@ jobs:
    outputs:
      release_version: ${{ steps.version.outputs.package }}
      tag_version: ${{ steps.version.outputs.tag }}
+      branch-name: ${{ steps.branch.outputs.branch-name }}
    steps:
      - name: Branch check
        run: |
-          if [[ "$GITHUB_REF" != "refs/heads/rc" ]]; then
+          if [[ "$GITHUB_REF" != "refs/heads/rc" ]] && [[ "$GITHUB_REF" != "refs/heads/hotfix" ]]; then
            echo "==================================="
-            echo "[!] Can only release from rc branch"
+            echo "[!] Can only release from the 'rc' or 'hotfix' branches"
            echo "==================================="
            exit 1
          fi
@@ -41,9 +42,15 @@ jobs:
          echo "::set-output name=package::$version"
          echo "::set-output name=tag::v$version"

+      - name: Get branch name
+        id: branch
+        run: |
+          BRANCH_NAME=$(basename ${{ github.ref }})
+          echo "::set-output name=branch-name::$BRANCH_NAME"
+

  self-host:
-    name: Build self-host docker
+    name: Release self-host docker
    runs-on: ubuntu-20.04
    needs: setup
    env:
@@ -66,20 +73,18 @@ jobs:
      - name: Checkout repo
        uses: actions/checkout@5a4ac9002d0be2fb38bd78e4b4dbde5606d7042f

-      - name: Pull latest selfhost rc image
-        run: docker pull bitwarden/web:rc
+      - name: Pull latest selfhost Release image
+        run: docker pull bitwarden/web:latest

      - name: Tag version
        run: |
-          docker tag bitwarden/web:rc bitwarden/web:latest
-          docker tag bitwarden/web:rc bitwarden/web:$_RELEASE_VERSION
+          docker tag bitwarden/web:latest bitwarden/web:$_RELEASE_VERSION

      - name: List Docker images
        run: docker images

      - name: Push images
        run: |
-          docker push bitwarden/web:latest
          docker push bitwarden/web:$_RELEASE_VERSION
        env:
          DOCKER_CONTENT_TRUST: 1
@@ -108,7 +113,9 @@ jobs:
        run: |
          git switch -c deploy-$_TAG_VERSION
          git push -u origin deploy-$_TAG_VERSION
-          git switch rc
+
+      - name: Checkout Repo
+        uses: actions/checkout@5a4ac9002d0be2fb38bd78e4b4dbde5606d7042f  # v2.3.4

      - name: Setup git config
        run: |
@@ -122,7 +129,7 @@ jobs:
        with:
          workflow: build.yml
          workflow_conclusion: success
-          branch: rc
+          branch: ${{ needs.setup.outputs.branch-name }}
          artifacts: web-*-cloud-COMMERCIAL.zip

      # This should result in a build directory in the current working directory
@@ -163,7 +170,7 @@ jobs:
        with:
          workflow: build.yml
          workflow_conclusion: success
-          branch: rc
+          branch: ${{ needs.setup.outputs.branch-name }}
          artifacts: "web-*-selfhosted-COMMERCIAL.zip,
                      web-*-selfhosted-open-source.zip"

@@ -182,3 +189,4 @@ jobs:
          artifacts: "web-${{ needs.setup.outputs.release_version }}-selfhosted-COMMERCIAL.zip,
                      web-${{ needs.setup.outputs.release_version }}-selfhosted-open-source.zip"
          token: ${{ secrets.GITHUB_TOKEN }}
+          draft: true
--- a/README.md
+++ b/README.md
@@ -41,18 +41,20 @@ If you want to point the development web vault to the production APIs, you can r

 ```
 npm install
-ENV=production npm run build:oss:watch
+ENV=cloud npm run build:oss:watch
 ```

 You can also manually adjusting your API endpoint settings by adding `config/local.json` overriding any of the following values:

 ```json
 {
-    "proxyApi": "http://your-api-url",
-    "proxyIdentity": "http://your-identity-url",
-    "proxyEvents": "http://your-events-url",
-    "proxyNotifications": "http://your-notifications-url",
-    "allowedHosts": ["hostnames-to-allow-in-webpack"],
+    "dev": {
+        "proxyApi": "http://your-api-url",
+        "proxyIdentity": "http://your-identity-url",
+        "proxyEvents": "http://your-events-url",
+        "proxyNotifications": "http://your-notifications-url",
+        "allowedHosts": ["hostnames-to-allow-in-webpack"],
+    },
    "urls": {
      
    }
--- a/bitwarden_license/src/app/organizations/manage/sso.component.html
+++ b/bitwarden_license/src/app/organizations/manage/sso.component.html
@@ -7,14 +7,79 @@
    <span class="sr-only">{{'loading' | i18n}}</span>
 </ng-container>

-<form #form (ngSubmit)="submit()" [formGroup]="data" [appApiAction]="formPromise" *ngIf="!loading">
+<form #form (ngSubmit)="submit()" [formGroup]="data" [appApiAction]="formPromise" *ngIf="!loading" ngNativeValidate>
+    <p>
+        {{'ssoPolicyHelpStart' | i18n}}
+        <a routerLink="../policies">{{'ssoPolicyHelpLink' | i18n}}</a>
+        {{'ssoPolicyHelpEnd' | i18n}}
+        <br>
+        {{'ssoPolicyHelpKeyConnector' | i18n}}
+    </p>
+    
    <div class="form-group">
        <div class="form-check">
            <input class="form-check-input" type="checkbox" id="enabled" [formControl]="enabled" name="Enabled">
-            <label class="form-check-label" for="enabled">{{'enabled' | i18n}}</label>
+            <label class="form-check-label" for="enabled">{{'allowSso' | i18n}}</label>
+        </div>
+        <small class="form-text text-muted">{{'allowSsoDesc' | i18n}}</small>
+    </div>
+
+    <div class="form-group">
+        <label>{{'memberDecryptionOption' | i18n}}</label>
+        <div class="form-check form-check-block">
+            <input class="form-check-input" type="radio" id="memberDecryptionPass" [value]="false" formControlName="keyConnectorEnabled">
+            <label class="form-check-label" for="memberDecryptionPass">
+                {{'masterPass' | i18n}}
+                <small>{{'memberDecryptionPassDesc' | i18n}}</small>
+            </label>
+        </div>
+        <div class="form-check mt-2 form-check-block">
+            <input class="form-check-input" type="radio" id="memberDecryptionKey" [value]="true" formControlName="keyConnectorEnabled"
+                [attr.disabled]="!organization.useKeyConnector || null">
+            <label class="form-check-label" for="memberDecryptionKey">
+                {{'keyConnector' | i18n}}
+                <a target="_blank" rel="noopener" appA11yTitle="{{'learnMore' | i18n}}"
+                    href="https://bitwarden.com/help/article/about-key-connector/">
+                    <i class="fa fa-question-circle-o" aria-hidden="true"></i>
+                </a>
+                <small>{{'memberDecryptionKeyConnectorDesc' | i18n}}</small>
+            </label>
        </div>
    </div>

+    <ng-container *ngIf="data.value.keyConnectorEnabled">
+        <app-callout type="warning" [useAlertRole]="true">
+            {{'keyConnectorWarning' | i18n}}
+        </app-callout>
+    
+        <div class="form-group">
+            <label for="keyConnectorUrl">{{'keyConnectorUrl' | i18n}}</label>
+            <div class="input-group">
+                <input class="form-control" formControlName="keyConnectorUrl" id="keyConnectorUrl" required>
+                <div class="input-group-append">
+                    <button type="button" class="btn btn-outline-secondary" (click)="validateKeyConnectorUrl()"
+                        [disabled]="!enableTestKeyConnector">
+                        <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"
+                            *ngIf="keyConnectorUrl.pending"></i>
+                        <span *ngIf="!keyConnectorUrl.pending">
+                            {{'keyConnectorTest' | i18n}}
+                        </span>
+                    </button>
+                </div>
+            </div>
+            <ng-container *ngIf="keyConnectorUrl.pristine && !keyConnectorUrl.pending">
+                <div class="text-danger" *ngIf="keyConnectorUrl.hasError('invalidUrl')" role="alert">
+                    <i class="fa fa-exclamation-circle" aria-hidden="true"></i>
+                    {{'keyConnectorTestFail' | i18n}}
+                </div>
+                <div class="text-success" *ngIf="!keyConnectorUrl.hasError('invalidUrl')" role="alert">
+                    <i class="fa fa-check-circle-o" aria-hidden="true"></i>
+                    {{'keyConnectorTestSuccess' | i18n}}
+                </div>
+            </ng-container>
+        </div>
+    </ng-container>
+
    <div class="form-group">
        <label for="type">{{'type' | i18n}}</label>
        <select class="form-control" id="type" formControlName="configType">
@@ -55,24 +120,24 @@
                </div>
            </div>
            <div class="form-group">
-                <label>{{'authority' | i18n}}</label>
-                <input class="form-control" formControlName="authority">
+                <label for="authority">{{'authority' | i18n}}</label>
+                <input class="form-control" formControlName="authority" id="authority">
            </div>
            <div class="form-group">
-                <label>{{'clientId' | i18n}}</label>
-                <input class="form-control" formControlName="clientId">
+                <label for="clientId">{{'clientId' | i18n}}</label>
+                <input class="form-control" formControlName="clientId" id="clientId">
            </div>
            <div class="form-group">
-                <label>{{'clientSecret' | i18n}}</label>
-                <input class="form-control" formControlName="clientSecret">
+                <label for="clientSecret">{{'clientSecret' | i18n}}</label>
+                <input class="form-control" formControlName="clientSecret" id="clientSecret">
            </div>
            <div class="form-group">
-                <label>{{'metadataAddress' | i18n}}</label>
-                <input class="form-control" formControlName="metadataAddress">
+                <label for="metadataAddress">{{'metadataAddress' | i18n}}</label>
+                <input class="form-control" formControlName="metadataAddress" id="metadataAddress">
            </div>
            <div class="form-group">
-                <label>{{'oidcRedirectBehavior' | i18n}}</label>
-                <select class="form-control" formControlName="redirectBehavior">
+                <label for="redirectBehavior">{{'oidcRedirectBehavior' | i18n}}</label>
+                <select class="form-control" formControlName="redirectBehavior" id="redirectBehavior">
                    <option value="0">Redirect GET</option>
                    <option value="1">Form POST</option>
                </select>
@@ -87,28 +152,31 @@
                </div>
            </div>
            <div class="form-group">
-                <label>{{'additionalScopes' | i18n}}</label>
-                <input class="form-control" formControlName="additionalScopes">
+                <label for="additionalScopes">{{'additionalScopes' | i18n}}</label>
+                <input class="form-control" formControlName="additionalScopes" id="additionalScopes">
            </div>
            <div class="form-group">
-                <label>{{'additionalUserIdClaimTypes' | i18n}}</label>
-                <input class="form-control" formControlName="additionalUserIdClaimTypes">
+                <label for="additionalUserIdClaimTypes">{{'additionalUserIdClaimTypes' | i18n}}</label>
+                <input class="form-control" formControlName="additionalUserIdClaimTypes"
+                    id="additionalUserIdClaimTypes">
            </div>
            <div class="form-group">
-                <label>{{'additionalEmailClaimTypes' | i18n}}</label>
-                <input class="form-control" formControlName="additionalEmailClaimTypes">
+                <label for="additionalEmailClaimTypes">{{'additionalEmailClaimTypes' | i18n}}</label>
+                <input class="form-control" formControlName="additionalEmailClaimTypes"
+                    id="additionalEmailClaimTypes">
            </div>
            <div class="form-group">
-                <label>{{'additionalNameClaimTypes' | i18n}}</label>
-                <input class="form-control" formControlName="additionalNameClaimTypes">
+                <label for="additionalNameClaimTypes">{{'additionalNameClaimTypes' | i18n}}</label>
+                <input class="form-control" formControlName="additionalNameClaimTypes"
+                    id="additionalNameClaimTypes">
            </div>
            <div class="form-group">
-                <label>{{'acrValues' | i18n}}</label>
-                <input class="form-control" formControlName="acrValues">
+                <label for="acrValues">{{'acrValues' | i18n}}</label>
+                <input class="form-control" formControlName="acrValues" id="acrValues">
            </div>
            <div class="form-group">
-                <label>{{'expectedReturnAcrValue' | i18n}}</label>
-                <input class="form-control" formControlName="expectedReturnAcrValue">
+                <label for="expectedReturnAcrValue">{{'expectedReturnAcrValue' | i18n}}</label>
+                <input class="form-control" formControlName="expectedReturnAcrValue" id="expectedReturnAcrValue">
            </div>
        </div>
    </div>
@@ -162,8 +230,8 @@
                </div>
            </div>
            <div class="form-group">
-                <label>{{'spNameIdFormat' | i18n}}</label>
-                <select class="form-control" formControlName="spNameIdFormat">
+                <label for="spNameIdFormat">{{'spNameIdFormat' | i18n}}</label>
+                <select class="form-control" formControlName="spNameIdFormat" id="spNameIdFormat">
                    <option value="0">Not Configured</option>
                    <option value="1">Unspecified</option>
                    <option value="2">Email Address</option>
@@ -176,35 +244,43 @@
                </select>
            </div>
            <div class="form-group">
-                <label>{{'spOutboundSigningAlgorithm' | i18n}}</label>
-                <select class="form-control" formControlName="spOutboundSigningAlgorithm">
+                <label for="spOutboundSigningAlgorithm">{{'spOutboundSigningAlgorithm' | i18n}}</label>
+                <select class="form-control" formControlName="spOutboundSigningAlgorithm"
+                    id="spOutboundSigningAlgorithm">
                    <option *ngFor="let o of samlSigningAlgorithms" [ngValue]="o">{{o}}</option>
                </select>
            </div>
            <div class="form-group">
-                <label>{{'spSigningBehavior' | i18n}}</label>
-                <select class="form-control" formControlName="spSigningBehavior">
+                <label for="spSigningBehavior">{{'spSigningBehavior' | i18n}}</label>
+                <select class="form-control" formControlName="spSigningBehavior" id="spSigningBehavior">
                    <option value="0">If IdP Wants Authn Requests Signed</option>
                    <option value="1">Always</option>
                    <option value="3">Never</option>
                </select>
            </div>
            <div class="form-group">
-                <label>{{'spMinIncomingSigningAlgorithm' | i18n}}</label>
-                <select class="form-control" formControlName="spMinIncomingSigningAlgorithm">
+                <label for="spMinIncomingSigningAlgorithm">{{'spMinIncomingSigningAlgorithm' | i18n}}</label>
+                <select class="form-control" formControlName="spMinIncomingSigningAlgorithm"
+                    id="spMinIncomingSigningAlgorithm">
                    <option *ngFor="let o of samlSigningAlgorithms" [ngValue]="o">{{o}}</option>
                </select>
            </div>
            <div class="form-group">
                <div class="form-check">
-                    <input class="form-check-input" type="checkbox" id="spWantAssertionsSigned" formControlName="spWantAssertionsSigned">
-                    <label class="form-check-label" for="spWantAssertionsSigned">{{'spWantAssertionsSigned' | i18n}}</label>
+                    <input class="form-check-input" type="checkbox" id="spWantAssertionsSigned"
+                        formControlName="spWantAssertionsSigned">
+                    <label class="form-check-label" for="spWantAssertionsSigned">
+                        {{'spWantAssertionsSigned' | i18n}}
+                    </label>
                </div>
            </div>
            <div class="form-group">
                <div class="form-check">
-                    <input class="form-check-input" type="checkbox" id="spValidateCertificates" formControlName="spValidateCertificates">
-                    <label class="form-check-label" for="spValidateCertificates">{{'spValidateCertificates' | i18n}}</label>
+                    <input class="form-check-input" type="checkbox" id="spValidateCertificates"
+                        formControlName="spValidateCertificates">
+                    <label class="form-check-label" for="spValidateCertificates">
+                        {{'spValidateCertificates' | i18n}}
+                    </label>
                </div>
            </div>
        </div>
@@ -214,36 +290,39 @@
            <h2>{{'samlIdpConfig' | i18n}}</h2>

            <div class="form-group">
-                <label>{{'idpEntityId' | i18n}}</label>
-                <input class="form-control" formControlName="idpEntityId">
+                <label for="idpEntityId">{{'idpEntityId' | i18n}}</label>
+                <input class="form-control" formControlName="idpEntityId" id="idpEntityId">
            </div>
            <div class="form-group">
-                <label>{{'idpBindingType' | i18n}}</label>
-                <select class="form-control" formControlName="idpBindingType">
+                <label for="idpBindingType">{{'idpBindingType' | i18n}}</label>
+                <select class="form-control" formControlName="idpBindingType" id="idpBindingType">
                    <option value="1">Redirect</option>
                    <option value="2">HTTP POST</option>
                    <option value="4">Artifact</option>
                </select>
            </div>
            <div class="form-group">
-                <label>{{'idpSingleSignOnServiceUrl' | i18n}}</label>
-                <input class="form-control" formControlName="idpSingleSignOnServiceUrl">
+                <label for="idpSingleSignOnServiceUrl">{{'idpSingleSignOnServiceUrl' | i18n}}</label>
+                <input class="form-control" formControlName="idpSingleSignOnServiceUrl" id="idpSingleSignOnServiceUrl">
            </div>
            <div class="form-group">
-                <label>{{'idpSingleLogoutServiceUrl' | i18n}}</label>
-                <input class="form-control" formControlName="idpSingleLogoutServiceUrl">
+                <label for="idpSingleLogoutServiceUrl">{{'idpSingleLogoutServiceUrl' | i18n}}</label>
+                <input class="form-control" formControlName="idpSingleLogoutServiceUrl" id="idpSingleLogoutServiceUrl">
            </div>
            <div class="form-group">
-                <label>{{'idpArtifactResolutionServiceUrl' | i18n}}</label>
-                <input class="form-control" formControlName="idpArtifactResolutionServiceUrl">
+                <label for="idpArtifactResolutionServiceUrl">{{'idpArtifactResolutionServiceUrl' | i18n}}</label>
+                <input class="form-control" formControlName="idpArtifactResolutionServiceUrl"
+                    id="idpArtifactResolutionServiceUrl">
            </div>
            <div class="form-group">
-                <label>{{'idpX509PublicCert' | i18n}}</label>
-                <textarea formControlName="idpX509PublicCert" class="form-control form-control-sm text-monospace" rows="6"></textarea>
+                <label for="idpX509PublicCert">{{'idpX509PublicCert' | i18n}}</label>
+                <textarea formControlName="idpX509PublicCert" class="form-control form-control-sm text-monospace"
+                    rows="6" id="idpX509PublicCert"></textarea>
            </div>
            <div class="form-group">
-                <label>{{'idpOutboundSigningAlgorithm' | i18n}}</label>
-                <select class="form-control" formControlName="idpOutboundSigningAlgorithm">
+                <label for="idpOutboundSigningAlgorithm">{{'idpOutboundSigningAlgorithm' | i18n}}</label>
+                <select class="form-control" formControlName="idpOutboundSigningAlgorithm"
+                    id="idpOutboundSigningAlgorithm">
                    <option *ngFor="let o of samlSigningAlgorithms" [ngValue]="o">{{o}}</option>
                </select>
            </div>
--- a/bitwarden_license/src/app/organizations/manage/sso.component.ts
+++ b/bitwarden_license/src/app/organizations/manage/sso.component.ts
@@ -8,6 +8,10 @@ import { ActivatedRoute } from '@angular/router';
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { UserService } from 'jslib-common/abstractions/user.service';
+
+import { Organization } from 'jslib-common/models/domain/organization';
+
 import { OrganizationSsoRequest } from 'jslib-common/models/request/organization/organizationSsoRequest';

@Component({
@@ -25,6 +29,7 @@ export class SsoComponent implements OnInit {

    loading = true;
    organizationId: string;
+    organization: Organization;
    formPromise: Promise<any>;

    callbackPath: string;
@@ -37,6 +42,9 @@ export class SsoComponent implements OnInit {
    data = this.fb.group({
        configType: [],

+        keyConnectorEnabled: [],
+        keyConnectorUrl: [],
+
        // OpenId
        authority: [],
        clientId: [],
@@ -72,7 +80,8 @@ export class SsoComponent implements OnInit {
    });

    constructor(private fb: FormBuilder, private route: ActivatedRoute, private apiService: ApiService,
-        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService) { }
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
+        private userService: UserService) { }

    async ngOnInit() {
        this.route.parent.parent.params.subscribe(async params => {
@@ -82,6 +91,7 @@ export class SsoComponent implements OnInit {
    }

    async load() {
+        this.organization = await this.userService.getOrganization(this.organizationId);
        const ssoSettings = await this.apiService.getOrganizationSso(this.organizationId);

        this.data.patchValue(ssoSettings.data);
@@ -93,6 +103,8 @@ export class SsoComponent implements OnInit {
        this.spMetadataUrl = ssoSettings.urls.spMetadataUrl;
        this.spAcsUrl = ssoSettings.urls.spAcsUrl;

+        this.keyConnectorUrl.markAsDirty();
+
        this.loading = false;
    }

@@ -105,17 +117,64 @@ export class SsoComponent implements OnInit {
    }

    async submit() {
+        this.formPromise = this.postData();
+
+        try {
+            const response = await this.formPromise;
+
+            this.data.patchValue(response.data);
+            this.enabled.setValue(response.enabled);
+
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('ssoSettingsSaved'));
+        } catch {
+            // Logged by appApiAction, do nothing
+        }
+
+        this.formPromise = null;
+    }
+
+    async postData() {
+        if (this.data.get('keyConnectorEnabled').value) {
+            await this.validateKeyConnectorUrl();
+
+            if (this.keyConnectorUrl.hasError('invalidUrl')) {
+                throw new Error(this.i18nService.t('keyConnectorTestFail'));
+            }
+        }
+
        const request = new OrganizationSsoRequest();
        request.enabled = this.enabled.value;
        request.data = this.data.value;

-        this.formPromise = this.apiService.postOrganizationSso(this.organizationId, request);
+        return this.apiService.postOrganizationSso(this.organizationId, request);
+    }

-        const response = await this.formPromise;
-        this.data.patchValue(response.data);
-        this.enabled.setValue(response.enabled);
+    async validateKeyConnectorUrl() {
+        if (this.keyConnectorUrl.pristine) {
+            return;
+        }

-        this.formPromise = null;
-        this.platformUtilsService.showToast('success', null, this.i18nService.t('ssoSettingsSaved'));
+        this.keyConnectorUrl.markAsPending();
+
+        try {
+            await this.apiService.getKeyConnectorAlive(this.keyConnectorUrl.value);
+            this.keyConnectorUrl.updateValueAndValidity();
+        } catch {
+            this.keyConnectorUrl.setErrors({
+                invalidUrl: true,
+            });
+        }
+
+        this.keyConnectorUrl.markAsPristine();
+    }
+
+    get enableTestKeyConnector() {
+        return this.data.get('keyConnectorEnabled').value &&
+            this.keyConnectorUrl != null &&
+            this.keyConnectorUrl.value !== '';
+    }
+
+    get keyConnectorUrl() {
+        return this.data.get('keyConnectorUrl');
    }
 }
--- a/bitwarden_license/src/app/providers/clients/add-organization.component.html
+++ b/bitwarden_license/src/app/providers/clients/add-organization.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="addTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="addTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/bitwarden_license/src/app/providers/manage/user-add-edit.component.html
+++ b/bitwarden_license/src/app/providers/manage/user-add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/config.js
+++ b/config.js
@@ -3,6 +3,11 @@ function load(envName) {
        ...require('./config/base.json'),
        ...loadConfig(envName),
        ...loadConfig('local'),
+        dev: {
+            ...require('./config/base.json').dev,
+            ...loadConfig(envName).dev,
+            ...loadConfig('local').dev,
+        },
    };
 }

--- a/config/base.json
+++ b/config/base.json
@@ -5,5 +5,8 @@
    "paypal": {
        "businessId": "AD3LAUZSNVPJY",
        "buttonAction": "https://www.sandbox.paypal.com/cgi-bin/webscr"
+    },
+    "dev": {
+        "allowedHosts": []
    }
 }
--- a/config/cloud.json
+++ b/config/cloud.json
@@ -8,5 +8,10 @@
    "paypal": {
        "businessId": "4ZDA7DLUUJGMN",
        "buttonAction": "https://www.paypal.com/cgi-bin/webscr"
+    },
+    "dev": {
+        "proxyApi": "https://api.bitwarden.com",
+        "proxyIdentity": "https://identity.bitwarden.com",
+        "proxyEvents": "https://events.bitwarden.com"
    }
 }
--- a/config/development.json
+++ b/config/development.json
@@ -1,10 +1,11 @@
 {
-    "proxyApi": "http://localhost:4000",
-    "proxyIdentity": "http://localhost:33656",
-    "proxyEvents": "http://localhost:46273",
-    "proxyNotifications": "http://localhost:61840",
-    "allowedHosts": [],
    "urls": {
        "notifications": "http://localhost:61840"
+    },
+    "dev": {
+        "proxyApi": "http://localhost:4000",
+        "proxyIdentity": "http://localhost:33656",
+        "proxyEvents": "http://localhost:46273",
+        "proxyNotifications": "http://localhost:61840"
    }
 }
--- a/config/qa.json
+++ b/config/qa.json
@@ -2,5 +2,10 @@
    "urls": {
        "icons": "https://icons.qa.bitwarden.pw",
        "notifications": "https://notifications.qa.bitwarden.pw"
+    },
+    "dev": {
+        "proxyApi": "https://api.qa.bitwarden.pw",
+        "proxyIdentity": "https://identity.qa.bitwarden.pw",
+        "proxyEvents": "https://events.qa.bitwarden.pw"
    }
 }
--- a/crowdin.yml
+++ b/crowdin.yml
@@ -1,7 +1,9 @@
 project_id_env: _CROWDIN_PROJECT_ID
 api_token_env: CROWDIN_API_TOKEN
+preserve_hierarchy: true
 files:
  - source: /src/locales/en/messages.json
+    dest: /src/locales/en/%file_name%.%file_extension%
    translation: /src/locales/%two_letters_code%/%original_file_name%
    update_option: update_as_unapproved
    languages_mapping:
--- a/2
+++ b/2
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "bitwarden-web",
-  "version": "2.23.0",
+  "version": "2.25.0",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "bitwarden-web",
-      "version": "2.23.0",
+      "version": "2.25.0",
      "hasInstallScript": true,
      "license": "GPL-3.0",
      "dependencies": {
@@ -20626,4 +20626,4 @@
      "integrity": "sha1-KOwXzwl0PtyrBW3dixsGJizHPDA="
    }
  }
-}
+}
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "bitwarden-web",
-  "version": "2.23.0",
+  "version": "2.25.0",
  "license": "GPL-3.0",
  "repository": "https://github.com/bitwarden/web",
  "scripts": {
@@ -85,4 +85,4 @@
    "node": "~14",
    "npm": "~7"
  }
-}
+}
--- a/src/app/accounts/lock.component.ts
+++ b/src/app/accounts/lock.component.ts
@@ -5,6 +5,7 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
@@ -27,9 +28,11 @@ export class LockComponent extends BaseLockComponent {
        userService: UserService, cryptoService: CryptoService,
        storageService: StorageService, vaultTimeoutService: VaultTimeoutService,
        environmentService: EnvironmentService, private routerService: RouterService,
-        stateService: StateService, apiService: ApiService, logService: LogService) {
+        stateService: StateService, apiService: ApiService, logService: LogService,
+        keyConnectorService: KeyConnectorService) {
        super(router, i18nService, platformUtilsService, messagingService, userService, cryptoService,
-            storageService, vaultTimeoutService, environmentService, stateService, apiService, logService);
+            storageService, vaultTimeoutService, environmentService, stateService, apiService, logService,
+            keyConnectorService);
    }

    async ngOnInit() {
--- a/src/app/accounts/login.component.ts
+++ b/src/app/accounts/login.component.ts
@@ -55,6 +55,15 @@ export class LoginComponent extends BaseLoginComponent {
                this.stateService.save('loginRedirect',
                    { route: '/settings/create-organization', qParams: { plan: qParams.org } });
            }
+
+            // Are they coming from an email for sponsoring a families organization
+            if (qParams.sponsorshipToken != null) {
+                // After logging in redirect them to setup the families sponsorship
+                this.stateService.save('loginRedirect', {
+                    route: '/setup/families-for-enterprise',
+                    qParams: { token: qParams.sponsorshipToken },
+                });
+            }
            await super.ngOnInit();
        });

--- a/src/app/accounts/register.component.ts
+++ b/src/app/accounts/register.component.ts
@@ -68,6 +68,14 @@ export class RegisterComponent extends BaseRegisterComponent {
            } else {
                this.referenceData.id = ('; ' + document.cookie).split('; reference=').pop().split(';').shift();
            }
+            // Are they coming from an email for sponsoring a families organization
+            if (qParams.sponsorshipToken != null) {
+                // After logging in redirect them to setup the families sponsorship
+                this.stateService.save('loginRedirect', {
+                    route: '/setup/families-for-enterprise',
+                    qParams: { token: qParams.sponsorshipToken },
+                });
+            }
            if (this.referenceData.id === '') {
                this.referenceData.id = null;
            }
--- a/src/app/accounts/remove-password.component.html
+++ b/src/app/accounts/remove-password.component.html
@@ -0,0 +1,31 @@
+<div class="mt-5 d-flex justify-content-center" *ngIf="loading">
+    <div>
+        <img class="mb-4 logo logo-themed" alt="Bitwarden">
+        <p class="text-center">
+            <i class="fa fa-spinner fa-spin fa-2x text-muted" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+            <span class="sr-only">{{'loading' | i18n}}</span>
+        </p>
+    </div>
+</div>
+<div class="container" *ngIf="!loading">
+    <div class="row justify-content-md-center mt-5">
+        <div class="col-5">
+            <p class="lead text-center mb-4">{{'removeMasterPassword' | i18n}}</p>
+            <hr>
+            <div class="card d-block">
+                <div class="card-body">
+                    <p>{{'convertOrganizationEncryptionDesc' | i18n : organization.name}}</p>
+
+                    <button type="button" class="btn btn-primary btn-block" (click)="convert()" [disabled]="actionPromise">
+                        <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true" *ngIf="continuing"></i>
+                        {{'removeMasterPassword' | i18n}}
+                    </button>
+                    <button type="button" class="btn btn-outline-secondary btn-block" (click)="leave()" [disabled]="actionPromise">
+                        <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true" *ngIf="leaving"></i>
+                        {{'leaveOrganization' | i18n}}
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
--- a/src/app/accounts/remove-password.component.ts
+++ b/src/app/accounts/remove-password.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+import { RemovePasswordComponent as BaseRemovePasswordComponent } from 'jslib-angular/components/remove-password.component';
+
+@Component({
+    selector: 'app-remove-password',
+    templateUrl: 'remove-password.component.html',
+})
+export class RemovePasswordComponent extends BaseRemovePasswordComponent {
+}
--- a/src/app/accounts/two-factor-options.component.html
+++ b/src/app/accounts/two-factor-options.component.html
@@ -1,5 +1,5 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="twoStepOptionsTitle">
-    <div class="modal-dialog modal-dialog-scrollable" role="document">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="twoStepOptionsTitle">
+    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h2 class="modal-title" id="twoStepOptionsTitle">{{'twoStepOptions' | i18n}}</h2>
@@ -8,21 +8,46 @@
                </button>
            </div>
            <div class="modal-body">
-                <div class="list-group list-group-flush">
-                    <a href="#" appStopClick *ngFor="let p of providers" (click)="choose(p)"
-                        class="list-group-item list-group-item-action">
-                        <img [src]="'images/two-factor/' + p.type + '.png'" alt="" class="pull-right">
-                        <h3>{{p.name}}</h3>
-                        {{p.description}}
-                    </a>
-                    <a href="#" appStopClick class="list-group-item list-group-item-action" (click)="recover()">
-                        <h3>{{'recoveryCodeTitle' | i18n}}</h3>
-                        {{'recoveryCodeDesc' | i18n}}
-                    </a>
+                <div class="list-group list-group-flush-2fa">
+                    <div *ngFor="let p of providers" class="list-group-item list-group-item-action">
+                        <div class="two-factor-content">
+                            <div class="logo-col">
+                                <img [class]="'mfaType' + p.type" [alt]="p.name + ' logo'">
+                            </div>
+                            <div class="text-col">
+                                <h3>{{p.name}}</h3>
+                                {{p.description}}
+                            </div>
+                            <div class="btn-col">
+                                <button [attr.aria-describedby]="p.name" type="button"
+                                    class="btn btn-outline-secondary btn-sm" (click)="choose(p)">
+                                    {{'select' | i18n}}
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="list-group-item list-group-item-action" (click)="recover()">
+                        <div class="two-factor-content">
+                            <div class="logo-col">
+                                <img class="recovery-code-img" alt="rc logo">
+                            </div>
+                            <div class="text-col">
+                                <h3>{{'recoveryCodeTitle' | i18n}}</h3>
+                                {{'recoveryCodeDesc' | i18n}}
+                            </div>
+                            <div class="btn-col">
+                                <button [attr.aria-descibedby]="'recoveryCodeTitle' | i18n" type="button"
+                                    class="btn btn-outline-secondary btn-sm" (click)="recover()">
+                                    {{'select' | i18n}}
+                                </button>
+                            </div>
+                        </div>
+                    </div>
                </div>
            </div>
            <div class="modal-footer">
-                <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
+                <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' |
+                    i18n}}</button>
            </div>
        </div>
    </div>
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -32,6 +32,7 @@ import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { EventService } from 'jslib-common/abstractions/event.service';
 import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
 import { NotificationsService } from 'jslib-common/abstractions/notifications.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
@@ -92,7 +93,8 @@ export class AppComponent implements OnDestroy, OnInit {
        private sanitizer: DomSanitizer, private searchService: SearchService,
        private notificationsService: NotificationsService, private routerService: RouterService,
        private stateService: StateService, private eventService: EventService,
-        private policyService: PolicyService, protected policyListService: PolicyListService) { }
+        private policyService: PolicyService, protected policyListService: PolicyListService,
+        private keyConnectorService: KeyConnectorService) { }

    ngOnInit() {
        this.ngZone.runOutsideAngular(() => {
@@ -163,6 +165,10 @@ export class AppComponent implements OnDestroy, OnInit {
                    case 'setFullWidth':
                        this.setFullWidth();
                        break;
+                    case 'convertAccountToKeyConnector':
+                        this.keyConnectorService.setConvertAccountRequired(true);
+                        this.router.navigate(['/remove-password']);
+                        break;
                    default:
                        break;
                }
@@ -218,6 +224,7 @@ export class AppComponent implements OnDestroy, OnInit {
            this.policyService.clear(userId),
            this.passwordGenerationService.clear(),
            this.stateService.purge(),
+            this.keyConnectorService.clear(),
        ]);

        this.searchService.clearIndex();
--- a/src/app/common/base.people.component.ts
+++ b/src/app/common/base.people.component.ts
@@ -180,7 +180,7 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai

    async remove(user: UserType) {
        const confirmed = await this.platformUtilsService.showDialog(
-            this.i18nService.t('removeUserConfirmation'), this.userNamePipe.transform(user),
+            this.deleteWarningMessage(user), this.userNamePipe.transform(user),
            this.i18nService.t('yes'), this.i18nService.t('no'), 'warning');

        if (!confirmed) {
@@ -288,6 +288,10 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
        return !searching && this.users && this.users.length > this.pageSize;
    }

+    protected deleteWarningMessage(user: UserType): string {
+        return this.i18nService.t('removeUserConfirmation');
+    }
+
    protected getCheckedUsers() {
        return this.users.filter(u => (u as any).checked);
    }
--- a/src/app/components/password-reprompt.component.html
+++ b/src/app/components/password-reprompt.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()">
            <div class="modal-header">
--- a/src/app/organizations/manage/bulk/bulk-confirm.component.html
+++ b/src/app/organizations/manage/bulk/bulk-confirm.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/organizations/manage/bulk/bulk-remove.component.html
+++ b/src/app/organizations/manage/bulk/bulk-remove.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/organizations/manage/bulk/bulk-status.component.html
+++ b/src/app/organizations/manage/bulk/bulk-status.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/organizations/manage/collection-add-edit.component.html
+++ b/src/app/organizations/manage/collection-add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="collectionAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="collectionAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/organizations/manage/entity-events.component.html
+++ b/src/app/organizations/manage/entity-events.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="eventLogsTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="eventLogsTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/organizations/manage/entity-users.component.html
+++ b/src/app/organizations/manage/entity-users.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAccessTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAccessTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/organizations/manage/group-add-edit.component.html
+++ b/src/app/organizations/manage/group-add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="groupAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="groupAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/organizations/manage/people.component.ts
+++ b/src/app/organizations/manage/people.component.ts
@@ -193,6 +193,7 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
            comp.name = this.userNamePipe.transform(user);
            comp.organizationId = this.organizationId;
            comp.organizationUserId = user != null ? user.id : null;
+            comp.usesKeyConnector = user?.usesKeyConnector;
            comp.onSavedUser.subscribe(() => {
                modal.close();
                this.load();
@@ -291,6 +292,14 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
        });
    }

+    protected deleteWarningMessage(user: OrganizationUserUserDetailsResponse): string {
+        if (user.usesKeyConnector) {
+            return this.i18nService.t('removeUserConfirmationKeyConnector');
+        }
+
+        return super.deleteWarningMessage(user);
+    }
+
    private async showBulkStatus(users: OrganizationUserUserDetailsResponse[], filteredUsers: OrganizationUserUserDetailsResponse[],
        request: Promise<ListResponse<OrganizationUserBulkResponse>>, successfullMessage: string) {

--- a/src/app/organizations/manage/policy-edit.component.html
+++ b/src/app/organizations/manage/policy-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="policiesEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="policiesEditTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/organizations/manage/reset-password.component.html
+++ b/src/app/organizations/manage/reset-password.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="resetPasswordTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="resetPasswordTitle">
    <div class="modal-dialog" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
            <div class="modal-header">
--- a/src/app/organizations/manage/user-add-edit.component.html
+++ b/src/app/organizations/manage/user-add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/organizations/manage/user-add-edit.component.ts
+++ b/src/app/organizations/manage/user-add-edit.component.ts
@@ -33,6 +33,7 @@ export class UserAddEditComponent implements OnInit {
    @Input() name: string;
    @Input() organizationUserId: string;
    @Input() organizationId: string;
+    @Input() usesKeyConnector: boolean = false;
    @Output() onSavedUser = new EventEmitter();
    @Output() onDeletedUser = new EventEmitter();

@@ -193,9 +194,10 @@ export class UserAddEditComponent implements OnInit {
            return;
        }

+        const message = this.usesKeyConnector ? 'removeUserConfirmationKeyConnector' : 'removeUserConfirmation';
        const confirmed = await this.platformUtilsService.showDialog(
-            this.i18nService.t('removeUserConfirmation'), this.name,
-            this.i18nService.t('yes'), this.i18nService.t('no'), 'warning');
+            this.i18nService.t(message), this.name, this.i18nService.t('yes'), this.i18nService.t('no'), 'warning'
+        );
        if (!confirmed) {
            return false;
        }
--- a/src/app/organizations/manage/user-confirm.component.html
+++ b/src/app/organizations/manage/user-confirm.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
            <div class="modal-header">
--- a/src/app/organizations/manage/user-groups.component.html
+++ b/src/app/organizations/manage/user-groups.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="groupAccessTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="groupAccessTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
            <div class="modal-header">
--- a/src/app/organizations/policies/master-password.component.html
+++ b/src/app/organizations/policies/master-password.component.html
@@ -1,3 +1,7 @@
+<app-callout type="info" *ngIf="showKeyConnectorInfo">
+    {{'keyConnectorPolicyRestriction' | i18n}}
+</app-callout>
+
 <div [formGroup]="data">
    <div class="form-group">
        <div class="form-check">
--- a/src/app/organizations/policies/master-password.component.ts
+++ b/src/app/organizations/policies/master-password.component.ts
@@ -2,6 +2,7 @@ import { Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';

 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { UserService } from 'jslib-common/abstractions/user.service';

 import { PolicyType } from 'jslib-common/enums/policyType';

@@ -30,8 +31,9 @@ export class MasterPasswordPolicyComponent extends BasePolicyComponent {
    });

    passwordScores: { name: string; value: number; }[];
+    showKeyConnectorInfo: boolean = false;

-    constructor(private fb: FormBuilder, i18nService: I18nService) {
+    constructor(private fb: FormBuilder, i18nService: I18nService, private userService: UserService) {
        super();

        this.passwordScores = [
@@ -43,4 +45,10 @@ export class MasterPasswordPolicyComponent extends BasePolicyComponent {
            { name: i18nService.t('strong') + ' (4)', value: 4 },
        ];
    }
+
+    async ngOnInit() {
+        super.ngOnInit();
+        const organization = await this.userService.getOrganization(this.policyResponse.organizationId);
+        this.showKeyConnectorInfo = organization.keyConnectorEnabled;
+    }
 }
--- a/src/app/organizations/policies/reset-password.component.html
+++ b/src/app/organizations/policies/reset-password.component.html
@@ -1,3 +1,7 @@
+<app-callout type="info" *ngIf="showKeyConnectorInfo">
+    {{'keyConnectorPolicyRestriction' | i18n}}
+</app-callout>
+
 <app-callout type="warning">
    {{'resetPasswordPolicyWarning' | i18n}}
 </app-callout>
--- a/src/app/organizations/policies/reset-password.component.ts
+++ b/src/app/organizations/policies/reset-password.component.ts
@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
+import { UserService } from 'jslib-common/abstractions/user.service';

 import { PolicyType } from 'jslib-common/enums/policyType';

@@ -29,8 +30,15 @@ export class ResetPasswordPolicyComponent extends BasePolicyComponent {
    });

    defaultTypes: { name: string; value: string; }[];
+    showKeyConnectorInfo: boolean = false;

-    constructor(private fb: FormBuilder) {
+    constructor(private fb: FormBuilder, private userService: UserService) {
        super();
    }
+
+    async ngOnInit() {
+        super.ngOnInit();
+        const organization = await this.userService.getOrganization(this.policyResponse.organizationId);
+        this.showKeyConnectorInfo = organization.keyConnectorEnabled;
+    }
 }
--- a/src/app/organizations/settings/account.component.ts
+++ b/src/app/organizations/settings/account.component.ts
@@ -4,7 +4,10 @@ import {
    ViewContainerRef,
 } from '@angular/core';

-import { ActivatedRoute } from '@angular/router';
+import {
+    ActivatedRoute,
+    Router
+} from '@angular/router';

 import { ToasterService } from 'angular2-toaster';
 import { ModalService } from 'jslib-angular/services/modal.service';
@@ -51,7 +54,8 @@ export class AccountComponent {
        private apiService: ApiService, private i18nService: I18nService,
        private toasterService: ToasterService, private route: ActivatedRoute,
        private syncService: SyncService, private platformUtilsService: PlatformUtilsService,
-        private cryptoService: CryptoService, private logService: LogService) { }
+        private cryptoService: CryptoService, private logService: LogService,
+        private router: Router) { }

    async ngOnInit() {
        this.selfHosted = this.platformUtilsService.isSelfHost();
@@ -101,6 +105,9 @@ export class AccountComponent {
    async deleteOrganization() {
        await this.modalService.openViewRef(DeleteOrganizationComponent, this.deleteModalRef, comp => {
            comp.organizationId = this.organizationId;
+            comp.onSuccess.subscribe(() => {
+                this.router.navigate(['/']);
+            });
        });
    }

--- a/src/app/organizations/settings/delete-organization.component.html
+++ b/src/app/organizations/settings/delete-organization.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deleteOrganizationTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deleteOrganizationTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
@@ -8,11 +8,10 @@
                </button>
            </div>
            <div class="modal-body">
-                <p>{{'deleteOrganizationDesc' | i18n}}</p>
+                <p>{{descriptionKey | i18n}}</p>
                <app-callout type="warning">{{'deleteOrganizationWarning' | i18n}}</app-callout>
-                <label for="masterPassword">{{'masterPass' | i18n}}</label>
-                <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-                    [(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
+                <app-verify-master-password [(ngModel)]="masterPassword" ngDefaultControl name="secret">
+                </app-verify-master-password>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">
--- a/src/app/organizations/settings/delete-organization.component.ts
+++ b/src/app/organizations/settings/delete-organization.component.ts
@@ -1,14 +1,17 @@
-import { Component } from '@angular/core';
-import { Router } from '@angular/router';
+import {
+    Component,
+    EventEmitter,
+    Output,
+} from '@angular/core';

 import { ToasterService } from 'angular2-toaster';

+import { Verification } from 'jslib-common/types/verification';
+
 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 { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

@Component({
    selector: 'app-delete-organization',
@@ -16,29 +19,24 @@ import { PasswordVerificationRequest } from 'jslib-common/models/request/passwor
 })
 export class DeleteOrganizationComponent {
    organizationId: string;
+    descriptionKey = 'deleteOrganizationDesc';
+    @Output() onSuccess: EventEmitter<any> = new EventEmitter();

-    masterPassword: string;
+    masterPassword: Verification;
    formPromise: Promise<any>;

    constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
-        private router: Router, private logService: LogService) { }
+        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private logService: LogService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, null);
        try {
-            this.formPromise = this.apiService.deleteOrganization(this.organizationId, request);
+            this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
+                .then(request => this.apiService.deleteOrganization(this.organizationId, request));
            await this.formPromise;
            this.toasterService.popAsync('success', this.i18nService.t('organizationDeleted'),
                this.i18nService.t('organizationDeletedDesc'));
-            this.router.navigate(['/']);
+            this.onSuccess.emit();
        } catch (e) {
            this.logService.error(e);
        }
--- a/src/app/organizations/settings/organization-subscription.component.html
+++ b/src/app/organizations/settings/organization-subscription.component.html
@@ -32,7 +32,7 @@
                    <ng-container *ngIf="subscription">
                        <dt>{{'status' | i18n}}</dt>
                        <dd>
-                            <span class="text-capitalize">{{subscription.status || '-'}}</span>
+                            <span class="text-capitalize">{{isSponsoredSubscription ? 'sponsored' : subscription.status || '-'}}</span>
                            <span class="badge badge-warning"
                                *ngIf="subscriptionMarkedForCancel">{{'pendingCancellation' |
                                i18n}}</span>
@@ -45,7 +45,7 @@
                    </ng-container>
                    </dl>
                    </div>
-            <div class="col-8">
+            <div class="col-8" *ngIf="subscription">
                <strong class="d-block mb-1">{{'details' | i18n}}</strong>
                <table class="table">
                    <tbody>
@@ -70,6 +70,13 @@
                </div>
            </ng-container>
        </div>
+        <ng-container>
+            <button type="button" class="btn btn-outline-secondary" (click)="changePlan()" *ngIf="showChangePlanButton">
+                {{'changeBillingPlan' | i18n}}
+            </button>
+            <app-change-plan [organizationId]="organizationId" (onChanged)="closeChangePlan(true)"
+                (onCanceled)="closeChangePlan(false)" *ngIf="showChangePlan"></app-change-plan>
+        </ng-container>
        <h2 class="spaced-header">{{'manageSubscription' | i18n}}</h2>
        <p class="mb-4">{{subscriptionDesc}}</p>
        <ng-container *ngIf="subscription && canAdjustSeats && !subscription.cancelled && !subscriptionMarkedForCancel">
@@ -79,6 +86,12 @@
                </app-adjust-subscription>
            </div>
        </ng-container>
+        <button #removeSponsorshipBtn type="button" class="btn btn-outline-danger btn-submit" (click)="removeSponsorship()"
+            [appApiAction]="removeSponsorshipPromise" [disabled]="removeSponsorshipBtn.loading"
+            *ngIf="isSponsoredSubscription">
+            <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+            <span>{{'removeSponsorship' | i18n}}</span>
+        </button>
        <h2 class="spaced-header">{{'storage' | i18n}}</h2>
        <p>{{'subscriptionStorage' | i18n : sub.maxStorageGb || 0 : sub.storageName || '0 MB'}}</p>
        <div class="progress">
@@ -118,8 +131,6 @@
                <span>{{'cancelSubscription' | i18n}}</span>
            </button>
        </div>
-        <app-change-plan [organizationId]="organizationId" (onChanged)="closeChangePlan(true)"
-            (onCanceled)="closeChangePlan(false)" *ngIf="showChangePlan"></app-change-plan>
        <div class="mt-3" *ngIf="showDownloadLicense">
            <app-download-license [organizationId]="organizationId" (onDownloaded)="closeDownloadLicense()"
                (onCanceled)="closeDownloadLicense()"></app-download-license>
--- a/src/app/organizations/settings/organization-subscription.component.ts
+++ b/src/app/organizations/settings/organization-subscription.component.ts
@@ -38,6 +38,7 @@ export class OrganizationSubscriptionComponent implements OnInit {

    userOrg: Organization;

+    removeSponsorshipPromise: Promise<any>;
    cancelPromise: Promise<any>;
    reinstatePromise: Promise<any>;

@@ -110,15 +111,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
    }

    async changePlan() {
-        if (this.subscription == null && this.sub.planType === PlanType.Free) {
-            this.showChangePlan = !this.showChangePlan;
-            return;
-        }
-        const contactSupport = await this.platformUtilsService.showDialog(this.i18nService.t('changeBillingPlanDesc'),
-            this.i18nService.t('changeBillingPlan'), this.i18nService.t('contactSupport'), this.i18nService.t('close'));
-        if (contactSupport) {
-            this.platformUtilsService.launchUri('https://bitwarden.com/contact');
-        }
+        this.showChangePlan = !this.showChangePlan;
    }

    closeChangePlan(changed: boolean) {
@@ -164,6 +157,26 @@ export class OrganizationSubscriptionComponent implements OnInit {
        }
    }

+    async removeSponsorship() {
+        const isConfirmed = await this.platformUtilsService.showDialog(
+            this.i18nService.t('removeSponsorshipConfirmation'),
+            this.i18nService.t('removeSponsorship'),
+            this.i18nService.t('remove'), this.i18nService.t('cancel'), 'warning');
+
+        if (!isConfirmed) {
+            return;
+        }
+
+        try {
+            this.removeSponsorshipPromise = this.apiService.deleteRemoveSponsorship(this.organizationId);
+            await this.removeSponsorshipPromise;
+            this.toasterService.popAsync('success', null, this.i18nService.t('removeSponsorshipSuccess'));
+            await this.load();
+        } catch (e) {
+            this.logService.error(e);
+        }
+    }
+
    get isExpired() {
        return this.sub != null && this.sub.expiration != null &&
            new Date(this.sub.expiration) < new Date();
@@ -215,13 +228,25 @@ export class OrganizationSubscriptionComponent implements OnInit {
        return this.sub.plan.hasAdditionalSeatsOption;
    }

+    get isSponsoredSubscription(): boolean {
+        return this.sub.subscription?.items.some(i => i.sponsoredSubscriptionItem);
+    }
+
    get canDownloadLicense() {
        return (this.sub.planType !== PlanType.Free && this.subscription == null) ||
            (this.subscription != null && !this.subscription.cancelled);
    }

    get subscriptionDesc() {
-        if (this.sub.maxAutoscaleSeats === this.sub.seats && this.sub.seats != null) {
+        if (this.sub.planType === PlanType.Free) {
+            return this.i18nService.t('subscriptionFreePlan', this.sub.seats.toString());
+        } else if (this.sub.planType === PlanType.FamiliesAnnually || this.sub.planType === PlanType.FamiliesAnnually2019) {
+            if (this.isSponsoredSubscription) {
+                return this.i18nService.t('subscriptionSponsoredFamiliesPlan', this.sub.seats.toString());
+            } else {
+                return this.i18nService.t('subscriptionFamiliesPlan', this.sub.seats.toString());
+            }
+        } else if (this.sub.maxAutoscaleSeats === this.sub.seats && this.sub.seats != null) {
            return this.i18nService.t('subscriptionMaxReached', this.sub.seats.toString());
        } else if (this.sub.maxAutoscaleSeats == null) {
            return this.i18nService.t('subscriptionUserSeatsUnlimitedAutoscale');
@@ -229,4 +254,8 @@ export class OrganizationSubscriptionComponent implements OnInit {
            return this.i18nService.t('subscriptionUserSeatsLimitedAutoscale', this.sub.maxAutoscaleSeats.toString());
        }
    }
+
+    get showChangePlanButton() {
+        return this.subscription == null && this.sub.planType === PlanType.Free && !this.showChangePlan;
+    }
 }
--- a/src/app/organizations/sponsorships/families-for-enterprise-setup.component.html
+++ b/src/app/organizations/sponsorships/families-for-enterprise-setup.component.html
@@ -0,0 +1,36 @@
+<div class="container page-content">
+    <div class="page-header">
+        <h1>{{'sponsoredFamiliesOffer' | i18n}}</h1>
+    </div>
+    <div *ngIf="loading" class="mt-5 d-flex justify-content-center">
+                <i class="fa fa-spinner fa-spin fa-2x text-muted" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+                <span class="sr-only">{{'loading' | i18n}}</span>
+    </div>
+    <div *ngIf="!loading && badToken" class="mt-5 d-flex justify-content-center">
+        <span>{{'badToken' | i18n}}</span>
+    </div>
+    <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="!loading && !badToken">
+        <p>
+            <span>{{'acceptBitwardenFamiliesHelp' | i18n}}</span>
+        </p>
+        <div class="form-group col-6">
+            <label for="availableSponsorshipOrg">{{ 'sponsoredFamiliesSelectOffer' | i18n}}</label>
+            <select id="availableSponsorshipOrg" name="Available Sponsorship Organization"
+                [(ngModel)]="selectedFamilyOrganizationId" class="form-control" required>
+                <option value="" disabled>-- {{'select' | i18n}} --</option>
+                <option value="createNew">{{'newFamiliesOrganization' | i18n}}</option>
+                <option *ngFor="let o of existingFamilyOrganizations" [ngValue]="o.id">{{o.name}}</option>
+            </select>
+        </div>
+        <div *ngIf="showNewOrganization" class="col-12">
+            <app-organization-plans></app-organization-plans>
+        </div>
+        <div class="form-group col-6" *ngIf="!showNewOrganization">
+            <button class="btn btn-primary mt-2 btn-submit" [disabled]="form.loading" type="submit">
+                <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+                <span>{{'acceptOffer' | i18n}}</span>
+            </button>
+        </div>
+    </form>
+</div>
+<ng-template #deleteOrganizationTemplate></ng-template>
--- a/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts
+++ b/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts
@@ -0,0 +1,149 @@
+import {
+    Component,
+    OnInit,
+    ViewChild,
+    ViewContainerRef,
+} from '@angular/core';
+import {
+    ActivatedRoute,
+    Router,
+} from '@angular/router';
+import {
+    Toast,
+    ToasterService,
+} from 'angular2-toaster';
+
+import { first } from 'rxjs/operators';
+
+import { ModalService } from 'jslib-angular/services/modal.service';
+import { ValidationService } from 'jslib-angular/services/validation.service';
+
+import { ApiService } from 'jslib-common/abstractions/api.service';
+import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { SyncService } from 'jslib-common/abstractions/sync.service';
+import { UserService } from 'jslib-common/abstractions/user.service';
+
+import { PlanSponsorshipType } from 'jslib-common/enums/planSponsorshipType';
+import { PlanType } from 'jslib-common/enums/planType';
+import { ProductType } from 'jslib-common/enums/productType';
+
+import { Organization } from 'jslib-common/models/domain/organization';
+
+import { OrganizationSponsorshipRedeemRequest } from 'jslib-common/models/request/organization/organizationSponsorshipRedeemRequest';
+
+import { DeleteOrganizationComponent } from 'src/app/organizations/settings/delete-organization.component';
+
+import { OrganizationPlansComponent } from 'src/app/settings/organization-plans.component';
+
+@Component({
+    selector: 'families-for-enterprise-setup',
+    templateUrl: 'families-for-enterprise-setup.component.html',
+})
+export class FamiliesForEnterpriseSetupComponent implements OnInit {
+    @ViewChild(OrganizationPlansComponent, { static: false })
+    set organizationPlansComponent(value: OrganizationPlansComponent) {
+        if (!value) {
+            return;
+        }
+
+        value.plan = PlanType.FamiliesAnnually;
+        value.product = ProductType.Families;
+        value.acceptingSponsorship = true;
+        value.onSuccess.subscribe(this.onOrganizationCreateSuccess.bind(this));
+    }
+
+    @ViewChild('deleteOrganizationTemplate', { read: ViewContainerRef, static: true }) deleteModalRef: ViewContainerRef;
+
+    loading = true;
+    badToken = false;
+    formPromise: Promise<any>;
+
+    token: string;
+    existingFamilyOrganizations: Organization[];
+
+    showNewOrganization: boolean = false;
+    _organizationPlansComponent: OrganizationPlansComponent;
+    _selectedFamilyOrganizationId: string = '';
+
+    constructor(private router: Router, private toasterService: ToasterService,
+        private i18nService: I18nService, private route: ActivatedRoute,
+        private apiService: ApiService, private syncService: SyncService,
+        private validationService: ValidationService, private userService: UserService,
+        private modalService: ModalService) { }
+
+    async ngOnInit() {
+        document.body.classList.remove('layout_frontend');
+        this.route.queryParams.pipe(first()).subscribe(async qParams => {
+            const error = qParams.token == null;
+            if (error) {
+                const toast: Toast = {
+                    type: 'error',
+                    title: null,
+                    body: this.i18nService.t('sponsoredFamiliesAcceptFailed'),
+                    timeout: 10000,
+                };
+                this.toasterService.popAsync(toast);
+                this.router.navigate(['/']);
+                return;
+            }
+
+            this.token = qParams.token;
+
+            await this.syncService.fullSync(true);
+            this.badToken = !await this.apiService.postPreValidateSponsorshipToken(this.token);
+            this.loading = false;
+
+            this.existingFamilyOrganizations = (await this.userService.getAllOrganizations())
+                .filter(o => o.planProductType === ProductType.Families);
+
+            if (this.existingFamilyOrganizations.length === 0) {
+                this.selectedFamilyOrganizationId = 'createNew';
+            }
+        });
+    }
+
+    async submit() {
+        this.formPromise = this.doSubmit(this._selectedFamilyOrganizationId);
+        await this.formPromise;
+        this.formPromise = null;
+    }
+
+    get selectedFamilyOrganizationId() {
+        return this._selectedFamilyOrganizationId;
+    }
+
+    set selectedFamilyOrganizationId(value: string) {
+        this._selectedFamilyOrganizationId = value;
+        this.showNewOrganization = value === 'createNew';
+    }
+
+    private async doSubmit(organizationId: string) {
+        try {
+            const request = new OrganizationSponsorshipRedeemRequest();
+            request.planSponsorshipType = PlanSponsorshipType.FamiliesForEnterprise;
+            request.sponsoredOrganizationId = organizationId;
+
+            await this.apiService.postRedeemSponsorship(this.token, request);
+            this.toasterService.popAsync('success', null, this.i18nService.t('sponsoredFamiliesOfferRedeemed'));
+            await this.syncService.fullSync(true);
+
+            this.router.navigate(['/']);
+        } catch (e) {
+            if (this.showNewOrganization) {
+                await this.modalService.openViewRef(DeleteOrganizationComponent, this.deleteModalRef, comp => {
+                    comp.organizationId = organizationId;
+                    comp.descriptionKey = 'orgCreatedSponsorshipInvalid';
+                    comp.onSuccess.subscribe(() => {
+                        this.router.navigate(['/']);
+                    });
+                });
+            }
+            this.validationService.showError(this.i18nService.t('sponsorshipTokenHasExpired'));
+        }
+    }
+
+    private async onOrganizationCreateSuccess(value: any) {
+        // Use newly created organization id
+        await this.doSubmit(value.organizationId);
+    }
+}
--- a/src/app/organizations/tools/export.component.ts
+++ b/src/app/organizations/tools/export.component.ts
@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { FormBuilder } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';

 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
@@ -8,6 +9,7 @@ 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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { ExportComponent as BaseExportComponent } from '../../tools/export.component';

@@ -19,9 +21,9 @@ export class ExportComponent extends BaseExportComponent {
    constructor(cryptoService: CryptoService, i18nService: I18nService,
        platformUtilsService: PlatformUtilsService, exportService: ExportService,
        eventService: EventService, private route: ActivatedRoute, policyService: PolicyService,
-        logService: LogService) {
+        logService: LogService, userVerificationService: UserVerificationService, fb: FormBuilder) {
        super(cryptoService, i18nService, platformUtilsService, exportService, eventService, policyService,
-            logService);
+            logService, userVerificationService, fb);
    }

    async ngOnInit() {
--- a/src/app/organizations/vault/add-edit.component.ts
+++ b/src/app/organizations/vault/add-edit.component.ts
@@ -10,6 +10,7 @@ import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
+import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
@@ -38,10 +39,11 @@ export class AddEditComponent extends BaseAddEditComponent {
        userService: UserService, collectionService: CollectionService,
        totpService: TotpService, passwordGenerationService: PasswordGenerationService,
        private apiService: ApiService, messagingService: MessagingService,
-        eventService: EventService, policyService: PolicyService, logService: LogService) {
+        eventService: EventService, policyService: PolicyService, logService: LogService,
+        passwordRepromptService: PasswordRepromptService) {
        super(cipherService, folderService, i18nService, platformUtilsService, auditService, stateService,
            userService, collectionService, totpService, passwordGenerationService, messagingService,
-            eventService, policyService, logService);
+            eventService, policyService, passwordRepromptService, logService);
    }

    protected allowOwnershipAssignment() {
--- a/src/app/oss-routing.module.ts
+++ b/src/app/oss-routing.module.ts
@@ -16,6 +16,7 @@ import { LoginComponent } from './accounts/login.component';
 import { RecoverDeleteComponent } from './accounts/recover-delete.component';
 import { RecoverTwoFactorComponent } from './accounts/recover-two-factor.component';
 import { RegisterComponent } from './accounts/register.component';
+import { RemovePasswordComponent } from './accounts/remove-password.component';
 import { SetPasswordComponent } from './accounts/set-password.component';
 import { SsoComponent } from './accounts/sso.component';
 import { TwoFactorComponent } from './accounts/two-factor.component';
@@ -38,6 +39,7 @@ import {
    TwoFactorSetupComponent as OrgTwoFactorSetupComponent,
 } from './organizations/settings/two-factor-setup.component';

+import { FamiliesForEnterpriseSetupComponent } from './organizations/sponsorships/families-for-enterprise-setup.component';
 import { ExportComponent as OrgExportComponent } from './organizations/tools/export.component';
 import {
    ExposedPasswordsReportComponent as OrgExposedPasswordsReportComponent,
@@ -97,6 +99,7 @@ import { Permissions } from 'jslib-common/enums/permissions';

 import { EmergencyAccessViewComponent } from './settings/emergency-access-view.component';
 import { EmergencyAccessComponent } from './settings/emergency-access.component';
+import { SponsoredFamiliesComponent } from './settings/sponsored-families.component';

 const routes: Routes = [
    {
@@ -170,6 +173,12 @@ const routes: Routes = [
                canActivate: [AuthGuardService],
                data: { titleId: 'updateTempPassword' },
            },
+            {
+                path: 'remove-password',
+                component: RemovePasswordComponent,
+                canActivate: [AuthGuardService],
+                data: { titleId: 'removeMasterPassword' },
+            },
        ],
    },
    {
@@ -216,6 +225,11 @@ const routes: Routes = [
                            },
                        ],
                    },
+                    {
+                        path: 'sponsored-families',
+                        component: SponsoredFamiliesComponent,
+                        data: { titleId: 'sponsoredFamilies' },
+                    },
                ],
            },
            {
@@ -259,6 +273,7 @@ const routes: Routes = [
                    },
                ],
            },
+            { path: 'setup/families-for-enterprise', component: FamiliesForEnterpriseSetupComponent },
        ],
    },
    {
--- a/src/app/oss.module.ts
+++ b/src/app/oss.module.ts
@@ -29,6 +29,7 @@ import { LoginComponent } from './accounts/login.component';
 import { RecoverDeleteComponent } from './accounts/recover-delete.component';
 import { RecoverTwoFactorComponent } from './accounts/recover-two-factor.component';
 import { RegisterComponent } from './accounts/register.component';
+import { RemovePasswordComponent } from './accounts/remove-password.component';
 import { SetPasswordComponent } from './accounts/set-password.component';
 import { SsoComponent } from './accounts/sso.component';
 import { TwoFactorOptionsComponent } from './accounts/two-factor-options.component';
@@ -89,6 +90,7 @@ import {
    WeakPasswordsReportComponent as OrgWeakPasswordsReportComponent,
 } from './organizations/tools/weak-passwords-report.component';

+import { FamiliesForEnterpriseSetupComponent } from './organizations/sponsorships/families-for-enterprise-setup.component';
 import { AddEditComponent as OrgAddEditComponent } from './organizations/vault/add-edit.component';
 import { AttachmentsComponent as OrgAttachmentsComponent } from './organizations/vault/attachments.component';
 import { CiphersComponent as OrgCiphersComponent } from './organizations/vault/ciphers.component';
@@ -129,6 +131,8 @@ import { PremiumComponent } from './settings/premium.component';
 import { ProfileComponent } from './settings/profile.component';
 import { PurgeVaultComponent } from './settings/purge-vault.component';
 import { SettingsComponent } from './settings/settings.component';
+import { SponsoredFamiliesComponent } from './settings/sponsored-families.component';
+import { SponsoringOrgRowComponent } from './settings/sponsoring-org-row.component';
 import { TaxInfoComponent } from './settings/tax-info.component';
 import { TwoFactorAuthenticatorComponent } from './settings/two-factor-authenticator.component';
 import { TwoFactorDuoComponent } from './settings/two-factor-duo.component';
@@ -177,6 +181,7 @@ import { ProvidersComponent } from './providers/providers.component';
 import { AvatarComponent } from 'jslib-angular/components/avatar.component';
 import { CalloutComponent } from 'jslib-angular/components/callout.component';
 import { IconComponent } from 'jslib-angular/components/icon.component';
+import { VerifyMasterPasswordComponent } from 'jslib-angular/components/verify-master-password.component';

 import { A11yTitleDirective } from 'jslib-angular/directives/a11y-title.directive';
 import { ApiActionDirective } from 'jslib-angular/directives/api-action.directive';
@@ -303,6 +308,7 @@ registerLocaleData(localeZhTw, 'zh-TW');
        SetPasswordComponent,
        AddCreditComponent,
        AddEditComponent,
+        AddEditCustomFieldsComponent,
        AdjustPaymentComponent,
        AdjustSubscription,
        AdjustStorageComponent,
@@ -343,6 +349,7 @@ registerLocaleData(localeZhTw, 'zh-TW');
        ExportComponent,
        ExposedPasswordsReportComponent,
        FallbackSrcDirective,
+        FamiliesForEnterpriseSetupComponent,
        FolderAddEditComponent,
        FooterComponent,
        FrontendLayoutComponent,
@@ -419,6 +426,8 @@ registerLocaleData(localeZhTw, 'zh-TW');
        SendComponent,
        SettingsComponent,
        ShareComponent,
+        SponsoredFamiliesComponent,
+        SponsoringOrgRowComponent,
        SsoComponent,
        StopClickDirective,
        StopPropDirective,
@@ -460,6 +469,8 @@ registerLocaleData(localeZhTw, 'zh-TW');
        ResetPasswordPolicyComponent,
        VaultTimeoutInputComponent,
        AddEditCustomFieldsComponent,
+        VerifyMasterPasswordComponent,
+        RemovePasswordComponent,
    ],
    exports: [
        A11yTitleDirective,
--- a/src/app/send/add-edit.component.html
+++ b/src/app/send/add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="sendAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="sendAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate
            autocomplete="off">
--- a/src/app/services/event.service.ts
+++ b/src/app/services/event.service.ts
@@ -74,6 +74,9 @@ export class EventService {
            case EventType.User_UpdatedTempPassword:
                msg = humanReadableMsg = this.i18nService.t('updatedMasterPassword');
                break;
+            case EventType.User_MigratedKeyToKeyConnector:
+                msg = humanReadableMsg = this.i18nService.t('migratedKeyConnector');
+                break;
            // Cipher
            case EventType.Cipher_Created:
                msg = this.i18nService.t('createdItemId', this.formatCipherId(ev, options));
@@ -210,6 +213,10 @@ export class EventService {
                msg = this.i18nService.t('eventResetSsoLink', this.formatOrgUserId(ev));
                humanReadableMsg = this.i18nService.t('eventResetSsoLink', this.getShortId(ev.organizationUserId));
                break;
+            case EventType.OrganizationUser_FirstSsoLogin:
+                msg = this.i18nService.t('firstSsoLogin', this.formatOrgUserId(ev));
+                humanReadableMsg = this.i18nService.t('firstSsoLogin', this.getShortId(ev.organizationUserId));
+                break;
            // Org
            case EventType.Organization_Updated:
                msg = humanReadableMsg = this.i18nService.t('editedOrgSettings');
@@ -225,6 +232,18 @@ export class EventService {
            case EventType.Organization_VaultAccessed:
                msg = humanReadableMsg = this.i18nService.t('vaultAccessedByProvider');
                break;
+            case EventType.Organization_EnabledSso:
+                msg = humanReadableMsg = this.i18nService.t('enabledSso');
+                break;
+            case EventType.Organization_DisabledSso:
+                msg = humanReadableMsg = this.i18nService.t('disabledSso');
+                break;
+            case EventType.Organization_EnabledKeyConnector:
+                msg = humanReadableMsg = this.i18nService.t('enabledKeyConnector');
+                break;
+            case EventType.Organization_DisabledKeyConnector:
+                msg = humanReadableMsg = this.i18nService.t('disabledKeyConnector');
+                break;
            // Policies
            case EventType.Policy_Updated:
                msg = this.i18nService.t('modifiedPolicyId', this.formatPolicyId(ev));
--- a/src/app/services/services.module.ts
+++ b/src/app/services/services.module.ts
@@ -42,6 +42,7 @@ import { ExportService } from 'jslib-common/services/export.service';
 import { FileUploadService } from 'jslib-common/services/fileUpload.service';
 import { FolderService } from 'jslib-common/services/folder.service';
 import { ImportService } from 'jslib-common/services/import.service';
+import { KeyConnectorService } from 'jslib-common/services/keyConnector.service';
 import { NotificationsService } from 'jslib-common/services/notifications.service';
 import { PasswordGenerationService } from 'jslib-common/services/passwordGeneration.service';
 import { PolicyService } from 'jslib-common/services/policy.service';
@@ -53,6 +54,7 @@ import { SyncService } from 'jslib-common/services/sync.service';
 import { TokenService } from 'jslib-common/services/token.service';
 import { TotpService } from 'jslib-common/services/totp.service';
 import { UserService } from 'jslib-common/services/user.service';
+import { UserVerificationService } from 'jslib-common/services/userVerification.service';
 import { VaultTimeoutService } from 'jslib-common/services/vaultTimeout.service';
 import { WebCryptoFunctionService } from 'jslib-common/services/webCryptoFunction.service';

@@ -70,6 +72,7 @@ import { FileUploadService as FileUploadServiceAbstraction }  from 'jslib-common
 import { FolderService as FolderServiceAbstraction } from 'jslib-common/abstractions/folder.service';
 import { I18nService as I18nServiceAbstraction } from 'jslib-common/abstractions/i18n.service';
 import { ImportService as ImportServiceAbstraction } from 'jslib-common/abstractions/import.service';
+import { KeyConnectorService as KeyConnectorServiceAbstraction } from 'jslib-common/abstractions/keyConnector.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService as MessagingServiceAbstraction } from 'jslib-common/abstractions/messaging.service';
 import { NotificationsService as NotificationsServiceAbstraction } from 'jslib-common/abstractions/notifications.service';
@@ -88,6 +91,7 @@ import { SyncService as SyncServiceAbstraction } from 'jslib-common/abstractions
 import { TokenService as TokenServiceAbstraction } from 'jslib-common/abstractions/token.service';
 import { TotpService as TotpServiceAbstraction } from 'jslib-common/abstractions/totp.service';
 import { UserService as UserServiceAbstraction } from 'jslib-common/abstractions/user.service';
+import { UserVerificationService as UserVerificationServiceAbstraction } from 'jslib-common/abstractions/userVerification.service';
 import { VaultTimeoutService as VaultTimeoutServiceAbstraction } from 'jslib-common/abstractions/vaultTimeout.service';
 import { ModalService } from './modal.service';

@@ -124,18 +128,21 @@ searchService = new SearchService(cipherService, consoleLogService, i18nService)
 const policyService = new PolicyService(userService, storageService, apiService);
 const sendService = new SendService(cryptoService, userService, apiService, fileUploadService, storageService,
    i18nService, cryptoFunctionService);
+const keyConnectorService = new KeyConnectorService(storageService, userService, cryptoService, apiService,
+    tokenService, consoleLogService);
 const vaultTimeoutService = new VaultTimeoutService(cipherService, folderService, collectionService,
    cryptoService, platformUtilsService, storageService, messagingService, searchService, userService, tokenService,
-    policyService, null, async () => messagingService.send('logout', { expired: false }));
+    policyService, keyConnectorService, null, async () => messagingService.send('logout', { expired: false }));
 const syncService = new SyncService(userService, apiService, settingsService,
    folderService, cipherService, cryptoService, collectionService, storageService, messagingService, policyService,
-    sendService, consoleLogService, async (expired: boolean) => messagingService.send('logout', { expired: expired }));
+    sendService, consoleLogService, tokenService, keyConnectorService,
+    async (expired: boolean) => messagingService.send('logout', { expired: expired }));
 const passwordGenerationService = new PasswordGenerationService(cryptoService, storageService, policyService);
 const totpService = new TotpService(storageService, cryptoFunctionService, consoleLogService);
 const containerService = new ContainerService(cryptoService);
 const authService = new AuthService(cryptoService, apiService,
    userService, tokenService, appIdService, i18nService, platformUtilsService, messagingService, vaultTimeoutService,
-    consoleLogService);
+    consoleLogService, cryptoFunctionService, environmentService, keyConnectorService);
 const exportService = new ExportService(folderService, cipherService, apiService, cryptoService);
 const importService = new ImportService(cipherService, folderService, apiService, i18nService, collectionService,
    platformUtilsService, cryptoService);
@@ -143,6 +150,7 @@ const notificationsService = new NotificationsService(userService, syncService,
    environmentService, async () => messagingService.send('logout', { expired: true }), consoleLogService);
 const auditService = new AuditService(cryptoFunctionService, apiService);
 const eventLoggingService = new EventLoggingService(storageService, apiService, userService, cipherService, consoleLogService);
+const userVerificationService = new UserVerificationService(cryptoService, i18nService, apiService);

 containerService.attachToWindow(window);

@@ -226,6 +234,8 @@ export function initFactory(): Function {
        { provide: EventLoggingServiceAbstraction, useValue: eventLoggingService },
        { provide: PolicyServiceAbstraction, useValue: policyService },
        { provide: SendServiceAbstraction, useValue: sendService },
+        { provide: KeyConnectorServiceAbstraction, useValue: keyConnectorService },
+        { provide: UserVerificationServiceAbstraction, useValue: userVerificationService },
        { provide: PasswordRepromptServiceAbstraction, useClass: PasswordRepromptService },
        { provide: LogService, useValue: consoleLogService },
        {
--- a/src/app/settings/account.component.html
+++ b/src/app/settings/account.component.html
@@ -2,18 +2,24 @@
    <h1>{{'myAccount' | i18n}}</h1>
 </div>
 <app-profile></app-profile>
-<div class="secondary-header">
-    <h1>{{'changeEmail' | i18n}}</h1>
-</div>
-<app-change-email></app-change-email>
-<div class="secondary-header">
-    <h1>{{'changeMasterPassword' | i18n}}</h1>
-</div>
-<app-change-password></app-change-password>
-<div class="secondary-header">
-    <h1>{{'encKeySettings' | i18n}}</h1>
-</div>
-<app-change-kdf></app-change-kdf>
+<ng-container *ngIf="showChangeEmail">
+    <div class="secondary-header">
+        <h1>{{'changeEmail' | i18n}}</h1>
+    </div>
+    <app-change-email></app-change-email>
+</ng-container>
+<ng-container *ngIf="showChangePassword">
+    <div class="secondary-header">
+        <h1>{{'changeMasterPassword' | i18n}}</h1>
+    </div>
+    <app-change-password></app-change-password>
+</ng-container>
+<ng-container *ngIf="showChangeKdf">
+    <div class="secondary-header">
+        <h1>{{'encKeySettings' | i18n}}</h1>
+    </div>
+    <app-change-kdf></app-change-kdf>
+</ng-container>
 <div class="secondary-header border-0 mb-0">
    <h1>{{'apiKey' | i18n}}</h1>
 </div>
--- a/src/app/settings/account.component.ts
+++ b/src/app/settings/account.component.ts
@@ -10,6 +10,7 @@ import { DeleteAccountComponent } from './delete-account.component';
 import { PurgeVaultComponent } from './purge-vault.component';

 import { ApiService } from 'jslib-common/abstractions/api.service';
+import { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
 import { UserService } from 'jslib-common/abstractions/user.service';

 import { ModalService } from 'jslib-angular/services/modal.service';
@@ -25,8 +26,17 @@ export class AccountComponent {
    @ViewChild('viewUserApiKeyTemplate', { read: ViewContainerRef, static: true }) viewUserApiKeyModalRef: ViewContainerRef;
    @ViewChild('rotateUserApiKeyTemplate', { read: ViewContainerRef, static: true }) rotateUserApiKeyModalRef: ViewContainerRef;

+    showChangePassword = true;
+    showChangeKdf = true;
+    showChangeEmail = true;
+
    constructor(private modalService: ModalService, private apiService: ApiService,
-        private userService: UserService) { }
+        private userService: UserService, private keyConnectorService: KeyConnectorService) { }
+
+    async ngOnInit() {
+        this.showChangeEmail = this.showChangeKdf = this.showChangePassword =
+            !await this.keyConnectorService.getUsesKeyConnector();
+    }

    async deauthorizeSessions() {
        await this.modalService.openViewRef(DeauthorizeSessionsComponent, this.deauthModalRef);
--- a/src/app/settings/api-key.component.html
+++ b/src/app/settings/api-key.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="apiKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="apiKeyTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
@@ -9,11 +9,9 @@
            </div>
            <div class="modal-body">
                <p>{{apiKeyDescription | i18n}}</p>
-                <ng-container *ngIf="!clientSecret">
-                    <label for="masterPassword">{{'masterPass' | i18n}}</label>
-                    <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-                        [(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
-                </ng-container>
+                <app-verify-master-password [(ngModel)]="masterPassword" ngDefaultControl name="secret" *ngIf="!clientSecret">
+                </app-verify-master-password>
+
                <app-callout type="warning" *ngIf="clientSecret">{{apiKeyWarning | i18n}}</app-callout>
                <app-callout type="info" title="{{'oauth2ClientCredentials' | i18n}}" icon="fa-key"
                    *ngIf="clientSecret">
--- a/src/app/settings/api-key.component.ts
+++ b/src/app/settings/api-key.component.ts
@@ -1,15 +1,14 @@
 import { Component } from '@angular/core';

-import { ToasterService } from 'angular2-toaster';
-
-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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { SecretVerificationRequest } from 'jslib-common/models/request/secretVerificationRequest';

 import { ApiKeyResponse } from 'jslib-common/models/response/apiKeyResponse';

+import { Verification } from 'jslib-common/types/verification';
+
@Component({
    selector: 'app-api-key',
    templateUrl: 'api-key.component.html',
@@ -17,7 +16,7 @@ import { ApiKeyResponse } from 'jslib-common/models/response/apiKeyResponse';
 export class ApiKeyComponent {
    keyType: string;
    isRotation: boolean;
-    postKey: (entityId: string, request: PasswordVerificationRequest) => Promise<ApiKeyResponse>;
+    postKey: (entityId: string, request: SecretVerificationRequest) => Promise<ApiKeyResponse>;
    entityId: string;
    scope: string;
    grantType: string;
@@ -25,25 +24,17 @@ export class ApiKeyComponent {
    apiKeyWarning: string;
    apiKeyDescription: string;

-    masterPassword: string;
+    masterPassword: Verification;
    formPromise: Promise<ApiKeyResponse>;
    clientId: string;
    clientSecret: string;

-    constructor(private i18nService: I18nService, private toasterService: ToasterService,
-        private cryptoService: CryptoService, private logService: LogService) { }
+    constructor(private userVerificationService: UserVerificationService, private logService: LogService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, null);
        try {
-            this.formPromise = this.postKey(this.entityId, request);
+            this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
+                .then(request => this.postKey(this.entityId, request));
            const response = await this.formPromise;
            this.clientSecret = response.apiKey;
            this.clientId = `${this.keyType}.${this.entityId}`;
--- a/src/app/settings/deauthorize-sessions.component.html
+++ b/src/app/settings/deauthorize-sessions.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deAuthTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deAuthTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
@@ -10,9 +10,8 @@
            <div class="modal-body">
                <p>{{'deauthorizeSessionsDesc' | i18n}}</p>
                <app-callout type="warning">{{'deauthorizeSessionsWarning' | i18n}}</app-callout>
-                <label for="masterPassword">{{'masterPass' | i18n}}</label>
-                <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-                    [(ngModel)]="masterPassword" required appAutoFocus appInputVerbatim>
+                <app-verify-master-password [(ngModel)]="masterPassword" ngDefaultControl name="secret">
+                </app-verify-master-password>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">
--- a/src/app/settings/deauthorize-sessions.component.ts
+++ b/src/app/settings/deauthorize-sessions.component.ts
@@ -3,36 +3,29 @@ import { Component } from '@angular/core';
 import { ToasterService } from 'angular2-toaster';

 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 { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { Verification } from 'jslib-common/types/verification';

@Component({
    selector: 'app-deauthorize-sessions',
    templateUrl: 'deauthorize-sessions.component.html',
 })
 export class DeauthorizeSessionsComponent {
-    masterPassword: string;
+    masterPassword: Verification;
    formPromise: Promise<any>;

    constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
        private messagingService: MessagingService, private logService: LogService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, null);
        try {
-            this.formPromise = this.apiService.postSecurityStamp(request);
+            this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
+                .then(request => this.apiService.postSecurityStamp(request));
            await this.formPromise;
            this.toasterService.popAsync('success', this.i18nService.t('sessionsDeauthorized'),
                this.i18nService.t('logBackIn'));
--- a/src/app/settings/delete-account.component.html
+++ b/src/app/settings/delete-account.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deleteAccountTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deleteAccountTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
@@ -10,9 +10,8 @@
            <div class="modal-body">
                <p>{{'deleteAccountDesc' | i18n}}</p>
                <app-callout type="warning">{{'deleteAccountWarning' | i18n}}</app-callout>
-                <label for="masterPassword">{{'masterPass' | i18n}}</label>
-                <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-                    [(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
+                <app-verify-master-password [(ngModel)]="masterPassword" ngDefaultControl name="secret">
+                </app-verify-master-password>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">
--- a/src/app/settings/delete-account.component.ts
+++ b/src/app/settings/delete-account.component.ts
@@ -3,36 +3,29 @@ import { Component } from '@angular/core';
 import { ToasterService } from 'angular2-toaster';

 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 { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { Verification } from 'jslib-common/types/verification';

@Component({
    selector: 'app-delete-account',
    templateUrl: 'delete-account.component.html',
 })
 export class DeleteAccountComponent {
-    masterPassword: string;
+    masterPassword: Verification;
    formPromise: Promise<any>;

    constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
        private messagingService: MessagingService, private logService: LogService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, null);
        try {
-            this.formPromise = this.apiService.deleteAccount(request);
+            this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
+                .then(request => this.apiService.deleteAccount(request));
            await this.formPromise;
            this.toasterService.popAsync('success', this.i18nService.t('accountDeleted'),
                this.i18nService.t('accountDeletedDesc'));
--- a/src/app/settings/emergency-access-add-edit.component.html
+++ b/src/app/settings/emergency-access-add-edit.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/settings/emergency-access-confirm.component.html
+++ b/src/app/settings/emergency-access-confirm.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
            <div class="modal-header">
--- a/src/app/settings/emergency-access-takeover.component.html
+++ b/src/app/settings/emergency-access-takeover.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
    <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/settings/emergency-add-edit.component.ts
+++ b/src/app/settings/emergency-add-edit.component.ts
@@ -9,6 +9,7 @@ import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
+import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
@@ -33,10 +34,10 @@ export class EmergencyAddEditComponent extends BaseAddEditComponent {
        userService: UserService, collectionService: CollectionService,
        totpService: TotpService, passwordGenerationService: PasswordGenerationService,
        messagingService: MessagingService, eventService: EventService, policyService: PolicyService,
-        logService: LogService) {
+        logService: LogService, passwordRepromptService: PasswordRepromptService) {
        super(cipherService, folderService, i18nService, platformUtilsService, auditService, stateService,
            userService, collectionService, totpService, passwordGenerationService, messagingService,
-            eventService, policyService, logService);
+            eventService, policyService, passwordRepromptService, logService);
    }

    async load() {
--- a/src/app/settings/organization-plans.component.html
+++ b/src/app/settings/organization-plans.component.html
@@ -36,7 +36,7 @@
            <small class="text-muted">{{'clientOwnerDesc' | i18n : '20'}}</small>
        </div>
    </div>
-    <div *ngIf="!providerId">
+    <div *ngIf="!providerId && !acceptingSponsorship">
        <div class="form-group form-check">
            <input id="ownedBusiness" class="form-check-input" type="checkbox" name="OwnedBusiness"
                [(ngModel)]="ownedBusiness" (change)="changedOwnedBusiness()">
@@ -92,7 +92,7 @@
                </small>
            </ng-template>
            <span *ngIf="selectableProduct.product != productTypes.Free">
-                <ng-container *ngIf="selectableProduct.basePrice">
+                <ng-container *ngIf="selectableProduct.basePrice && !acceptingSponsorship">
                    {{selectableProduct.basePrice / 12 | currency:'$'}} /{{'month' | i18n}},
                    {{'includesXUsers' | i18n : selectableProduct.baseSeats}}
                    <ng-container *ngIf="selectableProduct.hasAdditionalSeatsOption">
@@ -162,8 +162,14 @@
                        {{'basePrice' | i18n}}: {{ selectablePlan.basePrice / 12 | currency:'$'}} &times; 12
                        {{'monthAbbr' | i18n}}
                        =
-                        {{selectablePlan.basePrice | currency:'$'}}
-                        /{{'year' | i18n}}
+                        <ng-container *ngIf="acceptingSponsorship; else notAcceptingSponsorship">
+                            <span style="text-decoration: line-through;">{{selectablePlan.basePrice | currency:'$'}}</span>
+                            {{'freeWithSponsorship' | i18n}}
+                        </ng-container>
+                        <ng-template #notAcceptingSponsorship>
+                            {{selectablePlan.basePrice | currency:'$'}}
+                            /{{'year' | i18n}}
+                        </ng-template>
                    </small>
                    <small *ngIf="selectablePlan.hasAdditionalSeatsOption">
                        <span *ngIf="selectablePlan.baseSeats">{{'additionalUsers' | i18n}}:</span>
@@ -219,6 +225,9 @@
        <hr class="my-3">
        <h2 class="spaced-header mb-4">{{ (createOrganization ? 'paymentInformation' : 'billingInformation') | i18n}}
        </h2>
+        <small class="text-muted font-italic mb-3 d-block">
+            {{paymentDesc}}
+        </small>
        <app-payment *ngIf="createOrganization" [hideCredit]="true"></app-payment>
        <app-tax-info (onCountryChanged)="changedCountry()"></app-tax-info>
        <div id="price" class="my-4">
@@ -233,14 +242,6 @@
            <p class="text-lg"><strong>{{'total' | i18n}}:</strong>
                {{total | currency:'USD $'}}/{{selectedPlanInterval | i18n}}</p>
        </div>
-        <small class="text-muted font-italic" *ngIf="freeTrial && createOrganization; else paymentChargedImmediately">
-            {{'paymentChargedWithTrial' | i18n : (selectedPlanInterval | i18n) }}
-        </small>
-        <ng-template #paymentChargedImmediately>
-            <small class="text-muted font-italic mt-2 d-block">
-                {{'paymentCharged' | i18n : (selectedPlanInterval | i18n) }}
-            </small>
-        </ng-template>
        <ng-container *ngIf="!createOrganization">
            <app-payment [showMethods]="false"></app-payment>
        </ng-container>
--- a/src/app/settings/organization-plans.component.ts
+++ b/src/app/settings/organization-plans.component.ts
@@ -48,6 +48,7 @@ export class OrganizationPlansComponent implements OnInit {
    @Input() organizationId: string;
    @Input() showFree = true;
    @Input() showCancel = false;
+    @Input() acceptingSponsorship = false;
    @Input() product: ProductType = ProductType.Free;
    @Input() plan: PlanType = PlanType.Free;
    @Input() providerId: string;
@@ -67,7 +68,7 @@ export class OrganizationPlansComponent implements OnInit {
    productTypes = ProductType;
    formPromise: Promise<any>;
    singleOrgPolicyBlock: boolean = false;
-    freeTrial: boolean = false;
+    discount = 0;

    plans: PlanResponse[];

@@ -121,9 +122,17 @@ export class OrganizationPlansComponent implements OnInit {
        }

        validPlans = validPlans
-            .filter(plan => !plan.legacyYear
-                && !plan.disabled
-                && (plan.isAnnual || plan.product === this.productTypes.Free));
+        .filter(plan => !plan.legacyYear
+            && !plan.disabled
+            && (plan.isAnnual || plan.product === this.productTypes.Free));
+
+        if (this.acceptingSponsorship) {
+            const familyPlan = this.plans.find(plan => plan.type === PlanType.FamiliesAnnually);
+            this.discount = familyPlan.basePrice;
+            validPlans = [
+                familyPlan,
+            ];
+        }

        return validPlans;
    }
@@ -173,7 +182,11 @@ export class OrganizationPlansComponent implements OnInit {
        if (this.selectedPlan.hasPremiumAccessOption && this.premiumAccessAddon) {
            subTotal += this.selectedPlan.premiumAccessOptionPrice;
        }
-        return subTotal;
+        return subTotal - this.discount;
+    }
+
+    get freeTrial() {
+        return this.selectedPlan.trialPeriodDays != null;
    }

    get taxCharges() {
@@ -186,6 +199,16 @@ export class OrganizationPlansComponent implements OnInit {
        return (this.subtotal + this.taxCharges) || 0;
    }

+    get paymentDesc() {
+        if (this.acceptingSponsorship) {
+            return this.i18nService.t('paymentSponsored');
+        } else if (this.freeTrial && this.createOrganization) {
+            return this.i18nService.t('paymentChargedWithTrial');
+        } else {
+            return this.i18nService.t('paymentCharged', this.i18nService.t(this.selectedPlanInterval));
+        }
+    }
+
    changedProduct() {
        this.plan = this.selectablePlans[0].type;
        if (!this.selectedPlan.hasPremiumAccessOption) {
@@ -200,7 +223,6 @@ export class OrganizationPlansComponent implements OnInit {
            this.selectedPlan.hasAdditionalSeatsOption) {
            this.additionalSeats = 1;
        }
-        this.freeTrial = this.selectedPlan.trialPeriodDays != null;
    }

    changedOwnedBusiness() {
@@ -233,7 +255,7 @@ export class OrganizationPlansComponent implements OnInit {
        }

        try {
-            const doSubmit = async () => {
+            const doSubmit = async (): Promise<string> => {
                let orgId: string = null;
                if (this.createOrganization) {
                    const shareKey = await this.cryptoService.makeShareKey();
@@ -257,12 +279,16 @@ export class OrganizationPlansComponent implements OnInit {

                await this.apiService.refreshIdentityToken();
                await this.syncService.fullSync(true);
-                this.router.navigate(['/organizations/' + orgId]);
+                if (!this.acceptingSponsorship) {
+                    this.router.navigate(['/organizations/' + orgId]);
+                }
+
+                return orgId;
            };

            this.formPromise = doSubmit();
-            await this.formPromise;
-            this.onSuccess.emit();
+            const orgId = await this.formPromise;
+            this.onSuccess.emit({ organizationId: orgId });
        } catch (e) {
            this.logService.error(e);
        }
--- a/src/app/settings/profile.component.html
+++ b/src/app/settings/profile.component.html
@@ -13,7 +13,7 @@
                <label for="email">{{'email' | i18n}}</label>
                <input id="email" class="form-control" type="text" name="Email" [(ngModel)]="profile.email" readonly>
            </div>
-            <div class="form-group">
+            <div class="form-group" *ngIf="!hidePasswordHint">
                <label for="masterPasswordHint">{{'masterPassHintLabel' | i18n}}</label>
                <input id="masterPasswordHint" class="form-control" type="text" name="MasterPasswordHint"
                    [(ngModel)]="profile.masterPasswordHint">
--- a/src/app/settings/profile.component.ts
+++ b/src/app/settings/profile.component.ts
@@ -8,6 +8,7 @@ import { ToasterService } from 'angular2-toaster';
 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 { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { UserService } from 'jslib-common/abstractions/user.service';

@@ -23,12 +24,14 @@ export class ProfileComponent implements OnInit {
    loading = true;
    profile: ProfileResponse;
    fingerprint: string;
+    hidePasswordHint = false;

    formPromise: Promise<any>;

    constructor(private apiService: ApiService, private i18nService: I18nService,
        private toasterService: ToasterService, private userService: UserService,
-        private cryptoService: CryptoService, private logService: LogService) { }
+        private cryptoService: CryptoService, private logService: LogService,
+        private keyConnectorService: KeyConnectorService) { }

    async ngOnInit() {
        this.profile = await this.apiService.getProfile();
@@ -37,6 +40,7 @@ export class ProfileComponent implements OnInit {
        if (fingerprint != null) {
            this.fingerprint = fingerprint.join('-');
        }
+        this.hidePasswordHint = await this.keyConnectorService.getUsesKeyConnector();
    }

    async submit() {
--- a/src/app/settings/purge-vault.component.html
+++ b/src/app/settings/purge-vault.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="purgeVaultTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="purgeVaultTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
@@ -10,9 +10,8 @@
            <div class="modal-body">
                <p>{{(organizationId ? 'purgeOrgVaultDesc' : 'purgeVaultDesc') | i18n}}</p>
                <app-callout type="warning">{{'purgeVaultWarning' | i18n}}</app-callout>
-                <label for="masterPassword">{{'masterPass' | i18n}}</label>
-                <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-                    [(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
+                <app-verify-master-password [(ngModel)]="masterPassword" ngDefaultControl name="secret">
+                </app-verify-master-password>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">
--- a/src/app/settings/purge-vault.component.ts
+++ b/src/app/settings/purge-vault.component.ts
@@ -7,11 +7,11 @@ import { Router } from '@angular/router';
 import { ToasterService } from 'angular2-toaster';

 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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { Verification } from 'jslib-common/types/verification';

@Component({
    selector: 'app-purge-vault',
@@ -20,24 +20,17 @@ import { PasswordVerificationRequest } from 'jslib-common/models/request/passwor
 export class PurgeVaultComponent {
    @Input() organizationId?: string = null;

-    masterPassword: string;
+    masterPassword: Verification;
    formPromise: Promise<any>;

    constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
        private router: Router, private logService: LogService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, null);
        try {
-            this.formPromise = this.apiService.postPurgeCiphers(request, this.organizationId);
+            this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
+                .then(request => this.apiService.postPurgeCiphers(request, this.organizationId));
            await this.formPromise;
            this.toasterService.popAsync('success', null, this.i18nService.t('vaultPurged'));
            if (this.organizationId != null) {
--- a/src/app/settings/settings.component.html
+++ b/src/app/settings/settings.component.html
@@ -31,6 +31,9 @@
                    <a routerLink="emergency-access" class="list-group-item" routerLinkActive="active">
                        {{'emergencyAccess' | i18n}}
                    </a>
+                    <a routerLink="sponsored-families" class="list-group-item" routerLinkActive="active" *ngIf="hasFamilySponsorshipAvailable">
+                        {{'sponsoredFamilies' | i18n}}
+                    </a>
                </div>
            </div>
        </div>
--- a/src/app/settings/settings.component.ts
+++ b/src/app/settings/settings.component.ts
@@ -7,6 +7,7 @@ import {

 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { TokenService } from 'jslib-common/abstractions/token.service';
+import { UserService } from 'jslib-common/abstractions/user.service';

 import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';

@@ -19,9 +20,11 @@ const BroadcasterSubscriptionId = 'SettingsComponent';
 export class SettingsComponent implements OnInit, OnDestroy {
    premium: boolean;
    selfHosted: boolean;
+    hasFamilySponsorshipAvailable: boolean;

    constructor(private tokenService: TokenService, private broadcasterService: BroadcasterService,
-        private ngZone: NgZone, private platformUtilsService: PlatformUtilsService) { }
+        private ngZone: NgZone, private platformUtilsService: PlatformUtilsService,
+        private userService: UserService) { }

    async ngOnInit() {
        this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => {
@@ -45,5 +48,6 @@ export class SettingsComponent implements OnInit, OnDestroy {

    async load() {
        this.premium = await this.tokenService.getPremium();
+        this.hasFamilySponsorshipAvailable = await this.userService.canManageSponsorships();
    }
 }
--- a/src/app/settings/sponsored-families.component.html
+++ b/src/app/settings/sponsored-families.component.html
@@ -0,0 +1,57 @@
+<div class="page-header">
+    <h1>{{'sponsoredFamilies' | i18n}}</h1>
+</div>
+<ng-container *ngIf="loading">
+    <i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
+    <span class="sr-only">{{'loading' | i18n}}</span>
+</ng-container>
+<ng-container *ngIf="!loading">
+    <p>
+        {{'sponsoredFamiliesEligible' | i18n}}
+    </p>
+    <div>
+        {{'sponsoredFamiliesInclude' | i18n}}:
+        <ul class="inset-list">
+            <li>{{'sponsoredFamiliesPremiumAccess' | i18n}}</li>
+            <li>{{'sponsoredFamiliesSharedCollections' | i18n}}</li>
+        </ul>
+    </div>
+    <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="anyOrgsAvailable">
+        <div *ngIf="moreThanOneOrgAvailable" class="form-group col-7">
+            <label for="availableSponsorshipOrg">{{ 'familiesSponsoringOrgSelect' | i18n}}</label>
+            <select id="availableSponsorshipOrg" name="Available Sponsorship Organization"
+                [(ngModel)]="selectedSponsorshipOrgId" class="form-control" required>
+                <option value="">-- {{'select' | i18n}} --</option>
+                <option *ngFor="let o of availableSponsorshipOrgs" [ngValue]="o.id">{{o.name}}</option>
+            </select>
+        </div>
+        <div class="form-group col-7">
+            <label for="accountEmail">{{'sponsoredFamiliesEmail' | i18n}}:</label>
+            <input id="accountEmail" class="form-control" inputmode="email" [(ngModel)]="sponsorshipEmail"
+                name="sponsorshipEmail" required>
+            <button class="btn btn-primary btn-submit mt-4" type="submit" [disabled]="form.loading">
+                <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+                <span>{{'redeem' | i18n}}</span>
+            </button>
+        </div>
+    </form>
+    <ng-container *ngIf="anyActiveSponsorships">
+        <div class="border-bottom">
+            <table class="table table-hover table-list">
+                <thead>
+                    <tr>
+                        <th>{{'recipient' | i18n}}</th>
+                        <th>{{'sponsoringOrg' | i18n}}</th>
+                        <th></th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <ng-container *ngFor="let o of activeSponsorshipOrgs">
+                        <tr sponsoring-org-row [sponsoringOrg]="o" (sponsorshipRemoved)="load(true)"></tr>
+                    </ng-container>
+                </tbody>
+            </table>
+        </div>
+        <small>{{'sponsoredFamiliesLeaveCopy' | i18n}}</small>
+    </ng-container>
+</ng-container>
--- a/src/app/settings/sponsored-families.component.ts
+++ b/src/app/settings/sponsored-families.component.ts
@@ -0,0 +1,88 @@
+import {
+    Component,
+    OnInit,
+} from '@angular/core';
+import { ToasterService } from 'angular2-toaster';
+import { ApiService } from 'jslib-common/abstractions/api.service';
+import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { SyncService } from 'jslib-common/abstractions/sync.service';
+import { UserService } from 'jslib-common/abstractions/user.service';
+import { PlanSponsorshipType } from 'jslib-common/enums/planSponsorshipType';
+import { Organization } from 'jslib-common/models/domain/organization';
+
+@Component({
+    selector: 'app-sponsored-families',
+    templateUrl: 'sponsored-families.component.html',
+})
+export class SponsoredFamiliesComponent implements OnInit {
+    loading = false;
+
+    availableSponsorshipOrgs: Organization[] = [];
+    activeSponsorshipOrgs: Organization[] = [];
+    selectedSponsorshipOrgId: string = '';
+    sponsorshipEmail: string = '';
+
+    // Conditional display properties
+    formPromise: Promise<any>;
+
+    constructor(private userService: UserService, private apiService: ApiService,
+        private i18nService: I18nService, private toasterService: ToasterService,
+        private syncService: SyncService) { }
+
+    async ngOnInit() {
+        await this.load();
+    }
+
+    async submit() {
+        this.formPromise = this.apiService.postCreateSponsorship(this.selectedSponsorshipOrgId, {
+            sponsoredEmail: this.sponsorshipEmail,
+            planSponsorshipType: PlanSponsorshipType.FamiliesForEnterprise,
+            friendlyName: this.sponsorshipEmail,
+        });
+
+        await this.formPromise;
+        this.toasterService.popAsync('success', null, this.i18nService.t('sponsorshipCreated'));
+        this.formPromise = null;
+        this.resetForm();
+        await this.load(true);
+    }
+
+    async load(forceReload: boolean = false) {
+        if (this.loading) {
+            return;
+        }
+
+        this.loading = true;
+        if (forceReload) {
+            await this.syncService.fullSync(true);
+        }
+
+        const allOrgs = await this.userService.getAllOrganizations();
+        this.availableSponsorshipOrgs = allOrgs.filter(org => org.familySponsorshipAvailable);
+
+        this.activeSponsorshipOrgs = allOrgs.filter(org => org.familySponsorshipFriendlyName !== null);
+
+        if (this.availableSponsorshipOrgs.length === 1) {
+            this.selectedSponsorshipOrgId = this.availableSponsorshipOrgs[0].id;
+        }
+        this.loading = false;
+    }
+
+
+    private async resetForm() {
+        this.sponsorshipEmail = '';
+        this.selectedSponsorshipOrgId = '';
+    }
+
+    get anyActiveSponsorships(): boolean {
+        return this.activeSponsorshipOrgs.length > 0;
+    }
+
+    get anyOrgsAvailable(): boolean {
+        return this.availableSponsorshipOrgs.length > 0;
+    }
+
+    get moreThanOneOrgAvailable(): boolean {
+        return this.availableSponsorshipOrgs.length > 1;
+    }
+}
--- a/src/app/settings/sponsoring-org-row.component.html
+++ b/src/app/settings/sponsoring-org-row.component.html
@@ -0,0 +1,26 @@
+<td>
+    {{sponsoringOrg.familySponsorshipFriendlyName}}
+</td>
+<td>{{sponsoringOrg.name}}</td>
+<td class="table-action-right">
+    <div class="dropdown" appListDropdown>
+        <button class="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton"
+            data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" appA11yTitle="{{'options' | i18n}}">
+            <i class="fa fa-cog fa-lg" aria-hidden="true"></i>
+        </button>
+        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
+            <button #resendEmailBtn [appApiAction]="resendEmailPromise" class="dropdown-item btn-submit"
+                [disabled]="resendEmailBtn.loading" (click)="resendEmail()"
+                [attr.aria-label]="'resendEmailLabel' | i18n : sponsoringOrg.familySponsorshipFriendlyName">
+                <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+                <span>{{'resendEmail' | i18n }}</span>
+            </button>
+            <button #revokeSponsorshipBtn [appApiAction]="revokeSponsorshipPromise" class="dropdown-item text-danger btn-submit"
+                [disabled]="revokeSponsorshipBtn.loading" (click)="revokeSponsorship()"
+                [attr.aria-label]="'revokeAccount' | i18n : sponsoringOrg.familySponsorshipFriendlyName">
+                <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true"></i>
+                <span>{{'remove' | i18n}}</span>
+            </button>
+        </div>
+    </div>
+</td>
--- a/src/app/settings/sponsoring-org-row.component.ts
+++ b/src/app/settings/sponsoring-org-row.component.ts
@@ -0,0 +1,63 @@
+import {
+    Component,
+    EventEmitter,
+    Input,
+    Output,
+} from '@angular/core';
+import { ToasterService } from 'angular2-toaster';
+import { ApiService } from 'jslib-common/abstractions/api.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 { Organization } from 'jslib-common/models/domain/organization';
+
+@Component({
+    selector: '[sponsoring-org-row]',
+    templateUrl: 'sponsoring-org-row.component.html',
+})
+export class SponsoringOrgRowComponent {
+    @Input() sponsoringOrg: Organization = null;
+
+    @Output() sponsorshipRemoved = new EventEmitter();
+
+    revokeSponsorshipPromise: Promise<any>;
+    resendEmailPromise: Promise<any>;
+
+    constructor(private toasterService: ToasterService, private apiService: ApiService,
+        private i18nService: I18nService, private logService: LogService,
+        private platformUtilsService: PlatformUtilsService) { }
+
+    async revokeSponsorship() {
+        try {
+            this.revokeSponsorshipPromise = this.doRevokeSponsorship();
+            await this.revokeSponsorshipPromise;
+        } catch (e) {
+            this.logService.error(e);
+        }
+
+        this.revokeSponsorshipPromise = null;
+    }
+
+    async resendEmail() {
+        this.resendEmailPromise = this.apiService.postResendSponsorshipOffer(this.sponsoringOrg.id);
+        await this.resendEmailPromise;
+        this.toasterService.popAsync('success', null, this.i18nService.t('emailSent'));
+        this.resendEmailPromise = null;
+    }
+
+    private async doRevokeSponsorship() {
+        const isConfirmed = await this.platformUtilsService.showDialog(
+            this.i18nService.t('revokeSponsorshipConfirmation'),
+            `${this.i18nService.t('remove')} ${this.sponsoringOrg.familySponsorshipFriendlyName}?`,
+            this.i18nService.t('remove'), this.i18nService.t('cancel'), 'warning');
+
+        if (!isConfirmed) {
+            return;
+        }
+
+        await this.apiService.deleteRevokeSponsorship(this.sponsoringOrg.id);
+        this.toasterService.popAsync('success', null, this.i18nService.t('reclaimedFreePlan'));
+        this.sponsorshipRemoved.emit();
+    }
+}
--- a/src/app/settings/two-factor-authenticator.component.html
+++ b/src/app/settings/two-factor-authenticator.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faAuthenticatorTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faAuthenticatorTitle">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-authenticator.component.ts
+++ b/src/app/settings/two-factor-authenticator.component.ts
@@ -11,6 +11,7 @@ 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 { UserService } from 'jslib-common/abstractions/user.service';
+import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { UpdateTwoFactorAuthenticatorRequest } from 'jslib-common/models/request/updateTwoFactorAuthenticatorRequest';
 import { TwoFactorAuthenticatorResponse } from 'jslib-common/models/response/twoFactorAuthenticatorResponse';
@@ -32,9 +33,10 @@ export class TwoFactorAuthenticatorComponent extends TwoFactorBaseComponent impl
    private qrScript: HTMLScriptElement;

    constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, private userService: UserService,
-        platformUtilsService: PlatformUtilsService, logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        toasterService: ToasterService, userVerificationService: UserVerificationService,
+        platformUtilsService: PlatformUtilsService, logService: LogService,
+        private userService: UserService) {
+        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
        this.qrScript = window.document.createElement('script');
        this.qrScript.src = 'scripts/qrious.min.js';
        this.qrScript.async = true;
@@ -61,9 +63,8 @@ export class TwoFactorAuthenticatorComponent extends TwoFactorBaseComponent impl
        }
    }

-    protected enable() {
-        const request = new UpdateTwoFactorAuthenticatorRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+    protected async enable() {
+        const request = await this.buildRequestModel(UpdateTwoFactorAuthenticatorRequest);
        request.token = this.token;
        request.key = this.key;

--- a/src/app/settings/two-factor-base.component.ts
+++ b/src/app/settings/two-factor-base.component.ts
@@ -10,8 +10,12 @@ import { ApiService } from 'jslib-common/abstractions/api.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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType';
+import { VerificationType } from 'jslib-common/enums/verificationType';
+
+import { SecretVerificationRequest } from 'jslib-common/models/request/secretVerificationRequest';
 import { TwoFactorProviderRequest } from 'jslib-common/models/request/twoFactorProviderRequest';

@Directive()
@@ -24,14 +28,16 @@ export abstract class TwoFactorBaseComponent {
    enabled = false;
    authed = false;

-    protected masterPasswordHash: string;
+    protected hashedSecret: string;
+    protected verificationType: VerificationType;

    constructor(protected apiService: ApiService, protected i18nService: I18nService,
        protected toasterService: ToasterService, protected platformUtilsService: PlatformUtilsService,
-        protected logService: LogService) { }
+        protected logService: LogService, protected userVerificationService: UserVerificationService) { }

    protected auth(authResponse: any) {
-        this.masterPasswordHash = authResponse.masterPasswordHash;
+        this.hashedSecret = authResponse.secret;
+        this.verificationType = authResponse.verificationType;
        this.authed = true;
    }

@@ -52,8 +58,7 @@ export abstract class TwoFactorBaseComponent {
        }

        try {
-            const request = new TwoFactorProviderRequest();
-            request.masterPasswordHash = this.masterPasswordHash;
+            const request = await this.buildRequestModel(TwoFactorProviderRequest);
            request.type = this.type;
            if (this.organizationId != null) {
                promise = this.apiService.putTwoFactorOrganizationDisable(this.organizationId, request);
@@ -68,4 +73,11 @@ export abstract class TwoFactorBaseComponent {
            this.logService.error(e);
        }
    }
+
+    protected async buildRequestModel<T extends SecretVerificationRequest>(requestClass: new() => T)  {
+        return this.userVerificationService.buildRequest({
+            secret: this.hashedSecret,
+            type: this.verificationType,
+        }, requestClass, true);
+    }
 }
--- a/src/app/settings/two-factor-duo.component.html
+++ b/src/app/settings/two-factor-duo.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faDuoTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faDuoTitle">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-duo.component.ts
+++ b/src/app/settings/two-factor-duo.component.ts
@@ -6,6 +6,7 @@ import { ApiService } from 'jslib-common/abstractions/api.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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType';
 import { UpdateTwoFactorDuoRequest } from 'jslib-common/models/request/updateTwoFactorDuoRequest';
@@ -26,8 +27,8 @@ export class TwoFactorDuoComponent extends TwoFactorBaseComponent {

    constructor(apiService: ApiService, i18nService: I18nService,
        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
-        logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        logService: LogService, userVerificationService: UserVerificationService) {
+        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
    }

    auth(authResponse: any) {
@@ -43,9 +44,8 @@ export class TwoFactorDuoComponent extends TwoFactorBaseComponent {
        }
    }

-    protected enable() {
-        const request = new UpdateTwoFactorDuoRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+    protected async enable() {
+        const request = await this.buildRequestModel(UpdateTwoFactorDuoRequest);
        request.integrationKey = this.ikey;
        request.secretKey = this.skey;
        request.host = this.host;
--- a/src/app/settings/two-factor-email.component.html
+++ b/src/app/settings/two-factor-email.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faEmailTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faEmailTitle">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-email.component.ts
+++ b/src/app/settings/two-factor-email.component.ts
@@ -7,6 +7,7 @@ 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 { UserService } from 'jslib-common/abstractions/user.service';
+import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { TwoFactorEmailRequest } from 'jslib-common/models/request/twoFactorEmailRequest';

@@ -30,8 +31,9 @@ export class TwoFactorEmailComponent extends TwoFactorBaseComponent {

    constructor(apiService: ApiService, i18nService: I18nService,
        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
-        private userService: UserService, logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        logService: LogService, userVerificationService: UserVerificationService,
+        private userService: UserService) {
+        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
    }

    auth(authResponse: any) {
@@ -49,7 +51,8 @@ export class TwoFactorEmailComponent extends TwoFactorBaseComponent {

    async sendEmail() {
        try {
-            const request = new TwoFactorEmailRequest(this.email, this.masterPasswordHash);
+            const request = await this.buildRequestModel(TwoFactorEmailRequest);
+            request.email = this.email;
            this.emailPromise = this.apiService.postTwoFactorEmailSetup(request);
            await this.emailPromise;
            this.sentEmail = this.email;
@@ -58,9 +61,8 @@ export class TwoFactorEmailComponent extends TwoFactorBaseComponent {
        }
    }

-    protected enable() {
-        const request = new UpdateTwoFactorEmailRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+    protected async enable() {
+        const request = await this.buildRequestModel(UpdateTwoFactorEmailRequest);
        request.email = this.email;
        request.token = this.token;

--- a/src/app/settings/two-factor-recovery.component.html
+++ b/src/app/settings/two-factor-recovery.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faRecoveryTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faRecoveryTitle">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-verify.component.html
+++ b/src/app/settings/two-factor-verify.component.html
@@ -1,9 +1,8 @@
 <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
    <div class="modal-body">
        <p>{{'twoStepLoginAuthDesc' | i18n}}</p>
-        <label for="masterPassword">{{'masterPass' | i18n}}</label>
-        <input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
-            [(ngModel)]="masterPassword" required appAutoFocus appInputVerbatim>
+        <app-verify-master-password [(ngModel)]="secret" ngDefaultControl name="secret">
+        </app-verify-master-password>
    </div>
    <div class="modal-footer">
        <button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
--- a/src/app/settings/two-factor-verify.component.ts
+++ b/src/app/settings/two-factor-verify.component.ts
@@ -5,16 +5,26 @@ import {
    Output,
 } from '@angular/core';

-import { ToasterService } from 'angular2-toaster';
-
 import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType';
+import { VerificationType } from 'jslib-common/enums/verificationType';

 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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { Verification } from 'jslib-common/types/verification';
+
+import { TwoFactorAuthenticatorResponse } from 'jslib-common/models/response/twoFactorAuthenticatorResponse';
+import { TwoFactorDuoResponse } from 'jslib-common/models/response/twoFactorDuoResponse';
+import { TwoFactorEmailResponse } from 'jslib-common/models/response/twoFactorEmailResponse';
+import { TwoFactorRecoverResponse } from 'jslib-common/models/response/twoFactorRescoverResponse';
+import { TwoFactorWebAuthnResponse } from 'jslib-common/models/response/twoFactorWebAuthnResponse';
+import { TwoFactorYubiKeyResponse } from 'jslib-common/models/response/twoFactorYubiKeyResponse';
+
+import { SecretVerificationRequest } from 'jslib-common/models/request/secretVerificationRequest';
+
+type TwoFactorResponse = TwoFactorRecoverResponse | TwoFactorDuoResponse | TwoFactorEmailResponse |
+    TwoFactorWebAuthnResponse | TwoFactorAuthenticatorResponse | TwoFactorYubiKeyResponse;

@Component({
    selector: 'app-two-factor-verify',
@@ -25,60 +35,54 @@ export class TwoFactorVerifyComponent {
    @Input() organizationId: string;
    @Output() onAuthed = new EventEmitter<any>();

-    masterPassword: string;
-    formPromise: Promise<any>;
+    secret: Verification;
+    formPromise: Promise<TwoFactorResponse>;

-    private masterPasswordHash: string;
-
-    constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
-        private logService: LogService) { }
+    constructor(private apiService: ApiService, private logService: LogService,
+        private userVerificationService: UserVerificationService) { }

    async submit() {
-        if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
-                this.i18nService.t('masterPassRequired'));
-            return;
-        }
-
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = this.masterPasswordHash =
-            await this.cryptoService.hashPassword(this.masterPassword, null);
+        let hashedSecret: string;

        try {
-            switch (this.type) {
-                case -1:
-                    this.formPromise = this.apiService.getTwoFactorRecover(request);
-                    break;
-                case TwoFactorProviderType.Duo:
-                case TwoFactorProviderType.OrganizationDuo:
-                    if (this.organizationId != null) {
-                        this.formPromise = this.apiService.getTwoFactorOrganizationDuo(this.organizationId, request);
-                    } else {
-                        this.formPromise = this.apiService.getTwoFactorDuo(request);
-                    }
-                    break;
-                case TwoFactorProviderType.Email:
-                    this.formPromise = this.apiService.getTwoFactorEmail(request);
-                    break;
-                case TwoFactorProviderType.WebAuthn:
-                    this.formPromise = this.apiService.getTwoFactorWebAuthn(request);
-                    break;
-                case TwoFactorProviderType.Authenticator:
-                    this.formPromise = this.apiService.getTwoFactorAuthenticator(request);
-                    break;
-                case TwoFactorProviderType.Yubikey:
-                    this.formPromise = this.apiService.getTwoFactorYubiKey(request);
-                    break;
-            }
+            this.formPromise = this.userVerificationService.buildRequest(this.secret)
+                .then(request => {
+                    hashedSecret = this.secret.type === VerificationType.MasterPassword
+                        ? request.masterPasswordHash
+                        : request.otp;
+                    return this.apiCall(request);
+                });

            const response = await this.formPromise;
            this.onAuthed.emit({
                response: response,
-                masterPasswordHash: this.masterPasswordHash,
+                secret: hashedSecret,
+                verificationType: this.secret.type,
            });
        } catch (e) {
            this.logService.error(e);
        }
    }
+
+    private apiCall(request: SecretVerificationRequest): Promise<TwoFactorResponse> {
+        switch (this.type) {
+            case -1:
+                return this.apiService.getTwoFactorRecover(request);
+            case TwoFactorProviderType.Duo:
+            case TwoFactorProviderType.OrganizationDuo:
+                if (this.organizationId != null) {
+                    return this.apiService.getTwoFactorOrganizationDuo(this.organizationId, request);
+                } else {
+                    return this.apiService.getTwoFactorDuo(request);
+                }
+            case TwoFactorProviderType.Email:
+                return this.apiService.getTwoFactorEmail(request);
+            case TwoFactorProviderType.WebAuthn:
+                return this.apiService.getTwoFactorWebAuthn(request);
+            case TwoFactorProviderType.Authenticator:
+                return this.apiService.getTwoFactorAuthenticator(request);
+            case TwoFactorProviderType.Yubikey:
+                return this.apiService.getTwoFactorYubiKey(request);
+        }
+    }
 }
--- a/src/app/settings/two-factor-webauthn.component.html
+++ b/src/app/settings/two-factor-webauthn.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faU2fTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faU2fTitle">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-webauthn.component.ts
+++ b/src/app/settings/two-factor-webauthn.component.ts
@@ -9,10 +9,11 @@ import { ApiService } from 'jslib-common/abstractions/api.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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType';

-import { PasswordVerificationRequest } from 'jslib-common/models/request/passwordVerificationRequest';
+import { SecretVerificationRequest } from 'jslib-common/models/request/secretVerificationRequest';
 import { UpdateTwoFactorWebAuthnDeleteRequest } from 'jslib-common/models/request/updateTwoFactorWebAuthnDeleteRequest';
 import { UpdateTwoFactorWebAuthnRequest } from 'jslib-common/models/request/updateTwoFactorWebAuthnRequest';
 import {
@@ -40,8 +41,8 @@ export class TwoFactorWebAuthnComponent extends TwoFactorBaseComponent {

    constructor(apiService: ApiService, i18nService: I18nService,
        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
-        private ngZone: NgZone, logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        private ngZone: NgZone, logService: LogService, userVerificationService: UserVerificationService) {
+        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
    }

    auth(authResponse: any) {
@@ -49,13 +50,12 @@ export class TwoFactorWebAuthnComponent extends TwoFactorBaseComponent {
        this.processResponse(authResponse.response);
    }

-    submit() {
+    async submit() {
        if (this.webAuthnResponse == null || this.keyIdAvailable == null) {
            // Should never happen.
            return Promise.reject();
        }
-        const request = new UpdateTwoFactorWebAuthnRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+        const request = await this.buildRequestModel(UpdateTwoFactorWebAuthnRequest);
        request.deviceResponse = this.webAuthnResponse;
        request.id = this.keyIdAvailable;
        request.name = this.name;
@@ -82,9 +82,8 @@ export class TwoFactorWebAuthnComponent extends TwoFactorBaseComponent {
        if (!confirmed) {
            return;
        }
-        const request = new UpdateTwoFactorWebAuthnDeleteRequest();
+        const request = await this.buildRequestModel(UpdateTwoFactorWebAuthnDeleteRequest);
        request.id = key.id;
-        request.masterPasswordHash = this.masterPasswordHash;
        try {
            key.removePromise = this.apiService.deleteTwoFactorWebAuthn(request);
            const response = await key.removePromise;
@@ -99,8 +98,7 @@ export class TwoFactorWebAuthnComponent extends TwoFactorBaseComponent {
        if (this.keyIdAvailable == null) {
            return;
        }
-        const request = new PasswordVerificationRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+        const request = await this.buildRequestModel(SecretVerificationRequest);
        try {
            this.challengePromise = this.apiService.getTwoFactorWebAuthnChallenge(request);
            const challenge = await this.challengePromise;
--- a/src/app/settings/two-factor-yubikey.component.html
+++ b/src/app/settings/two-factor-yubikey.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faYubiKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faYubiKeyTitle">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
--- a/src/app/settings/two-factor-yubikey.component.ts
+++ b/src/app/settings/two-factor-yubikey.component.ts
@@ -6,6 +6,7 @@ import { ApiService } from 'jslib-common/abstractions/api.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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { UpdateTwoFactorYubioOtpRequest } from 'jslib-common/models/request/updateTwoFactorYubioOtpRequest';
 import { TwoFactorYubiKeyResponse } from 'jslib-common/models/response/twoFactorYubiKeyResponse';
@@ -28,8 +29,8 @@ export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent {

    constructor(apiService: ApiService, i18nService: I18nService,
        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
-        logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        logService: LogService, userVerificationService: UserVerificationService) {
+        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
    }

    auth(authResponse: any) {
@@ -37,9 +38,8 @@ export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent {
        this.processResponse(authResponse.response);
    }

-    submit() {
-        const request = new UpdateTwoFactorYubioOtpRequest();
-        request.masterPasswordHash = this.masterPasswordHash;
+    async submit() {
+        const request = await this.buildRequestModel(UpdateTwoFactorYubioOtpRequest);
        request.key1 = this.keys != null && this.keys.length > 0 ? this.keys[0].key : null;
        request.key2 = this.keys != null && this.keys.length > 1 ? this.keys[1].key : null;
        request.key3 = this.keys != null && this.keys.length > 2 ? this.keys[2].key : null;
--- a/src/app/settings/update-key.component.html
+++ b/src/app/settings/update-key.component.html
@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="updateEncKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="updateEncKeyTitle">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
            <div class="modal-header">
--- a/src/app/tools/export.component.html
+++ b/src/app/tools/export.component.html
@@ -1,4 +1,4 @@
-<form #form (ngSubmit)="submit()" ngNativeValidate [appApiAction]="formPromise">
+<form #form (ngSubmit)="submit()" ngNativeValidate [appApiAction]="formPromise" [formGroup]="exportForm">
    <div class="page-header">
        <h1>{{'exportVault' | i18n}}</h1>
    </div>
@@ -7,25 +7,21 @@
        {{'personalVaultExportPolicyInEffect' | i18n}}
    </app-callout>

-    <p>{{'exportMasterPassword' | i18n}}</p>
    <div class="row">
        <div class="form-group col-6">
            <label for="format">{{'fileFormat' | i18n}}</label>
-            <select class="form-control" id="format" name="Format" [(ngModel)]="format" [disabled]="disabledByPolicy">
-                <option value="json">.json</option>
-                <option value="csv">.csv</option>
-                <option value="encrypted_json">.json (Encrypted)</option>
+            <select class="form-control" id="format" name="Format" formControlName="format">
+                <option *ngFor="let f of formatOptions" [value]="f.value">{{f.name}}</option>
            </select>
        </div>
    </div>
    <div class="row">
        <div class="form-group col-6">
-            <label for="masterPassword">{{'masterPass' | i18n}}</label>
-            <input id="masterPassword" type="password" name="MasterPassword" class="form-control"
-                [(ngModel)]="masterPassword" required appInputVerbatim [disabled]="disabledByPolicy">
+            <app-verify-master-password ngDefaultControl formControlName="secret" name="secret">
+            </app-verify-master-password>
        </div>
    </div>
-    <button type="submit" class="btn btn-primary" [disabled]="form.loading || disabledByPolicy">
+    <button type="submit" class="btn btn-primary" [disabled]="form.loading || exportForm.disabled">
        <i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}" aria-hidden="true" *ngIf="form.loading"></i>
        <span *ngIf="!form.loading">{{'exportVault' | i18n}}</span>
    </button>
--- a/src/app/tools/export.component.ts
+++ b/src/app/tools/export.component.ts
@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { FormBuilder } from '@angular/forms';

 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { EventService } from 'jslib-common/abstractions/event.service';
@@ -7,6 +8,7 @@ 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 { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';

 import { ExportComponent as BaseExportComponent } from 'jslib-angular/components/export.component';

@@ -19,14 +21,14 @@ export class ExportComponent extends BaseExportComponent {

    constructor(cryptoService: CryptoService, i18nService: I18nService,
        platformUtilsService: PlatformUtilsService, exportService: ExportService,
-        eventService: EventService, policyService: PolicyService, logService: LogService) {
+        eventService: EventService, policyService: PolicyService, logService: LogService,
+        userVerificationService: UserVerificationService, fb: FormBuilder) {
        super(cryptoService, i18nService, platformUtilsService, exportService, eventService,
-            policyService, window, logService);
+            policyService, window, logService, userVerificationService, fb);
    }

    protected saved() {
        super.saved();
-        this.masterPassword = null;
        this.platformUtilsService.showToast('success', null, this.i18nService.t('exportSuccess'));
    }
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Vince Grassia	d10dc94a48	Remove old 'release' ref in workflow (#1328 ) (cherry picked from commit `75984a2e37`)	2021-12-07 22:52:00 -05:00
github-actions[bot]	c85051d6e2	Bumped version to 2.25.0 (#1327 ) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> (cherry picked from commit `1cba6dc3b9`)	2021-12-07 19:13:44 -08:00
Matt Gibson	778700f399	Fix families sponsorship redeem page (#1321 ) * Display sponsorship warning when sponsoring an org Move actions to drop down menu Fix revoke cancel success popup * Only show warning when sponsorship exists (cherry picked from commit `d9231ae3f3`)	2021-12-01 20:48:44 -05:00
Justin Baur	23048d46d6	Fix basePrice to reflect the sponsorship (#1311 ) * Fix basePrice to reflect the sponsorship * Ran linter * Add latest copy * Remove unneeded if * Fix times * Stopped hardcoding basePrice * Stopped hardcoding 40 in UI * Switch to single small block * Update jslib * Revert "Update jslib" This reverts commit `28534f2230`. * Revert "Remove unneeded if" This reverts commit `5540b19998`. * Fix revert issue (cherry picked from commit `4b856d9016`)	2021-11-24 15:12:49 -06:00
Matt Gibson	e54586c7d2	Update jslib	2021-11-24 15:48:20 -05:00
Matt Gibson	494fc4b194	Fix formatting and title of sponsoring org drop down (#1317 ) (cherry picked from commit `4029554658`)	2021-11-24 15:48:00 -05:00
Matt Gibson	48b9393a48	Add sponsorship pre validate to families redeem page (#1315 ) * Add sponsorship pre validate to families redeem page * Update messaging * update jslib (cherry picked from commit `6ec22a9408`)	2021-11-24 15:47:11 -05:00
Matt Gibson	b6b3184a7b	Force sponsorship friendly name to recipient address (#1316 ) (cherry picked from commit `9cc7dfb884`)	2021-11-24 15:46:45 -05:00
Matt Gibson	66be24a1f5	Display sponsored status for sponsored org subscription (#1312 ) * Display sponsored status for sponsored org subscription * Linter fixes (cherry picked from commit `f8c943c042`)	2021-11-24 15:46:23 -05:00
Matt Gibson	346052922e	Fix typo (#1310 )	2021-11-23 13:49:32 -06:00
Thomas Rittson	2973d06c9f	[Key Connector] Fix Key Connector Url test (#1308 )	2021-11-23 21:11:47 +10:00
Oscar Hinton	0490314cff	[KeyConnector] Updated remove warning in details view (#1309 )	2021-11-22 18:39:20 +01:00
Justin Baur	a6abb74810	Feature/families for enterprise (#1300 ) * Added manual routing * Families for enterprise/account settings (#1290) * Added sponsored families page * Revert "Added manual routing" This reverts commit `a970ba78ff`. * Add messages to page * Remove stages and simplify design * Switch to new figma design * Add screen reader * Add calls to server * Reorder methods * Used to organization filters * Connected page to server * Add preliminary text to subscription page * Sponsor existing family organization flow * Update jslib Co-authored-by: Matt Gibson <mgibson@bitwarden.com> * Add revoke sponsorship flow * Add spinner to send offer button * Determine if subscription has sponsored items * Work on subscription button * Add message for new family organization * Families for enterprise/subscription page (#1292) * Work on subscription button * Determine if subscription has sponsored items * Work on subscriptions page * Add message for new family organization Co-authored-by: Matt Gibson <mgibson@bitwarden.com> * Families for enterprise/redeem card (#1295) * Add toast localization message * Use helpers to property display sponsorship items * Split table rows into component so buttons load (#1296) * Split table rows into component so buttons load * Update jslib * Families for enterprise/localizations (#1299) * Add more localizations * Remove unneeded comments * Fix help article * Run linting * Do not show redeem button if no orgs exist to redeem * Implement new process for accepting sponsorships * Hide business checkbox * Update jslib * Removed commented code * Remove commented html * Cleaned up imports * Use proper message * Remove merge conflict message * Remove confusing comment * Listened to PR feedback * Remove unused property * Update help text * Fix aria labels * Add try catch * Made toast before emit * Minor copy changes * Update jslib * Remove unneeded loading Co-authored-by: Matt Gibson <mgibson@bitwarden.com>	2021-11-22 08:41:40 -05:00
Oscar Hinton	0ce00a15e7	Update warning when removing an account using key connector (#1307 )	2021-11-19 15:13:55 +01:00
github-actions[bot]	cd90949d27	Autosync the updated translations (#1306 ) Co-authored-by: github-actions <>	2021-11-19 13:03:40 +01:00
Thomas Rittson	0d0eb609d3	[Key Connector] Test that Key Connector URL can be reached before saving (#1291 ) * Test that Key Connector URL can be reached before saving * Update jslib * Add styling to validation messages * Use inline button, fix styling * Add accessibility call out to form validation	2021-11-19 21:22:05 +10:00
Thomas Rittson	7c902e61d6	[Key Connector] Add firstSsoLogin event (#1305 ) * Add firstSsoLogin event * Update jslib	2021-11-19 06:01:28 +10:00
Oscar Hinton	1e5c2c35e5	Update verify password/otp component (#1303 )	2021-11-18 20:51:04 +01:00
Daniel James Smith	977fdef787	Use Mql.addListener for backwards compat (Safari < v14) (#1304 )	2021-11-18 19:03:20 +01:00
Oscar Hinton	d6c419bad8	Disable key connector when org doesn't have the feature (#1301 )	2021-11-17 12:11:20 +01:00
Thomas Rittson	f740d8b057	Update jslib and use new UserVerificationService pattern (#1302 ) * Use try/catch pattern for userVerification * Update deps	2021-11-17 09:37:36 +10:00
github-actions[bot]	8889722388	Autosync the updated translations (#1298 ) Co-authored-by: github-actions <>	2021-11-15 10:59:18 -05:00
Thomas Rittson	01503f137d	Update jslib (#1297 )	2021-11-12 09:20:28 +10:00
Oscar Hinton	6171aa89a8	Add required KeyConnectorService to vaultTimeoutService (#1294 )	2021-11-11 14:37:16 +01:00
Thomas Rittson	40c37143e0	Fix linting in connectors (#1293 )	2021-11-11 13:35:35 +10:00
Vince Grassia	57031e7752	Version bump (#1288 )	2021-11-10 14:59:54 -05:00
Oscar Hinton	db5a8df64e	[KeyConnector] Add support for key connector OTP (#1256 ) Co-authored-by: Thomas Rittson <trittson@bitwarden.com>	2021-11-09 19:24:26 +01:00
github-actions[bot]	e5eb5d61fe	Autosync the updated translations (#1278 ) Co-authored-by: github-actions <>	2021-11-09 12:50:32 -05:00
Kyle Spearrin	9061af54bf	limit duo connector hosts to duo-owned domains (#1283 )	2021-11-09 12:17:30 -05:00
Kyle Spearrin	83fed7d66f	sanitize data inputs for captcha connector (#1284 )	2021-11-09 12:16:10 -05:00
Kyle Spearrin	f8aea1e861	don't use innerHTML for sso handOffMessage (#1285 )	2021-11-09 12:15:58 -05:00
Kyle Spearrin	5b6fb16591	remove callbackUri input for fixed mobile uri (#1282 )	2021-11-09 11:36:41 -05:00
Justin Baur	278cf2ca40	Fix free trial text to show at the right time (#1281 )	2021-11-08 13:14:57 -05:00
Vince Grassia	fe15de02e5	Change release workflow to only allow releases from rc or hotfix branches (#1279 )	2021-11-08 09:48:53 -05:00
Justin Baur	b164a39abc	Update payment info (#1274 ) * Added manual routing * Add additional copy for free trial * Revert * Fix formatting * Switch text to be on the top of the payment info * Update to put text at top of the screen	2021-11-05 14:59:45 -04:00
Joseph Flinn	e5f77e2c4e	Hotfix Crowdin push (#1276 ) * trying a fix for the Crowdin source destination * adding the dest file extension * removing testing code	2021-11-04 14:47:39 -07:00
Joseph Flinn	cf460096af	Rework Crowdin Integration (#1275 ) * Updating the Crowdin push process * removing the test code in the check-failures job * Adding a scheduled trigger to the crowdin-pull workflow * switching the crowdin pull schedule to Friday instead of Saturday * fixing a indentation issue	2021-11-04 11:15:29 -07:00
Robyn MacCallum	1403ecfa6f	Minor dark mode fixes (#1273 ) * Fix badge colors and nav bar color * Make input background transparent in dark mode * fix badge colors * remove extra space	2021-11-04 08:35:51 -04:00
Thomas Rittson	8b60d50050	[Linked fields] Add Linked Field as custom field type (#1206 ) * Add linked fields * Update to use Field.linkedId * Update jslib	2021-11-04 07:41:04 +10:00
Matt Gibson	cf5823fe71	Fix repeat ng insert on safari (#1270 )	2021-11-01 16:14:31 -05:00
Matt Gibson	bb0b5f2d87	Show upgrade plan button for free orgs. (#1269 ) * Show upgrade plan button for free orgs. * Add families plan callout for subscription upgrade	2021-11-01 14:29:46 -05:00
Robyn MacCallum	2700caf2a8	Fix jumbo sized WebAuthn logo (#1251 ) * Fix jumbo sized WebAuthn logo * Fix styling on 2FA modals * Fix so that text does not go below image * Rearrange items in modal and add new icons * make spacing a little wider * Remove 1 from mfaTypes, we now have both versions Co-authored-by: Thomas Rittson <trittson@bitwarden.com>	2021-10-28 08:20:37 -04:00
Joseph Flinn	523b18156c	Adding fixes from last night's release (#1263 )	2021-10-27 13:08:37 -07:00
Matt Gibson	7219b394a0	update jslib (#1265 ) * update jslib * update jslib	2021-10-27 13:47:51 -05:00
Matt Gibson	383c29c761	Null Check subscription prior to use (#1264 )	2021-10-27 10:03:41 -05:00
Robyn MacCallum	b5231425fb	Use useAlertRole input added to app-callout (#1254 ) * Use enforceAlert input added to app-callout to still give alerts for screen readers on important callouts * Update input variable name * Add brackets to pass value correctly	2021-10-27 08:25:06 -04:00
Thomas Rittson	7cb48e3a81	Add PR template (#1260 )	2021-10-27 19:01:32 +10:00
Thomas Rittson	664d10cd06	Add Safari importer (#1261 ) * Add instructions for Safari import * Update jslib	2021-10-27 18:58:15 +10:00
github-actions[bot]	a6a34788a8	Autosync the updated translations (#1259 ) Co-authored-by: github-actions <>	2021-10-26 15:10:10 -07:00
Joseph Flinn	381ec7af67	enabling the new release branch to push its docker images (#1258 )	2021-10-26 14:20:28 -07:00
Joseph Flinn	8be377c7f8	Version Bump 2.24.0 (#1257 )	2021-10-26 13:47:39 -07:00
Oscar Hinton	c46ca2f9e2	Crypto Agent (#1243 )	2021-10-26 01:14:16 +02:00
Matt Gibson	6d4f163824	Update local web development instructions (#1208 ) * Indicate production with NODE_ENV * Use local.json config to point to Bitwarden production APIs * Add proxy configuration to cloud and qa environment * Move notifications to urls Co-authored-by: Hinton <oscar@oscarhinton.com>	2021-10-22 07:50:08 -05:00
Thomas Rittson	6c581b3ebc	Fixes for dynamic modal a11y (#1237 ) * Remove tabindex from modal component templates * Remove tabindex from modal component templates * Update jslib	2021-10-22 07:30:25 +10:00
Joseph Flinn	618f950cae	Change release branch constraints (#1248 ) * updating the release branch constraints * updating the self host docker image build and release with the new release branch * renaming the release job for selfhost docker release * removing unneeded line * removing the master branch release ci code execution * updating some verbiage	2021-10-21 10:31:41 -07:00