ace-interview-prep 0.1.0

package/questions/leetcode-algo/two-sum/solution.test.ts

@@ -0,0 +1,55 @@
+import { describe, it, expect } from 'vitest';
+import { twoSum } from './solution';
+
+describe('twoSum', () => {
+  it('basic case: [2,7,11,15] target 9 returns [0,1]', () => {
+    const nums = [2, 7, 11, 15];
+    const result = twoSum(nums, 9);
+    expect(result).toHaveLength(2);
+    expect(result.sort()).toEqual([0, 1]);
+    expect(nums[result[0]] + nums[result[1]]).toBe(9);
+  });
+
+  it('handles negative numbers', () => {
+    const result = twoSum([-1, -2, -3, -4, -5], -8);
+    expect(result).toHaveLength(2);
+    const [i, j] = result;
+    expect([-1, -2, -3, -4, -5][i] + [-1, -2, -3, -4, -5][j]).toBe(-8);
+  });
+
+  it('handles zero in array', () => {
+    const result = twoSum([0, 4, 3, 0], 0);
+    expect(result).toHaveLength(2);
+    const [i, j] = result;
+    expect(i).not.toBe(j);
+    expect([0, 4, 3, 0][i] + [0, 4, 3, 0][j]).toBe(0);
+  });
+
+  it('handles large array', () => {
+    const nums = Array.from({ length: 10000 }, (_, i) => i);
+    const target = 9998;
+    const result = twoSum(nums, target);
+    expect(result).toHaveLength(2);
+    expect(nums[result[0]] + nums[result[1]]).toBe(target);
+  });
+
+  it('handles duplicate values', () => {
+    const result = twoSum([3, 3], 6);
+    expect(result).toHaveLength(2);
+    expect(result).toContain(0);
+    expect(result).toContain(1);
+    expect(result[0]).not.toBe(result[1]);
+  });
+
+  it('adjacent elements sum to target', () => {
+    const result = twoSum([1, 2, 3, 4], 7);
+    expect(result).toHaveLength(2);
+    expect([1, 2, 3, 4][result[0]] + [1, 2, 3, 4][result[1]]).toBe(7);
+  });
+
+  it('single pair in longer array', () => {
+    const result = twoSum([1, 2, 3, 4, 5, 6, 7, 8, 9], 17);
+    expect(result).toHaveLength(2);
+    expect([1, 2, 3, 4, 5, 6, 7, 8, 9][result[0]] + [1, 2, 3, 4, 5, 6, 7, 8, 9][result[1]]).toBe(17);
+  });
+});

package/questions/leetcode-algo/two-sum/solution.ts

@@ -0,0 +1,4 @@
+export function twoSum(nums: number[], target: number): [number, number] {
+  // TODO: implement
+  return [0, 0];
+}

package/questions/leetcode-ds/lru-cache/README.md

@@ -0,0 +1,70 @@
+# Implement an LRU Cache
+
+**Category:** LeetCode Data Structures  
+**Difficulty:** Hard  
+**Suggested Time:** ~45 minutes
+
+---
+
+## Problem
+
+Implement an LRU (Least Recently Used) Cache class with `get(key)` and `put(key, value)` methods. Both operations must run in **O(1)** time complexity.
+
+The constructor takes a `capacity` parameter that determines the maximum number of key-value pairs the cache can hold. When the cache reaches capacity and a new item is inserted, the least recently used item must be evicted.
+
+## Class Signature
+
+```ts
+class LRUCache {
+  constructor(capacity: number)
+  get(key: number): number
+  put(key: number, value: number): void
+}
+```
+
+- **`constructor(capacity)`** — Initialize the cache with a maximum capacity.
+- **`get(key)`** — Return the value for the key if it exists, otherwise return `-1`. Accessing a key updates its recency (makes it "most recently used").
+- **`put(key, value)`** — Insert or update the value. If the key already exists, update its value and recency. If the cache is at capacity, evict the least recently used item before inserting.
+
+## Examples
+
+### Example 1
+
+```ts
+const cache = new LRUCache(2);
+
+cache.put(1, 1);
+cache.put(2, 2);
+cache.get(1);    // returns 1
+cache.put(3, 3); // evicts key 2
+cache.get(2);    // returns -1 (not found)
+cache.put(4, 4); // evicts key 1
+cache.get(1);    // returns -1 (not found)
+cache.get(3);    // returns 3
+cache.get(4);    // returns 4
+```
+
+### Example 2
+
+```ts
+const cache = new LRUCache(1);
+
+cache.put(1, 1);
+cache.get(1);    // returns 1
+cache.put(2, 2); // evicts key 1
+cache.get(1);    // returns -1
+cache.get(2);    // returns 2
+```
+
+## Constraints
+
+- `1 <= capacity <= 3000`
+- `0 <= key <= 10^4`
+- `0 <= value <= 10^5`
+- At most `2 * 10^5` calls will be made to `get` and `put`.
+
+## Hints
+
+- A hash map gives O(1) lookup, but doesn't track order.
+- A doubly linked list gives O(1) add/remove at head or tail.
+- Combine both: map for O(1) lookup, doubly linked list for O(1) recency updates.

package/questions/leetcode-ds/lru-cache/scorecard.json

@@ -0,0 +1 @@
+{"title":"Implement an LRU Cache","category":"leetcode-ds","difficulty":"hard","suggestedTime":45,"status":"untouched","attempts":[],"llmFeedback":null}

package/questions/leetcode-ds/lru-cache/solution.test.ts

@@ -0,0 +1,82 @@
+import { describe, it, expect } from 'vitest';
+import { LRUCache } from './solution';
+
+describe('LRUCache', () => {
+  it('basic get and put', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    expect(cache.get(1)).toBe(1);
+    expect(cache.get(2)).toBe(2);
+  });
+
+  it('evicts least recently used when full', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    cache.put(3, 3); // evicts key 1
+    expect(cache.get(1)).toBe(-1);
+    expect(cache.get(2)).toBe(2);
+    expect(cache.get(3)).toBe(3);
+  });
+
+  it('get updates recency (accessed key is not evicted next)', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    cache.get(1); // makes 1 most recently used
+    cache.put(3, 3); // evicts key 2, not 1
+    expect(cache.get(1)).toBe(1);
+    expect(cache.get(2)).toBe(-1);
+    expect(cache.get(3)).toBe(3);
+  });
+
+  it('put existing key updates value and recency', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    cache.put(1, 10); // update value, 1 becomes most recently used
+    expect(cache.get(1)).toBe(10);
+    cache.put(3, 3); // evicts key 2
+    expect(cache.get(1)).toBe(10);
+    expect(cache.get(2)).toBe(-1);
+  });
+
+  it('capacity of 1', () => {
+    const cache = new LRUCache(1);
+    cache.put(1, 1);
+    expect(cache.get(1)).toBe(1);
+    cache.put(2, 2);
+    expect(cache.get(1)).toBe(-1);
+    expect(cache.get(2)).toBe(2);
+  });
+
+  it('accessing a key prevents its eviction', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    cache.get(2); // 2 is now most recently used
+    cache.put(3, 3); // evicts 1
+    expect(cache.get(1)).toBe(-1);
+    expect(cache.get(2)).toBe(2);
+    expect(cache.get(3)).toBe(3);
+  });
+
+  it('multiple evictions in sequence', () => {
+    const cache = new LRUCache(2);
+    cache.put(1, 1);
+    cache.put(2, 2);
+    cache.put(3, 3); // evicts 1
+    cache.put(4, 4); // evicts 2
+    expect(cache.get(1)).toBe(-1);
+    expect(cache.get(2)).toBe(-1);
+    expect(cache.get(3)).toBe(3);
+    expect(cache.get(4)).toBe(4);
+  });
+
+  it('empty cache returns -1 for get', () => {
+    const cache = new LRUCache(2);
+    expect(cache.get(1)).toBe(-1);
+    expect(cache.get(99)).toBe(-1);
+  });
+});

package/questions/leetcode-ds/lru-cache/solution.ts

@@ -0,0 +1,14 @@
+export class LRUCache {
+  constructor(private capacity: number) {
+    // TODO: implement
+  }
+
+  get(key: number): number {
+    // TODO: implement
+    return -1;
+  }
+
+  put(key: number, value: number): void {
+    // TODO: implement
+  }
+}

package/questions/react-apps/todo-app/App.test.tsx

@@ -0,0 +1,130 @@
+import { describe, it, expect } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import App from './App';
+
+function getInput() {
+  return (
+    screen.queryByPlaceholderText(/add|what needs|new todo|todo/i) ??
+    screen.getByRole('textbox')
+  );
+}
+
+function getAddButton() {
+  return screen.getByRole('button', { name: /add|submit/i });
+}
+
+describe('Todo App', () => {
+  it('renders heading', () => {
+    render(<App />);
+    expect(screen.getByRole('heading', { name: /todo app/i })).toBeInTheDocument();
+  });
+
+  it('can add a todo', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Buy milk' } });
+    fireEvent.click(addButton);
+    expect(screen.getByText('Buy milk')).toBeInTheDocument();
+  });
+
+  it('displays added todo', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Walk the dog' } });
+    fireEvent.click(addButton);
+    expect(screen.getByText('Walk the dog')).toBeInTheDocument();
+  });
+
+  it('can toggle todo complete', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Test todo' } });
+    fireEvent.click(addButton);
+    const checkbox =
+      screen.getByText('Test todo').closest('li')?.querySelector('input[type="checkbox"]') ??
+      screen.getByRole('checkbox');
+    fireEvent.click(checkbox);
+    expect(checkbox).toBeChecked();
+  });
+
+  it('can delete a todo', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Delete me' } });
+    fireEvent.click(addButton);
+    expect(screen.getByText('Delete me')).toBeInTheDocument();
+    const deleteButton =
+      screen.queryByRole('button', { name: /delete|remove|x/i }) ??
+      screen.queryByLabelText(/delete|remove/i);
+    if (!deleteButton) throw new Error('Delete button not found');
+    fireEvent.click(deleteButton);
+    expect(screen.queryByText('Delete me')).not.toBeInTheDocument();
+  });
+
+  it('filter shows only active todos', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Active todo' } });
+    fireEvent.click(addButton);
+    fireEvent.change(input, { target: { value: 'Completed todo' } });
+    fireEvent.click(addButton);
+    const checkboxes = screen.getAllByRole('checkbox');
+    fireEvent.click(checkboxes[1]);
+    const activeFilter =
+      screen.queryByRole('button', { name: /active/i }) ?? screen.queryByText(/active/i);
+    if (!activeFilter) throw new Error('Active filter not found');
+    fireEvent.click(activeFilter);
+    expect(screen.getByText('Active todo')).toBeInTheDocument();
+    expect(screen.queryByText('Completed todo')).not.toBeInTheDocument();
+  });
+
+  it('filter shows only completed todos', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'Todo one' } });
+    fireEvent.click(addButton);
+    fireEvent.change(input, { target: { value: 'Todo two' } });
+    fireEvent.click(addButton);
+    const checkboxes = screen.getAllByRole('checkbox');
+    fireEvent.click(checkboxes[0]);
+    const completedFilter =
+      screen.queryByRole('button', { name: /completed/i }) ?? screen.queryByText(/completed/i);
+    if (!completedFilter) throw new Error('Completed filter not found');
+    fireEvent.click(completedFilter);
+    expect(screen.getByText('Todo one')).toBeInTheDocument();
+    expect(screen.queryByText('Todo two')).not.toBeInTheDocument();
+  });
+
+  it('shows remaining count', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    fireEvent.change(input, { target: { value: 'First' } });
+    fireEvent.click(addButton);
+    fireEvent.change(input, { target: { value: 'Second' } });
+    fireEvent.click(addButton);
+    const countEl =
+      screen.queryByText(/2.*(item|remaining|left)/i) ?? screen.queryByText(/^2$/);
+    expect(countEl).toBeInTheDocument();
+  });
+
+  it('can add multiple todos', () => {
+    render(<App />);
+    const input = getInput();
+    const addButton = getAddButton();
+    const todos = ['First todo', 'Second todo', 'Third todo'];
+    todos.forEach((todo) => {
+      fireEvent.change(input, { target: { value: todo } });
+      fireEvent.click(addButton);
+    });
+    todos.forEach((todo) => {
+      expect(screen.getByText(todo)).toBeInTheDocument();
+    });
+  });
+});

package/questions/react-apps/todo-app/App.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+export default function App() {
+  return (
+    <div>
+      <h1>Todo App</h1>
+      {/* TODO: implement */}
+    </div>
+  );
+}

package/questions/react-apps/todo-app/README.md

@@ -0,0 +1,23 @@
+# Build a Todo App with Filters
+
+## Problem
+
+Build a React Todo app with the following features:
+
+- Add todos
+- Toggle complete
+- Delete todos
+- Filter by All / Active / Completed
+- Show count of remaining items
+
+## Category
+
+React Web Apps
+
+## Difficulty
+
+Medium
+
+## Suggested Time
+
+~45 minutes

package/questions/react-apps/todo-app/scorecard.json

@@ -0,0 +1,9 @@
+{
+  "title": "Build a Todo App with Filters",
+  "category": "react-apps",
+  "difficulty": "medium",
+  "suggestedTime": 45,
+  "status": "untouched",
+  "attempts": [],
+  "llmFeedback": null
+}

package/questions/web-components/star-rating/README.md

@@ -0,0 +1,45 @@
+# Build a Star Rating Web Component
+
+**Category:** Web Components  
+**Difficulty:** Medium  
+**Suggested Time:** ~35 minutes
+
+---
+
+## Problem
+
+Build a `<star-rating>` custom element that displays 5 stars, allows users to click to rate, has a `value` attribute/property, and dispatches a `change` event when the rating changes.
+
+## Requirements
+
+- **Display** — Render 5 star elements (you may use Unicode stars ★/☆, SVG, or styled spans).
+- **Click to rate** — Clicking a star sets the rating to that star's index (1–5).
+- **`value` attribute** — The component accepts a `value` attribute (e.g. `<star-rating value="3">`) to show the initial or current rating.
+- **`value` property** — The component exposes a `value` getter/setter that reflects and updates the rating.
+- **`change` event** — When the user clicks a star, dispatch a `change` event with the new value (e.g. `detail: { value: 3 }`).
+
+## Example Usage
+
+```html
+<star-rating value="3"></star-rating>
+```
+
+```js
+const el = document.querySelector('star-rating');
+el.value = 4;
+el.addEventListener('change', (e) => console.log('New rating:', e.detail.value));
+```
+
+## Constraints
+
+- Use the Custom Elements API (extend `HTMLElement`).
+- Use Shadow DOM for encapsulation.
+- Observe the `value` attribute and sync it with the internal state.
+- Clamp `value` to 0–5 (0 = no stars selected).
+
+## Hints
+
+- Use `attachShadow({ mode: 'open' })` in the constructor.
+- Use `static get observedAttributes()` to return `['value']`.
+- In `attributeChangedCallback`, parse the attribute and update the display.
+- Use `CustomEvent` with `detail: { value }` for the change event.

package/questions/web-components/star-rating/component.test.ts

@@ -0,0 +1,64 @@
+import { describe, it, expect, beforeEach, afterEach } from 'vitest';
+import './component';
+
+describe('star-rating', () => {
+  let el: HTMLElement & { value: number };
+
+  beforeEach(() => {
+    el = document.createElement('star-rating') as HTMLElement & { value: number };
+    document.body.appendChild(el);
+  });
+
+  afterEach(() => {
+    el.remove();
+  });
+
+  it('renders 5 star elements', () => {
+    const stars = el.shadowRoot?.querySelectorAll('[data-star]') ?? [];
+    expect(stars.length).toBe(5);
+  });
+
+  it('default value is 0', () => {
+    expect(el.value).toBe(0);
+  });
+
+  it('setting value attribute updates display', () => {
+    el.setAttribute('value', '3');
+    expect(el.value).toBe(3);
+  });
+
+  it('clicking a star updates value', () => {
+    const stars = el.shadowRoot?.querySelectorAll('[data-star]') ?? [];
+    (stars[2] as HTMLElement).click();
+    expect(el.value).toBe(3);
+  });
+
+  it('dispatches change event on click', () => {
+    let receivedValue: number | undefined;
+    const handler = (e: Event) => {
+      receivedValue = (e as CustomEvent).detail?.value;
+    };
+    el.addEventListener('change', handler);
+
+    const stars = el.shadowRoot?.querySelectorAll('[data-star]') ?? [];
+    (stars[3] as HTMLElement).click();
+
+    expect(receivedValue).toBe(4);
+    el.removeEventListener('change', handler);
+  });
+
+  it('value property reflects attribute', () => {
+    el.setAttribute('value', '2');
+    expect(el.value).toBe(2);
+  });
+
+  it('setting value property updates attribute', () => {
+    el.value = 5;
+    expect(el.getAttribute('value')).toBe('5');
+  });
+
+  it('clamps value to 0-5', () => {
+    el.setAttribute('value', '10');
+    expect(el.value).toBeLessThanOrEqual(5);
+  });
+});

package/questions/web-components/star-rating/component.ts

@@ -0,0 +1,28 @@
+export class StarRating extends HTMLElement {
+  constructor() {
+    super();
+    this.attachShadow({ mode: 'open' });
+  }
+
+  connectedCallback() {
+    // TODO: implement - render 5 stars, handle click, support value attribute
+  }
+
+  static get observedAttributes() {
+    return ['value'];
+  }
+
+  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {
+    // TODO: implement
+  }
+
+  get value(): number {
+    return 0; // TODO: implement
+  }
+
+  set value(_val: number) {
+    // TODO: implement
+  }
+}
+
+customElements.define('star-rating', StarRating);

package/questions/web-components/star-rating/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Star Rating Component</title>
+</head>
+<body>
+  <h1>Star Rating</h1>
+  <star-rating value="3"></star-rating>
+
+  <script type="module" src="./component.ts"></script>
+</body>
+</html>

package/questions/web-components/star-rating/scorecard.json

@@ -0,0 +1,9 @@
+{
+  "title": "Build a Star Rating Component",
+  "category": "web-components",
+  "difficulty": "medium",
+  "suggestedTime": 35,
+  "status": "untouched",
+  "attempts": [],
+  "llmFeedback": null
+}