Merge branch 'main' into vault/ac-2555/collection-dialog-fixes

.storybook/main.ts

@@ -4,6 +4,7 @@ import remarkGfm from "remark-gfm";
 
 const config: StorybookConfig = {
  stories: [
+ "../libs/auth/src/**/*.mdx",
  "../libs/auth/src/**/*.stories.@(js|jsx|ts|tsx)",
  "../libs/components/src/**/*.mdx",
  "../libs/components/src/**/*.stories.@(js|jsx|ts|tsx)",

apps/web/src/app/admin-console/organizations/reporting/reports-home.component.ts

@@ -23,8 +23,8 @@ export class ReportsHomeComponent implements OnInit {
  ngOnInit() {
  this.homepage$ = this.router.events.pipe(
  filter((event) => event instanceof NavigationEnd),
- map((event) => (event as NavigationEnd).urlAfterRedirects.endsWith("/reports")),
- startWith(true),
+ map((event) => this.isReportsHomepageRouteUrl((event as NavigationEnd).urlAfterRedirects)),
+ startWith(this.isReportsHomepageRouteUrl(this.router.url)),
  );
 
  this.reports$ = this.route.params.pipe(
@@ -61,4 +61,8 @@ export class ReportsHomeComponent implements OnInit {
  },
  ];
  }
+
+ private isReportsHomepageRouteUrl(url: string): boolean {
+ return url.endsWith("/reports");
+ }
 }

apps/web/src/app/auth/anon-layout-wrapper.component.html

@@ -0,0 +1,4 @@
+<auth-anon-layout [title]="pageTitle" [subtitle]="pageSubtitle" [icon]="pageIcon">
+ <router-outlet></router-outlet>
+ <router-outlet slot="secondary" name="secondary"></router-outlet>
+</auth-anon-layout>

apps/web/src/app/auth/anon-layout-wrapper.component.ts

@@ -0,0 +1,34 @@
+import { Component, OnDestroy, OnInit } from "@angular/core";
+import { ActivatedRoute, RouterModule } from "@angular/router";
+
+import { AnonLayoutComponent } from "@bitwarden/auth/angular";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { Icon } from "@bitwarden/components";
+
+@Component({
+ standalone: true,
+ templateUrl: "anon-layout-wrapper.component.html",
+ imports: [AnonLayoutComponent, RouterModule],
+})
+export class AnonLayoutWrapperComponent implements OnInit, OnDestroy {
+ protected pageTitle: string;
+ protected pageSubtitle: string;
+ protected pageIcon: Icon;
+
+ constructor(
+ private route: ActivatedRoute,
+ private i18nService: I18nService,
+ ) {
+ this.pageTitle = this.i18nService.t(this.route.snapshot.firstChild.data["pageTitle"]);
+ this.pageSubtitle = this.i18nService.t(this.route.snapshot.firstChild.data["pageSubtitle"]);
+ this.pageIcon = this.route.snapshot.firstChild.data["pageIcon"]; // don't translate
+ }
+
+ ngOnInit() {
+ document.body.classList.add("layout_frontend");
+ }
+
+ ngOnDestroy() {
+ document.body.classList.remove("layout_frontend");
+ }
+}

apps/web/src/app/vault/components/vault-items/vault-collection-row.component.html

@@ -20,15 +20,23 @@
  bitLink
  [disabled]="disabled"
  type="button"
- class="tw-w-full tw-truncate tw-text-start tw-leading-snug"
+ class="tw-flex tw-w-full tw-text-start tw-leading-snug"
  linkType="secondary"
  title="{{ 'viewCollectionWithName' | i18n: collection.name }}"
  [routerLink]="[]"
  [queryParams]="{ collectionId: collection.id }"
  queryParamsHandling="merge"
  appStopProp
  >
- {{ collection.name }}
+ <span class="tw-truncate tw-mr-1">{{ collection.name }}</span>
+ <div>
+ <span
+ *ngIf="collection.addAccess && collection.id !== Unassigned"
+ bitBadge
+ variant="warning"
+ >{{ "addAccess" | i18n }}</span
+ >
+ </div>
  </button>
 </td>
 <td bitCell [ngClass]="RowHeightClass" *ngIf="showOwner">

apps/web/src/app/vault/components/vault-items/vault-collection-row.component.ts

@@ -21,6 +21,7 @@ import { RowHeightClass } from "./vault-items.component";
 })
 export class VaultCollectionRowComponent {
  protected RowHeightClass = RowHeightClass;
+ protected Unassigned = "unassigned";
 
  @Input() disabled: boolean;
  @Input() collection: CollectionView;

apps/web/src/app/vault/components/vault-items/vault-items.component.html

@@ -99,8 +99,12 @@
  (checkedToggled)="selection.toggle(item)"
  (onEvent)="event($event)"
  ></tr>
+ <!-- 
+ addAccessStatus check here so ciphers do not show if user 
+ has filtered for collections with addAccess 
+ -->
  <tr
- *ngIf="item.cipher"
+ *ngIf="item.cipher && (!addAccessToggle || (addAccessToggle && addAccessStatus !== 1))"
  bitRow
  appVaultCipherRow
  alignContent="middle"

apps/web/src/app/vault/components/vault-items/vault-items.component.ts

@@ -1,6 +1,7 @@
 import { SelectionModel } from "@angular/cdk/collections";
 import { Component, EventEmitter, Input, Output } from "@angular/core";
 
+import { OrganizationUserType } from "@bitwarden/common/admin-console/enums";
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
 import { CollectionView } from "@bitwarden/common/vault/models/view/collection.view";
@@ -45,6 +46,8 @@ export class VaultItemsComponent {
  @Input() showPermissionsColumn = false;
  @Input() viewingOrgVault: boolean;
  @Input({ required: true }) flexibleCollectionsV1Enabled = false;
+ @Input() addAccessStatus: number;
+ @Input() addAccessToggle: boolean;
 
  private _ciphers?: CipherView[] = [];
  @Input() get ciphers(): CipherView[] {
@@ -101,6 +104,28 @@ export class VaultItemsComponent {
  }
 
  const organization = this.allOrganizations.find((o) => o.id === collection.organizationId);
+
+ if (this.flexibleCollectionsV1Enabled) {
+ //Custom user without edit access should not see the Edit option unless that user has "Can Manage" access to a collection
+ if (
+ !collection.manage &&
+ organization?.type === OrganizationUserType.Custom &&
+ !organization?.permissions.editAnyCollection
+ ) {
+ return false;
+ }
+ //Owner/Admin and Custom Users with Edit can see Edit and Access of Orphaned Collections
+ if (
+ collection.addAccess &&
+ collection.id !== Unassigned &&
+ ((organization?.type === OrganizationUserType.Custom &&
+ organization?.permissions.editAnyCollection) ||
+ organization.isAdmin ||
+ organization.isOwner)
+ ) {
+ return true;
+ }
+ }
  return collection.canEdit(organization, this.flexibleCollectionsV1Enabled);
  }
 
@@ -111,6 +136,32 @@ export class VaultItemsComponent {
  }
 
  const organization = this.allOrganizations.find((o) => o.id === collection.organizationId);
+
+ if (this.flexibleCollectionsV1Enabled) {
+ //Custom user with only edit access should not see the Delete button for orphaned collections
+ if (
+ collection.addAccess &&
+ organization?.type === OrganizationUserType.Custom &&
+ !organization?.permissions.deleteAnyCollection &&
+ organization?.permissions.editAnyCollection
+ ) {
+ return false;
+ }
+
+ // Owner/Admin with no access to a collection will not see Delete
+ if (
+ !collection.assigned &&
+ !collection.addAccess &&
+ (organization.isAdmin || organization.isOwner) &&
+ !(
+ organization?.type === OrganizationUserType.Custom &&
+ organization?.permissions.deleteAnyCollection
+ )
+ ) {
+ return false;
+ }
+ }
+
  return collection.canDelete(organization);
  }
 

apps/web/src/app/vault/core/views/collection-admin.view.ts

@@ -1,3 +1,4 @@
+import { OrganizationUserUserDetailsResponse } from "@bitwarden/common/admin-console/abstractions/organization-user/responses";
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
 import { CollectionAccessDetailsResponse } from "@bitwarden/common/src/vault/models/response/collection.response";
 import { CollectionView } from "@bitwarden/common/vault/models/view/collection.view";
@@ -7,6 +8,7 @@ import { CollectionAccessSelectionView } from "../../../admin-console/organizati
 export class CollectionAdminView extends CollectionView {
  groups: CollectionAccessSelectionView[] = [];
  users: CollectionAccessSelectionView[] = [];
+ addAccess: boolean;
 
  /**
  * Flag indicating the user has been explicitly assigned to this Collection
@@ -31,6 +33,33 @@ export class CollectionAdminView extends CollectionView {
  this.assigned = response.assigned;
  }
 
+ groupsCanManage() {
+ if (this.groups.length === 0) {
+ return this.groups;
+ }
+
+ const returnedGroups = this.groups.filter((group) => {
+ if (group.manage) {
+ return group;
+ }
+ });
+ return returnedGroups;
+ }
+
+ usersCanManage(revokedUsers: OrganizationUserUserDetailsResponse[]) {
+ if (this.users.length === 0) {
+ return this.users;
+ }
+
+ const returnedUsers = this.users.filter((user) => {
+ const isRevoked = revokedUsers.some((revoked) => revoked.id === user.id);
+ if (user.manage && !isRevoked) {
+ return user;
+ }
+ });
+ return returnedUsers;
+ }
+
  /**
  * Whether the current user can edit the collection, including user and group access
  */

apps/web/src/app/vault/org-vault/vault.component.html

@@ -26,6 +26,20 @@
  </div>
  </div>
  <div class="col-9">
+ <bit-toggle-group
+ *ngIf="showAddAccessToggle && activeFilter.selectedCollectionNode"
+ [selected]="addAccessStatus$ | async"
+ (selectedChange)="addAccessToggle($event)"
+ [attr.aria-label]="'addAccessFilter' | i18n"
+ >
+ <bit-toggle [value]="0">
+ {{ "all" | i18n }}
+ </bit-toggle>
+
+ <bit-toggle [value]="1">
+ {{ "addAccess" | i18n }}
+ </bit-toggle>
+ </bit-toggle-group>
  <app-callout type="warning" *ngIf="activeFilter.isDeleted" icon="bwi bwi-exclamation-triangle">
  {{ trashCleanupWarning }}
  </app-callout>
@@ -54,6 +68,8 @@
  [showBulkAddToCollections]="organization?.flexibleCollections"
  [viewingOrgVault]="true"
  [flexibleCollectionsV1Enabled]="flexibleCollectionsV1Enabled"
+ [addAccessStatus]="addAccessStatus$ | async"
+ [addAccessToggle]="showAddAccessToggle"
  >
  </app-vault-items>
  <ng-container *ngIf="!flexibleCollectionsV1Enabled">