[AC-2436] Show unassigned items banner in web (#8655)

* Boostrap basic banner, show for all admins

* Remove UI banner, fix method calls

* Invert showBanner -> hideBanner

* Add api call

* Minor tweaks and wording

* Change to active user state

* Add tests

* Fix mixed up names

* Simplify logic

* Add feature flag

* Do not clear on logout

* Update apps/web/src/locales/en/messages.json

---------

Co-authored-by: Addison Beck <github@addisonbeck.com>

libs/common/src/abstractions/api.service.ts

@@ -207,6 +207,7 @@ export abstract class ApiService {
     emergencyAccessId?: string,
   ) => Promise<AttachmentResponse>;
   getCiphersOrganization: (organizationId: string) => Promise<ListResponse<CipherResponse>>;
+  getShowUnassignedCiphersBanner: () => Promise<boolean>;
   postCipher: (request: CipherRequest) => Promise<CipherResponse>;
   postCipherCreate: (request: CipherCreateRequest) => Promise<CipherResponse>;
   postCipherAdmin: (request: CipherCreateRequest) => Promise<CipherResponse>;

libs/common/src/enums/feature-flag.enum.ts

@@ -9,6 +9,7 @@ export enum FeatureFlag {
   ShowPaymentMethodWarningBanners = "show-payment-method-warning-banners",
   EnableConsolidatedBilling = "enable-consolidated-billing",
   AC1795_UpdatedSubscriptionStatusSection = "AC-1795_updated-subscription-status-section",
+  UnassignedItemsBanner = "unassigned-items-banner",
 }
 
 // Replace this with a type safe lookup of the feature flag values in PM-2282

libs/common/src/platform/state/state-definitions.ts

@@ -76,6 +76,10 @@ export const NEW_WEB_LAYOUT_BANNER_DISK = new StateDefinition("newWebLayoutBanne
   web: "disk-local",
 });
 
+export const UNASSIGNED_ITEMS_BANNER_DISK = new StateDefinition("unassignedItemsBanner", "disk", {
+  web: "disk-local",
+});
+
 // Platform
 
 export const APPLICATION_ID_DISK = new StateDefinition("applicationId", "disk", {

libs/common/src/services/api.service.ts

@@ -506,6 +506,11 @@ export class ApiService implements ApiServiceAbstraction {
     return new ListResponse(r, CipherResponse);
   }
 
+  async getShowUnassignedCiphersBanner(): Promise<boolean> {
+    const r = await this.send("GET", "/ciphers/has-unassigned-ciphers", null, true, true);
+    return r;
+  }
+
   async postCipher(request: CipherRequest): Promise<CipherResponse> {
     const r = await this.send("POST", "/ciphers", request, true, true);
     return new CipherResponse(r);