fix(web): les fichiers s'ouvrent enfin, et le travail git par projet au centre

Deux défauts d'usage de la zone centrale de l'IDE.

1. Ouvrir un fichier affichait une page vide. Le conteneur de l'unique instance
   Monaco vivait sous le `v-if="activeTab"` : monté sans onglet actif (premier
   usage, ou après avoir tout fermé), `onMounted` sortait en silence sur
   `!host.value`, `ready` restait faux pour toujours, et les deux watchers
   d'affichage étaient gardés par lui. Le conteneur est désormais toujours monté
   (v-show, jamais v-if : sous un v-if, fermer le dernier onglet détruisait le
   DOM et l'éditeur gardait une référence sur un noeud détaché) et l'éditeur est
   créé paresseusement depuis `showTab`, devenu l'unique entonnoir d'affichage.
   `useMonaco` ne mémoïse plus un échec, l'attente et l'erreur sont visibles, et
   la relecture disque ne se tait plus. Sur mobile, ouvrir un fichier amène enfin
   la zone centrale au premier plan et la valeur morte `mobilePanel = 'sidebar'`
   disparaît (migrée).

   Trouvé par l'E2E : seul l'`editor.worker` était fourni, donc ouvrir un `.ts`
   lançait le service TypeScript contre un worker qui n'en connaissait pas les
   méthodes, et jetait un rejet non géré à chaque ouverture. Les workers de
   langage sont fournis (chunks à la demande), diagnostics sémantiques coupés
   (sans tsconfig ni node_modules, ils inventeraient des erreurs).

2. Le statut git était à l'étroit et mono-projet. La zone centrale porte un mode
   « Fichiers / Changements » (bascule à icônes dans la barre d'onglets, donc
   accessible même sans onglet ouvert). La vue Changements montre un bloc par
   worktree pour TOUS les projets ouverts : fichiers indexés et non indexés, diff
   déplié sur place, commit, push, fetch, pull et historique par bloc. Le panneau
   Git de la barre latérale devient l'index (compteurs déjà diffusés par WS, donc
   zéro requête) et le badge de la barre d'activité, codé à 0, compte enfin les
   worktrees à traiter.

   Au passage : `canPush` était faux dans les deux sens (actif sans rien à
   pousser, bloqué en étant seulement en retard), l'amend d'un message seul est
   accepté comme le serveur le permettait déjà, le rebase est proposé dès qu'on
   est en retard, une confirmation d'abandon ne survit plus au rechargement de la
   liste, et `commit`/`fetch`/`push` émettent enfin `worktree_changes` (le
   compteur « n non poussés » restait périmé juste après un push).

Vérifié : 528 tests, acceptations P7/P9/P14/P15, `verify-ui` (4 captures
nouvelles) et un `verify-editor` qui prouve par clics réels l'ouverture d'un
fichier sans onglet persisté, la fermeture/réouverture, la bascule mobile et le
chunk éditeur absent. Ce dernier échoue bien si l'on remet le conteneur sous un
v-if.
This commit is contained in:
2026-08-04 23:18:40 +02:00
parent 114fbc8ba0
commit ce224fd470
34 changed files with 2026 additions and 226 deletions
@@ -1,10 +1,16 @@
<template>
<!-- pas de bordure haute : ce panneau est le premier enfant du panneau Git (le trait était un
vestige de l'ancien layout, où il vivait sous le contenu). -->
<div class="flex h-full flex-col">
<!-- en-tête + actions distantes -->
<!-- Layout « bloc » : ce panneau est monté une fois par worktree dans une vue qui défile, donc sa
hauteur suit son contenu et c'est la LISTE qui est bornée. Un `h-full` avec une liste `flex-1`
ne fonctionnerait que dans un parent à hauteur définie. -->
<div class="flex flex-col">
<!-- Actions distantes. Pas de titre : le bloc qui monte ce panneau nomme déjà le worktree, et
répéter « Changements » sous l'en-tête de la vue Changements ne disait rien de plus. -->
<div class="flex items-center gap-1 px-2 py-1 label-mono">
<GitCompare :size="13" /> {{ t('workspace.changes') }}
<!-- L'upstream nomme le contexte des deux boutons de droite : sans lui, cette ligne était une
barre d'icônes orpheline. -->
<span class="min-w-0 truncate normal-case" :class="git.upstream ? 'text-fg-subtle' : 'text-fg-subtle/70'">
{{ git.upstream ?? t('git.noUpstream') }}
</span>
<span v-if="git.ahead" class="text-accent">↑{{ git.ahead }}</span>
<span v-if="git.behind" class="text-warn">↓{{ git.behind }}</span>
<span class="ml-auto flex items-center gap-1">
@@ -13,7 +19,7 @@
</span>
</div>
<div class="min-h-0 flex-1 overflow-auto">
<div class="max-h-[50vh] overflow-auto">
<!-- fichiers indexés (staged) -->
<div v-if="staged.length" class="px-1">
<div class="flex items-center px-1 py-0.5 text-[11px] text-fg-subtle">
@@ -67,9 +73,9 @@
</template>
<script setup lang="ts">
import { computed, ref } from 'vue';
import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import { ArrowDownToLine, Check, Download, GitCompare, Minus, Plus, Undo2, Upload } from '@lucide/vue';
import { ArrowDownToLine, Check, Download, Minus, Plus, Undo2, Upload } from '@lucide/vue';
import type { FileChange, WorktreeGitStatus, WorktreeSummary } from '@arboretum/shared';
import { gitApi } from '../../lib/git-api';
import { ApiError } from '../../lib/api';
@@ -90,10 +96,33 @@ const amend = ref(false);
const busy = ref<string | null>(null);
const error = ref<string | null>(null);
const discardArmed = ref<string | null>(null);
const canRebase = ref(false);
// Un `git pull --ff-only` a échoué : la divergence est constatée, on propose le rebase même si les
// compteurs ne l'annoncent pas encore.
const ffFailed = ref(false);
const canCommit = computed(() => !busy.value && staged.value.length > 0 && (amend.value || message.value.trim() !== ''));
const canPush = computed(() => !!props.git && props.git.behind === 0); // push simple (ff) ; le serveur gère l'upstream
// Le serveur autorise l'amend d'un message seul (sans rien d'indexé) : l'exiger ici privait d'une
// correction de message pourtant sans risque.
const canCommit = computed(() =>
!busy.value &&
(amend.value
? message.value.trim() !== '' || staged.value.length > 0
: staged.value.length > 0 && message.value.trim() !== ''),
);
// Ne rien pousser n'a aucun sens, et être en retard n'empêche pas de pousser (git tranche, et son
// refus s'affiche ci-dessous). Sans upstream, le serveur publie la branche via `push -u origin`.
const canPush = computed(() => !busy.value && (!props.git.upstream || props.git.ahead > 0));
// Pas de garde `busy` ici : le bouton porte déjà son propre indicateur de chargement, et le faire
// disparaître pendant le rebase serait déroutant.
const canRebase = computed(() => ffFailed.value || props.git.behind > 0);
// Une confirmation destructive ne doit pas survivre à un rechargement de liste ni à un changement de
// worktree : la ligne sous le curseur peut avoir changé d'identité entre l'armement et le clic.
watch(
() => [props.repoId, props.wt, props.changes] as const,
() => {
discardArmed.value = null;
},
);
function select(c: FileChange, stagedSide: boolean): void {
emit('select', { file: c.path, staged: stagedSide });
@@ -140,11 +169,11 @@ async function onCommit(): Promise<void> {
const onPush = () => run('push', () => store.pushWorktree(props.repoId, props.wt).then((worktree) => ({ worktree }))).catch(() => {});
async function onPull(mode: 'ff-only' | 'rebase'): Promise<void> {
canRebase.value = false;
try {
await run(mode === 'rebase' ? 'rebase' : 'pull', () => gitApi.pull(props.repoId, props.wt, mode));
ffFailed.value = false;
} catch {
if (mode === 'ff-only') canRebase.value = true; // ff impossible (divergence) → proposer le rebase
if (mode === 'ff-only') ffFailed.value = true; // ff impossible (divergence) → proposer le rebase
}
}
</script>