Merge pull request #3226 from codecrafters-io/clear-local-storage-on-logout

Clear local storage when logging out

Author: VasylMarchuk

app/services/authenticator.ts

@@ -7,11 +7,13 @@ import Store from '@ember-data/store';
 import window from 'ember-window-mock';
 import { tracked } from '@glimmer/tracking';
 import type UserModel from 'codecrafters-frontend/models/user';
+import type LocalStorageService from 'codecrafters-frontend/services/local-storage';
 
 export default class AuthenticatorService extends Service {
   @service declare router: RouterService;
   @service declare sessionTokenStorage: SessionTokenStorageService;
   @service declare currentUserCacheStorage: CurrentUserCacheStorageService;
+  @service declare localStorage: LocalStorageService;
   @service declare store: Store;
 
   // TODO: See if there's a way around using this
@@ -91,6 +93,8 @@ export default class AuthenticatorService extends Service {
     this.sessionTokenStorage.clear();
     // eslint-disable-next-line ember/no-array-prototype-extensions
     this.currentUserCacheStorage.clear();
+    // eslint-disable-next-line ember/no-array-prototype-extensions
+    this.localStorage.clear();
     this.cacheBuster++;
   }
 

app/services/local-storage.ts

@@ -1,51 +1,127 @@
 import Service from '@ember/service';
 
+/**
+ * Returns the localStorage key with application-specific prefix applied.
+ *
+ * @param {string} [key=''] - The unprefixed key.
+ * @returns {string} The prefixed key used in window.localStorage.
+ */
+function prefixKey(key: string = ''): string {
+  return `cc-frontend:${key}`;
+}
+
+/**
+ * Collects and returns all keys from window.localStorage that start with the
+ * application prefix. Returned keys are unprefixed (prefix removed).
+ *
+ * @returns {string[]} Array of keys stored under the application prefix.
+ */
+function getLocalStorageKeys(): string[] {
+  return Array.from({ length: window.localStorage?.length || 0 }, (_, i) => window.localStorage?.key(i) || null)
+    .filter((k) => k !== null)
+    .filter((k) => k.startsWith(prefixKey()))
+    .map((key) => key.substring(prefixKey().length));
+}
+
+/**
+ * Service wrapping browser localStorage access and applying an app-specific prefix
+ * to all keys. Provides safe guards for environments where window.localStorage
+ * may be unavailable and convenience methods for common operations.
+ */
 export default class LocalStorageService extends Service {
-  get length(): number {
-    if (!window.localStorage) {
-      return 0;
-    }
+  /**
+   * Initialize the service and perform cleanup of known legacy keys.
+   * TODO: legacy key removal is temporary and can be removed after migration.
+   */
+  constructor() {
+    super();
 
-    return window.localStorage.length;
+    // TODO: Remove legacy keys from local storage - safe to drop a month after merge
+    this.clearLegacyKeys();
   }
 
+  /**
+   * Number of prefixed keys available in window.localStorage.
+   */
+  get length(): number {
+    return getLocalStorageKeys().length;
+  }
+
+  /**
+   * Remove all prefixed keys from window.localStorage.
+   */
   clear(): void {
-    if (!window.localStorage) {
-      throw new Error('Clearing localStorage items is unavailable in the current context');
+    for (const key of getLocalStorageKeys()) {
+      this.removeItem(key);
     }
+  }
 
-    window.localStorage.clear();
+  /**
+   * Remove known legacy keys that were stored without the current prefix.
+   * This is a one-time migration helper.
+   */
+  clearLegacyKeys() {
+    for (const key of [
+      'current_user_cache_v1:user_id',
+      'current_user_cache_v1:username',
+      'preferred-language-leaderboard-v1',
+      'leaderboard-team-selection-v1',
+      'session_token_v1',
+    ]) {
+      window.localStorage?.removeItem(key);
+    }
   }
 
-  getItem(keyName: string): string | null {
+  /**
+   * Get a value from localStorage for the given key (unprefixed).
+   *
+   * @param {string} key - The unprefixed key to retrieve.
+   * @returns {string | null} The stored value, or null if not found or unavailable.
+   */
+  getItem(key: string): string | null {
     if (!window.localStorage) {
       return null;
     }
 
-    return window.localStorage.getItem(keyName);
+    return window.localStorage.getItem(prefixKey(key));
   }
 
+  /**
+   * Retrieve the unprefixed key at the given index.
+   *
+   * @param {number} index - Index of the key to retrieve.
+   * @returns {string | null} The unprefixed key or null if out of range.
+   */
   key(index: number): string | null {
-    if (!window.localStorage) {
-      return null;
-    }
-
-    return window.localStorage.key(index);
+    return getLocalStorageKeys()[index] || null;
   }
 
-  removeItem(keyName: string): void {
+  /**
+   * Remove the item associated with the given unprefixed key from localStorage.
+   *
+   * @param {string} key - The unprefixed key to remove.
+   * @throws Will throw if window.localStorage is not available.
+   */
+  removeItem(key: string): void {
     if (!window.localStorage) {
       throw new Error('Removing localStorage items is unavailable in the current context');
     }
 
-    window.localStorage.removeItem(keyName);
+    window.localStorage.removeItem(prefixKey(key));
   }
 
-  setItem(keyName: string, keyValue: string): void {
+  /**
+   * Set an item in localStorage under the given unprefixed key.
+   *
+   * @param {string} key - The unprefixed key under which to store the value.
+   * @param {string} value - The string value to store.
+   * @throws Will throw if window.localStorage is not available.
+   */
+  setItem(key: string, value: string): void {
     if (!window.localStorage) {
       throw new Error('Setting localStorage items is unavailable in the current context');
     }
 
-    window.localStorage.setItem(keyName, keyValue);
+    window.localStorage.setItem(prefixKey(key), value);
   }
 }

tests/unit/services/local-storage-test.js

@@ -4,9 +4,83 @@ import { setupTest } from 'codecrafters-frontend/tests/helpers';
 module('Unit | Service | local-storage', function (hooks) {
   setupTest(hooks);
 
-  // TODO: Replace this with your real tests.
-  test('it exists', function (assert) {
-    let service = this.owner.lookup('service:local-storage');
-    assert.ok(service);
+  test('getItem / setItem / removeItem use prefixed keys', function (assert) {
+    const service = this.owner.lookup('service:local-storage');
+
+    service.setItem('foo', 'bar');
+
+    assert.strictEqual(window.localStorage.getItem('cc-frontend:foo'), 'bar', 'raw storage has prefixed key');
+    assert.strictEqual(service.getItem('foo'), 'bar', 'service returns stored value');
+
+    service.removeItem('foo');
+    assert.strictEqual(service.getItem('foo'), null, 'value removed via service');
+    assert.strictEqual(window.localStorage.getItem('cc-frontend:foo'), null, 'raw storage entry removed');
+  });
+
+  test('length and key return prefixed keys only', function (assert) {
+    const service = this.owner.lookup('service:local-storage');
+
+    // add two prefixed keys and one non-prefixed
+    service.setItem('one', '1');
+    service.setItem('two', '2');
+    window.localStorage.setItem('three', '3');
+
+    assert.strictEqual(service.length, 2, 'service.length counts only prefixed keys');
+
+    const keys = [];
+
+    for (let i = 0; i < service.length; i++) {
+      keys.push(service.key(i));
+    }
+
+    // keys should be unprefixed
+    assert.ok(keys.includes('one'), 'contains one');
+    assert.ok(keys.includes('two'), 'contains two');
+    assert.notOk(keys.includes('three'), 'does not include non-prefixed key');
+  });
+
+  test('clear removes only prefixed keys and leaves others intact', function (assert) {
+    const service = this.owner.lookup('service:local-storage');
+
+    service.setItem('temp', 'x');
+    window.localStorage.setItem('other:keep', 'y');
+
+    // eslint-disable-next-line ember/no-array-prototype-extensions
+    service.clear();
+
+    // prefixed keys removed
+    assert.strictEqual(service.getItem('existing'), null, 'existing prefixed removed');
+    assert.strictEqual(service.getItem('temp'), null, 'temp prefixed removed');
+
+    // non-prefixed untouched
+    assert.strictEqual(window.localStorage.getItem('other:keep'), 'y', 'non-prefixed key remains');
+  });
+
+  test('clearLegacyKeys removes legacy keys from raw localStorage', function (assert) {
+    const initial = {
+      'cc-frontend:existing': 'yes',
+      'external:keep': 'stay',
+      // legacy keys that clearLegacyKeys should remove
+      'current_user_cache_v1:user_id': '1',
+      'current_user_cache_v1:username': 'u',
+      'preferred-language-leaderboard-v1': 'en',
+      'leaderboard-team-selection-v1': 'team',
+      session_token_v1: 'token',
+    };
+
+    for (const key of Object.keys(initial)) {
+      window.localStorage.setItem(key, initial[key]);
+    }
+
+    const service = this.owner.lookup('service:local-storage');
+    service.clearLegacyKeys();
+
+    assert.strictEqual(window.localStorage.getItem('cc-frontend:existing'), 'yes', 'cc-frontend:existing is preserved');
+    assert.strictEqual(window.localStorage.getItem('external:keep'), 'stay', 'external:keep is preserved');
+    assert.strictEqual(window.localStorage.getItem('current_user_cache_v1:user_id'), null, 'legacy user_id removed');
+    assert.strictEqual(window.localStorage.getItem('current_user_cache_v1:username'), null, 'legacy username removed');
+    assert.strictEqual(window.localStorage.getItem('preferred-language-leaderboard-v1'), null, 'legacy preferred-language removed');
+    assert.strictEqual(window.localStorage.getItem('leaderboard-team-selection-v1'), null, 'legacy leaderboard-team-selection removed');
+    assert.strictEqual(window.localStorage.getItem('session_token_v1'), null, 'legacy session_token removed');
   });
 });