// runnable
// Prefix cache that answers a longer query from a cached shorter one, and ignores stale responses.
function createTypeahead(fetchList) {
  const cache = new Map();                          // query -> { items, complete }
  let latest = 0;
  return async function search(query) {
    const id = ++latest;
    if (cache.has(query)) return { query, items: cache.get(query).items, from: 'cache' };
    // reuse a cached shorter prefix when the server returned the complete match set for it
    for (let n = query.length - 1; n > 0; n -= 1) {
      const hit = cache.get(query.slice(0, n));
      if (hit?.complete) return { query, items: hit.items.filter((s) => s.startsWith(query)), from: 'prefix' };
    }
    const items = await fetchList(query);
    if (id !== latest) return null;                 // a newer search superseded this one
    cache.set(query, { items, complete: true });    // here the fake server always returns every match
    return { query, items, from: 'network' };
  };
}

const words = ['apple', 'apricot', 'banana', 'blueberry', 'avocado'];
const delay = (ms) => new Promise((r) => setTimeout(r, ms));
const search = createTypeahead(async (q) => { await delay(q.length === 1 ? 50 : 10); return words.filter((w) => w.startsWith(q)); });

(async () => {
  const slow = search('a');                          // slow response for "a"
  const fast = search('ap');                         // faster response for "ap"
  console.log('a  ->', await slow);                  // null: stale, dropped
  console.log('ap ->', await fast);
  console.log('ap again ->', (await search('ap')).from);
  console.log('apr ->', await search('apr'));        // answered locally from the cached "ap" result
})();

// runnable
// Index math for a looping carousel and which slides to load.
const wrap = (i, n) => ((i % n) + n) % n;
const next = (i, n) => wrap(i + 1, n);
const prev = (i, n) => wrap(i - 1, n);
function slidesToLoad(index, n, radius = 1) {
  const out = [];
  for (let d = -radius; d <= radius; d += 1) out.push(wrap(index + d, n));
  return [...new Set(out)];
}
console.log(next(9, 10), prev(0, 10), slidesToLoad(0, 10), slidesToLoad(5, 3));

// runnable
// Toast queue: max visible, dedupe by key, auto dismiss.
function createToaster({ max = 3, ttl = 40 } = {}) {
  let visible = [];
  const queue = [];
  const log = (label) => console.log(label.padEnd(10), visible.map((t) => t.msg).join(' | '));
  function show(msg, key = msg) {
    if ([...visible, ...queue].some((t) => t.key === key)) return;       // dedupe
    const toast = { msg, key };
    if (visible.length < max) {
      visible.push(toast);
      setTimeout(() => dismiss(toast), ttl);
    } else queue.push(toast);
  }
  function dismiss(toast) {
    visible = visible.filter((t) => t !== toast);
    const nxt = queue.shift();
    if (nxt) { visible.push(nxt); setTimeout(() => dismiss(nxt), ttl); }
    log('dismissed');
  }
  return { show, snapshot: () => log('visible') };
}

const toaster = createToaster();
['Saved', 'Saved', 'Uploaded', 'Synced', 'Error 1', 'Error 2'].forEach((m) => toaster.show(m));
toaster.snapshot();

// runnable
// Run chunk uploads with a concurrency limit and retry with backoff.
async function uploadChunks(chunks, send, { concurrency = 3, retries = 2 } = {}) {
  const results = new Array(chunks.length);
  let next = 0, attemptsTotal = 0;
  async function worker() {
    while (next < chunks.length) {
      const i = next++;
      for (let attempt = 0; ; attempt += 1) {
        try { attemptsTotal += 1; results[i] = await send(chunks[i], i); break; }
        catch (e) { if (attempt >= retries) throw e; await new Promise((r) => setTimeout(r, 5 * 2 ** attempt)); }
      }
    }
  }
  await Promise.all(Array.from({ length: concurrency }, worker));
  return { results, attemptsTotal };
}

let failedOnce = false;
const send = async (chunk, i) => {
  if (i === 2 && !failedOnce) { failedOnce = true; throw new Error('network'); }   // chunk 2 fails once
  return `etag-${i}`;
};
uploadChunks([...Array(6).keys()], send).then(({ results, attemptsTotal }) => console.log(results.join(','), '| attempts:', attemptsTotal));

// runnable
// Build a comment tree from a flat list, then flatten to visible rows with depth (respecting collapse).
function buildTree(flat) {
  const byId = new Map(flat.map((c) => [c.id, { ...c, children: [] }]));
  const roots = [];
  for (const c of byId.values()) (c.parentId ? byId.get(c.parentId)?.children : roots)?.push(c);
  return roots;
}
function flatten(nodes, collapsed = new Set(), depth = 0, out = []) {
  for (const n of nodes) {
    out.push({ id: n.id, depth, hidden: collapsed.has(n.id) ? countDescendants(n) : 0 });
    if (!collapsed.has(n.id)) flatten(n.children, collapsed, depth + 1, out);
  }
  return out;
}
const countDescendants = (n) => n.children.reduce((s, c) => s + 1 + countDescendants(c), 0);

const flat = [
  { id: 1, parentId: null }, { id: 2, parentId: 1 }, { id: 3, parentId: 2 },
  { id: 4, parentId: 1 }, { id: 5, parentId: null },
];
const tree = buildTree(flat);
console.log(flatten(tree).map((r) => `${'  '.repeat(r.depth)}#${r.id}`).join('\n'));
console.log(JSON.stringify(flatten(tree, new Set([1]))));