popilot 0.2.0

package/scaffold/spec-site/src/composables/useActiveSection.ts

@@ -0,0 +1,53 @@
+import { ref, provide, inject, nextTick } from 'vue'
+import type { InjectionKey, Ref } from 'vue'
+
+interface ActiveSectionCtx {
+  activeSection: Ref<string | null>
+  setActiveSection: (id: string) => void
+  clearActiveSection: () => void
+}
+
+const ActiveSectionKey: InjectionKey<ActiveSectionCtx> = Symbol('activeSection')
+
+export function provideActiveSection() {
+  const activeSection = ref<string | null>(null)
+
+  function setActiveSection(id: string) {
+    activeSection.value = id
+
+    nextTick(() => {
+      // Highlight mockup area
+      document.querySelectorAll('[data-area]').forEach(el =>
+        el.classList.remove('area-active')
+      )
+      const mockupArea = document.querySelector(`[data-area="${id}"]`)
+      if (mockupArea) {
+        mockupArea.classList.add('area-active')
+        mockupArea.scrollIntoView({ behavior: 'smooth', block: 'center' })
+      }
+
+      // Scroll spec panel
+      const specEl = document.getElementById(`spec-section-${id}`)
+      if (specEl) {
+        const body = document.getElementById('spec-body')
+        if (body) body.scrollTop = 0
+      }
+    })
+  }
+
+  function clearActiveSection() {
+    activeSection.value = null
+    document.querySelectorAll('[data-area]').forEach(el =>
+      el.classList.remove('area-active')
+    )
+  }
+
+  provide(ActiveSectionKey, { activeSection, setActiveSection, clearActiveSection })
+  return { activeSection, setActiveSection, clearActiveSection }
+}
+
+export function useActiveSection() {
+  const ctx = inject(ActiveSectionKey)
+  if (!ctx) throw new Error('useActiveSection requires SplitPaneLayout ancestor')
+  return ctx
+}

package/scaffold/spec-site/src/composables/useMemo.ts

@@ -0,0 +1,138 @@
+import { ref, computed } from 'vue'
+
+export interface MemoItem {
+  id: number
+  text: string
+  author: string
+  ts: number
+}
+
+export function useMemo(pageId: string) {
+  const STORAGE_KEY = `spec-memo-${pageId}`
+  const memos = ref<MemoItem[]>([])
+  const memoCount = computed(() => memos.value.length)
+  const loading = ref(false)
+  const error = ref<string | null>(null)
+
+  // localStorage (sync, immediately available)
+  function loadFromLocal() {
+    try {
+      const raw = localStorage.getItem(STORAGE_KEY)
+      if (raw) {
+        const items = JSON.parse(raw) as Array<{ id: number; text: string; ts: number; author?: string }>
+        memos.value = items.map((m) => ({
+          id: m.id,
+          text: m.text,
+          author: m.author ?? '',
+          ts: m.ts,
+        }))
+      }
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : 'Failed to read local memos'
+    }
+  }
+
+  function saveToLocal() {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(memos.value))
+  }
+
+  // Turso dynamic load attempt (falls back to localStorage)
+  async function tryLoadFromTurso() {
+    try {
+      const { query } = await import('./useTurso')
+      const r = await query<{ id: number; content: string; author: string; created_at: string }>(
+        'SELECT id, content, author, created_at FROM memos WHERE page_id = ? ORDER BY created_at DESC',
+        [pageId],
+      )
+      if (!r.error) {
+        memos.value = r.rows.map((row) => ({
+          id: Number(row.id),
+          text: String(row.content),
+          author: String(row.author),
+          ts: new Date(row.created_at + 'Z').getTime(),
+        }))
+      } else {
+        error.value = r.error
+      }
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : 'Turso load failed'
+      // Keep localStorage fallback silently in UI behavior
+    }
+  }
+
+  async function loadMemos() {
+    loading.value = true
+    error.value = null
+    await tryLoadFromTurso()
+    loading.value = false
+  }
+
+  async function addMemo(text: string, author: string): Promise<boolean> {
+    const trimmed = text.trim()
+    if (!trimmed) return false
+
+    // Try Turso
+    try {
+      const { execute } = await import('./useTurso')
+      const r = await execute('INSERT INTO memos (page_id, content, author) VALUES (?, ?, ?)', [
+        pageId, trimmed, author,
+      ])
+      if (!r.error) {
+        await tryLoadFromTurso()
+        return true
+      }
+      error.value = r.error ?? 'Turso save failed'
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : 'Turso save failed'
+    }
+
+    // localStorage fallback
+    memos.value.unshift({ id: Date.now(), text: trimmed, author, ts: Date.now() })
+    saveToLocal()
+    return true
+  }
+
+  async function deleteMemo(id: number) {
+    try {
+      const { execute } = await import('./useTurso')
+      const r = await execute('DELETE FROM memos WHERE id = ?', [id])
+      if (!r.error) {
+        await tryLoadFromTurso()
+        return
+      }
+      error.value = r.error ?? 'Turso delete failed'
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : 'Turso delete failed'
+    }
+
+    memos.value = memos.value.filter((m) => m.id !== id)
+    saveToLocal()
+  }
+
+  async function clearAll() {
+    try {
+      const { execute } = await import('./useTurso')
+      const r = await execute('DELETE FROM memos WHERE page_id = ?', [pageId])
+      if (r.error) error.value = r.error
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : 'Turso clear failed'
+    }
+    memos.value = []
+    saveToLocal()
+  }
+
+  function formatTime(ts: number): string {
+    const d = new Date(ts)
+    const mm = String(d.getMonth() + 1).padStart(2, '0')
+    const dd = String(d.getDate()).padStart(2, '0')
+    const hh = String(d.getHours()).padStart(2, '0')
+    const mi = String(d.getMinutes()).padStart(2, '0')
+    return `${mm}/${dd} ${hh}:${mi}`
+  }
+
+  // Immediately load from localStorage (sync), then try Turso (async)
+  loadFromLocal()
+  loadMemos()
+
+  return { memos, memoCount, loading, error, addMemo, deleteMemo, clearAll, formatTime, loadMemos }
+}

package/scaffold/spec-site/src/composables/useRetro.ts

@@ -0,0 +1,313 @@
+import { ref, computed, onUnmounted } from 'vue'
+import { query, execute } from './useTurso'
+
+export type RetroPhase = 'write' | 'vote' | 'discuss' | 'done'
+export type RetroCategory = 'keep' | 'problem' | 'try'
+
+export interface RetroSession {
+  id: number
+  sprint: string
+  title: string | null
+  phase: RetroPhase
+  created_at: string
+  updated_at: string
+}
+
+export interface RetroItem {
+  id: number
+  session_id: number
+  category: RetroCategory
+  content: string
+  author: string
+  created_at: string
+  voteCount: number
+  hasVoted: boolean
+}
+
+export interface RetroAction {
+  id: number
+  session_id: number
+  content: string
+  assignee: string | null
+  status: 'pending' | 'done'
+  created_at: string
+}
+
+export const VOTES_PER_PERSON = 5
+const POLL_INTERVAL_MS = 4000
+
+export function useRetro(sprintId: string) {
+  const session = ref<RetroSession | null>(null)
+  const items = ref<RetroItem[]>([])
+  const actions = ref<RetroAction[]>([])
+  const loading = ref(false)
+  const error = ref<string | null>(null)
+
+  // -- Derived --
+  const keepItems = computed(() => items.value.filter((i) => i.category === 'keep'))
+  const problemItems = computed(() => items.value.filter((i) => i.category === 'problem'))
+  const tryItems = computed(() => items.value.filter((i) => i.category === 'try'))
+
+  // -- Session --
+  async function loadOrCreateSession() {
+    loading.value = true
+    error.value = null
+
+    const r = await query<RetroSession>(
+      'SELECT * FROM retro_sessions WHERE sprint = ? LIMIT 1',
+      [sprintId],
+    )
+    if (r.error) {
+      error.value = r.error
+      loading.value = false
+      return
+    }
+
+    if (r.rows.length > 0) {
+      session.value = r.rows[0]
+    } else {
+      const ins = await execute(
+        'INSERT INTO retro_sessions (sprint, title) VALUES (?, ?)',
+        [sprintId, `${sprintId.toUpperCase()} Retro`],
+      )
+      if (ins.error) {
+        error.value = ins.error
+        loading.value = false
+        return
+      }
+      const r2 = await query<RetroSession>(
+        'SELECT * FROM retro_sessions WHERE sprint = ? LIMIT 1',
+        [sprintId],
+      )
+      session.value = r2.rows[0] ?? null
+    }
+
+    await refresh()
+    loading.value = false
+  }
+
+  async function setPhase(phase: RetroPhase) {
+    if (!session.value) return
+    await execute(
+      "UPDATE retro_sessions SET phase = ?, updated_at = datetime('now') WHERE id = ?",
+      [phase, session.value.id],
+    )
+    session.value = { ...session.value, phase }
+  }
+
+  // -- Items --
+  async function loadItems(currentUser: string) {
+    if (!session.value) return
+    const r = await query<Record<string, unknown>>(
+      `SELECT i.*,
+        COUNT(v.voter) as voteCount,
+        MAX(CASE WHEN v.voter = ? THEN 1 ELSE 0 END) as hasVoted
+       FROM retro_items i
+       LEFT JOIN retro_votes v ON v.item_id = i.id
+       WHERE i.session_id = ?
+       GROUP BY i.id
+       ORDER BY i.created_at ASC`,
+      [currentUser, session.value.id],
+    )
+    if (!r.error) {
+      items.value = r.rows.map((row) => ({
+        id: Number(row.id),
+        session_id: Number(row.session_id),
+        category: row.category as RetroCategory,
+        content: row.content as string,
+        author: row.author as string,
+        created_at: row.created_at as string,
+        voteCount: Number(row.voteCount),
+        hasVoted: Boolean(Number(row.hasVoted)),
+      }))
+    }
+  }
+
+  async function addItem(category: RetroCategory, content: string, author: string) {
+    if (!session.value) return
+    const trimmed = content.trim()
+    if (!trimmed) return
+    await execute(
+      'INSERT INTO retro_items (session_id, category, content, author) VALUES (?, ?, ?, ?)',
+      [session.value.id, category, trimmed, author],
+    )
+    await loadItems(author)
+  }
+
+  async function deleteItem(itemId: number, currentUser: string) {
+    await execute('DELETE FROM retro_votes WHERE item_id = ?', [itemId])
+    await execute('DELETE FROM retro_items WHERE id = ?', [itemId])
+    await loadItems(currentUser)
+  }
+
+  // -- Votes --
+  const myVoteCount = computed(() => items.value.filter((i) => i.hasVoted).length)
+  const votesRemaining = computed(() => VOTES_PER_PERSON - myVoteCount.value)
+
+  async function toggleVote(itemId: number, currentUser: string, hasVoted: boolean) {
+    if (!hasVoted && votesRemaining.value <= 0) return
+    if (hasVoted) {
+      await execute('DELETE FROM retro_votes WHERE item_id = ? AND voter = ?', [
+        itemId,
+        currentUser,
+      ])
+    } else {
+      await execute('INSERT OR IGNORE INTO retro_votes (item_id, voter) VALUES (?, ?)', [
+        itemId,
+        currentUser,
+      ])
+    }
+    await loadItems(currentUser)
+  }
+
+  // -- Actions --
+  async function loadActions() {
+    if (!session.value) return
+    const r = await query<RetroAction>(
+      'SELECT * FROM retro_actions WHERE session_id = ? ORDER BY created_at ASC',
+      [session.value.id],
+    )
+    if (!r.error) actions.value = r.rows
+  }
+
+  async function addAction(content: string, assignee: string | null) {
+    if (!session.value) return
+    await execute(
+      'INSERT INTO retro_actions (session_id, content, assignee) VALUES (?, ?, ?)',
+      [session.value.id, content.trim(), assignee],
+    )
+    await loadActions()
+  }
+
+  async function toggleActionStatus(actionId: number, currentStatus: 'pending' | 'done') {
+    const next = currentStatus === 'pending' ? 'done' : 'pending'
+    await execute('UPDATE retro_actions SET status = ? WHERE id = ?', [next, actionId])
+    await loadActions()
+  }
+
+  // -- Reset --
+  async function resetSession() {
+    if (!session.value) return
+    const sid = session.value.id
+    await execute(
+      'DELETE FROM retro_votes WHERE item_id IN (SELECT id FROM retro_items WHERE session_id = ?)',
+      [sid],
+    )
+    await execute('DELETE FROM retro_actions WHERE session_id = ?', [sid])
+    await execute('DELETE FROM retro_items WHERE session_id = ?', [sid])
+    await execute('DELETE FROM retro_sessions WHERE id = ?', [sid])
+    session.value = null
+    items.value = []
+    actions.value = []
+    await loadOrCreateSession()
+  }
+
+  // -- Export --
+  function exportMarkdown(): string {
+    if (!session.value) return ''
+    const s = session.value
+    const lines: string[] = []
+
+    lines.push(`# ${s.sprint.toUpperCase()} Sprint Retro`)
+    lines.push('')
+
+    const cats: { key: RetroCategory; emoji: string; label: string }[] = [
+      { key: 'keep', emoji: '✅', label: 'Keep' },
+      { key: 'problem', emoji: '🔴', label: 'Problem' },
+      { key: 'try', emoji: '💡', label: 'Try' },
+    ]
+
+    for (const cat of cats) {
+      const catItems = [...items.value]
+        .filter((i) => i.category === cat.key)
+        .sort((a, b) => b.voteCount - a.voteCount)
+
+      lines.push(`## ${cat.emoji} ${cat.label}`)
+      lines.push('')
+      if (catItems.length === 0) {
+        lines.push('- (none)')
+      } else {
+        for (const item of catItems) {
+          const votes = item.voteCount > 0 ? ` (👍 ${item.voteCount})` : ''
+          lines.push(`- ${item.content}${votes} — _${item.author}_`)
+        }
+      }
+      lines.push('')
+    }
+
+    if (actions.value.length > 0) {
+      lines.push('## 📋 Action Items')
+      lines.push('')
+      for (const a of actions.value) {
+        const check = a.status === 'done' ? '✅' : '⬜'
+        const assignee = a.assignee ? ` @${a.assignee}` : ''
+        lines.push(`- ${check} ${a.content}${assignee}`)
+      }
+      lines.push('')
+    }
+
+    lines.push(`---`)
+    lines.push(`_Generated: ${new Date().toLocaleDateString()}_`)
+
+    return lines.join('\n')
+  }
+
+  // -- Refresh (items + actions + session phase) --
+  let _currentUser = ''
+
+  async function refresh() {
+    if (!session.value) return
+    const r = await query<{ phase: string }>(
+      'SELECT phase FROM retro_sessions WHERE id = ?',
+      [session.value.id],
+    )
+    if (r.rows[0] && r.rows[0].phase !== session.value.phase) {
+      session.value = { ...session.value, phase: r.rows[0].phase as RetroPhase }
+    }
+    await loadItems(_currentUser)
+    await loadActions()
+  }
+
+  // -- Polling --
+  let pollTimer: ReturnType<typeof setInterval> | null = null
+
+  function startPolling(currentUser: string) {
+    _currentUser = currentUser
+    stopPolling()
+    pollTimer = setInterval(refresh, POLL_INTERVAL_MS)
+  }
+
+  function stopPolling() {
+    if (pollTimer) {
+      clearInterval(pollTimer)
+      pollTimer = null
+    }
+  }
+
+  onUnmounted(stopPolling)
+
+  return {
+    session,
+    items,
+    actions,
+    loading,
+    error,
+    keepItems,
+    problemItems,
+    tryItems,
+    myVoteCount,
+    votesRemaining,
+    loadOrCreateSession,
+    setPhase,
+    addItem,
+    deleteItem,
+    toggleVote,
+    addAction,
+    toggleActionStatus,
+    resetSession,
+    exportMarkdown,
+    startPolling,
+    stopPolling,
+    refresh,
+  }
+}

package/scaffold/spec-site/src/composables/useScenario.ts

@@ -0,0 +1,43 @@
+import { ref, provide, inject, computed } from 'vue'
+import type { InjectionKey, Ref, ComputedRef } from 'vue'
+import type { Scenario } from '@/data/types'
+
+interface ScenarioCtx<T = any> {
+  scenarios: Ref<Scenario<T>[]>
+  activeScenarioId: Ref<string>
+  activeScenario: ComputedRef<Scenario<T> | undefined>
+  mockData: ComputedRef<T | undefined>
+  setScenario: (id: string) => void
+  updateScenarios: (newList: Scenario<any>[], defaultId?: string) => void
+}
+
+const ScenarioKey = '__scenario__' as unknown as InjectionKey<ScenarioCtx>
+
+export function provideScenario<T>(scenarioList: Scenario<T>[], defaultId?: string) {
+  const scenarios = ref(scenarioList) as Ref<Scenario<T>[]>
+  const activeScenarioId = ref(defaultId ?? scenarioList[0]?.id ?? '')
+
+  const activeScenario = computed(() =>
+    scenarios.value.find(s => s.id === activeScenarioId.value)
+  )
+
+  const mockData = computed(() => activeScenario.value?.data)
+
+  function setScenario(id: string) {
+    activeScenarioId.value = id
+  }
+
+  function updateScenarios(newList: Scenario<any>[], defaultId?: string) {
+    scenarios.value = newList as any
+    activeScenarioId.value = defaultId ?? newList[0]?.id ?? ''
+  }
+
+  provide(ScenarioKey, { scenarios, activeScenarioId, activeScenario, mockData, setScenario, updateScenarios } as ScenarioCtx)
+  return { scenarios, activeScenarioId, activeScenario, mockData, setScenario, updateScenarios }
+}
+
+export function useScenario<T = any>() {
+  const ctx = inject(ScenarioKey)
+  if (!ctx) throw new Error('useScenario requires a provideScenario ancestor')
+  return ctx as ScenarioCtx<T>
+}

package/scaffold/spec-site/src/composables/useScenarioStore.ts

@@ -0,0 +1,102 @@
+import { ref } from 'vue'
+import { query, execute } from './useTurso'
+import type { Scenario } from '@/data/types'
+
+export function useScenarioStore(pageId: string, sprint: string) {
+  const customScenarios = ref<Scenario<any>[]>([])
+  const loading = ref(false)
+  const error = ref<string | null>(null)
+
+  async function loadCustomScenarios(): Promise<Scenario<any>[]> {
+    loading.value = true
+    error.value = null
+    const r = await query<{
+      scenario_id: string
+      label: string
+      data_json: string
+    }>(
+      'SELECT scenario_id, label, data_json FROM scenario_data WHERE page_id = ? AND sprint = ? ORDER BY created_at ASC',
+      [pageId, sprint],
+    )
+    loading.value = false
+    if (r.error) {
+      error.value = r.error
+      customScenarios.value = []
+      return []
+    }
+    const list = r.rows
+      .map((row) => {
+        try {
+          return {
+            id: String(row.scenario_id),
+            label: String(row.label),
+            data: JSON.parse(String(row.data_json)),
+          } as Scenario<any>
+        } catch {
+          return null
+        }
+      })
+      .filter((s): s is Scenario<any> => s !== null)
+    customScenarios.value = list
+    return list
+  }
+
+  async function saveScenario(scenario: Scenario<any>, author: string): Promise<boolean> {
+    error.value = null
+    const dataJson = JSON.stringify(scenario.data)
+    const res = await execute(
+      `INSERT INTO scenario_data (page_id, sprint, scenario_id, label, data_json, author)
+       VALUES (?, ?, ?, ?, ?, ?)
+       ON CONFLICT(page_id, sprint, scenario_id)
+       DO UPDATE SET label = ?, data_json = ?, author = ?, updated_at = datetime('now')`,
+      [pageId, sprint, scenario.id, scenario.label, dataJson, author, scenario.label, dataJson, author],
+    )
+    if (res.error) {
+      error.value = res.error
+      return false
+    }
+    await loadCustomScenarios()
+    return true
+  }
+
+  async function deleteScenario(scenarioId: string): Promise<boolean> {
+    error.value = null
+    const res = await execute(
+      'DELETE FROM scenario_data WHERE page_id = ? AND sprint = ? AND scenario_id = ?',
+      [pageId, sprint, scenarioId],
+    )
+    if (res.error) {
+      error.value = res.error
+      return false
+    }
+    await loadCustomScenarios()
+    return true
+  }
+
+  async function duplicateScenario(
+    source: Scenario<any>,
+    newLabel: string,
+    author: string,
+  ): Promise<string> {
+    error.value = null
+    const newId = `custom-${Date.now()}`
+    const newScenario: Scenario<any> = {
+      id: newId,
+      label: newLabel,
+      data: structuredClone(source.data),
+    }
+    const ok = await saveScenario(newScenario, author)
+    if (!ok) return ''
+    return newId
+  }
+
+  return {
+    customScenarios,
+    loading,
+    error,
+    loadCustomScenarios,
+    saveScenario,
+    deleteScenario,
+    duplicateScenario,
+  }
+}