Claude upgrade shenanigans

2026-02-14 07:23:28 +00:00 · 2026-01-22 11:00:40 -06:00 · 2026-01-22 10:59:05 -06:00
45 changed files with 8865 additions and 5916 deletions
--- a/.claude/CLAUDE.md
+++ b/.claude/CLAUDE.md
--- a/.claude/commands/code-explainer.md
+++ b/.claude/commands/code-explainer.md
@@ -0,0 +1,30 @@
+---
+description: "Provides a brief explanation of the code attached, including key components, notable patterns, and a code walkthrough."
+---
+
+# Code Explainer
+
+Provide a brief explanation of the code attached. I'm trying to better understand it.
+
+## Key Components
+
+- Main classes/functions and their roles
+- Important dependencies
+- Critical flows
+
+## Notable Patterns
+
+- Design patterns used
+- Architecture decisions
+- Important abstractions
+
+## Code Walkthrough
+
+- How it works
+- Key decision points
+- Important considerations
+
+## Gotchas & Tips
+
+- Edge cases to watch for
+- Performance considerations
--- a/.claude/plan.md
+++ b/.claude/plan.md
@@ -1,239 +0,0 @@
-# Phase 2 PR #1: Flatten Account Model - IMPLEMENTATION COMPLETE
-
-## Status: ✅ COMPLETED
-
-**Implementation Date:** February 13, 2026
-**All tests passing:** 120/120 ✅
-**TypeScript compilation:** Success ✅
-
---
-
-## Summary
-
-Successfully implemented Phase 2 PR #1: Flatten Account Model. The Account model has been simplified from 177 lines (51 + 126 inherited) to 51 lines, removing the BaseAccount inheritance and flattening nested structures into direct properties.
-
-## Changes Implemented
-
-### Files Modified (7 files)
-
-1. **`jslib/common/src/enums/stateVersion.ts`**
-   - Added `StateVersion.Five` for the flattened Account structure
-   - Updated `StateVersion.Latest = Five`
-
-2. **`src/models/account.ts`**
-   - Removed `extends BaseAccount` inheritance
-   - Removed `ClientKeys` class (redundant)
-   - Flattened 6 authentication fields to top level:
-     - `userId`, `entityId`, `apiKeyClientId`
-     - `accessToken`, `refreshToken`, `apiKeyClientSecret`
-   - Kept `DirectoryConfigurations` and `DirectorySettings` unchanged
-   - Added compatibility fields with FIXME comment for jslib infrastructure:
-     - `data?`, `keys?`, `profile?`, `settings?`, `tokens?` (optional, unused)
-   - Simplified constructor without Object.assign
-
-3. **`src/services/stateMigration.service.ts`**
-   - Added `migrateStateFrom3To4()` placeholder migration
-   - Added `migrateStateFrom4To5()` to flatten nested → flat Account structure
-   - Updated `migrate()` method with new case statements for v3→v4 and v4→v5
-   - Updated `migrateStateFrom1To2()` to use flattened structure (removed `account.profile`, `account.clientKeys`)
-
-4. **`src/services/auth.service.ts`**
-   - Removed imports: `AccountKeys`, `AccountProfile`, `AccountTokens`
-   - Simplified account creation from 26 lines to 10 lines (62% reduction)
-   - Direct property assignment instead of nested objects with spread operators
-
-5. **`src/services/state.service.ts`**
-   - Changed `account.profile.userId` → `account.userId`
-   - Removed `account.settings` from `scaffoldNewAccountDiskStorage`
-   - Added `settings` back to `resetAccount` for base class compatibility (unused but required)
-
-6. **`src/services/authService.spec.ts`**
-   - Removed imports: `AccountKeys`, `AccountProfile`, `AccountTokens`
-   - Updated test expectations to match new flat Account structure
-
-### Files Created (1 file)
-
-7. **`src/services/stateMigration.service.spec.ts`**
-   - Comprehensive migration test suite (5 tests, 210 lines)
-   - Tests flattening nested account structure
-   - Tests handling missing nested objects gracefully
-   - Tests empty account list
-   - Tests preservation of directory configurations and settings
-   - Tests state version update
-
-## Code Reduction Achieved
-
- **Account model:** 177 lines (51 + 126 inherited) → 51 lines (71% reduction)
- **AuthService account creation:** 26 lines → 10 lines (62% reduction)
- **Import statements removed:** 5 jslib imports across multiple files
-
-## Migration Logic
-
-### State Version v4 → v5 Migration
-
-The `migrateStateFrom4To5()` method handles conversion from nested to flat structure:
-
-```typescript
-// OLD (nested structure):
-{
-  profile: {
-    userId: "CLIENT_ID",
-    entityId: "CLIENT_ID",
-    apiKeyClientId: "organization.CLIENT_ID"
-  },
-  tokens: {
-    accessToken: "token",
-    refreshToken: "refresh"
-  },
-  keys: {
-    apiKeyClientSecret: "secret"
-  }
-}
-
-// NEW (flat structure):
-{
-  userId: "CLIENT_ID",
-  entityId: "CLIENT_ID",
-  apiKeyClientId: "organization.CLIENT_ID",
-  accessToken: "token",
-  refreshToken: "refresh",
-  apiKeyClientSecret: "secret"
-}
-```
-
-**Migration Safety:**
-
- Null-safe property access with `??` operator
- Preserves all directory configurations and settings
- Falls back to userId if profile.userId doesn't exist
- Handles empty account lists gracefully
-
-## Test Results
-
-### Unit Tests: ✅ PASS
-
-```
-Test Suites: 14 passed, 14 total
-Tests:       120 passed, 120 total
-```
-
-New tests added:
-
- `should flatten nested account structure` ✅
- `should handle missing nested objects gracefully` ✅
- `should handle empty account list` ✅
- `should preserve directory configurations and settings` ✅
- `should update state version after successful migration` ✅
-
-### TypeScript Compilation: ✅ PASS
-
-```
-npm run test:types
-```
-
-All type checks pass with zero errors.
-
-## Technical Notes
-
-### Compatibility Fields
-
-Added optional compatibility fields to Account model to satisfy jslib infrastructure type constraints:
-
-```typescript
-// FIXME: Remove these compatibility fields after StateServiceVNext migration (PR #990) is merged
-// These fields are unused but required for type compatibility with jslib's StateService infrastructure
-data?: any;
-keys?: any;
-profile?: any;
-settings?: any;
-tokens?: any;
-```
-
-These will be removed after PR #990 (StateServiceVNext) merges and old StateService is deleted.
-
-### Key Architectural Decision
-
-Chose to add compatibility fields rather than refactor entire jslib infrastructure because:
-
-1. PR #990 (StateServiceVNext) will eventually replace this infrastructure
-2. Minimizes changes needed in this PR
-3. Avoids conflicts with PR #990
-4. Can be cleaned up later
-
-## What This Enables
-
-### Immediate Benefits
-
- ✅ Simplified Account model (71% code reduction)
- ✅ Clearer authentication field structure
- ✅ Easier debugging (no nested property access)
- ✅ Self-documenting code (obvious what DC needs)
-
-### Enables Future Work
-
- **Phase 2 PR #2:** Remove StateFactory infrastructure
- **Phase 2 PR #3:** Delete ~90 unused jslib files including:
-  - EncString (only used by old nested Account)
-  - SymmetricCryptoKey (only used by old nested Account)
-  - OrganizationData (completely unused)
-  - ProviderData (completely unused)
-  - AccountKeys, AccountProfile, AccountTokens, AccountData, AccountSettings
-
-## Merge Strategy
-
-**Conflict Management:**
-
- This PR targets current codebase (with old StateService)
- Will conflict with PR #990 (StateServiceVNext) when it merges
- Plan: Rebase this PR after #990 merges
- Expected conflicts: StateService files, Account model structure
- Resolution: Keep StateServiceVNext changes, apply Account flattening to new structure
-
-## Next Steps
-
-1. **Review & Test:** Thorough code review and manual testing
-2. **Create PR:** Open PR with comprehensive description and test results
-3. **Manual Testing Scenarios:**
-   - Fresh installation → authentication flow
-   - Existing installation → migration runs successfully
-   - All directory types → configuration persists correctly
-   - CLI authentication → flat structure works
-4. **After Merge:**
-   - Begin Phase 2 PR #2: Remove StateFactory Infrastructure
-   - Monitor for any migration issues in production
-
-## Related Work
-
- **Depends On:** None (can merge independently)
- **Blocks:** Phase 2 PR #2 (Remove StateFactory), Phase 2 PR #3 (Delete Unused jslib Files)
- **Conflicts With:** PR #990 (StateServiceVNext) - plan to rebase after #990 merges
- **Part Of:** Phase 2 tech debt cleanup (see CLAUDE.md)
-
---
-
-## Original Implementation Plan
-
-[The original detailed step-by-step plan from the conversation has been preserved below for reference]
-
-### Context
-
-Directory Connector's Account model currently extends jslib's BaseAccount, inheriting 126 lines of complex nested structures designed for multi-account password manager features that DC doesn't use. This inheritance creates unnecessary coupling and blocks cleanup of unused jslib dependencies.
-
-**Current State:**
-
- Account extends BaseAccount with nested objects: `profile.userId`, `tokens.accessToken`, `keys.apiKeyClientSecret`
- Only 6 fields from BaseAccount are actually used by DC
- 120+ lines of inherited code (AccountData, AccountKeys, AccountProfile, AccountSettings, AccountTokens) are unused
- Creates dependencies on EncString, SymmetricCryptoKey, OrganizationData, ProviderData that DC never uses
-
-**Problem:**
-
- Unnecessary complexity for a single-account application
- Blocks deletion of unused jslib models (Phase 2 goal)
- Verbose account creation code (26 lines to set 6 fields)
- Difficult to understand what DC actually needs
-
-**Goal:**
-Flatten Account model to contain only the 8 fields DC uses, removing BaseAccount inheritance. This enables Phase 2 PR #2 and PR #3 to delete ~90 unused jslib files.
-
-[Rest of original plan preserved in conversation transcript]
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -9,3 +9,26 @@
 ## 📸 Screenshots

 <!-- Required for any UI changes; delete if not applicable. Use fixed width images for better display. -->
+
+## ⏰ Reminders before review
+
+- Contributor guidelines followed
+- All formatters and local linters executed and passed
+- Written new unit and / or integration tests where applicable
+- Used internationalization (i18n) for all UI strings
+- CI builds passed
+- Communicated to DevOps any deployment requirements
+- Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team
+
+## 🦮 Reviewer guidelines
+
+<!-- Suggested interactions but feel free to use (or not) as you desire! -->
+
+- 👍 (`:+1:`) or similar for great changes
+- 📝 (`:memo:`) or ℹ️ (`:information_source:`) for notes or general info
+- ❓ (`:question:`) for questions
+- 🤔 (`:thinking:`) or 💭 (`:thought_balloon:`) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
+- 🎨 (`:art:`) for suggestions / improvements
+- ❌ (`:x:`) or ⚠️ (`:warning:`) for more significant problems or concerns needing attention
+- 🌱 (`:seedling:`) or ♻️ (`:recycle:`) for future improvements or indications of technical debt
+- ⛏ (`:pick:`) for minor or nitpick changes
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -23,7 +23,7 @@ jobs:
      node_version: ${{ steps.retrieve-node-version.outputs.node_version }}
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

@@ -51,12 +51,12 @@ jobs:
      contents: read
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -129,12 +129,12 @@ jobs:
      _NODE_VERSION: ${{ needs.setup.outputs.node_version }}
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -200,7 +200,7 @@ jobs:
      _NODE_VERSION: ${{ needs.setup.outputs.node_version }}
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

@@ -209,7 +209,7 @@ jobs:
          choco install checksum --no-progress

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -279,12 +279,12 @@ jobs:
      HUSKY: 0
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -379,12 +379,12 @@ jobs:
      HUSKY: 0
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -439,12 +439,12 @@ jobs:
      HUSKY: 0
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
--- a/.github/workflows/integration-test.yml
+++ b/.github/workflows/integration-test.yml
@@ -40,7 +40,7 @@ jobs:

    steps:
      - name: Check out repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

@@ -52,7 +52,7 @@ jobs:
          echo "node_version=$NODE_VERSION" >> "$GITHUB_OUTPUT"

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -129,7 +129,7 @@ jobs:

      - name: Report test results
        id: report
-        uses: dorny/test-reporter@b082adf0eced0765477756c2a610396589b8c637 # v2.5.0
+        uses: dorny/test-reporter@fe45e9537387dac839af0d33ba56eed8e24189e8 # v2.3.0
        # This will skip the job if it's a pull request from a fork, because that won't have permission to upload test results.
        # PRs from the repository and all other events are OK.
        if: (github.event_name == 'push' || github.event_name == 'workflow_dispatch' || github.event.pull_request.head.repo.full_name == github.repository) && !cancelled()
@@ -143,6 +143,4 @@ jobs:
        uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2

      - name: Upload results to codecov.io
-        uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2
-        with:
-          report_type: test_results
+        uses: codecov/test-results-action@0fa95f0e1eeaafde2c782583b36b28ad0d8c77d3 # v1.2.1
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -26,7 +26,7 @@ jobs:
      release_version: ${{ steps.version.outputs.version }}
    steps:
      - name: Checkout repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -22,7 +22,7 @@ jobs:

    steps:
      - name: Check out repo
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          persist-credentials: false

@@ -34,7 +34,7 @@ jobs:
          echo "node_version=$NODE_VERSION" >> "$GITHUB_OUTPUT"

      - name: Set up Node
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
        with:
          cache: 'npm'
          cache-dependency-path: '**/package-lock.json'
@@ -53,7 +53,7 @@ jobs:
        run: npm run test --coverage

      - name: Report test results
-        uses: dorny/test-reporter@b082adf0eced0765477756c2a610396589b8c637 # v2.5.0
+        uses: dorny/test-reporter@fe45e9537387dac839af0d33ba56eed8e24189e8 # v2.3.0
        # This will skip the job if it's a pull request from a fork, because that won't have permission to upload test results.
        # PRs from the repository and all other events are OK.
        if: (github.event_name == 'push' || github.event_name == 'workflow_dispatch' || github.event.pull_request.head.repo.full_name == github.repository) && !cancelled()
@@ -67,6 +67,4 @@ jobs:
        uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2

      - name: Upload results to codecov.io
-        uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2
-        with:
-          report_type: test_results
+        uses: codecov/test-results-action@0fa95f0e1eeaafde2c782583b36b28ad0d8c77d3 # v1.2.1
--- a/.github/workflows/version-bump.yml
+++ b/.github/workflows/version-bump.yml
@@ -50,7 +50,7 @@ jobs:
          permission-contents: write

      - name: Checkout Branch
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
        with:
          token: ${{ steps.app-token.outputs.token }}
          persist-credentials: true
--- a/ESM_MIGRATION_PLAN.md
+++ b/ESM_MIGRATION_PLAN.md
@@ -0,0 +1,156 @@
+# ESM Migration Plan
+
+## Migration Status: Partial Success
+
+The ESM migration has been **partially completed**. The source code is now ESM-compatible with `"type": "module"` in package.json, and webpack outputs CommonJS bundles (`.cjs`) for Node.js compatibility.
+
+### What Works
+
+- ✅ CLI build (`bwdc.cjs`) - builds and runs successfully
+- ✅ Electron main process (`main.cjs`) - builds successfully
+- ✅ All 130 tests pass
+- ✅ Source code uses ESM syntax (import/export)
+
+### What Doesn't Work
+
+- ❌ Electron renderer build - **pre-existing type errors in jslib** (not caused by this migration)
+
+The renderer build was failing with 37 TypeScript errors in `jslib/` **before** the ESM migration began. These are ArrayBuffer/SharedArrayBuffer type compatibility issues in the jslib submodule that need to be addressed separately.
+
+---
+
+## Changes Made
+
+### 1. package.json
+
+```json
+{
+  "type": "module",
+  "main": "main.cjs"
+}
+```
+
+### 2. tsconfig.json
+
+```json
+{
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "module": "ES2020",
+    "skipLibCheck": true,
+    "noEmitOnError": false
+  }
+}
+```
+
+### 3. Webpack Configurations
+
+**CLI (webpack.cli.cjs)**
+
+- Output changed to `.cjs` extension
+- Added `transpileOnly: true` to ts-loader for faster builds
+
+**Main (webpack.main.cjs)**
+
+- Output changed to `.cjs` extension
+- Added `transpileOnly: true` to ts-loader
+
+**Renderer (webpack.renderer.cjs)**
+
+- Created separate `tsconfig.renderer.json` to isolate Angular compilation
+- Removed ESM output experiments (not compatible with Angular's webpack plugin)
+
+### 4. src-cli/package.json
+
+```json
+{
+  "type": "module",
+  "bin": {
+    "bwdc": "../build-cli/bwdc.cjs"
+  }
+}
+```
+
+### 5. New File: tsconfig.renderer.json
+
+Dedicated TypeScript config for Angular renderer to isolate from jslib type issues.
+
+---
+
+## Architecture Decision
+
+### Why CJS Output Instead of ESM Output?
+
+The migration uses a **hybrid approach**:
+
+- **Source code**: ESM syntax (`import`/`export`)
+- **Build output**: CommonJS (`.cjs` files)
+
+This approach was chosen because:
+
+1. **lowdb v1 incompatibility**: The legacy lowdb v1 used in jslib doesn't work properly with ESM output due to lodash interop issues
+
+2. **Native module compatibility**: keytar and other native modules work better with CJS
+
+3. **Electron compatibility**: Electron's main process ESM support is still maturing
+
+4. **jslib constraints**: The jslib submodule is read-only and contains CJS-only patterns
+
+The webpack bundler transpiles ESM source to CJS output, giving us modern syntax in the codebase while maintaining runtime compatibility.
+
+---
+
+## Blocking Issues for Full ESM
+
+### 1. jslib Submodule (Read-Only)
+
+The jslib folder contains:
+
+- `lowdb` v1.0.0 usage (CJS-only, v7 is ESM but has breaking API changes)
+- `node-fetch` v2.7.0 usage (CJS-only, v3 is ESM-only)
+- Pre-existing TypeScript errors (ArrayBuffer type mismatches)
+
+### 2. Angular Webpack Plugin
+
+The `@ngtools/webpack` plugin does its own TypeScript compilation and doesn't support `transpileOnly` mode, so it surfaces type errors from jslib.
+
+---
+
+## Future Work
+
+To complete full ESM migration:
+
+1. **Update jslib submodule** - Fix type errors, upgrade to ESM-compatible dependencies
+2. **Upgrade lowdb** - From v1 to v7 (requires rewriting storage layer)
+3. **Remove node-fetch** - Use native `fetch` (Node 18+) or upgrade to v3
+4. **Enable ESM output** - Once dependencies are updated, change webpack output to ESM
+
+---
+
+## Testing the Migration
+
+```bash
+# Build CLI
+npm run build:cli
+node ./build-cli/bwdc.cjs --help
+
+# Build Electron main
+npm run build:main
+
+# Run tests
+npm test
+```
+
+---
+
+## Files Changed
+
+| File                     | Change                                               |
+| ------------------------ | ---------------------------------------------------- |
+| `package.json`           | Added `"type": "module"`, changed main to `main.cjs` |
+| `tsconfig.json`          | Added `skipLibCheck`, `noEmitOnError`                |
+| `tsconfig.renderer.json` | New file for Angular compilation                     |
+| `webpack.cli.cjs`        | Output to `.cjs`, added `transpileOnly`              |
+| `webpack.main.cjs`       | Output to `.cjs`, added `transpileOnly`              |
+| `webpack.renderer.cjs`   | Use separate tsconfig                                |
+| `src-cli/package.json`   | Added `"type": "module"`, updated bin path           |
--- a/angular.json
+++ b/angular.json
@@ -18,17 +18,15 @@
      "prefix": "app",
      "architect": {
        "build": {
-          "builder": "@angular/build:application",
+          "builder": "@angular-devkit/build-angular:browser",
          "options": {
-            "outputPath": {
-              "base": "dist"
-            },
+            "outputPath": "dist",
            "index": "src/index.html",
+            "main": "src/main.ts",
            "tsConfig": "tsconfig.json",
            "assets": [],
            "styles": [],
-            "scripts": [],
-            "browser": "src/main.ts"
+            "scripts": []
          }
        }
      }
--- a/jest.config.cjs
+++ b/jest.config.cjs
@@ -24,13 +24,20 @@ module.exports = {

  roots: ["<rootDir>"],
  modulePaths: [compilerOptions.baseUrl],
-  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, { prefix: "<rootDir>/" }),
+  moduleNameMapper: {
+    ...pathsToModuleNameMapper(compilerOptions.paths, { prefix: "<rootDir>/" }),
+    // ESM compatibility: mock import.meta.url for tests
+    "^(\\.{1,2}/.*)\\.js$": "$1",
+  },
  setupFilesAfterEnv: ["<rootDir>/test.setup.ts"],
  // Workaround for a memory leak that crashes tests in CI:
  // https://github.com/facebook/jest/issues/9430#issuecomment-1149882002
  // Also anecdotally improves performance when run locally
  maxWorkers: 3,

+  // ESM support
+  extensionsToTreatAsEsm: [".ts"],
+
  transform: {
    "^.+\\.tsx?$": [
      "jest-preset-angular",
@@ -43,6 +50,8 @@ module.exports = {
        // Makes tests run faster and reduces size/rate of leak, but loses typechecking on test code
        // See https://bitwarden.atlassian.net/browse/EC-497 for more info
        isolatedModules: true,
+        // ESM support
+        useESM: true,
      },
    ],
  },
--- a/jslib/angular/src/components/toastr.component.ts
+++ b/jslib/angular/src/components/toastr.component.ts
@@ -1,77 +1,75 @@
+import { animate, state, style, transition, trigger } from "@angular/animations";
 import { CommonModule } from "@angular/common";
 import { Component, ModuleWithProviders, NgModule } from "@angular/core";
-import { DefaultNoComponentGlobalConfig, GlobalConfig, Toast, TOAST_CONFIG } from "ngx-toastr";
+import {
+  DefaultNoComponentGlobalConfig,
+  GlobalConfig,
+  Toast as BaseToast,
+  ToastPackage,
+  ToastrService,
+  TOAST_CONFIG,
+} from "ngx-toastr";

@Component({
  selector: "[toast-component2]",
  template: `
-    @if (options().closeButton) {
-      <button (click)="remove()" type="button" class="toast-close-button" aria-label="Close">
-        <span aria-hidden="true">&times;</span>
-      </button>
-    }
+    <button
+      *ngIf="options.closeButton"
+      (click)="remove()"
+      type="button"
+      class="toast-close-button"
+      aria-label="Close"
+    >
+      <span aria-hidden="true">&times;</span>
+    </button>
    <div class="icon">
      <i></i>
    </div>
    <div>
-      @if (title()) {
-        <div [class]="options().titleClass" [attr.aria-label]="title()">
-          {{ title() }}
-          @if (duplicatesCount) {
-            [{{ duplicatesCount + 1 }}]
-          }
-        </div>
-      }
-      @if (message() && options().enableHtml) {
-        <div
-          role="alertdialog"
-          aria-live="polite"
-          [class]="options().messageClass"
-          [innerHTML]="message()"
-        ></div>
-      }
-      @if (message() && !options().enableHtml) {
-        <div
-          role="alertdialog"
-          aria-live="polite"
-          [class]="options().messageClass"
-          [attr.aria-label]="message()"
-        >
-          {{ message() }}
-        </div>
-      }
-    </div>
-    @if (options().progressBar) {
-      <div>
-        <div class="toast-progress" [style.width]="width + '%'"></div>
+      <div *ngIf="title" [class]="options.titleClass" [attr.aria-label]="title">
+        {{ title }} <ng-container *ngIf="duplicatesCount">[{{ duplicatesCount + 1 }}]</ng-container>
      </div>
-    }
-  `,
-  styles: `
-    :host {
-      &.toast-in {
-        animation: toast-animation var(--animation-duration) var(--animation-easing);
-      }
-
-      &.toast-out {
-        animation: toast-animation var(--animation-duration) var(--animation-easing) reverse
-          forwards;
-      }
-    }
-
-    @keyframes toast-animation {
-      from {
-        opacity: 0;
-      }
-      to {
-        opacity: 1;
-      }
-    }
+      <div
+        *ngIf="message && options.enableHtml"
+        role="alertdialog"
+        aria-live="polite"
+        [class]="options.messageClass"
+        [innerHTML]="message"
+      ></div>
+      <div
+        *ngIf="message && !options.enableHtml"
+        role="alertdialog"
+        aria-live="polite"
+        [class]="options.messageClass"
+        [attr.aria-label]="message"
+      >
+        {{ message }}
+      </div>
+    </div>
+    <div *ngIf="options.progressBar">
+      <div class="toast-progress" [style.width]="width + '%'"></div>
+    </div>
  `,
+  animations: [
+    trigger("flyInOut", [
+      state("inactive", style({ opacity: 0 })),
+      state("active", style({ opacity: 1 })),
+      state("removed", style({ opacity: 0 })),
+      transition("inactive => active", animate("{{ easeTime }}ms {{ easing }}")),
+      transition("active => removed", animate("{{ easeTime }}ms {{ easing }}")),
+    ]),
+  ],
  preserveWhitespaces: false,
  standalone: false,
 })
-export class BitwardenToast extends Toast {}
+export class BitwardenToast extends BaseToast {
+  constructor(
+    protected toastrService: ToastrService,
+    public toastPackage: ToastPackage,
+  ) {
+    super(toastrService, toastPackage);
+  }
+}

 export const BitwardenToastGlobalConfig: GlobalConfig = {
  ...DefaultNoComponentGlobalConfig,
--- a/jslib/common/spec/domain/encString.spec.ts
+++ b/jslib/common/spec/domain/encString.spec.ts
@@ -0,0 +1,195 @@
+import { Substitute, Arg } from "@fluffy-spoon/substitute";
+
+import { CryptoService } from "@/jslib/common/src/abstractions/crypto.service";
+import { EncryptionType } from "@/jslib/common/src/enums/encryptionType";
+import { EncString } from "@/jslib/common/src/models/domain/encString";
+import { SymmetricCryptoKey } from "@/jslib/common/src/models/domain/symmetricCryptoKey";
+import { ContainerService } from "@/jslib/common/src/services/container.service";
+
+describe("EncString", () => {
+  afterEach(() => {
+    (window as any).bitwardenContainerService = undefined;
+  });
+
+  describe("Rsa2048_OaepSha256_B64", () => {
+    it("constructor", () => {
+      const encString = new EncString(EncryptionType.Rsa2048_OaepSha256_B64, "data");
+
+      expect(encString).toEqual({
+        data: "data",
+        encryptedString: "3.data",
+        encryptionType: 3,
+      });
+    });
+
+    describe("parse existing", () => {
+      it("valid", () => {
+        const encString = new EncString("3.data");
+
+        expect(encString).toEqual({
+          data: "data",
+          encryptedString: "3.data",
+          encryptionType: 3,
+        });
+      });
+
+      it("invalid", () => {
+        const encString = new EncString("3.data|test");
+
+        expect(encString).toEqual({
+          encryptedString: "3.data|test",
+          encryptionType: 3,
+        });
+      });
+    });
+
+    describe("decrypt", () => {
+      const encString = new EncString(EncryptionType.Rsa2048_OaepSha256_B64, "data");
+
+      const cryptoService = Substitute.for<CryptoService>();
+      cryptoService.getOrgKey(null).resolves(null);
+      cryptoService.decryptToUtf8(encString, Arg.any()).resolves("decrypted");
+
+      beforeEach(() => {
+        (window as any).bitwardenContainerService = new ContainerService(cryptoService);
+      });
+
+      it("decrypts correctly", async () => {
+        const decrypted = await encString.decrypt(null);
+
+        expect(decrypted).toBe("decrypted");
+      });
+
+      it("result should be cached", async () => {
+        const decrypted = await encString.decrypt(null);
+        cryptoService.received(1).decryptToUtf8(Arg.any(), Arg.any());
+
+        expect(decrypted).toBe("decrypted");
+      });
+    });
+  });
+
+  describe("AesCbc256_B64", () => {
+    it("constructor", () => {
+      const encString = new EncString(EncryptionType.AesCbc256_B64, "data", "iv");
+
+      expect(encString).toEqual({
+        data: "data",
+        encryptedString: "0.iv|data",
+        encryptionType: 0,
+        iv: "iv",
+      });
+    });
+
+    describe("parse existing", () => {
+      it("valid", () => {
+        const encString = new EncString("0.iv|data");
+
+        expect(encString).toEqual({
+          data: "data",
+          encryptedString: "0.iv|data",
+          encryptionType: 0,
+          iv: "iv",
+        });
+      });
+
+      it("invalid", () => {
+        const encString = new EncString("0.iv|data|mac");
+
+        expect(encString).toEqual({
+          encryptedString: "0.iv|data|mac",
+          encryptionType: 0,
+        });
+      });
+    });
+  });
+
+  describe("AesCbc256_HmacSha256_B64", () => {
+    it("constructor", () => {
+      const encString = new EncString(EncryptionType.AesCbc256_HmacSha256_B64, "data", "iv", "mac");
+
+      expect(encString).toEqual({
+        data: "data",
+        encryptedString: "2.iv|data|mac",
+        encryptionType: 2,
+        iv: "iv",
+        mac: "mac",
+      });
+    });
+
+    it("valid", () => {
+      const encString = new EncString("2.iv|data|mac");
+
+      expect(encString).toEqual({
+        data: "data",
+        encryptedString: "2.iv|data|mac",
+        encryptionType: 2,
+        iv: "iv",
+        mac: "mac",
+      });
+    });
+
+    it("invalid", () => {
+      const encString = new EncString("2.iv|data");
+
+      expect(encString).toEqual({
+        encryptedString: "2.iv|data",
+        encryptionType: 2,
+      });
+    });
+  });
+
+  it("Exit early if null", () => {
+    const encString = new EncString(null);
+
+    expect(encString).toEqual({
+      encryptedString: null,
+    });
+  });
+
+  describe("decrypt", () => {
+    it("throws exception when bitwarden container not initialized", async () => {
+      const encString = new EncString(null);
+
+      expect.assertions(1);
+      try {
+        await encString.decrypt(null);
+      } catch (e) {
+        expect(e.message).toEqual("global bitwardenContainerService not initialized.");
+      }
+    });
+
+    it("handles value it can't decrypt", async () => {
+      const encString = new EncString(null);
+
+      const cryptoService = Substitute.for<CryptoService>();
+      cryptoService.getOrgKey(null).resolves(null);
+      cryptoService.decryptToUtf8(encString, Arg.any()).throws("error");
+
+      (window as any).bitwardenContainerService = new ContainerService(cryptoService);
+
+      const decrypted = await encString.decrypt(null);
+
+      expect(decrypted).toBe("[error: cannot decrypt]");
+
+      expect(encString).toEqual({
+        decryptedValue: "[error: cannot decrypt]",
+        encryptedString: null,
+      });
+    });
+
+    it("passes along key", async () => {
+      const encString = new EncString(null);
+      const key = Substitute.for<SymmetricCryptoKey>();
+
+      const cryptoService = Substitute.for<CryptoService>();
+      cryptoService.getOrgKey(null).resolves(null);
+
+      (window as any).bitwardenContainerService = new ContainerService(cryptoService);
+
+      await encString.decrypt(null, key);
+
+      cryptoService.received().decryptToUtf8(encString, key);
+    });
+  });
+});
--- a/jslib/common/spec/domain/symmetricCryptoKey.spec.ts
+++ b/jslib/common/spec/domain/symmetricCryptoKey.spec.ts
@@ -9,7 +9,7 @@ describe("SymmetricCryptoKey", () => {
      new SymmetricCryptoKey(null);
    };

-    expect(t).toThrow("Must provide key");
+    expect(t).toThrowError("Must provide key");
  });

  describe("guesses encKey from key length", () => {
@@ -63,7 +63,7 @@ describe("SymmetricCryptoKey", () => {
        new SymmetricCryptoKey(makeStaticByteArray(30));
      };

-      expect(t).toThrow("Unable to determine encType.");
+      expect(t).toThrowError("Unable to determine encType.");
    });
  });
 });
--- a/jslib/common/spec/services/stateMigration.service.ts
+++ b/jslib/common/spec/services/stateMigration.service.ts
@@ -0,0 +1,84 @@
+import { Arg, Substitute, SubstituteOf } from "@fluffy-spoon/substitute";
+
+import { StorageService } from "@/jslib/common/src/abstractions/storage.service";
+import { StateVersion } from "@/jslib/common/src/enums/stateVersion";
+import { StateFactory } from "@/jslib/common/src/factories/stateFactory";
+import { Account } from "@/jslib/common/src/models/domain/account";
+import { GlobalState } from "@/jslib/common/src/models/domain/globalState";
+import { StateMigrationService } from "@/jslib/common/src/services/stateMigration.service";
+
+const userId = "USER_ID";
+
+describe("State Migration Service", () => {
+  let storageService: SubstituteOf<StorageService>;
+  let secureStorageService: SubstituteOf<StorageService>;
+  let stateFactory: SubstituteOf<StateFactory>;
+
+  let stateMigrationService: StateMigrationService;
+
+  beforeEach(() => {
+    storageService = Substitute.for<StorageService>();
+    secureStorageService = Substitute.for<StorageService>();
+    stateFactory = Substitute.for<StateFactory>();
+
+    stateMigrationService = new StateMigrationService(
+      storageService,
+      secureStorageService,
+      stateFactory,
+    );
+  });
+
+  describe("StateVersion 3 to 4 migration", async () => {
+    beforeEach(() => {
+      const globalVersion3: Partial<GlobalState> = {
+        stateVersion: StateVersion.Three,
+      };
+
+      storageService.get("global", Arg.any()).resolves(globalVersion3);
+      storageService.get("authenticatedAccounts", Arg.any()).resolves([userId]);
+    });
+
+    it("clears everBeenUnlocked", async () => {
+      const accountVersion3: Account = {
+        profile: {
+          apiKeyClientId: null,
+          convertAccountToKeyConnector: null,
+          email: "EMAIL",
+          emailVerified: true,
+          everBeenUnlocked: true,
+          hasPremiumPersonally: false,
+          kdfIterations: 100000,
+          kdfType: 0,
+          keyHash: "KEY_HASH",
+          lastSync: "LAST_SYNC",
+          userId: userId,
+          usesKeyConnector: false,
+          forcePasswordReset: false,
+        },
+      };
+
+      const expectedAccountVersion4: Account = {
+        profile: {
+          ...accountVersion3.profile,
+        },
+      };
+      delete expectedAccountVersion4.profile.everBeenUnlocked;
+
+      storageService.get(userId, Arg.any()).resolves(accountVersion3);
+
+      await stateMigrationService.migrate();
+
+      storageService.received(1).save(userId, expectedAccountVersion4, Arg.any());
+    });
+
+    it("updates StateVersion number", async () => {
+      await stateMigrationService.migrate();
+
+      storageService.received(1).save(
+        "global",
+        Arg.is((globals: GlobalState) => globals.stateVersion === StateVersion.Four),
+        Arg.any(),
+      );
+    });
+  });
+});
--- a/jslib/common/spec/utils.ts
+++ b/jslib/common/spec/utils.ts
@@ -1,3 +1,7 @@
+import { Substitute, Arg } from "@fluffy-spoon/substitute";
+
+import { EncString } from "@/jslib/common/src/models/domain/encString";
+
 function newGuid() {
  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
    const r = (Math.random() * 16) | 0;
@@ -17,10 +21,17 @@ export function BuildTestObject<T, K extends keyof T = keyof T>(
  return Object.assign(constructor === null ? {} : new constructor(), def) as T;
 }

+export function mockEnc(s: string): EncString {
+  const mock = Substitute.for<EncString>();
+  mock.decrypt(Arg.any(), Arg.any()).resolves(s);
+
+  return mock;
+}
+
 export function makeStaticByteArray(length: number, start = 0) {
  const arr = new Uint8Array(length);
  for (let i = 0; i < length; i++) {
    arr[i] = start + i;
  }
-  return arr.buffer;
+  return arr;
 }
--- a/jslib/common/src/enums/stateVersion.ts
+++ b/jslib/common/src/enums/stateVersion.ts
@@ -3,6 +3,5 @@ export enum StateVersion {
  Two = 2, // Move to a typed State object
  Three = 3, // Fix migration of users' premium status
  Four = 4, // Fix 'Never Lock' option by removing stale data
-  Five = 5, // DC: Flatten Account model, remove BaseAccount inheritance
-  Latest = Five,
+  Latest = Four,
 }
--- a/jslib/common/src/misc/nodeUtils.ts
+++ b/jslib/common/src/misc/nodeUtils.ts
@@ -26,4 +26,9 @@ export class NodeUtils {
        .on("error", (err) => reject(err));
    });
  }
+
+  // https://stackoverflow.com/a/31394257
+  static bufferToArrayBuffer(buf: Buffer): ArrayBuffer {
+    return buf.buffer.slice(buf.byteOffset, buf.byteOffset + buf.byteLength);
+  }
 }
--- a/jslib/common/src/misc/utils.ts
+++ b/jslib/common/src/misc/utils.ts
@@ -36,7 +36,7 @@ export class Utils {
    Utils.global = Utils.isNode && !Utils.isBrowser ? global : window;
  }

-  static fromB64ToArray(str: string): Uint8Array<ArrayBuffer> {
+  static fromB64ToArray(str: string): Uint8Array {
    if (Utils.isNode) {
      return new Uint8Array(Buffer.from(str, "base64"));
    } else {
@@ -49,11 +49,11 @@ export class Utils {
    }
  }

-  static fromUrlB64ToArray(str: string): Uint8Array<ArrayBuffer> {
+  static fromUrlB64ToArray(str: string): Uint8Array {
    return Utils.fromB64ToArray(Utils.fromUrlB64ToB64(str));
  }

-  static fromHexToArray(str: string): Uint8Array<ArrayBuffer> {
+  static fromHexToArray(str: string): Uint8Array {
    if (Utils.isNode) {
      return new Uint8Array(Buffer.from(str, "hex"));
    } else {
@@ -65,7 +65,7 @@ export class Utils {
    }
  }

-  static fromUtf8ToArray(str: string): Uint8Array<ArrayBuffer> {
+  static fromUtf8ToArray(str: string): Uint8Array {
    if (Utils.isNode) {
      return new Uint8Array(Buffer.from(str, "utf8"));
    } else {
@@ -78,7 +78,7 @@ export class Utils {
    }
  }

-  static fromByteStringToArray(str: string): Uint8Array<ArrayBuffer> {
+  static fromByteStringToArray(str: string): Uint8Array {
    const arr = new Uint8Array(str.length);
    for (let i = 0; i < str.length; i++) {
      arr[i] = str.charCodeAt(i);
@@ -99,8 +99,8 @@ export class Utils {
    }
  }

-  static fromBufferToUrlB64(buffer: Uint8Array<ArrayBuffer>): string {
-    return Utils.fromB64toUrlB64(Utils.fromBufferToB64(buffer.buffer));
+  static fromBufferToUrlB64(buffer: ArrayBuffer): string {
+    return Utils.fromB64toUrlB64(Utils.fromBufferToB64(buffer));
  }

  static fromB64toUrlB64(b64Str: string) {
--- a/jslib/common/src/services/crypto.service.ts
+++ b/jslib/common/src/services/crypto.service.ts
@@ -636,9 +636,9 @@ export class CryptoService implements CryptoServiceAbstraction {

    const encBytes = new Uint8Array(encBuf);
    const encType = encBytes[0];
-    let ctBytes: Uint8Array<ArrayBuffer> = null;
-    let ivBytes: Uint8Array<ArrayBuffer> = null;
-    let macBytes: Uint8Array<ArrayBuffer> = null;
+    let ctBytes: Uint8Array = null;
+    let ivBytes: Uint8Array = null;
+    let macBytes: Uint8Array = null;

    switch (encType) {
      case EncryptionType.AesCbc128_HmacSha256_B64:
--- a/jslib/electron/src/window.main.ts
+++ b/jslib/electron/src/window.main.ts
@@ -127,13 +127,6 @@ export class WindowMain {
      },
    });

-    // Enable SharedArrayBuffer. See https://developer.chrome.com/blog/enabling-shared-array-buffer/#cross-origin-isolation
-    this.win.webContents.session.webRequest.onHeadersReceived((details, callback) => {
-      details.responseHeaders["Cross-Origin-Opener-Policy"] = ["same-origin"];
-      details.responseHeaders["Cross-Origin-Embedder-Policy"] = ["require-corp"];
-      callback({ responseHeaders: details.responseHeaders });
-    });
-
    if (this.windowStates[mainWindowSizeKey].isMaximized) {
      this.win.maximize();
    }
--- a/jslib/node/spec/services/nodeCryptoFunction.service.spec.ts
+++ b/jslib/node/spec/services/nodeCryptoFunction.service.spec.ts
@@ -94,7 +94,7 @@ describe("NodeCrypto Function Service", () => {
    it("should fail with prk too small", async () => {
      const cryptoFunctionService = new NodeCryptoFunctionService();
      const f = cryptoFunctionService.hkdfExpand(
-        Utils.fromB64ToArray(prk16Byte).buffer,
+        Utils.fromB64ToArray(prk16Byte),
        "info",
        32,
        "sha256",
@@ -105,7 +105,7 @@ describe("NodeCrypto Function Service", () => {
    it("should fail with outputByteSize is too large", async () => {
      const cryptoFunctionService = new NodeCryptoFunctionService();
      const f = cryptoFunctionService.hkdfExpand(
-        Utils.fromB64ToArray(prk32Byte).buffer,
+        Utils.fromB64ToArray(prk32Byte),
        "info",
        8161,
        "sha256",
@@ -341,7 +341,7 @@ function testHkdf(
  utf8Key: string,
  unicodeKey: string,
 ) {
-  const ikm = Utils.fromB64ToArray("criAmKtfzxanbgea5/kelQ==").buffer;
+  const ikm = Utils.fromB64ToArray("criAmKtfzxanbgea5/kelQ==");

  const regularSalt = "salt";
  const utf8Salt = "üser_salt";
@@ -393,7 +393,7 @@ function testHkdfExpand(
  it("should create valid " + algorithm + " " + outputByteSize + " byte okm", async () => {
    const cryptoFunctionService = new NodeCryptoFunctionService();
    const okm = await cryptoFunctionService.hkdfExpand(
-      Utils.fromB64ToArray(b64prk).buffer,
+      Utils.fromB64ToArray(b64prk),
      info,
      outputByteSize,
      algorithm,
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -2,7 +2,8 @@
  "name": "@bitwarden/directory-connector",
  "productName": "Bitwarden Directory Connector",
  "description": "Sync your user directory to your Bitwarden organization.",
-  "version": "2026.2.0",
+  "version": "2025.12.0",
+  "type": "module",
  "keywords": [
    "bitwarden",
    "password",
@@ -16,7 +17,7 @@
    "url": "https://github.com/bitwarden/directory-connector"
  },
  "license": "GPL-3.0",
-  "main": "main.js",
+  "main": "main.cjs",
  "scripts": {
    "sub:init": "git submodule update --init --recursive",
    "sub:update": "git submodule update --remote",
@@ -73,16 +74,17 @@
    "test:types": "npx tsc --noEmit"
  },
  "devDependencies": {
-    "@angular-eslint/eslint-plugin-template": "21.1.0",
-    "@angular-eslint/template-parser": "21.1.0",
-    "@angular/build": "21.1.2",
-    "@angular/compiler-cli": "21.1.1",
+    "@angular-devkit/build-angular": "20.3.3",
+    "@angular-eslint/eslint-plugin-template": "20.7.0",
+    "@angular-eslint/template-parser": "20.7.0",
+    "@angular/compiler-cli": "20.3.15",
    "@electron/notarize": "2.5.0",
    "@electron/rebuild": "4.0.1",
+    "@fluffy-spoon/substitute": "1.208.0",
    "@microsoft/microsoft-graph-types": "2.43.1",
-    "@ngtools/webpack": "21.1.2",
+    "@ngtools/webpack": "20.3.3",
    "@types/inquirer": "8.2.10",
-    "@types/jest": "30.0.0",
+    "@types/jest": "29.5.14",
    "@types/lowdb": "1.0.15",
    "@types/node": "22.19.2",
    "@types/node-fetch": "2.6.12",
@@ -90,12 +92,10 @@
    "@types/proper-lockfile": "4.1.4",
    "@types/semver": "7.7.1",
    "@types/tldjs": "2.3.4",
-    "@typescript-eslint/eslint-plugin": "8.54.0",
-    "@typescript-eslint/parser": "8.54.0",
+    "@typescript-eslint/eslint-plugin": "8.50.0",
+    "@typescript-eslint/parser": "8.50.0",
    "@yao-pkg/pkg": "5.16.1",
-    "babel-loader": "10.0.0",
    "clean-webpack-plugin": "4.0.0",
-    "jest-environment-jsdom": "30.2.0",
    "concurrently": "9.2.0",
    "copy-webpack-plugin": "13.0.0",
    "cross-env": "7.0.3",
@@ -106,7 +106,7 @@
    "electron-log": "5.4.1",
    "electron-reload": "2.0.0-alpha.1",
    "electron-store": "8.2.0",
-    "electron-updater": "6.7.3",
+    "electron-updater": "6.6.2",
    "eslint": "9.39.1",
    "eslint-config-prettier": "10.1.5",
    "eslint-import-resolver-typescript": "4.4.4",
@@ -118,16 +118,16 @@
    "html-loader": "5.1.0",
    "html-webpack-plugin": "5.6.3",
    "husky": "9.1.7",
-    "jest": "30.2.0",
+    "jest": "29.7.0",
    "jest-junit": "16.0.0",
    "jest-mock-extended": "4.0.0",
-    "jest-preset-angular": "16.0.0",
+    "jest-preset-angular": "14.6.0",
    "lint-staged": "16.2.6",
-    "mini-css-extract-plugin": "2.10.0",
+    "mini-css-extract-plugin": "2.9.2",
    "minimatch": "5.1.2",
    "node-forge": "1.3.2",
    "node-loader": "2.1.0",
-    "prettier": "3.8.1",
+    "prettier": "3.7.4",
    "rimraf": "6.1.0",
    "rxjs": "7.8.2",
    "sass": "1.97.1",
@@ -135,25 +135,25 @@
    "ts-jest": "29.4.1",
    "ts-loader": "9.5.2",
    "tsconfig-paths-webpack-plugin": "4.2.0",
-    "type-fest": "5.4.2",
-    "typescript": "5.9.3",
+    "type-fest": "5.3.0",
+    "typescript": "5.8.3",
    "webpack": "5.104.1",
    "webpack-cli": "6.0.1",
    "webpack-merge": "6.0.1",
    "webpack-node-externals": "3.0.0",
-    "zone.js": "0.16.0"
+    "zone.js": "0.15.1"
  },
  "dependencies": {
-    "@angular/animations": "21.1.1",
-    "@angular/cdk": "21.1.1",
-    "@angular/cli": "21.1.2",
-    "@angular/common": "21.1.1",
-    "@angular/compiler": "21.1.1",
-    "@angular/core": "21.1.1",
-    "@angular/forms": "21.1.1",
-    "@angular/platform-browser": "21.1.1",
-    "@angular/platform-browser-dynamic": "21.1.1",
-    "@angular/router": "21.1.1",
+    "@angular/animations": "20.3.15",
+    "@angular/cdk": "20.2.14",
+    "@angular/cli": "20.3.3",
+    "@angular/common": "20.3.15",
+    "@angular/compiler": "20.3.15",
+    "@angular/core": "20.3.15",
+    "@angular/forms": "20.3.15",
+    "@angular/platform-browser": "20.3.15",
+    "@angular/platform-browser-dynamic": "20.3.15",
+    "@angular/router": "20.3.15",
    "@microsoft/microsoft-graph-client": "3.0.7",
    "big-integer": "1.6.52",
    "bootstrap": "5.3.7",
@@ -165,16 +165,16 @@
    "https-proxy-agent": "7.0.6",
    "inquirer": "8.2.6",
    "keytar": "7.9.0",
-    "ldapts": "8.1.3",
+    "ldapts": "8.0.1",
    "lowdb": "1.0.0",
-    "ngx-toastr": "20.0.4",
+    "ngx-toastr": "19.1.0",
    "node-fetch": "2.7.0",
    "parse5": "8.0.0",
    "proper-lockfile": "4.1.2",
    "rxjs": "7.8.2",
    "tldjs": "2.3.1",
    "uuid": "11.1.0",
-    "zone.js": "0.16.0"
+    "zone.js": "0.15.1"
  },
  "engines": {
    "node": "~20",
--- a/src-cli/package.json
+++ b/src-cli/package.json
@@ -3,16 +3,17 @@
  "productName": "Bitwarden Directory Connector",
  "description": "Sync your user directory to your Bitwarden organization.",
  "version": "2.9.5",
+  "type": "module",
  "author": "Bitwarden Inc. <hello@bitwarden.com> (https://bitwarden.com)",
  "homepage": "https://bitwarden.com",
  "license": "GPL-3.0",
-  "main": "main.js",
+  "main": "main.mjs",
  "repository": {
    "type": "git",
    "url": "https://github.com/bitwarden/directory-connector"
  },
  "bin": {
-    "bwdc": "../build-cli/bwdc.js"
+    "bwdc": "../build-cli/bwdc.cjs"
  },
  "pkg": {
    "assets": "../build-cli/**/*"
--- a/src/app/main.ts
+++ b/src/app/main.ts
@@ -1,4 +1,4 @@
-import { enableProdMode, provideZoneChangeDetection } from "@angular/core";
+import { enableProdMode } from "@angular/core";
 import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";

 import { isDev } from "@/jslib/electron/src/utils";
@@ -11,7 +11,4 @@ if (!isDev()) {
  enableProdMode();
 }

-platformBrowserDynamic().bootstrapModule(AppModule, {
-  applicationProviders: [provideZoneChangeDetection()],
-  preserveWhitespaces: true,
-});
+platformBrowserDynamic().bootstrapModule(AppModule, { preserveWhitespaces: true });
--- a/src/app/tabs/dashboard.component.html
+++ b/src/app/tabs/dashboard.component.html
@@ -3,25 +3,17 @@
  <div class="card-body">
    <p>
      {{ "lastGroupSync" | i18n }}:
-      @if (!lastGroupSync) {
-        <span>-</span>
-      }
+      <span *ngIf="!lastGroupSync">-</span>
      {{ lastGroupSync | date: "medium" }}
      <br />
      {{ "lastUserSync" | i18n }}:
-      @if (!lastUserSync) {
-        <span>-</span>
-      }
+      <span *ngIf="!lastUserSync">-</span>
      {{ lastUserSync | date: "medium" }}
    </p>
    <p>
      {{ "syncStatus" | i18n }}:
-      @if (syncRunning) {
-        <strong class="text-success">{{ "running" | i18n }}</strong>
-      }
-      @if (!syncRunning) {
-        <strong class="text-danger">{{ "stopped" | i18n }}</strong>
-      }
+      <strong *ngIf="syncRunning" class="text-success">{{ "running" | i18n }}</strong>
+      <strong *ngIf="!syncRunning" class="text-danger">{{ "stopped" | i18n }}</strong>
    </p>
    <form #startForm [appApiAction]="startPromise" class="d-inline">
      <button
@@ -68,85 +60,57 @@
      />
      <label class="form-check-label" for="simSinceLast">{{ "testLastSync" | i18n }}</label>
    </div>
-    @if (!simForm.loading && (simUsers || simGroups)) {
+    <ng-container *ngIf="!simForm.loading && (simUsers || simGroups)">
      <hr />
      <div class="row">
        <div class="col-lg">
          <h4>{{ "users" | i18n }}</h4>
-          @if (simEnabledUsers && simEnabledUsers.length) {
-            <ul class="bwi-ul testing-list">
-              @for (u of simEnabledUsers; track u) {
-                <li title="{{ u.referenceId }}">
-                  <i class="bwi bwi-li bwi-user"></i>
-                  {{ u.displayName }}
-                </li>
-              }
-            </ul>
-          }
-          @if (!simEnabledUsers || !simEnabledUsers.length) {
-            <p>
-              {{ "noUsers" | i18n }}
-            </p>
-          }
+          <ul class="bwi-ul testing-list" *ngIf="simEnabledUsers && simEnabledUsers.length">
+            <li *ngFor="let u of simEnabledUsers" title="{{ u.referenceId }}">
+              <i class="bwi bwi-li bwi-user"></i>
+              {{ u.displayName }}
+            </li>
+          </ul>
+          <p *ngIf="!simEnabledUsers || !simEnabledUsers.length">
+            {{ "noUsers" | i18n }}
+          </p>
          <h4>{{ "disabledUsers" | i18n }}</h4>
-          @if (simDisabledUsers && simDisabledUsers.length) {
-            <ul class="bwi-ul testing-list">
-              @for (u of simDisabledUsers; track u) {
-                <li title="{{ u.referenceId }}">
-                  <i class="bwi bwi-li bwi-user"></i>
-                  {{ u.displayName }}
-                </li>
-              }
-            </ul>
-          }
-          @if (!simDisabledUsers || !simDisabledUsers.length) {
-            <p>
-              {{ "noUsers" | i18n }}
-            </p>
-          }
+          <ul class="bwi-ul testing-list" *ngIf="simDisabledUsers && simDisabledUsers.length">
+            <li *ngFor="let u of simDisabledUsers" title="{{ u.referenceId }}">
+              <i class="bwi bwi-li bwi-user"></i>
+              {{ u.displayName }}
+            </li>
+          </ul>
+          <p *ngIf="!simDisabledUsers || !simDisabledUsers.length">
+            {{ "noUsers" | i18n }}
+          </p>
          <h4>{{ "deletedUsers" | i18n }}</h4>
-          @if (simDeletedUsers && simDeletedUsers.length) {
-            <ul class="bwi-ul testing-list">
-              @for (u of simDeletedUsers; track u) {
-                <li title="{{ u.referenceId }}">
-                  <i class="bwi bwi-li bwi-user"></i>
-                  {{ u.displayName }}
-                </li>
-              }
-            </ul>
-          }
-          @if (!simDeletedUsers || !simDeletedUsers.length) {
-            <p>
-              {{ "noUsers" | i18n }}
-            </p>
-          }
+          <ul class="bwi-ul testing-list" *ngIf="simDeletedUsers && simDeletedUsers.length">
+            <li *ngFor="let u of simDeletedUsers" title="{{ u.referenceId }}">
+              <i class="bwi bwi-li bwi-user"></i>
+              {{ u.displayName }}
+            </li>
+          </ul>
+          <p *ngIf="!simDeletedUsers || !simDeletedUsers.length">
+            {{ "noUsers" | i18n }}
+          </p>
        </div>
        <div class="col-lg">
          <h4>{{ "groups" | i18n }}</h4>
-          @if (simGroups && simGroups.length) {
-            <ul class="bwi-ul testing-list">
-              @for (g of simGroups; track g) {
-                <li title="{{ g.referenceId }}">
-                  <i class="bwi bwi-li bwi-sitemap"></i>
-                  {{ g.displayName }}
-                  @if (g.users && g.users.length) {
-                    <ul class="small">
-                      @for (u of g.users; track u) {
-                        <li title="{{ u.referenceId }}">
-                          {{ u.displayName }}
-                        </li>
-                      }
-                    </ul>
-                  }
+          <ul class="bwi-ul testing-list" *ngIf="simGroups && simGroups.length">
+            <li *ngFor="let g of simGroups" title="{{ g.referenceId }}">
+              <i class="bwi bwi-li bwi-sitemap"></i>
+              {{ g.displayName }}
+              <ul class="small" *ngIf="g.users && g.users.length">
+                <li *ngFor="let u of g.users" title="{{ u.referenceId }}">
+                  {{ u.displayName }}
                </li>
-              }
-            </ul>
-          }
-          @if (!simGroups || !simGroups.length) {
-            <p>{{ "noGroups" | i18n }}</p>
-          }
+              </ul>
+            </li>
+          </ul>
+          <p *ngIf="!simGroups || !simGroups.length">{{ "noGroups" | i18n }}</p>
        </div>
      </div>
-    }
+    </ng-container>
  </div>
 </div>
--- a/src/app/tabs/settings.component.html
+++ b/src/app/tabs/settings.component.html
@@ -6,11 +6,9 @@
        <div class="mb-3">
          <label for="directory" class="form-label">{{ "type" | i18n }}</label>
          <select class="form-select" id="directory" name="Directory" [(ngModel)]="directory">
-            @for (o of directoryOptions; track o) {
-              <option [ngValue]="o.value">
-                {{ o.name }}
-              </option>
-            }
+            <option *ngFor="let o of directoryOptions" [ngValue]="o.value">
+              {{ o.name }}
+            </option>
          </select>
        </div>
        <div [hidden]="directory != directoryType.Ldap">
@@ -53,22 +51,20 @@
              <label class="form-check-label" for="ad">{{ "ldapAd" | i18n }}</label>
            </div>
          </div>
-          @if (!ldap.ad) {
-            <div class="mb-3">
-              <div class="form-check">
-                <input
-                  class="form-check-input"
-                  type="checkbox"
-                  id="pagedSearch"
-                  [(ngModel)]="ldap.pagedSearch"
-                  name="PagedSearch"
-                />
-                <label class="form-check-label" for="pagedSearch">{{
-                  "ldapPagedResults" | i18n
-                }}</label>
-              </div>
+          <div class="mb-3" *ngIf="!ldap.ad">
+            <div class="form-check">
+              <input
+                class="form-check-input"
+                type="checkbox"
+                id="pagedSearch"
+                [(ngModel)]="ldap.pagedSearch"
+                name="PagedSearch"
+              />
+              <label class="form-check-label" for="pagedSearch">{{
+                "ldapPagedResults" | i18n
+              }}</label>
            </div>
-          }
+          </div>
          <div class="mb-3">
            <div class="form-check">
              <input
@@ -83,122 +79,116 @@
              }}</label>
            </div>
          </div>
-          @if (ldap.ssl) {
-            <div class="ms-4">
-              <div class="mb-3">
-                <div class="form-check">
-                  <input
-                    class="form-check-input"
-                    type="radio"
-                    [value]="false"
-                    id="ssl"
-                    [(ngModel)]="ldap.startTls"
-                    name="SSL"
-                  />
-                  <label class="form-check-label" for="ssl">{{ "ldapSsl" | i18n }}</label>
-                </div>
-                <div class="form-check">
-                  <input
-                    class="form-check-input"
-                    type="radio"
-                    [value]="true"
-                    id="startTls"
-                    [(ngModel)]="ldap.startTls"
-                    name="StartTLS"
-                  />
-                  <label class="form-check-label" for="startTls">{{ "ldapTls" | i18n }}</label>
-                </div>
+          <div class="ms-4" *ngIf="ldap.ssl">
+            <div class="mb-3">
+              <div class="form-check">
+                <input
+                  class="form-check-input"
+                  type="radio"
+                  [value]="false"
+                  id="ssl"
+                  [(ngModel)]="ldap.startTls"
+                  name="SSL"
+                />
+                <label class="form-check-label" for="ssl">{{ "ldapSsl" | i18n }}</label>
              </div>
-              @if (ldap.startTls) {
-                <div class="ms-4">
-                  <p>{{ "ldapTlsUntrustedDesc" | i18n }}</p>
-                  <div class="mb-3">
-                    <label for="tlsCaPath" class="form-label">{{ "ldapTlsCa" | i18n }}</label>
-                    <input
-                      type="file"
-                      class="form-control mb-2"
-                      id="tlsCaPath_file"
-                      (change)="setSslPath('tlsCaPath')"
-                    />
-                    <input
-                      type="text"
-                      class="form-control"
-                      id="tlsCaPath"
-                      name="TLSCaPath"
-                      [(ngModel)]="ldap.tlsCaPath"
-                    />
-                  </div>
-                </div>
-              }
-              @if (!ldap.startTls) {
-                <div class="ms-4">
-                  <p>{{ "ldapSslUntrustedDesc" | i18n }}</p>
-                  <div class="mb-3">
-                    <label for="sslCertPath" class="form-label">{{ "ldapSslCert" | i18n }}</label>
-                    <input
-                      type="file"
-                      class="form-control mb-2"
-                      id="sslCertPath_file"
-                      (change)="setSslPath('sslCertPath')"
-                    />
-                    <input
-                      type="text"
-                      class="form-control"
-                      id="sslCertPath"
-                      name="SSLCertPath"
-                      [(ngModel)]="ldap.sslCertPath"
-                    />
-                  </div>
-                  <div class="mb-3">
-                    <label for="sslKeyPath" class="form-label">{{ "ldapSslKey" | i18n }}</label>
-                    <input
-                      type="file"
-                      class="form-control mb-2"
-                      id="sslKeyPath_file"
-                      (change)="setSslPath('sslKeyPath')"
-                    />
-                    <input
-                      type="text"
-                      class="form-control"
-                      id="sslKeyPath"
-                      name="SSLKeyPath"
-                      [(ngModel)]="ldap.sslKeyPath"
-                    />
-                  </div>
-                  <div class="mb-3">
-                    <label for="sslCaPath" class="form-label">{{ "ldapSslCa" | i18n }}</label>
-                    <input
-                      type="file"
-                      class="form-control mb-2"
-                      id="sslCaPath_file"
-                      (change)="setSslPath('sslCaPath')"
-                    />
-                    <input
-                      type="text"
-                      class="form-control"
-                      id="sslCaPath"
-                      name="SSLCaPath"
-                      [(ngModel)]="ldap.sslCaPath"
-                    />
-                  </div>
-                </div>
-              }
-              <div class="mb-3">
-                <div class="form-check">
-                  <input
-                    class="form-check-input"
-                    type="checkbox"
-                    id="certDoNotVerify"
-                    [(ngModel)]="ldap.sslAllowUnauthorized"
-                    name="CertDoNoVerify"
-                  />
-                  <label class="form-check-label" for="certDoNotVerify">{{
-                    "ldapCertDoNotVerify" | i18n
-                  }}</label>
-                </div>
+              <div class="form-check">
+                <input
+                  class="form-check-input"
+                  type="radio"
+                  [value]="true"
+                  id="startTls"
+                  [(ngModel)]="ldap.startTls"
+                  name="StartTLS"
+                />
+                <label class="form-check-label" for="startTls">{{ "ldapTls" | i18n }}</label>
              </div>
            </div>
-          }
+            <div class="ms-4" *ngIf="ldap.startTls">
+              <p>{{ "ldapTlsUntrustedDesc" | i18n }}</p>
+              <div class="mb-3">
+                <label for="tlsCaPath" class="form-label">{{ "ldapTlsCa" | i18n }}</label>
+                <input
+                  type="file"
+                  class="form-control mb-2"
+                  id="tlsCaPath_file"
+                  (change)="setSslPath('tlsCaPath')"
+                />
+                <input
+                  type="text"
+                  class="form-control"
+                  id="tlsCaPath"
+                  name="TLSCaPath"
+                  [(ngModel)]="ldap.tlsCaPath"
+                />
+              </div>
+            </div>
+            <div class="ms-4" *ngIf="!ldap.startTls">
+              <p>{{ "ldapSslUntrustedDesc" | i18n }}</p>
+              <div class="mb-3">
+                <label for="sslCertPath" class="form-label">{{ "ldapSslCert" | i18n }}</label>
+                <input
+                  type="file"
+                  class="form-control mb-2"
+                  id="sslCertPath_file"
+                  (change)="setSslPath('sslCertPath')"
+                />
+                <input
+                  type="text"
+                  class="form-control"
+                  id="sslCertPath"
+                  name="SSLCertPath"
+                  [(ngModel)]="ldap.sslCertPath"
+                />
+              </div>
+              <div class="mb-3">
+                <label for="sslKeyPath" class="form-label">{{ "ldapSslKey" | i18n }}</label>
+                <input
+                  type="file"
+                  class="form-control mb-2"
+                  id="sslKeyPath_file"
+                  (change)="setSslPath('sslKeyPath')"
+                />
+                <input
+                  type="text"
+                  class="form-control"
+                  id="sslKeyPath"
+                  name="SSLKeyPath"
+                  [(ngModel)]="ldap.sslKeyPath"
+                />
+              </div>
+              <div class="mb-3">
+                <label for="sslCaPath" class="form-label">{{ "ldapSslCa" | i18n }}</label>
+                <input
+                  type="file"
+                  class="form-control mb-2"
+                  id="sslCaPath_file"
+                  (change)="setSslPath('sslCaPath')"
+                />
+                <input
+                  type="text"
+                  class="form-control"
+                  id="sslCaPath"
+                  name="SSLCaPath"
+                  [(ngModel)]="ldap.sslCaPath"
+                />
+              </div>
+            </div>
+            <div class="mb-3">
+              <div class="form-check">
+                <input
+                  class="form-check-input"
+                  type="checkbox"
+                  id="certDoNotVerify"
+                  [(ngModel)]="ldap.sslAllowUnauthorized"
+                  name="CertDoNoVerify"
+                />
+                <label class="form-check-label" for="certDoNotVerify">{{
+                  "ldapCertDoNotVerify" | i18n
+                }}</label>
+              </div>
+            </div>
+          </div>
          <div class="mb-3" [hidden]="true">
            <div class="form-check">
              <input
@@ -221,12 +211,10 @@
                name="Username"
                [(ngModel)]="ldap.username"
              />
-              @if (ldap.ad) {
-                <div class="form-text">{{ "ex" | i18n }} company\admin</div>
-              }
-              @if (!ldap.ad) {
-                <div class="form-text">{{ "ex" | i18n }} cn=admin,dc=company,dc=com</div>
-              }
+              <div class="form-text" *ngIf="ldap.ad">{{ "ex" | i18n }} company\admin</div>
+              <div class="form-text" *ngIf="!ldap.ad">
+                {{ "ex" | i18n }} cn=admin,dc=company,dc=com
+              </div>
            </div>
            <div class="mb-3">
              <label for="password" class="form-label">{{ "password" | i18n }}</label>
@@ -616,24 +604,18 @@
              name="UserFilter"
              [(ngModel)]="sync.userFilter"
            ></textarea>
-            @if (directory === directoryType.Ldap) {
-              <div class="form-text">
-                {{ "ex" | i18n }} (&amp;(givenName=John)(|(l=Dallas)(l=Austin)))
-              </div>
-            }
-            @if (directory === directoryType.EntraID) {
-              <div class="form-text">{{ "ex" | i18n }} exclude:joe&#64;company.com</div>
-            }
-            @if (directory === directoryType.Okta) {
-              <div class="form-text">
-                {{ "ex" | i18n }} exclude:joe&#64;company.com | profile.firstName eq "John"
-              </div>
-            }
-            @if (directory === directoryType.GSuite) {
-              <div class="form-text">
-                {{ "ex" | i18n }} exclude:joe&#64;company.com | orgUnitPath=/Engineering
-              </div>
-            }
+            <div class="form-text" *ngIf="directory === directoryType.Ldap">
+              {{ "ex" | i18n }} (&amp;(givenName=John)(|(l=Dallas)(l=Austin)))
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.EntraID">
+              {{ "ex" | i18n }} exclude:joe&#64;company.com
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.Okta">
+              {{ "ex" | i18n }} exclude:joe&#64;company.com | profile.firstName eq "John"
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.GSuite">
+              {{ "ex" | i18n }} exclude:joe&#64;company.com | orgUnitPath=/Engineering
+            </div>
          </div>
          <div class="mb-3" [hidden]="directory != directoryType.Ldap">
            <label for="userPath" class="form-label">{{ "userPath" | i18n }}</label>
@@ -699,20 +681,18 @@
              name="GroupFilter"
              [(ngModel)]="sync.groupFilter"
            ></textarea>
-            @if (directory === directoryType.Ldap) {
-              <div class="form-text">
-                {{ "ex" | i18n }} (&amp;(objectClass=group)(!(cn=Sales*))(!(cn=IT*)))
-              </div>
-            }
-            @if (directory === directoryType.EntraID) {
-              <div class="form-text">{{ "ex" | i18n }} include:Sales,IT</div>
-            }
-            @if (directory === directoryType.Okta) {
-              <div class="form-text">{{ "ex" | i18n }} include:Sales,IT | type eq "APP_GROUP"</div>
-            }
-            @if (directory === directoryType.GSuite) {
-              <div class="form-text">{{ "ex" | i18n }} include:Sales,IT</div>
-            }
+            <div class="form-text" *ngIf="directory === directoryType.Ldap">
+              {{ "ex" | i18n }} (&amp;(objectClass=group)(!(cn=Sales*))(!(cn=IT*)))
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.EntraID">
+              {{ "ex" | i18n }} include:Sales,IT
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.Okta">
+              {{ "ex" | i18n }} include:Sales,IT | type eq "APP_GROUP"
+            </div>
+            <div class="form-text" *ngIf="directory === directoryType.GSuite">
+              {{ "ex" | i18n }} include:Sales,IT
+            </div>
          </div>
          <div class="mb-3" [hidden]="directory != directoryType.Ldap">
            <label for="groupPath" class="form-label">{{ "groupPath" | i18n }}</label>
@@ -723,12 +703,8 @@
              name="GroupPath"
              [(ngModel)]="sync.groupPath"
            />
-            @if (!ldap.ad) {
-              <div class="form-text">{{ "ex" | i18n }} CN=Groups</div>
-            }
-            @if (ldap.ad) {
-              <div class="form-text">{{ "ex" | i18n }} CN=Users</div>
-            }
+            <div class="form-text" *ngIf="!ldap.ad">{{ "ex" | i18n }} CN=Groups</div>
+            <div class="form-text" *ngIf="ldap.ad">{{ "ex" | i18n }} CN=Users</div>
          </div>
          <div [hidden]="directory != directoryType.Ldap || ldap.ad">
            <div class="mb-3">
--- a/src/models/account.ts
+++ b/src/models/account.ts
@@ -1,3 +1,5 @@
+import { Account as BaseAccount } from "@/jslib/common/src/models/domain/account";
+
 import { DirectoryType } from "@/src/enums/directoryType";

 import { EntraIdConfiguration } from "./entraIdConfiguration";
@@ -7,39 +9,23 @@ import { OktaConfiguration } from "./oktaConfiguration";
 import { OneLoginConfiguration } from "./oneLoginConfiguration";
 import { SyncConfiguration } from "./syncConfiguration";

-export class Account {
-  // Authentication fields (flattened from nested profile/tokens/keys structure)
-  userId: string;
-  entityId: string;
-  apiKeyClientId: string;
-  accessToken: string;
-  refreshToken: string;
-  apiKeyClientSecret: string;
-
-  // Directory Connector specific fields
-  directoryConfigurations: DirectoryConfigurations = new DirectoryConfigurations();
+export class Account extends BaseAccount {
+  directoryConfigurations?: DirectoryConfigurations = new DirectoryConfigurations();
  directorySettings: DirectorySettings = new DirectorySettings();
-
-  // FIXME: Remove these compatibility fields after StateServiceVNext migration (PR #990) is merged
-  // These fields are unused but required for type compatibility with jslib's StateService infrastructure
-  data?: any;
-  keys?: any;
-  profile?: any;
-  settings?: any;
-  tokens?: any;
+  clientKeys: ClientKeys = new ClientKeys();

  constructor(init: Partial<Account>) {
-    this.userId = init?.userId;
-    this.entityId = init?.entityId;
-    this.apiKeyClientId = init?.apiKeyClientId;
-    this.accessToken = init?.accessToken;
-    this.refreshToken = init?.refreshToken;
-    this.apiKeyClientSecret = init?.apiKeyClientSecret;
+    super(init);
    this.directoryConfigurations = init?.directoryConfigurations ?? new DirectoryConfigurations();
    this.directorySettings = init?.directorySettings ?? new DirectorySettings();
  }
 }

+export class ClientKeys {
+  clientId: string;
+  clientSecret: string;
+}
+
 export class DirectoryConfigurations {
  ldap: LdapConfiguration;
  gsuite: GSuiteConfiguration;
--- a/src/scss/bootstrap.scss
+++ b/src/scss/bootstrap.scss
@@ -28,4 +28,4 @@ $danger: map_get($theme-colors, "danger");
 $secondary: map_get($theme-colors, "secondary");
 $secondary-alt: map_get($theme-colors, "secondary-alt");

-@import "bootstrap/scss/bootstrap.scss";
+@import "~bootstrap/scss/bootstrap.scss";
--- a/src/scss/environment.scss
+++ b/src/scss/environment.scss
@@ -1,4 +1,4 @@
-@import "bootstrap/scss/_variables.scss";
+@import "~bootstrap/scss/_variables.scss";

 html.os_windows {
  body {
--- a/src/scss/misc.scss
+++ b/src/scss/misc.scss
@@ -1,4 +1,4 @@
-@import "bootstrap/scss/_variables.scss";
+@import "~bootstrap/scss/_variables.scss";

 body {
  padding: 10px 0 20px 0;
--- a/src/scss/plugins.scss
+++ b/src/scss/plugins.scss
@@ -1,6 +1,6 @@
-@import "ngx-toastr/toastr";
+@import "~ngx-toastr/toastr";

-@import "bootstrap/scss/_variables.scss";
+@import "~bootstrap/scss/_variables.scss";

 .toast-container {
  .toast-close-button {
--- a/src/services/auth.service.ts
+++ b/src/services/auth.service.ts
@@ -2,6 +2,11 @@ import { ApiService } from "@/jslib/common/src/abstractions/api.service";
 import { AppIdService } from "@/jslib/common/src/abstractions/appId.service";
 import { MessagingService } from "@/jslib/common/src/abstractions/messaging.service";
 import { PlatformUtilsService } from "@/jslib/common/src/abstractions/platformUtils.service";
+import {
+  AccountKeys,
+  AccountProfile,
+  AccountTokens,
+} from "@/jslib/common/src/models/domain/account";
 import { DeviceRequest } from "@/jslib/common/src/models/request/deviceRequest";
 import { ApiTokenRequest } from "@/jslib/common/src/models/request/identityToken/apiTokenRequest";
 import { TokenRequestTwoFactor } from "@/jslib/common/src/models/request/identityToken/tokenRequestTwoFactor";
@@ -57,12 +62,27 @@ export class AuthService {

    await this.stateService.addAccount(
      new Account({
-        userId: entityId,
-        entityId: entityId,
-        apiKeyClientId: clientId,
-        accessToken: tokenResponse.accessToken,
-        refreshToken: tokenResponse.refreshToken,
-        apiKeyClientSecret: clientSecret,
+        profile: {
+          ...new AccountProfile(),
+          ...{
+            userId: entityId,
+            apiKeyClientId: clientId,
+            entityId: entityId,
+          },
+        },
+        tokens: {
+          ...new AccountTokens(),
+          ...{
+            accessToken: tokenResponse.accessToken,
+            refreshToken: tokenResponse.refreshToken,
+          },
+        },
+        keys: {
+          ...new AccountKeys(),
+          ...{
+            apiKeyClientSecret: clientSecret,
+          },
+        },
        directorySettings: new DirectorySettings(),
        directoryConfigurations: new DirectoryConfigurations(),
      }),
--- a/src/services/authService.spec.ts
+++ b/src/services/authService.spec.ts
@@ -1,12 +1,17 @@
-import { mock } from "jest-mock-extended";
+import { Arg, Substitute, SubstituteOf } from "@fluffy-spoon/substitute";

 import { ApiService } from "@/jslib/common/src/abstractions/api.service";
 import { AppIdService } from "@/jslib/common/src/abstractions/appId.service";
-import { MessagingService } from "@/jslib/common/src/abstractions/messaging.service";
 import { PlatformUtilsService } from "@/jslib/common/src/abstractions/platformUtils.service";
 import { Utils } from "@/jslib/common/src/misc/utils";
+import {
+  AccountKeys,
+  AccountProfile,
+  AccountTokens,
+} from "@/jslib/common/src/models/domain/account";
 import { IdentityTokenResponse } from "@/jslib/common/src/models/response/identityTokenResponse";

+import { MessagingService } from "../../jslib/common/src/abstractions/messaging.service";
 import { Account, DirectoryConfigurations, DirectorySettings } from "../models/account";

 import { AuthService } from "./auth.service";
@@ -30,22 +35,22 @@ export function identityTokenResponseFactory() {
 }

 describe("AuthService", () => {
-  let apiService: jest.Mocked<ApiService>;
-  let appIdService: jest.Mocked<AppIdService>;
-  let platformUtilsService: jest.Mocked<PlatformUtilsService>;
-  let messagingService: jest.Mocked<MessagingService>;
-  let stateService: jest.Mocked<StateService>;
+  let apiService: SubstituteOf<ApiService>;
+  let appIdService: SubstituteOf<AppIdService>;
+  let platformUtilsService: SubstituteOf<PlatformUtilsService>;
+  let messagingService: SubstituteOf<MessagingService>;
+  let stateService: SubstituteOf<StateService>;

  let authService: AuthService;

  beforeEach(async () => {
-    apiService = mock<ApiService>();
-    appIdService = mock<AppIdService>();
-    platformUtilsService = mock<PlatformUtilsService>();
-    stateService = mock<StateService>();
-    messagingService = mock<MessagingService>();
+    apiService = Substitute.for();
+    appIdService = Substitute.for();
+    platformUtilsService = Substitute.for();
+    stateService = Substitute.for();
+    messagingService = Substitute.for();

-    appIdService.getAppId.mockResolvedValue(deviceId);
+    appIdService.getAppId().resolves(deviceId);

    authService = new AuthService(
      apiService,
@@ -57,19 +62,33 @@ describe("AuthService", () => {
  });

  it("sets the local environment after a successful login", async () => {
-    apiService.postIdentityToken.mockResolvedValue(identityTokenResponseFactory());
+    apiService.postIdentityToken(Arg.any()).resolves(identityTokenResponseFactory());

    await authService.logIn({ clientId, clientSecret });

-    expect(stateService.addAccount).toHaveBeenCalledTimes(1);
-    expect(stateService.addAccount).toHaveBeenCalledWith(
+    stateService.received(1).addAccount(
      new Account({
-        userId: "CLIENT_ID",
-        entityId: "CLIENT_ID",
-        apiKeyClientId: clientId, // with the "organization." prefix
-        accessToken: accessToken,
-        refreshToken: refreshToken,
-        apiKeyClientSecret: clientSecret,
+        profile: {
+          ...new AccountProfile(),
+          ...{
+            userId: "CLIENT_ID",
+            apiKeyClientId: clientId, // with the "organization." prefix
+            entityId: "CLIENT_ID",
+          },
+        },
+        tokens: {
+          ...new AccountTokens(),
+          ...{
+            accessToken: accessToken,
+            refreshToken: refreshToken,
+          },
+        },
+        keys: {
+          ...new AccountKeys(),
+          ...{
+            apiKeyClientSecret: clientSecret,
+          },
+        },
        directorySettings: new DirectorySettings(),
        directoryConfigurations: new DirectoryConfigurations(),
      }),
--- a/src/services/state.service.ts
+++ b/src/services/state.service.ts
@@ -558,16 +558,18 @@ export class StateService

  protected async scaffoldNewAccountDiskStorage(account: Account): Promise<void> {
    const storageOptions = this.reconcileOptions(
-      { userId: account.userId },
+      { userId: account.profile.userId },
      await this.defaultOnDiskLocalOptions(),
    );

    const storedAccount = await this.getAccount(storageOptions);
    if (storedAccount != null) {
+      account.settings = storedAccount.settings;
      account.directorySettings = storedAccount.directorySettings;
      account.directoryConfigurations = storedAccount.directoryConfigurations;
    } else if (await this.hasTemporaryStorage()) {
      // If migrating to state V2 with an no actively authed account we store temporary data to be copied on auth - this will only be run once.
+      account.settings = await this.storageService.get<any>(keys.tempAccountSettings);
      account.directorySettings = await this.storageService.get<any>(keys.tempDirectorySettings);
      account.directoryConfigurations = await this.storageService.get<any>(
        keys.tempDirectoryConfigs,
@@ -598,7 +600,7 @@ export class StateService

  protected resetAccount(account: Account) {
    const persistentAccountInformation = {
-      settings: account.settings, // Required by base class (unused by DC)
+      settings: account.settings,
      directorySettings: account.directorySettings,
      directoryConfigurations: account.directoryConfigurations,
    };
--- a/src/services/stateMigration.service.spec.ts
+++ b/src/services/stateMigration.service.spec.ts
@@ -1,209 +0,0 @@
-import { mock } from "jest-mock-extended";
-
-import { StorageService } from "@/jslib/common/src/abstractions/storage.service";
-import { StateVersion } from "@/jslib/common/src/enums/stateVersion";
-import { StateFactory } from "@/jslib/common/src/factories/stateFactory";
-
-import { Account, DirectoryConfigurations, DirectorySettings } from "../models/account";
-
-import { StateMigrationService } from "./stateMigration.service";
-
-describe("StateMigrationService - v4 to v5 migration", () => {
-  let storageService: jest.Mocked<StorageService>;
-  let secureStorageService: jest.Mocked<StorageService>;
-  let stateFactory: jest.Mocked<StateFactory<any, Account>>;
-  let migrationService: StateMigrationService;
-
-  beforeEach(() => {
-    storageService = mock<StorageService>();
-    secureStorageService = mock<StorageService>();
-    stateFactory = mock<StateFactory<any, Account>>();
-
-    migrationService = new StateMigrationService(
-      storageService,
-      secureStorageService,
-      stateFactory,
-    );
-  });
-
-  it("should flatten nested account structure", async () => {
-    const userId = "test-user-id";
-    const oldAccount = {
-      profile: {
-        userId: userId,
-        entityId: userId,
-        apiKeyClientId: "organization.CLIENT_ID",
-      },
-      tokens: {
-        accessToken: "test-access-token",
-        refreshToken: "test-refresh-token",
-      },
-      keys: {
-        apiKeyClientSecret: "test-secret",
-      },
-      directoryConfigurations: new DirectoryConfigurations(),
-      directorySettings: new DirectorySettings(),
-    };
-
-    storageService.get.mockImplementation((key: string) => {
-      if (key === "authenticatedAccounts") {
-        return Promise.resolve([userId]);
-      }
-      if (key === userId) {
-        return Promise.resolve(oldAccount);
-      }
-      if (key === "global") {
-        return Promise.resolve({ stateVersion: StateVersion.Four });
-      }
-      return Promise.resolve(null);
-    });
-
-    await migrationService["migrateStateFrom4To5"]();
-
-    expect(storageService.save).toHaveBeenCalledWith(
-      userId,
-      expect.objectContaining({
-        userId: userId,
-        entityId: userId,
-        apiKeyClientId: "organization.CLIENT_ID",
-        accessToken: "test-access-token",
-        refreshToken: "test-refresh-token",
-        apiKeyClientSecret: "test-secret",
-      }),
-      expect.anything(),
-    );
-  });
-
-  it("should handle missing nested objects gracefully", async () => {
-    const userId = "test-user-id";
-    const partialAccount = {
-      directoryConfigurations: new DirectoryConfigurations(),
-      directorySettings: new DirectorySettings(),
-    };
-
-    storageService.get.mockImplementation((key: string) => {
-      if (key === "authenticatedAccounts") {
-        return Promise.resolve([userId]);
-      }
-      if (key === userId) {
-        return Promise.resolve(partialAccount);
-      }
-      if (key === "global") {
-        return Promise.resolve({ stateVersion: StateVersion.Four });
-      }
-      return Promise.resolve(null);
-    });
-
-    await migrationService["migrateStateFrom4To5"]();
-
-    expect(storageService.save).toHaveBeenCalledWith(
-      userId,
-      expect.objectContaining({
-        userId: userId,
-        apiKeyClientId: null,
-        accessToken: null,
-      }),
-      expect.anything(),
-    );
-  });
-
-  it("should handle empty account list", async () => {
-    storageService.get.mockImplementation((key: string) => {
-      if (key === "authenticatedAccounts") {
-        return Promise.resolve([]);
-      }
-      if (key === "global") {
-        return Promise.resolve({ stateVersion: StateVersion.Four });
-      }
-      return Promise.resolve(null);
-    });
-
-    await migrationService["migrateStateFrom4To5"]();
-
-    expect(storageService.save).toHaveBeenCalledWith(
-      "global",
-      expect.objectContaining({ stateVersion: StateVersion.Five }),
-      expect.anything(),
-    );
-    expect(storageService.save).toHaveBeenCalledTimes(1);
-  });
-
-  it("should preserve directory configurations and settings", async () => {
-    const userId = "test-user-id";
-    const directoryConfigs = new DirectoryConfigurations();
-    directoryConfigs.ldap = { host: "ldap.example.com" } as any;
-
-    const directorySettings = new DirectorySettings();
-    directorySettings.organizationId = "org-123";
-    directorySettings.lastSyncHash = "hash-abc";
-
-    const oldAccount = {
-      profile: { userId: userId },
-      tokens: {},
-      keys: {},
-      directoryConfigurations: directoryConfigs,
-      directorySettings: directorySettings,
-    };
-
-    storageService.get.mockImplementation((key: string) => {
-      if (key === "authenticatedAccounts") {
-        return Promise.resolve([userId]);
-      }
-      if (key === userId) {
-        return Promise.resolve(oldAccount);
-      }
-      if (key === "global") {
-        return Promise.resolve({ stateVersion: StateVersion.Four });
-      }
-      return Promise.resolve(null);
-    });
-
-    await migrationService["migrateStateFrom4To5"]();
-
-    expect(storageService.save).toHaveBeenCalledWith(
-      userId,
-      expect.objectContaining({
-        directoryConfigurations: expect.objectContaining({
-          ldap: { host: "ldap.example.com" },
-        }),
-        directorySettings: expect.objectContaining({
-          organizationId: "org-123",
-          lastSyncHash: "hash-abc",
-        }),
-      }),
-      expect.anything(),
-    );
-  });
-
-  it("should update state version after successful migration", async () => {
-    const userId = "test-user-id";
-    const oldAccount = {
-      profile: { userId: userId },
-      tokens: {},
-      keys: {},
-      directoryConfigurations: new DirectoryConfigurations(),
-      directorySettings: new DirectorySettings(),
-    };
-
-    storageService.get.mockImplementation((key: string) => {
-      if (key === "authenticatedAccounts") {
-        return Promise.resolve([userId]);
-      }
-      if (key === userId) {
-        return Promise.resolve(oldAccount);
-      }
-      if (key === "global") {
-        return Promise.resolve({ stateVersion: StateVersion.Four });
-      }
-      return Promise.resolve(null);
-    });
-
-    await migrationService["migrateStateFrom4To5"]();
-
-    expect(storageService.save).toHaveBeenCalledWith(
-      "global",
-      expect.objectContaining({ stateVersion: StateVersion.Five }),
-      expect.anything(),
-    );
-  });
-});
--- a/src/services/stateMigration.service.ts
+++ b/src/services/stateMigration.service.ts
@@ -61,13 +61,6 @@ export class StateMigrationService extends BaseStateMigrationService {
          break;
        case StateVersion.Two:
          await this.migrateStateFrom2To3();
-          break;
-        case StateVersion.Three:
-          await this.migrateStateFrom3To4();
-          break;
-        case StateVersion.Four:
-          await this.migrateStateFrom4To5();
-          break;
      }
      currentStateVersion += 1;
    }
@@ -150,10 +143,15 @@ export class StateMigrationService extends BaseStateMigrationService {
    const account = await this.get<Account>(userId);
    account.directoryConfigurations = directoryConfigs;
    account.directorySettings = directorySettings;
-    account.userId = userId;
-    account.entityId = userId;
-    account.apiKeyClientId = clientId;
-    account.apiKeyClientSecret = clientSecret;
+    account.profile = {
+      userId: userId,
+      entityId: userId,
+      apiKeyClientId: clientId,
+    };
+    account.clientKeys = {
+      clientId: clientId,
+      clientSecret: clientSecret,
+    };

    await this.set(userId, account);
    await clearDirectoryConnectorV1Keys();
@@ -200,57 +198,4 @@ export class StateMigrationService extends BaseStateMigrationService {
    globals.stateVersion = StateVersion.Three;
    await this.set(StateKeys.global, globals);
  }
-
-  protected async migrateStateFrom3To4(): Promise<void> {
-    // Placeholder migration for v3→v4 (no changes needed for DC)
-    const globals = await this.getGlobals();
-    globals.stateVersion = StateVersion.Four;
-    await this.set(StateKeys.global, globals);
-  }
-
-  protected async migrateStateFrom4To5(): Promise<void> {
-    const authenticatedUserIds = await this.get<string[]>(StateKeys.authenticatedAccounts);
-
-    if (!authenticatedUserIds || authenticatedUserIds.length === 0) {
-      // No accounts to migrate, just update version
-      const globals = await this.getGlobals();
-      globals.stateVersion = StateVersion.Five;
-      await this.set(StateKeys.global, globals);
-      return;
-    }
-
-    await Promise.all(
-      authenticatedUserIds.map(async (userId) => {
-        const oldAccount = await this.get<any>(userId);
-
-        if (!oldAccount) {
-          return;
-        }
-
-        // Create new flattened account structure
-        const flattenedAccount = new Account({
-          // Extract from nested structures
-          userId: oldAccount.profile?.userId ?? userId,
-          entityId: oldAccount.profile?.entityId ?? userId,
-          apiKeyClientId: oldAccount.profile?.apiKeyClientId ?? null,
-          accessToken: oldAccount.tokens?.accessToken ?? null,
-          refreshToken: oldAccount.tokens?.refreshToken ?? null,
-          apiKeyClientSecret: oldAccount.keys?.apiKeyClientSecret ?? null,
-
-          // Preserve existing DC-specific data
-          directoryConfigurations:
-            oldAccount.directoryConfigurations ?? new DirectoryConfigurations(),
-          directorySettings: oldAccount.directorySettings ?? new DirectorySettings(),
-        });
-
-        // Save flattened account back to storage
-        await this.set(userId, flattenedAccount);
-      }),
-    );
-
-    // Update global state version
-    const globals = await this.getGlobals();
-    globals.stateVersion = StateVersion.Five;
-    await this.set(StateKeys.global, globals);
-  }
 }
--- a/test.setup.ts
+++ b/test.setup.ts
@@ -1,7 +1,7 @@
 import { webcrypto } from "crypto";
-import { TextEncoder, TextDecoder } from "util";

-Object.assign(globalThis, { TextEncoder, TextDecoder });
+import "jest-preset-angular/setup-jest";
+
 Object.defineProperty(window, "CSS", { value: null });
 Object.defineProperty(window, "getComputedStyle", {
  value: () => {
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -5,9 +5,9 @@
  },
  "compilerOptions": {
    "pretty": true,
-    "moduleResolution": "bundler",
+    "moduleResolution": "node",
    "noImplicitAny": true,
-    "target": "ES2016",
+    "target": "ES2020",
    "module": "ES2020",
    "lib": ["es5", "es6", "es7", "dom"],
    "sourceMap": true,
@@ -18,6 +18,8 @@
    "outDir": "dist",
    "baseUrl": ".",
    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "noEmitOnError": false,
    "paths": {
      "tldjs": ["./jslib/common/src/misc/tldjs.noop"],
      "@/*": ["./*"]
--- a/tsconfig.renderer.json
+++ b/tsconfig.renderer.json
@@ -0,0 +1,13 @@
+{
+  "extends": "./tsconfig.json",
+  "angularCompilerOptions": {
+    "strictTemplates": true,
+    "preserveWhitespaces": true
+  },
+  "compilerOptions": {
+    "skipLibCheck": true,
+    "noEmitOnError": false
+  },
+  "include": ["src/app"],
+  "exclude": ["jslib", "**/*.spec.ts"]
+}
--- a/webpack.cli.cjs
+++ b/webpack.cli.cjs
@@ -14,7 +14,12 @@ const ENV = (process.env.ENV = process.env.NODE_ENV);
 const moduleRules = [
  {
    test: /\.ts$/,
-    use: "ts-loader",
+    use: {
+      loader: "ts-loader",
+      options: {
+        transpileOnly: true,
+      },
+    },
    exclude: path.resolve(__dirname, "node_modules"),
  },
  {
@@ -62,7 +67,7 @@ const config = {
    modules: [path.resolve("node_modules")],
  },
  output: {
-    filename: "[name].js",
+    filename: "[name].cjs",
    path: path.resolve(__dirname, "build-cli"),
  },
  module: { rules: moduleRules },
--- a/webpack.main.cjs
+++ b/webpack.main.cjs
@@ -10,7 +10,12 @@ const common = {
    rules: [
      {
        test: /\.tsx?$/,
-        use: "ts-loader",
+        use: {
+          loader: "ts-loader",
+          options: {
+            transpileOnly: true,
+          },
+        },
        exclude: /node_modules\/(?!(@bitwarden)\/).*/,
      },
    ],
@@ -57,6 +62,9 @@ const main = {
      ],
    }),
  ],
+  output: {
+    filename: "[name].cjs",
+  },
  externals: {
    "electron-reload": "commonjs2 electron-reload",
    keytar: "commonjs2 keytar",
--- a/webpack.renderer.cjs
+++ b/webpack.renderer.cjs
@@ -38,7 +38,7 @@ const common = {
  plugins: [],
  resolve: {
    extensions: [".tsx", ".ts", ".js", ".json"],
-    plugins: [new TsconfigPathsPlugin({ configFile: "./tsconfig.json" })],
+    plugins: [new TsconfigPathsPlugin({ configFile: "./tsconfig.renderer.json" })],
    symlinks: false,
    modules: [path.resolve("node_modules")],
  },
@@ -113,7 +113,7 @@ const renderer = {
  },
  plugins: [
    new AngularWebpackPlugin({
-      tsConfigPath: "tsconfig.json",
+      tsConfigPath: "tsconfig.renderer.json",
      entryModule: "src/app/app.module#AppModule",
      sourceMap: true,
    }),
Author	SHA1	Message	Date
Sven	22fe0bc482	Claude upgrade shenanigans	2026-01-22 11:00:40 -06:00
Sven	5b1dd63c49	Claude upgrade shenanigans	2026-01-22 10:59:05 -06:00