feat(web): coquille IDE + arbre de projets unifié (route /ide)

components/ide/ : IdeShell (grille barre d'activité + panneau gauche + zone centrale + dock + barre de statut, splitters persistés, réconciliation des ressources ouvertes contre les données live), ActivityBar (Explorer/Git/Sessions/Groupes + Réglages/Aide), PrimarySidebar, ProjectTree + ProjectTreeNode (arbre unique repos -> worktrees -> sessions, fichiers embarqués via FileTree en mode sans chrome, dépliage paresseux), StatusBar. Route /ide (layout 'ide'), entrée de nav « IDE », namespace i18n ide (EN/FR). Clics de l'arbre pilotent le store (contexte worktree, ouverture de fichier/terminal). Centre et dock en placeholders (remplis en B4/B5). FileTree gagne un mode embedded. 427 tests.
2026-07-17 17:08:35 +02:00
parent 6acd4a16fd
commit c96d929c7a
13 changed files with 446 additions and 11 deletions
@@ -0,0 +1,51 @@
+<template>
+  <footer
+    class="flex h-[var(--ide-statusbar-h)] shrink-0 items-center gap-3 border-t border-border bg-surface-1 px-3 text-[11px] text-fg-muted"
+  >
+    <span class="flex items-center gap-1.5" :title="wsStatus">
+      <span class="h-2 w-2 rounded-full" :class="wsDot" />
+      {{ t('common.appName') }}
+    </span>
+    <GitStatusBadge v-if="activeWt" :git="activeWt.git" :branch="activeWt.branch" />
+    <span v-else class="text-fg-subtle">{{ t('ide.ready') }}</span>
+    <button
+      type="button"
+      class="ml-auto rounded px-1.5 py-0.5 transition-colors hover:bg-surface-2 hover:text-fg"
+      :class="ide.bottomVisible ? 'text-fg' : ''"
+      :title="t('ide.terminals')"
+      @click="ide.toggleBottom()"
+    >
+      <span class="inline-flex items-center gap-1"><SquareTerminal :size="12" /> {{ dockCount }}</span>
+    </button>
+  </footer>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { SquareTerminal } from '@lucide/vue';
+import { useIdeStore } from '../../stores/ide';
+import { useWorktreesStore } from '../../stores/worktrees';
+import { wsClient } from '../../lib/ws-client';
+import GitStatusBadge from '../workspace/GitStatusBadge.vue';
+
+const { t } = useI18n();
+const ide = useIdeStore();
+const worktrees = useWorktreesStore();
+
+const activeWt = computed(() => {
+  const c = ide.activeContext;
+  if (!c) return null;
+  return worktrees.worktrees.find((w) => w.repoId === c.repoId && w.path === c.wtPath) ?? null;
+});
+
+const wsStatus = computed(() => wsClient.status.value);
+const wsDot = computed(() =>
+  wsStatus.value === 'open'
+    ? 'bg-emerald-500'
+    : wsStatus.value === 'reconnecting' || wsStatus.value === 'connecting'
+      ? 'bg-amber-500'
+      : 'bg-zinc-600',
+);
+const dockCount = computed(() => ide.dockSessionIds.length);
+</script>