[AC-1119] [PM-1923] [AC-701] Import into a specified folder or collection

[djsmith85]

Type of change

- [ ] Bug fix
- [X] New feature development
- [X] Tech debt (refactoring, code cleanup, dependency upgrades, etc)
- [ ] Build/deploy pipeline (DevOps)
- [ ] Other

Objective

Flexible collections AC-1119

• Enable users to select their target-vault(individual and organizational vaults) for importing, without needing to navigate between (Tools ->Import data and Organization -> Select Org -> Settings -> Import data)
• Enable users to select a folder/collection as a new root for the import (optional)
  • If nothing is selected, the import will proceed as before, importing cipher into their assigned folders/collections
  • If selected, all items without a folder or collection assigned to them will be mapped onto the selected target
  • Any folder/collections present in the import file will be moved to a sub-folder/sub-collection of the selected target

Tech debt PM-1923 [AC-701]

• Migrate the import page to Reactive Forms and replace existing markup to use components from the Component Library

Code changes

UI rework:

• apps/web/src/app/tools/import-export/import.component.html: Reactive forms and
• apps/web/src/app/tools/import-export/import.component.ts: Retrieve vaults (individual/orgs), folders and collections for the new dropdowns. Pass on selected import target(folder/collection) on to import.service
• apps/web/src/app/admin-console/organizations/tools/import-export/org-import.component.ts: Import Formbuilder and pass into to ImportComponent ctor
• libs/common/src/admin-console/abstractions/organization/organization.service.abstraction.ts: Helper function to filter out any organizations from the dropwdown, where a member does not have the right permissions to either import or export.

Enabling import into a specific folder or collections

• libs/importer/src/services/import.service.ts: Add ability to pass in an optional folderId/collectionId which will be used as new root for any items being imported.
• libs/importer/src/services/import.service.abstraction.ts: Extend interface to receive selected import target (null | folderId | collectionId)
• libs/importer/src/services/import.service.spec.ts: Added unit tests for old behaviour when no target is selected, and with a selected target.
• apps/web/src/app/tools/import-export/import.component.ts: Retrieve vaults (individual/orgs), folders and collections for the new dropdowns. Pass on selected import target(folder/collection) on to import.service
• apps/web/src/app/admin-console/organizations/tools/import-export/org-import.component.ts: Import folder-, org- and collection-service and pass onto ImportComponent ctor

Screenshots

BEFORE:

AFTER:
Vault selector:

Individual vault:

Organizational vault:

Before you submit

• Please add unit tests where it makes sense to do so (encouraged but not required)
• If this change requires a documentation update - notify the documentation team
• If this change has particular deployment requirements - notify the DevOps team
• Ensure that all UI additions follow WCAG AA requirements

[shane-melton]

Nice work! I only have a few more comments/suggestions and then I think we'll be all set!

[shane-melton]

Changes look good to me! Nice job!

[bitwarden-bot]

Checkmarx One – Scan Summary & Details – b1e94a7d-86b8-44cc-8ca3-d443e2792b55

No New Or Fixed Issues Found

[aj-rosado]

Changes are looking good to me!

[djsmith85]

Re-requesting review from @aj-rosado due to merging PR #5933

[aj-rosado]

LGTM

[vvolkgang]

Given that @shane-melton and @eliykat previously approved it, I went through the recent commits and none had Admin Console related changes, approving on behalf of them.