<script lang="ts">
  import { onMount } from 'svelte';
  import ProjectDashboard from '../features/projects/ProjectDashboard.svelte';
  import ServerLogin from '../features/auth/ServerLogin.svelte';
  import SuggestionList from '../features/inbox/SuggestionList.svelte';
  import type { Suggestion } from '../features/inbox/types';
  import { createApi, type ProjectDashboardSummary } from '../lib/api';

  const emptyDashboard: ProjectDashboardSummary = {
    project_id: 1,
    pending_inbox_count: 0,
    open_task_count: 0,
    recent_note_count: 0,
    recent_session_count: 0,
  };

  let apiBase = localStorage.getItem('apiBase') ?? 'http://localhost:8080';
  let dashboard = emptyDashboard;
  let connectionStatus = '未连接';
  let selectedSuggestionCount = 0;

  const sampleSuggestions: Suggestion[] = [
    {
      kind: 'task',
      title: '跟进报价',
      body: '从项目 inbox 确认后创建任务，并保留来源记录。',
    },
    {
      kind: 'note',
      title: '客户背景',
      body: '把对话中的背景信息沉淀成项目笔记。',
    },
  ];

  onMount(() => {
    void loadDashboard();
  });

  function handleServerChange(event: CustomEvent<{ apiBase: string }>) {
    apiBase = event.detail.apiBase;
    localStorage.setItem('apiBase', apiBase);
    void loadDashboard();
  }

  async function loadDashboard() {
    connectionStatus = '连接中';
    try {
      dashboard = await createApi(apiBase).getProjectDashboard(1);
      connectionStatus = '已连接';
    } catch {
      dashboard = emptyDashboard;
      connectionStatus = '无法连接服务器';
    }
  }

  function handleConfirm(selected: Suggestion[]) {
    selectedSuggestionCount = selected.length;
  }
</script>

<main class="shell">
  <aside class="sidebar">
    <h1>项目工作台</h1>
    <ServerLogin {apiBase} on:serverChange={handleServerChange} />
    <p class="connection-status" aria-live="polite">{connectionStatus}</p>
  </aside>

  <section class="workspace">
    <ProjectDashboard summary={dashboard} />
    <section class="inbox-review" aria-label="项目 inbox">
      <h2>AI 整理建议</h2>
      <SuggestionList suggestions={sampleSuggestions} onConfirm={handleConfirm} />
      <p class="selection-status" aria-live="polite">已选择 {selectedSuggestionCount} 项</p>
    </section>
  </section>
</main>
