Merge pull request #18 from Masutayunikon/release-please--branches--main

chore(main): release 1.7.3
2026-03-13 00:13:58 +01:00 · 2026-03-13 00:12:12 +01:00 · 2026-03-13 00:11:45 +01:00 · 2026-03-12 23:56:24 +01:00 · 2026-03-12 23:56:16 +01:00 · 2026-03-12 23:52:47 +01:00
14 changed files with 737 additions and 141 deletions
@@ -1,5 +1,46 @@
 # Changelog

+## [1.7.3](https://github.com/Masutayunikon/FanKarr/compare/v1.7.2...v1.7.3) (2026-03-12)
+
+
+### Bug Fixes
+
+* CatalogView.vue badge deleted ([d897192](https://github.com/Masutayunikon/FanKarr/commit/d8971920462efd8d1d99eb867016c96713dfef58))
+* empty docker-compose.yml ([303dfd8](https://github.com/Masutayunikon/FanKarr/commit/303dfd85b5d033e2b247fd064ae1ae612fdb49e1))
+
+## [1.7.2](https://github.com/Masutayunikon/FanKarr/compare/v1.7.1...v1.7.2) (2026-03-12)
+
+
+### Bug Fixes
+
+* docker is able to change directory ([af08f7d](https://github.com/Masutayunikon/FanKarr/commit/af08f7d9d4fb2e23c5feac6d33b2ef495f9d91b2))
+
+## [1.7.1](https://github.com/Masutayunikon/FanKarr/compare/v1.7.0...v1.7.1) (2026-03-12)
+
+
+### Bug Fixes
+
+* path ([314f817](https://github.com/Masutayunikon/FanKarr/commit/314f817280f39d10eb21c4784f2aea41b9a6d32c))
+
+## [1.7.0](https://github.com/Masutayunikon/FanKarr/compare/v1.6.0...v1.7.0) (2026-03-12)
+
+
+### Features
+
+* UX improvements, folder picker, download state & NFO support ([20771fc](https://github.com/Masutayunikon/FanKarr/commit/20771fc31c187fd1fea8aa9b07093b15621a5b85))
+
+
+### Bug Fixes
+
+* rename if the torrent name is not the same as the api ([b8fcf71](https://github.com/Masutayunikon/FanKarr/commit/b8fcf71f54ab14e5572a7553d8554b617b4981b7))
+
+## [1.6.0](https://github.com/Masutayunikon/FanKarr/compare/v1.5.0...v1.6.0) (2026-03-11)
+
+
+### Features
+
+* add favicon ([dc4a2d4](https://github.com/Masutayunikon/FanKarr/commit/dc4a2d48f5c0cddd8e431ce33a69fc9146143fb6))
+
 ## [1.5.0](https://github.com/Masutayunikon/FanKarr/compare/v1.4.1...v1.5.0) (2026-03-11)


@@ -109,6 +109,7 @@ Fankarr sera accessible sur `http://localhost:3001`.
 | `PUID` | `1000` | UID utilisateur pour les permissions fichiers |
 | `PGID` | `1000` | GID utilisateur pour les permissions fichiers |
 | `TZ` | — | Timezone (ex: `Europe/Paris`) |
+| `JWT_SECRET` | auto-généré | Secret JWT — généré automatiquement dans `data/secret.key` si absent |
 | `GITHUB_RAW_URL` | repo scraper | URL du `torrent_final.json` à utiliser |

 ### Premier démarrage
@@ -165,4 +166,5 @@ Fankarr est disponible dans l'appstore personnalisé. Pour l'installer :

 - [fankai.fr](https://fankai.fr) — Le projet Fankai
 - [Plugin Jellyfin Fankai](https://github.com/Nackophilz/fankai_jellyfin) — Reconnaissance des métadonnées dans Jellyfin
- [fankarr-scraper](https://github.com/masutayunikon/fankarr-scraper) — Pipeline de collecte des torrents
+- [fankarr-scraper](https://github.com/masutayunikon/fankarr-scraper) — Pipeline de collecte des torrents
+- [runtipi-appstore](https://github.com/Masutayunikon/runtipi-appstore) — Appstore Runtipi personnel
@@ -0,0 +1,15 @@
+services:
+  fankarr:
+    image: masutayunikon/fankarr:latest
+    container_name: fankarr
+    environment:
+      - PUID=1000        # UID de votre utilisateur (id -u)
+      - PGID=1000        # GID de votre utilisateur (id -g)
+      - TZ=Europe/Paris  # Votre timezone
+    volumes:
+      - ./data:/app/data                        # Config, logs, base de données
+      - /votre/chemin/media:/media/Kai          # Destination Jellyfin
+      - /votre/chemin/complete:/downloads/complete  # Dossier complétés qBittorrent
+    ports:
+      - 3001:3001
+    restart: unless-stopped
@@ -433,6 +433,22 @@ app.get('/api/system', requireAuth, (_req, res) => {
    res.json({ isDocker })
 })

+app.get('/api/browse', requireAuth, (req, res) => {
+    const dirPath = (req.query.path as string) || '/'
+    try {
+        const entries = fs.readdirSync(dirPath, { withFileTypes: true })
+        const dirs = entries
+            .filter(e => e.isDirectory())
+            .map(e => e.name)
+            .filter(n => !n.startsWith('.'))
+            .sort((a, b) => a.localeCompare(b))
+        const parent = dirPath === '/' ? null : path.dirname(dirPath)
+        res.json({ path: dirPath, parent, dirs })
+    } catch (err) {
+        res.status(400).json({ error: err instanceof Error ? err.message : 'Erreur lecture dossier' })
+    }
+})
+
 app.get('/api/torrents/status', requireAuth, (_req, res) => {
    try {
        if (!fs.existsSync(TORRENTS_PATH)) { res.json({ exists: false, count: 0, empty: true }); return }
@@ -459,6 +475,18 @@ app.post('/api/update', requireAuth, async (_req, res) => {
    }
 })

+app.post('/api/scan', requireAuth, async (_req, res) => {
+    try {
+        const { mediaPath } = readSettings()
+        const ORGANIZED_PATH = path.join(process.cwd(), 'data', 'organized.json')
+        const result = await scanMediaPath(mediaPath, TORRENTS_PATH, ORGANIZED_PATH)
+        logger.info('api', `Scan manuel: ${result.found} fichiers scannés, ${result.added} ajoutés`)
+        res.json({ ok: true, ...result })
+    } catch (err) {
+        res.status(500).json({ error: err instanceof Error ? err.message : 'Erreur inconnue' })
+    }
+})
+
 // ── SPA fallback (prod) — doit être après toutes les routes API ─
 if (fs.existsSync(PUBLIC_PATH)) {
    app.get('*path', (_req, res) => {
@@ -20,19 +20,22 @@ const TORRENTS_PATH  = path.join(process.cwd(), 'data', 'torrent_final.json')
 const ORGANIZED_PATH = path.join(process.cwd(), 'data', 'organized.json')

 // ─── Utils log ────────────────────────────────────────────────
+// Le worker tourne dans un thread séparé — il passe les logs au thread principal
+// qui les écrit dans le fichier via logger.ts

 function log(msg: string)   { parentPort?.postMessage({ type: 'log', level: 'info',  msg }) }
 function warn(msg: string)  { parentPort?.postMessage({ type: 'log', level: 'warn',  msg }) }
 function error(msg: string) { parentPort?.postMessage({ type: 'log', level: 'error', msg }) }
+function debug(msg: string) { parentPort?.postMessage({ type: 'log', level: 'debug', msg }) }

 // ─── Settings (lu directement, pas d'import circulaire) ──────

-function readSettings(): { mediaPath: string; completePath: string; organizeMode: string } {
+function readSettings(): { mediaPath: string; completePath: string; organizeMode: string; nfoSupport: boolean } {
    try {
        const p = path.join(process.cwd(), 'data', 'settings.json')
-        if (!fs.existsSync(p)) return { mediaPath: '/media/Kai', completePath: '/downloads/complete', organizeMode: 'hardlink' }
+        if (!fs.existsSync(p)) return { mediaPath: '', completePath: '', organizeMode: 'hardlink', nfoSupport: false }
        return JSON.parse(fs.readFileSync(p, 'utf-8'))
-    } catch { return { mediaPath: '/media/Kai', completePath: '/downloads/complete', organizeMode: 'hardlink' } }
+    } catch { return { mediaPath: '', completePath: '', organizeMode: 'hardlink', nfoSupport: false } }
 }

 // ─── Organized log ────────────────────────────────────────────
@@ -84,10 +87,98 @@ function isInExcludedFolder(filePath: string[]): boolean {
    return false
 }

+// ─── Map correction titres API → titres GitLab ───────────────
+
+const SERIE_TITLE_GITLAB_MAP: Record<string, string> = {
+    'Enfer Et Paradis Henshū'            : 'Enfer et Paradis Henshū',
+    'Hajime No Ippo Henshū'              : 'Hajime no Ippo Henshū',
+    'Hikaru No Go Henshū'                : 'Hikaru no Go Henshū',
+    'Hokuto No Ken Kaï'                  : 'Hokuto no Ken Kaï',
+    'Kaguya-sama : Love is War Henshū'   : 'Kaguya-sama - Love is War Henshū',
+    'Kenshin le Vagabond Henshū'         : 'Kenshin le vagabond Henshū',
+    'Kuroko No Basket Henshū'            : 'Kuroko no Basket Henshū',
+    'Shingeki No Kyojin Henshū'          : 'Shingeki no Kyojin Henshū',
+    'Tower Of God Henshū'                : 'Tower of God Henshū',
+}
+
+function getGitlabSerieTitle(serieTitle: string): string {
+    return SERIE_TITLE_GITLAB_MAP[serieTitle] ?? serieTitle
+}
+
+
+
+// ─── GitLab NFO downloader ────────────────────────────────────
+
+const GITLAB_API      = 'https://gitlab.com/api/v4/projects/ElPouki%2Ffankai_pack/repository'
+const GITLAB_RAW_BASE = 'https://gitlab.com/ElPouki/fankai_pack/-/raw/main/pack'
+
+async function fetchJson(url: string): Promise<any> {
+    const { default: nodeFetch } = await import('node-fetch')
+    const res = await (nodeFetch as any)(url, { headers: { 'User-Agent': 'fankarr' } })
+    if (!res.ok) throw new Error(`HTTP ${res.status} — ${url}`)
+    return res.json()
+}
+
+async function fetchBinary(url: string): Promise<Buffer> {
+    const { default: nodeFetch } = await import('node-fetch')
+    const res = await (nodeFetch as any)(url, { headers: { 'User-Agent': 'fankarr' } })
+    if (!res.ok) throw new Error(`HTTP ${res.status} — ${url}`)
+    return Buffer.from(await res.arrayBuffer())
+}
+
+async function downloadGitlabFolder(serieTitle: string, destRoot: string): Promise<void> {
+    const gitlabTitle = getGitlabSerieTitle(serieTitle)
+    const folderPath  = `pack/${gitlabTitle}`
+
+    log(`[nfo] Récupération dossier GitLab: ${gitlabTitle}`)
+
+    // Lister récursivement tous les fichiers du dossier
+    let files: any[]
+    try {
+        files = await fetchJson(
+            `${GITLAB_API}/tree?path=${encodeURIComponent(folderPath)}&recursive=true&per_page=100&ref=main`
+        )
+    } catch (err) {
+        warn(`[nfo] Dossier GitLab introuvable pour "${gitlabTitle}": ${err instanceof Error ? err.message : err}`)
+        return
+    }
+
+    if (!Array.isArray(files) || files.length === 0) {
+        warn(`[nfo] Aucun fichier trouvé sur GitLab pour "${gitlabTitle}"`)
+        return
+    }
+
+    const fileEntries = files.filter((f: any) => f.type === 'blob')
+    log(`[nfo] ${fileEntries.length} fichiers à télécharger`)
+
+    for (const entry of fileEntries) {
+        // entry.path = "pack/Black Lagoon Henshū/Saison 1/fichier.nfo"
+        // On retire le préfixe "pack/{gitlabTitle}/" pour obtenir le chemin relatif
+        const relativePath = entry.path.replace(`pack/${gitlabTitle}/`, '')
+        const destPath     = path.join(destRoot, relativePath)
+        const destDir      = path.dirname(destPath)
+
+        // Skip si déjà présent
+        if (fs.existsSync(destPath)) continue
+
+        try {
+            fs.mkdirSync(destDir, { recursive: true })
+            const rawUrl = `${GITLAB_RAW_BASE}/${encodeURIComponent(gitlabTitle)}/${relativePath.split('/').map(encodeURIComponent).join('/')}`
+            const data   = await fetchBinary(rawUrl)
+            fs.writeFileSync(destPath, data)
+            log(`[nfo] ✓ ${relativePath}`)
+        } catch (err) {
+            warn(`[nfo] ✗ ${relativePath}: ${err instanceof Error ? err.message : err}`)
+        }
+    }
+
+    log(`[nfo] Dossier GitLab synchronisé pour "${serieTitle}"`)
+}
+
 // ─── Filesystem ops ───────────────────────────────────────────

 function seasonFolder(n: number): string {
-    return `Saison ${String(n).padStart(3, '0')}`
+    return `Saison ${n}`
 }

 function tryHardlink(src: string, dest: string): boolean {
@@ -101,7 +192,7 @@ function tryHardlink(src: string, dest: string): boolean {
 // ─── Organise un torrent ──────────────────────────────────────

 async function organizeTorrent(hash: string, name: string, savePath: string) {
-    const { mediaPath, completePath, organizeMode } = readSettings()
+    const { mediaPath, completePath, organizeMode, nfoSupport } = readSettings()
    const result = { total: 0, skipped: 0, done: 0, errors: [] as { file: string; error: string }[] }

    log(`[organize] ── ${name} ──`)
@@ -118,13 +209,20 @@ async function organizeTorrent(hash: string, name: string, savePath: string) {
    const torrentFiles: any[] = torrent.torrent_files ?? []
    log(`[organize] serie=${serieTitle} fichiers=${torrentFiles.length}`)

+    // ── Téléchargement NFO/images depuis GitLab ───────────────
+    if (nfoSupport) {
+        const serieDestRoot = path.join(mediaPath, serieTitle)
+        await downloadGitlabFolder(serieTitle, serieDestRoot)
+    }
+
    // ── Cas fichier unique ────────────────────────────────────
    if (torrentFiles.length === 0) {
        log(`[organize] torrent_files vide → tentative fichier unique`)
        const candidates = [path.join(savePath, name), path.join(completePath, name)]
        let src: string | null = null
        for (const c of candidates) {
-            log(`[organize]   candidate: ${c} → ${fs.existsSync(c) ? '✓' : '✗'}`)
+            if (fs.existsSync(c)) log(`[organize]   ✓ source trouvée: ${c}`)
+            else debug(`[organize]   candidate absent: ${c}`)
            if (fs.existsSync(c)) { src = c; break }
        }
        if (!src) throw new Error(`Source introuvable pour "${name}"`)
@@ -4,17 +4,19 @@ import path from 'path'
 const DATA_PATH = path.join(process.cwd(), 'data', 'settings.json')

 export interface Settings {
-    mediaPath     : string   // dossier Jellyfin destination ex: /media/Kai
-    completePath  : string   // dossier qB complétion ex: /downloads/complete
+    mediaPath     : string
+    completePath  : string
    organizeMode  : 'hardlink' | 'move'
-    category      : string   // catégorie qBittorrent
+    category      : string
+    nfoSupport    : boolean   // téléchargement NFO/images depuis GitLab Fankai Pack
 }

 const defaults: Settings = {
-    mediaPath    : '/media/Kai',
-    completePath : '/downloads/complete',
+    mediaPath    : '',
+    completePath : '',
    organizeMode : 'hardlink',
    category     : 'fankai',
+    nfoSupport   : false,
 }

 export function readSettings(): Settings {
@@ -168,7 +168,9 @@ export async function dispatchList(category?: string): Promise<(TorrentInfo & {
        const driver = getDriver(client.type)
        if (!driver) continue
        try {
-            const torrents = await driver.list(client.config, category)
+            // La catégorie du client est prioritaire sur la catégorie globale
+            const clientCategory = (client.config.category as string) || category
+            const torrents = await driver.list(client.config, clientCategory)
            for (const t of torrents) {
                results.push({ ...t, client_uuid: client.uuid, client_name: client.name })
            }
@@ -1,8 +1,8 @@
 <template>
  <div class="min-h-screen bg-[#080c10] text-[#c8d8e8] font-mono">
-    <RouterView v-slot="{ Component, route }">
+    <RouterView v-slot="{ Component }">
      <keep-alive include="CatalogView">
-        <component :is="Component" :key="route.path" />
+        <component :is="Component" />
      </keep-alive>
    </RouterView>
    <ToastContainer />
@@ -0,0 +1,117 @@
+<template>
+  <!-- Overlay -->
+  <div class="fixed inset-0 bg-black/70 flex items-center justify-center z-50 px-4" @click.self="$emit('cancel')">
+    <div class="bg-[#0d1219] border border-[#1e2d3d] w-full max-w-lg flex flex-col" style="max-height: 70vh">
+
+      <!-- Header -->
+      <div class="flex items-center justify-between px-5 py-4 border-b border-[#1e2d3d] shrink-0">
+        <div>
+          <div class="text-[10px] text-[#e8513a] tracking-widest mb-0.5">CHOISIR UN DOSSIER</div>
+          <div class="text-xs text-[#5a7a94] font-mono truncate max-w-xs">{{ current }}</div>
+        </div>
+        <button @click="$emit('cancel')" class="text-[#5a7a94] hover:text-white transition-colors cursor-pointer text-lg leading-none">✕</button>
+      </div>
+
+      <!-- Chemin éditable -->
+      <div class="px-5 py-3 border-b border-[#1e2d3d] shrink-0 flex gap-2">
+        <input
+            v-model="inputPath"
+            @keydown.enter="navigateTo(inputPath)"
+            class="flex-1 bg-[#121920] border border-[#1e2d3d] text-xs text-white px-3 py-2 font-mono outline-none focus:border-[#e8513a] transition-colors"
+            placeholder="/"
+        />
+        <button @click="navigateTo(inputPath)"
+                class="border border-[#1e2d3d] text-[#5a7a94] px-3 py-2 text-xs tracking-widest hover:border-[#e8513a] hover:text-[#e8513a] transition-colors cursor-pointer">
+          OK
+        </button>
+      </div>
+
+      <!-- Navigation retour -->
+      <div v-if="parent !== null" class="px-5 shrink-0">
+        <button @click="navigateTo(parent)"
+                class="flex items-center gap-2 w-full py-2.5 text-xs text-[#5a7a94] hover:text-white transition-colors cursor-pointer border-b border-[#1e2d3d]">
+          <svg width="12" height="12" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path d="M19 12H5M12 5l-7 7 7 7"/>
+          </svg>
+          ..
+        </button>
+      </div>
+
+      <!-- Liste dossiers -->
+      <div class="overflow-y-auto flex-1">
+        <div v-if="loading" class="flex items-center justify-center py-10 text-[#5a7a94] text-xs">
+          <div class="w-4 h-4 border border-white/10 border-t-[#e8513a] rounded-full animate-spin mr-2"/>
+          Chargement...
+        </div>
+        <div v-else-if="error" class="px-5 py-4 text-xs text-red-400">{{ error }}</div>
+        <div v-else-if="dirs.length === 0" class="px-5 py-4 text-xs text-[#5a7a94]">Aucun sous-dossier</div>
+        <button
+            v-for="dir in dirs"
+            :key="dir"
+            @click="navigateTo(joinPath(current, dir))"
+            class="flex items-center gap-3 w-full px-5 py-2.5 text-xs text-[#c8d8e8] hover:bg-white/5 transition-colors cursor-pointer border-b border-[#1e2d3d]/50 text-left"
+        >
+          <svg width="14" height="14" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+            <path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7z"/>
+          </svg>
+          {{ dir }}
+        </button>
+      </div>
+
+      <!-- Footer -->
+      <div class="flex items-center justify-between px-5 py-4 border-t border-[#1e2d3d] shrink-0">
+        <span class="text-[10px] text-[#5a7a94] font-mono truncate max-w-xs">{{ current }}</span>
+        <button @click="$emit('select', current)"
+                class="bg-[#e8513a] text-white px-5 py-2 text-xs tracking-widest hover:opacity-85 transition-opacity cursor-pointer">
+          CHOISIR
+        </button>
+      </div>
+
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+
+const props = defineProps<{ initialPath?: string }>()
+const emit  = defineEmits<{ select: [path: string]; cancel: [] }>()
+
+const current   = ref(props.initialPath || '/')
+const inputPath = ref(current.value)
+const dirs      = ref<string[]>([])
+const parent    = ref<string | null>(null)
+const loading   = ref(false)
+const error     = ref('')
+
+function joinPath(base: string, name: string): string {
+  return base === '/' ? `/${name}` : `${base}/${name}`
+}
+
+async function navigateTo(p: string) {
+  if (!p) return
+  loading.value = true
+  error.value   = ''
+  try {
+    const res = await fetch(`/api/browse?path=${encodeURIComponent(p)}`, { credentials: 'include' })
+    if (!res.ok) {
+      const data = await res.json()
+      error.value = data.error ?? 'Erreur'
+      return
+    }
+    const data = await res.json()
+    current.value   = data.path
+    inputPath.value = data.path
+    parent.value    = data.parent
+    dirs.value      = data.dirs
+  } catch {
+    error.value = 'Impossible de lire ce dossier'
+  } finally {
+    loading.value = false
+  }
+}
+
+watch(() => props.initialPath, v => {
+  if (v) navigateTo(v)
+}, { immediate: true })
+</script>
@@ -4,9 +4,9 @@
    <!-- Header -->
    <header class="sticky top-0 z-50 bg-zinc-950/90 backdrop-blur border-b border-white/5">
      <div class="max-w-7xl mx-auto px-6 h-16 flex items-center justify-between">
-        <span class="text-2xl font-serif tracking-tight">
+        <router-link to="/" class="text-2xl font-serif tracking-tight hover:opacity-80 transition">
          <span class="text-zinc-100">Fan</span><span class="text-orange-500">karr</span>
-        </span>
+        </router-link>
        <div class="flex items-center gap-2">
          <!-- Icône logs -->
          <router-link to="/logs"
@@ -67,9 +67,10 @@
              class="w-full bg-white/5 border border-white/[0.08] rounded-lg pl-9 pr-4 py-2 text-sm placeholder-zinc-600 outline-none focus:border-orange-500/50 transition"
          />
        </div>
-        <div class="flex gap-1">
+        <div class="flex items-center gap-1">
+          <!-- Groupe 1 : état de la série -->
          <button
-              v-for="f in filters"
+              v-for="f in filtersGroupe1"
              :key="f.value"
              class="px-3 py-1.5 rounded-lg text-xs font-medium border transition"
              :class="activeFilter === f.value
@@ -77,6 +78,20 @@
              : 'bg-transparent border-white/[0.08] text-zinc-500 hover:text-zinc-100 hover:border-white/20'"
              @click="activeFilter = f.value"
          >{{ f.label }}</button>
+
+          <!-- Séparateur -->
+          <span class="w-px h-5 bg-white/10 mx-1" />
+
+          <!-- Groupe 2 : état du téléchargement -->
+          <button
+              v-for="f in filtersGroupe2"
+              :key="f.value"
+              class="px-3 py-1.5 rounded-lg text-xs font-medium border transition"
+              :class="activeFilter === f.value
+              ? 'bg-blue-500 border-blue-500 text-white'
+              : 'bg-transparent border-white/[0.08] text-zinc-500 hover:text-zinc-100 hover:border-white/20'"
+              @click="activeFilter = f.value"
+          >{{ f.label }}</button>
        </div>
        <span class="text-xs text-zinc-600 ml-auto">{{ filtered.length }} série{{ filtered.length > 1 ? 's' : '' }}</span>
      </div>
@@ -132,10 +147,8 @@
              </svg>
            </div>

-            <!-- Badge torrents dispo -->
-            <div v-if="serie.has_torrents" class="absolute top-2 right-2 bg-orange-500 text-white text-[10px] font-bold px-1.5 py-0.5 rounded-full leading-none">
-              {{ serie.torrent_count }}
-            </div>
+
+

            <!-- Badge état téléchargement -->
            <div v-if="serie.download_state !== 'none'"
@@ -186,7 +199,7 @@
 </template>

 <script setup lang="ts">
-import { ref, computed, onMounted, onUnmounted } from 'vue'
+import { ref, computed, onMounted, onUnmounted, onActivated } from 'vue'
 import { useRouter } from 'vue-router'
 import { useSeriesStore } from '@/stores/series'
 import { useAuthStore } from '@/stores/auth'
@@ -201,12 +214,15 @@ const search = ref('')
 const activeFilter = ref('all')
 const activeDownloads = ref(0)

-const filters = [
-  { label: 'Toutes',      value: 'all' },
-  { label: 'Disponibles', value: 'available' },
-  { label: 'Téléchargés', value: 'complete' },
-  { label: 'En cours',    value: 'downloading' },
-  { label: 'Sans torrent', value: 'unavailable' },
+const filtersGroupe1 = [
+  { label: 'Toutes',        value: 'all' },
+  { label: 'Disponibles',   value: 'available' },
+  { label: 'Sans torrent',  value: 'unavailable' },
+]
+
+const filtersGroupe2 = [
+  { label: 'DL complet',    value: 'complete' },
+  { label: 'DL partiel',    value: 'downloading' },
 ]

 const filtered = computed(() => {
@@ -259,8 +275,24 @@ async function fetchOrganizeNotifs() {
  } catch {}
 }

-onMounted(() => {
-  if (store.series.length === 0) store.fetchSeries()
+// ── Cache images ───────────────────────────────────────────────
+const imageCache = new Set<string>()
+
+function precacheImages(series: any[]) {
+  for (const s of series) {
+    if (s.poster_image && !imageCache.has(s.poster_image)) {
+      imageCache.add(s.poster_image)
+      const img = new Image()
+      img.src = s.poster_image
+    }
+  }
+}
+
+onMounted(async () => {
+  if (store.series.length === 0) {
+    await store.fetchSeries()
+    precacheImages(store.series)
+  }
  fetchActiveDownloads()
  fetchOrganizeNotifs()
  dlInterval = setInterval(() => {
@@ -269,6 +301,13 @@ onMounted(() => {
  }, 10000)
 })

+// Refresh au retour sur le catalogue (après update ou scan)
+onActivated(async () => {
+  await store.fetchSeries()
+  precacheImages(store.series)
+  fetchActiveDownloads()
+})
+
 onUnmounted(() => {
  if (dlInterval) clearInterval(dlInterval)
 })
@@ -10,7 +10,6 @@
        <h1 class="text-xl font-black text-white font-sans">Téléchargements</h1>
      </div>
      <div class="flex items-center gap-3">
-        <!-- Indicateur de polling -->
        <div class="flex items-center gap-2 text-[10px] text-[#5a7a94] tracking-widest">
          <div class="w-1.5 h-1.5 rounded-full" :class="polling ? 'bg-green-500 animate-pulse' : 'bg-[#1e2d3d]'"/>
          {{ polling ? 'EN DIRECT' : 'PAUSE' }}
@@ -30,6 +29,47 @@
      </div>
    </div>

+    <!-- Onglets -->
+    <div class="flex items-center justify-between mb-4">
+      <div class="flex gap-0 border border-[#1e2d3d]">
+        <button
+            @click="activeTab = 'active'"
+            class="px-5 py-2 text-xs tracking-widest transition-colors cursor-pointer"
+            :class="activeTab === 'active'
+            ? 'bg-[#e8513a] text-white border-[#e8513a]'
+            : 'text-[#5a7a94] hover:text-white'">
+          EN COURS
+          <span v-if="activeTorrents.length > 0"
+                class="ml-1.5 bg-white/20 text-[9px] px-1.5 py-0.5 rounded-full">
+            {{ activeTorrents.length }}
+          </span>
+        </button>
+        <button
+            @click="activeTab = 'done'"
+            class="px-5 py-2 text-xs tracking-widest transition-colors cursor-pointer border-l border-[#1e2d3d]"
+            :class="activeTab === 'done'
+            ? 'bg-[#e8513a] text-white'
+            : 'text-[#5a7a94] hover:text-white'">
+          TERMINÉS
+          <span v-if="doneTorrents.length > 0"
+                class="ml-1.5 bg-white/20 text-[9px] px-1.5 py-0.5 rounded-full">
+            {{ doneTorrents.length }}
+          </span>
+        </button>
+      </div>
+
+      <!-- Toggle masquer organisés (onglet TERMINÉS uniquement) -->
+      <div v-if="activeTab === 'done'" class="flex items-center gap-2">
+        <button @click="hideOrganized = !hideOrganized"
+                class="relative shrink-0 w-8 h-4 rounded-full transition-colors cursor-pointer"
+                :class="hideOrganized ? 'bg-[#e8513a]' : 'bg-[#1e2d3d]'">
+          <span class="absolute top-0.5 left-0.5 w-3 h-3 rounded-full bg-white transition-transform duration-200"
+                :class="hideOrganized ? 'translate-x-4' : 'translate-x-0'" />
+        </button>
+        <span class="text-[10px] text-[#5a7a94] tracking-widest">MASQUER ORGANISÉS</span>
+      </div>
+    </div>
+
    <!-- Pas de clients -->
    <div v-if="noClients" class="flex flex-col items-center justify-center gap-3 min-h-64 text-[#5a7a94]">
      <p class="text-sm">Aucun client torrent configuré</p>
@@ -46,14 +86,20 @@
    </div>

    <!-- Vide -->
-    <div v-else-if="!loading && torrents.length === 0" class="flex flex-col items-center justify-center gap-3 min-h-64 text-[#5a7a94]">
-      <p class="text-sm">Aucun téléchargement en cours</p>
-      <p class="text-[11px]">Les torrents lancés depuis Fankarr apparaîtront ici</p>
+    <div v-else-if="!loading && visibleTorrents.length === 0" class="flex flex-col items-center justify-center gap-3 min-h-64 text-[#5a7a94]">
+      <p class="text-sm">
+        {{ activeTab === 'active' ? 'Aucun téléchargement en cours' : 'Aucun torrent terminé' }}
+      </p>
+      <p class="text-[11px]">
+        {{ activeTab === 'active'
+          ? 'Les torrents avec la catégorie « fankai » apparaîtront ici'
+          : hideOrganized ? 'Tous les torrents terminés sont organisés' : '' }}
+      </p>
    </div>

    <!-- Liste torrents -->
    <div v-else class="flex flex-col gap-2">
-      <div v-for="t in torrents" :key="t.hash"
+      <div v-for="t in visibleTorrents" :key="t.hash"
           class="bg-[#0d1219] border border-[#1e2d3d] p-4">

        <!-- Ligne principale -->
@@ -61,17 +107,14 @@
          <div class="flex-1 min-w-0">
            <p class="text-sm text-white font-medium truncate">{{ t.name }}</p>
            <div class="flex items-center gap-3 mt-1">
-              <!-- Badge état -->
              <span class="text-[10px] tracking-widest px-2 py-0.5 border"
                    :class="stateBadge(t.state).class">
                {{ stateBadge(t.state).label }}
              </span>
-              <!-- Client -->
              <span class="text-[10px] text-[#5a7a94]">{{ t.client_name }}</span>
            </div>
          </div>

-          <!-- Infos droite -->
          <div class="text-right shrink-0">
            <p class="text-sm font-bold text-white">{{ t.progress }}%</p>
            <p class="text-[10px] text-[#5a7a94] mt-0.5">
@@ -92,26 +135,17 @@
        <!-- Infos bas -->
        <div class="flex items-center justify-between">
          <div class="flex items-center gap-4 text-[10px] text-[#5a7a94]">
-            <span v-if="t.state === 'downloading'">
-              ↓ {{ formatSpeed(t.speed) }}
-            </span>
-            <span v-if="t.state === 'downloading' && t.eta > 0">
-              ETA {{ formatEta(t.eta) }}
-            </span>
-            <span v-if="t.state === 'seeding'" class="text-green-500">
-              ✓ Complété
-            </span>
+            <span v-if="t.state === 'downloading'">↓ {{ formatSpeed(t.speed) }}</span>
+            <span v-if="t.state === 'downloading' && t.eta > 0">ETA {{ formatEta(t.eta) }}</span>
+            <span v-if="t.state === 'seeding'" class="text-green-500">✓ Complété</span>
          </div>

-          <!-- Badge organisation -->
+          <!-- Badge organisation (seulement pour les terminés) -->
          <div v-if="t.state === 'seeding'" class="flex items-center gap-2">
-
-            <!-- Badge erreurs avec tooltip -->
            <div v-if="t.errorFiles?.length > 0" class="relative group/err">
              <span class="text-[9px] tracking-widest px-2 py-0.5 border border-red-500/40 text-red-400 cursor-default">
                {{ t.errorFiles.length }} ERREUR{{ t.errorFiles.length > 1 ? 'S' : '' }}
              </span>
-              <!-- Tooltip -->
              <div class="absolute bottom-full right-0 mb-2 hidden group-hover/err:block z-10 w-80">
                <div class="bg-[#0d1219] border border-red-500/30 p-3 text-[10px] shadow-xl">
                  <div class="text-red-400 tracking-widest mb-2">FICHIERS EN ERREUR</div>
@@ -123,7 +157,6 @@
              </div>
            </div>

-            <!-- Badge statut organisation -->
            <span class="text-[9px] tracking-widest px-2 py-0.5 border"
                  :class="t.organizeState === 'done'    ? 'border-green-500/40 text-green-500' :
                        t.organizeState === 'partial'  ? 'border-yellow-500/40 text-yellow-500' :
@@ -133,7 +166,6 @@
                    'NON ORGANISÉ' }}
            </span>

-            <!-- Bouton organiser si pas encore fait -->
            <button v-if="t.organizeState !== 'done'"
                    @click="organize(t)"
                    :disabled="organizing[t.hash]"
@@ -153,14 +185,31 @@ import { useToast } from '@/composables/useToast'

 const { add: toast } = useToast()

-const torrents   = ref<any[]>([])
-const loading    = ref(true)
-const polling    = ref(true)
-const noClients  = ref(false)
-const organizing = ref<Record<string, boolean>>({})
+const torrents      = ref<any[]>([])
+const loading       = ref(true)
+const polling       = ref(true)
+const noClients     = ref(false)
+const organizing    = ref<Record<string, boolean>>({})
+const activeTab     = ref<'active' | 'done'>('active')
+const hideOrganized = ref(false)

 let pollInterval: ReturnType<typeof setInterval> | null = null

+// ── Filtres onglets ────────────────────────────────────────────
+const activeTorrents = computed(() =>
+    torrents.value.filter(t => ['downloading', 'paused', 'checking', 'error', 'unknown'].includes(t.state))
+)
+
+const doneTorrents = computed(() =>
+    torrents.value.filter(t => t.state === 'seeding')
+)
+
+const visibleTorrents = computed(() => {
+  if (activeTab.value === 'active') return activeTorrents.value
+  if (hideOrganized.value) return doneTorrents.value.filter(t => t.organizeState !== 'done')
+  return doneTorrents.value
+})
+
 // ── Stats ──────────────────────────────────────────────────────
 const stats = computed(() => [
  { label: 'EN COURS',  value: torrents.value.filter(t => t.state === 'downloading').length },
@@ -213,7 +262,6 @@ async function organize(torrent: any) {
      body: JSON.stringify({ hash: torrent.hash, save_path: torrent.save_path, name: torrent.name })
    })
    if (res.ok) {
-      organized.value[torrent.hash] = true
      toast(`${torrent.name} organisé ✓`, 'success')
    } else {
      const { error } = await res.json()
@@ -65,16 +65,40 @@
                  v-for="(t, i) in data.torrents_integrale"
                  :key="i"
                  class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium rounded-lg transition"
-                  :class="t.label === 'Intégrale'
-                  ? 'bg-orange-500 hover:bg-orange-600 text-white'
-                  : 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border border-orange-500/20'"
-                  :disabled="downloading === `integrale-${i}`"
+                  :class="[
+                  t.label === 'Intégrale'
+                    ? 'bg-orange-500 hover:bg-orange-600 text-white'
+                    : 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border border-orange-500/20',
+                  (downloading.has(`integrale-${i}`) || downloaded.has(`integrale-${i}`) || isAlreadyQueued(t)) ? 'opacity-50 cursor-not-allowed' : ''
+                ]"
+                  :disabled="downloading.has(`integrale-${i}`) || downloaded.has(`integrale-${i}`) || isAlreadyQueued(t)"
                  @click="download(`integrale-${i}`, t.torrent_url, t.magnet)"
              >
-                <DownloadIcon :spinning="downloading === `integrale-${i}`" />
-                {{ t.label }}
+                <DownloadIcon :spinning="downloading.has(`integrale-${i}`)" />
+                {{ isAlreadyQueued(t) ? 'Déjà ajouté' : downloaded.has(`integrale-${i}`) ? 'Envoyé ✓' : t.label }}
              </button>
            </div>
+            <!-- Barre progression intégrale -->
+            <template v-for="(t, i) in data.torrents_integrale" :key="`prog-${i}`">
+              <template v-if="torrentProgress(extractHash(t))">
+                <!-- Badge 100% -->
+                <span v-if="torrentProgress(extractHash(t))!.progress === 100"
+                      class="mt-2 inline-flex items-center gap-1.5 text-[10px] px-2.5 py-1 rounded-full border bg-green-500/10 text-green-400 border-green-500/20">
+                  ✓ Téléchargé
+                </span>
+                <!-- Barre en cours -->
+                <div v-else class="mt-2 w-full max-w-sm">
+                  <div class="flex items-center justify-between text-[10px] text-zinc-500 mb-1">
+                    <span>Téléchargement</span>
+                    <span>{{ torrentProgress(extractHash(t))!.progress }}%</span>
+                  </div>
+                  <div class="h-1 bg-white/10 rounded-full overflow-hidden">
+                    <div class="h-full bg-orange-500 rounded-full transition-all duration-500"
+                         :style="{ width: `${torrentProgress(extractHash(t))!.progress}%` }" />
+                  </div>
+                </div>
+              </template>
+            </template>
          </div>
        </div>
      </div>
@@ -124,76 +148,123 @@
            <!-- Bouton pack_saison sur le header -->
            <button
                class="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-lg border transition"
-                :class="season.torrent
-                ? 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border-orange-500/20'
-                : 'bg-white/[0.03] text-zinc-600 border-white/8 cursor-not-allowed'"
-                :disabled="!season.torrent || downloading === `season-${season.id}`"
+                :class="[
+                season.torrent && !downloaded.has(`season-${season.id}`) && !isAlreadyQueued(season.torrent) && season.organized_state !== 'complete'
+                  ? 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border-orange-500/20'
+                  : 'bg-white/[0.03] text-zinc-600 border-white/8 cursor-not-allowed'
+              ]"
+                :disabled="!season.torrent || downloading.has(`season-${season.id}`) || downloaded.has(`season-${season.id}`) || isAlreadyQueued(season.torrent) || season.organized_state === 'complete'"
                @click="season.torrent && download(`season-${season.id}`, season.torrent.torrent_url, season.torrent.magnet)"
            >
-              <DownloadIcon :spinning="downloading === `season-${season.id}`" :size="12" />
-              Saison entière
+              <DownloadIcon :spinning="downloading.has(`season-${season.id}`)" :size="12" />
+              {{ season.organized_state === 'complete' ? 'Organisé ✓' : isAlreadyQueued(season.torrent) ? 'Déjà ajouté' : downloaded.has(`season-${season.id}`) ? 'Envoyé ✓' : 'Saison entière' }}
            </button>
          </div>
+          <!-- Barre progression saison -->
+          <template v-if="torrentProgress(extractHash(season.torrent))">
+            <!-- Badge 100% -->
+            <div v-if="torrentProgress(extractHash(season.torrent))!.progress === 100"
+                 class="px-5 py-2 border-b border-white/5">
+              <span class="inline-flex items-center gap-1.5 text-[10px] px-2.5 py-1 rounded-full border bg-green-500/10 text-green-400 border-green-500/20">
+                ✓ Téléchargé
+              </span>
+            </div>
+            <!-- Barre en cours -->
+            <div v-else class="px-5 py-2 border-b border-white/5">
+              <div class="flex items-center justify-between text-[10px] text-zinc-500 mb-1">
+                <span>Téléchargement en cours</span>
+                <span>{{ torrentProgress(extractHash(season.torrent))!.progress }}%</span>
+              </div>
+              <div class="h-1 bg-white/10 rounded-full overflow-hidden">
+                <div class="h-full bg-orange-500 rounded-full transition-all duration-500"
+                     :style="{ width: `${torrentProgress(extractHash(season.torrent))!.progress}%` }" />
+              </div>
+            </div>
+          </template>

          <!-- Episodes -->
          <div v-if="!collapsedSeasons.has(season.id)" class="divide-y divide-white/[0.04]">
            <div
                v-for="ep in season.episodes"
                :key="ep.id"
-                class="flex items-center gap-4 px-5 py-3 hover:bg-white/[0.02] transition"
+                class="px-5 py-3 hover:bg-white/[0.02] transition"
            >
-              <!-- Thumbnail -->
-              <div class="shrink-0 w-24 aspect-video rounded-lg overflow-hidden bg-zinc-800 hidden sm:block">
-                <img v-if="ep.thumb_image" :src="ep.thumb_image" class="w-full h-full object-cover" loading="lazy" />
-                <div v-else class="w-full h-full flex items-center justify-center text-zinc-700 text-xs font-mono">
-                  {{ season.season_number === 0 ? 'SP' : `E${ep.episode_number}` }}
+              <!-- Ligne principale -->
+              <div class="flex items-center gap-4">
+                <!-- Thumbnail -->
+                <div class="shrink-0 w-24 aspect-video rounded-lg overflow-hidden bg-zinc-800 hidden sm:block">
+                  <img v-if="ep.thumb_image" :src="ep.thumb_image" class="w-full h-full object-cover" loading="lazy" />
+                  <div v-else class="w-full h-full flex items-center justify-center text-zinc-700 text-xs font-mono">
+                    {{ season.season_number === 0 ? 'SP' : `E${ep.episode_number}` }}
+                  </div>
                </div>
-              </div>

-              <!-- Info -->
-              <div class="flex-1 min-w-0">
-                <div class="flex items-center gap-2">
+                <!-- Info -->
+                <div class="flex-1 min-w-0">
+                  <div class="flex items-center gap-2">
                  <span class="text-xs text-zinc-600 shrink-0 font-mono">
                    {{ season.season_number === 0 ? 'SP' : `E${String(ep.episode_number).padStart(2,'0')}` }}
                  </span>
-                  <span class="text-sm font-medium truncate">{{ ep.title || `Épisode ${ep.episode_number}` }}</span>
+                    <span class="text-sm font-medium truncate">{{ ep.title || `Épisode ${ep.episode_number}` }}</span>
+                  </div>
+                  <div class="flex items-center gap-3 mt-0.5">
+                    <span v-if="ep.aired" class="text-xs text-zinc-600">{{ formatDate(ep.aired) }}</span>
+                    <span v-if="ep.duration" class="text-xs text-zinc-600">{{ ep.duration }} min</span>
+                  </div>
                </div>
-                <div class="flex items-center gap-3 mt-0.5">
-                  <span v-if="ep.aired" class="text-xs text-zinc-600">{{ formatDate(ep.aired) }}</span>
-                  <span v-if="ep.duration" class="text-xs text-zinc-600">{{ ep.duration }} min</span>
-                </div>
-              </div>

-              <!-- Bouton épisode (type episode uniquement) -->
-              <div class="shrink-0 flex items-center gap-2">
-                <!-- Badge organisé -->
-                <span v-if="ep.organized"
-                      class="text-[10px] px-2 py-0.5 rounded-full border bg-green-500/10 text-green-400 border-green-500/20">
+                <!-- Bouton épisode (type episode uniquement) -->
+                <div class="shrink-0 flex items-center gap-2">
+                  <!-- Badge organisé -->
+                  <span v-if="ep.organized"
+                        class="text-[10px] px-2 py-0.5 rounded-full border bg-green-500/10 text-green-400 border-green-500/20">
                  ✓ organisé
                </span>

-                <!-- Badge dispo/indispo basé sur available (episode résolu dans un torrent) -->
-                <span
-                    class="inline-block text-[10px] px-2 py-0.5 rounded-full border"
-                    :class="ep.available
-                    ? 'bg-green-500/10 text-green-400 border-green-500/20'
+                  <!-- Badge téléchargé à 100% -->
+                  <span v-if="torrentProgress(extractHash(ep.torrent))?.progress === 100"
+                        class="text-[10px] px-2 py-0.5 rounded-full border bg-green-500/10 text-green-400 border-green-500/20">
+                  ✓ téléchargé
+                </span>
+
+                  <!-- Badge dispo/indispo -->
+                  <span
+                      class="inline-block text-[10px] px-2 py-0.5 rounded-full border"
+                      :class="ep.available
+                    ? 'bg-blue-500/10 text-blue-400 border-blue-500/20'
                    : 'bg-white/5 text-zinc-600 border-white/8'"
-                >
+                  >
                  {{ ep.available ? 'dispo' : 'indispo' }}
                </span>

-                <!-- Bouton download — visible seulement si type=episode, sinon grisé -->
-                <button
-                    class="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-lg border transition"
-                    :class="ep.torrent
-                    ? 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border-orange-500/20'
-                    : 'bg-white/[0.03] text-zinc-600 border-white/8 cursor-not-allowed'"
-                    :disabled="!ep.torrent || downloading === `ep-${ep.id}`"
-                    @click="ep.torrent && download(`ep-${ep.id}`, ep.torrent.torrent_url, ep.torrent.magnet)"
-                >
-                  <DownloadIcon :spinning="downloading === `ep-${ep.id}`" :size="12" />
-                  Ep.
-                </button>
+                  <!-- Bouton download -->
+                  <button
+                      class="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-lg border transition"
+                      :class="[
+                    ep.torrent && !downloaded.has(`ep-${ep.id}`) && !isAlreadyQueued(ep.torrent) && !ep.organized
+                      ? 'bg-orange-500/10 hover:bg-orange-500/20 text-orange-400 border-orange-500/20'
+                      : 'bg-white/[0.03] text-zinc-600 border-white/8 cursor-not-allowed'
+                  ]"
+                      :disabled="!ep.torrent || downloading.has(`ep-${ep.id}`) || downloaded.has(`ep-${ep.id}`) || isAlreadyQueued(ep.torrent) || ep.organized"
+                      @click="ep.torrent && download(`ep-${ep.id}`, ep.torrent.torrent_url, ep.torrent.magnet)"
+                  >
+                    <DownloadIcon :spinning="downloading.has(`ep-${ep.id}`)" :size="12" />
+                    {{ ep.organized ? '✓' : isAlreadyQueued(ep.torrent) ? '✓' : downloaded.has(`ep-${ep.id}`) ? '✓' : 'Ep.' }}
+                  </button>
+                </div>
+              </div>
+
+              <!-- Barre progression épisode (seulement si < 100%) -->
+              <div v-if="torrentProgress(extractHash(ep.torrent)) && torrentProgress(extractHash(ep.torrent))!.progress < 100"
+                   class="mt-2 sm:pl-28">
+                <div class="flex items-center justify-between text-[10px] text-zinc-500 mb-1">
+                  <span>Téléchargement</span>
+                  <span>{{ torrentProgress(extractHash(ep.torrent))!.progress }}%</span>
+                </div>
+                <div class="h-0.5 bg-white/10 rounded-full overflow-hidden">
+                  <div class="h-full bg-orange-500 rounded-full transition-all duration-500"
+                       :style="{ width: `${torrentProgress(extractHash(ep.torrent))!.progress}%` }" />
+                </div>
              </div>
            </div>
          </div>
@@ -223,7 +294,7 @@
 </template>

 <script setup lang="ts">
-import { ref, computed, onMounted, defineComponent, h } from 'vue'
+import { ref, computed, onMounted, onUnmounted, defineComponent, h } from 'vue'
 import { useRoute } from 'vue-router'
 import { useSeriesStore } from '@/stores/series'
 import type { Season } from '@/stores/series'
@@ -245,9 +316,44 @@ const route = useRoute()
 const store = useSeriesStore()

 const collapsedSeasons = ref<Set<number>>(new Set())
-const downloading = ref<string | null>(null)
-const toast = ref<{ type: 'success' | 'error'; message: string } | null>(null)
+const downloading      = ref<Set<string>>(new Set())
+const downloaded       = ref<Set<string>>(new Set())  // envoyés avec succès → bloqués
+const toast            = ref<{ type: 'success' | 'error'; message: string } | null>(null)

+// ── Progression downloads ──────────────────────────────────────
+interface ActiveTorrent { hash: string; progress: number; state: string; name: string }
+const activeTorrents = ref<ActiveTorrent[]>([])
+let pollTimer: ReturnType<typeof setInterval> | null = null
+
+async function fetchActiveDownloads() {
+  try {
+    const res = await fetch('/api/downloads', { credentials: 'include' })
+    if (!res.ok) return
+    const list: any[] = await res.json()
+    activeTorrents.value = list.map(t => ({
+      hash    : t.hash,
+      progress: t.progress ?? 0,
+      state   : t.state,
+      name    : t.name,
+    }))
+  } catch {}
+}
+
+// Cherche si un torrent actif correspond à un hash donné
+function torrentProgress(hash: string | null | undefined): ActiveTorrent | null {
+  if (!hash) return null
+  return activeTorrents.value.find(t => t.hash.toLowerCase() === hash.toLowerCase()) ?? null
+}
+
+// Hash d'un torrent de saison ou d'épisode (extrait depuis magnet ou url)
+function extractHash(torrent: { magnet?: string | null; torrent_url?: string | null } | null | undefined): string | null {
+  if (!torrent) return null
+  const magnet = torrent.magnet ?? ''
+  const m = magnet.match(/xt=urn:btih:([a-fA-F0-9]{40})/i)
+  return m ? m[1].toLowerCase() : null
+}
+
+// ── Data ───────────────────────────────────────────────────────
 const data = computed(() => store.currentSerie)

 function seasonAvailableCount(season: Season) {
@@ -269,19 +375,40 @@ function showToast(type: 'success' | 'error', message: string) {
  setTimeout(() => { toast.value = null }, 3500)
 }

+// Vérifie si un torrent est déjà en cours ou terminé dans qBittorrent
+function isAlreadyQueued(torrent: { magnet?: string | null; torrent_url?: string | null } | null | undefined): boolean {
+  const hash = extractHash(torrent)
+  if (!hash) return false
+  return activeTorrents.value.some(t => t.hash.toLowerCase() === hash.toLowerCase())
+}
+
 async function download(key: string, torrent_url: string | null, magnet: string | null) {
-  downloading.value = key
+  if (downloading.value.has(key) || downloaded.value.has(key)) return
+  downloading.value = new Set([...downloading.value, key])
  const result = await store.download(torrent_url, magnet)
-  downloading.value = null
-  if (result.success) showToast('success', 'Téléchargement lancé')
-  else showToast('error', result.error ?? 'Erreur inconnue')
+  downloading.value = new Set([...downloading.value].filter(k => k !== key))
+  if (result.success) {
+    downloaded.value = new Set([...downloaded.value, key])
+    showToast('success', 'Téléchargement lancé')
+    fetchActiveDownloads()
+  } else {
+    showToast('error', result.error ?? 'Erreur inconnue')
+  }
 }

 function load() {
  store.fetchSerieDetail(Number(route.params.id))
 }

-onMounted(load)
+onMounted(() => {
+  load()
+  fetchActiveDownloads()
+  pollTimer = setInterval(fetchActiveDownloads, 5000)
+})
+
+onUnmounted(() => {
+  if (pollTimer) clearInterval(pollTimer)
+})
 </script>

 <style scoped>
@@ -91,14 +91,12 @@
            <label class="text-[10px] text-[#5a7a94] tracking-widest">DOSSIER COMPLÉTION</label>
            <span v-if="isDocker" class="text-[9px] tracking-widest text-[#3a8fe8] border border-[#3a8fe8]/40 px-1.5 py-0.5">DOCKER</span>
          </div>
-          <input v-model="form.completePath" :disabled="isDocker"
-                 class="w-full bg-[#121920] border border-[#1e2d3d] text-sm px-3 py-2.5 outline-none transition-colors"
-                 :class="isDocker ? 'text-[#5a7a94] cursor-not-allowed opacity-60' : 'text-white focus:border-[#e8513a]'"
-                 placeholder="/downloads/complete"/>
-          <p class="text-[10px] text-[#5a7a94] mt-1.5">
-            <span v-if="isDocker">Défini par le volume Docker — non modifiable ici</span>
-            <span v-else>Dossier de complétion de qBittorrent</span>
-          </p>
+          <button @click="openPicker('completePath')"
+                  class="w-full bg-[#121920] border border-[#1e2d3d] text-sm px-3 py-2.5 text-left hover:border-[#e8513a] transition-colors cursor-pointer font-mono truncate"
+                  :class="form.completePath ? 'text-white' : 'text-[#5a7a94]'">
+            {{ form.completePath || '/' }}
+          </button>
+          <p class="text-[10px] text-[#5a7a94] mt-1.5">Dossier de complétion de qBittorrent</p>
        </div>

        <!-- Dossier Jellyfin -->
@@ -107,14 +105,12 @@
            <label class="text-[10px] text-[#5a7a94] tracking-widest">DOSSIER JELLYFIN</label>
            <span v-if="isDocker" class="text-[9px] tracking-widest text-[#3a8fe8] border border-[#3a8fe8]/40 px-1.5 py-0.5">DOCKER</span>
          </div>
-          <input v-model="form.mediaPath" :disabled="isDocker"
-                 class="w-full bg-[#121920] border border-[#1e2d3d] text-sm px-3 py-2.5 outline-none transition-colors"
-                 :class="isDocker ? 'text-[#5a7a94] cursor-not-allowed opacity-60' : 'text-white focus:border-[#e8513a]'"
-                 placeholder="/media/Kai"/>
-          <p class="text-[10px] text-[#5a7a94] mt-1.5">
-            <span v-if="isDocker">Défini par le volume Docker — non modifiable ici</span>
-            <span v-else>Dossier racine de la bibliothèque Fankai dans Jellyfin</span>
-          </p>
+          <button @click="openPicker('mediaPath')"
+                  class="w-full bg-[#121920] border border-[#1e2d3d] text-sm px-3 py-2.5 text-left hover:border-[#e8513a] transition-colors cursor-pointer font-mono truncate"
+                  :class="form.mediaPath ? 'text-white' : 'text-[#5a7a94]'">
+            {{ form.mediaPath || '/' }}
+          </button>
+          <p class="text-[10px] text-[#5a7a94] mt-1.5">Dossier racine de la bibliothèque Fankai dans Jellyfin</p>
        </div>

        <!-- Mode organisation -->
@@ -141,11 +137,37 @@
          </p>
        </div>

-        <div class="pt-1">
+        <!-- Support NFO -->
+        <div>
+          <label class="text-[10px] text-[#5a7a94] tracking-widest block mb-2">NFO / MÉTADONNÉES</label>
+          <div class="flex items-center gap-3">
+            <button @click="form.nfoSupport = !form.nfoSupport"
+                    class="relative shrink-0 w-11 h-6 rounded-full transition-colors cursor-pointer"
+                    :class="form.nfoSupport ? 'bg-[#e8513a]' : 'bg-[#1e2d3d]'">
+              <span class="absolute top-1 left-1 w-4 h-4 rounded-full bg-white transition-transform duration-200"
+                    :class="form.nfoSupport ? 'translate-x-5' : 'translate-x-0'" />
+            </button>
+            <span class="text-xs text-[#c8d8e8]">Télécharger les NFO et images depuis GitLab</span>
+          </div>
+          <p class="text-[10px] text-[#5a7a94] mt-1.5">
+            Pour les lecteurs sans agent Fankai (Kodi, Infuse, etc.) — télécharge les métadonnées depuis
+            <span class="text-white">fankai_pack</span> au moment de l'organisation
+          </p>
+        </div>
+
+        <div class="pt-1 flex items-center gap-3">
          <button type="button" @click="save" :disabled="saving"
                  class="bg-[#e8513a] text-white px-6 py-2.5 text-xs tracking-widest hover:opacity-85 transition-opacity disabled:opacity-50 cursor-pointer">
            {{ saving ? '...' : 'SAUVEGARDER' }}
          </button>
+          <button type="button" @click="scan" :disabled="scanning"
+                  class="border border-[#1e2d3d] text-[#5a7a94] px-6 py-2.5 text-xs tracking-widest hover:border-[#e8513a] hover:text-[#e8513a] transition-colors disabled:opacity-50 cursor-pointer">
+            {{ scanning ? 'SCAN...' : 'ANALYSER BIBLIOTHÈQUE' }}
+          </button>
+          <span v-if="scanResult" class="text-[10px]"
+                :class="scanResult.added > 0 ? 'text-green-400' : 'text-[#5a7a94]'">
+            {{ scanResult.found }} fichiers · {{ scanResult.added }} ajoutés
+          </span>
        </div>
      </div>
    </div>
@@ -160,6 +182,14 @@
      </button>
    </div>

+    <!-- Folder Picker -->
+    <FolderPicker
+        v-if="picker.open"
+        :initial-path="picker.currentPath"
+        @select="onPickerSelect"
+        @cancel="picker.open = false"
+    />
+
    <!-- Modal ajout client -->
    <div v-if="modal.open" class="fixed inset-0 bg-black/70 flex items-center justify-center z-50 px-4">
      <div class="bg-[#0d1219] border border-[#1e2d3d] w-full max-w-md p-6">
@@ -217,6 +247,7 @@ import { ref, computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { useAuthStore } from '@/stores/auth'
 import { useToast } from '@/composables/useToast'
+import FolderPicker from '@/components/FolderPicker.vue'

 const router = useRouter()
 const auth   = useAuthStore()
@@ -224,13 +255,34 @@ const { add: toast } = useToast()

 // ── State ──────────────────────────────────────────────────────
 const form = ref({
-  mediaPath   : '/media/Kai',
-  completePath: '/downloads/complete',
+  mediaPath   : '',
+  completePath: '',
  organizeMode: 'hardlink' as 'hardlink' | 'move',
+  nfoSupport  : false,
 })

 const saving    = ref(false)
 const updating  = ref(false)
+const scanning  = ref(false)
+const scanResult = ref<{ found: number; added: number } | null>(null)
+
+// ── Folder picker ──────────────────────────────────────────────
+const picker = ref<{ open: boolean; field: 'completePath' | 'mediaPath'; currentPath: string }>({
+  open: false, field: 'completePath', currentPath: '/'
+})
+
+function openPicker(field: 'completePath' | 'mediaPath') {
+  picker.value = {
+    open       : true,
+    field,
+    currentPath: (form.value as any)[field] || '/',
+  }
+}
+
+function onPickerSelect(path: string) {
+  (form.value as any)[picker.value.field] = path
+  picker.value.open = false
+}
 const isDocker  = ref(false)
 const torrentsStatus = ref({ exists: false, count: 0, empty: true })

@@ -272,7 +324,7 @@ onMounted(async () => {
  if (availRes.ok)    availableClients.value = await availRes.json()
  if (systemRes.ok)   isDocker.value = (await systemRes.json()).isDocker

-  for (const c of clients.value) await refreshHealth(c.uuid)
+  for (const c of clients.value) refreshHealth(c.uuid)
 })

 // ── Healthcheck ────────────────────────────────────────────────
@@ -362,7 +414,7 @@ async function saveClient() {
    if (res.ok) {
      const client = await res.json()
      clients.value.push(client)
-      await refreshHealth(client.uuid)
+      refreshHealth(client.uuid)
      closeModal()
      toast('Client enregistré ✓', 'success')
    } else {
@@ -394,6 +446,31 @@ async function update() {
  }
 }

+// ── Scan bibliothèque ──────────────────────────────────────────
+async function scan() {
+  scanning.value  = true
+  scanResult.value = null
+  try {
+    const res = await fetch('/api/scan', { method: 'POST', credentials: 'include' })
+    if (res.ok) {
+      const data = await res.json()
+      scanResult.value = { found: data.found, added: data.added }
+      toast(
+          data.added > 0
+              ? `${data.found} fichiers scannés — ${data.added} ajoutés`
+              : `${data.found} fichiers scannés — rien de nouveau`,
+          'success'
+      )
+    } else {
+      toast('Erreur lors du scan', 'error')
+    }
+  } catch {
+    toast('Impossible de contacter le serveur', 'error')
+  } finally {
+    scanning.value = false
+  }
+}
+
 // ── Sauvegarder settings ───────────────────────────────────────
 async function save() {
  saving.value = true
Author	SHA1	Message	Date
MasutaYunikon	a8978c1a43	Merge pull request #18 from Masutayunikon/release-please--branches--main chore(main): release 1.7.3	2026-03-13 00:13:58 +01:00
MasutaYunikon	40632c8b06	chore(main): release 1.7.3	2026-03-13 00:12:12 +01:00
MasutaYunikon	71d3c557e9	fix: CatalogView.vue badge deleted	2026-03-13 00:11:45 +01:00
MasutaYunikon	0825cb2f44	Merge remote-tracking branch 'origin/main'	2026-03-12 23:56:24 +01:00
MasutaYunikon	cec376ade6	fix: empty docker-compose.yml	2026-03-12 23:56:16 +01:00
MasutaYunikon	f01a37dfd8	Merge pull request #17 from Masutayunikon/release-please--branches--main chore(main): release 1.7.2	2026-03-12 23:52:47 +01:00
MasutaYunikon	c9adcb5abc	chore(main): release 1.7.2	2026-03-12 23:51:10 +01:00
MasutaYunikon	3dbb0757c4	Merge remote-tracking branch 'origin/main'	2026-03-12 23:50:46 +01:00
MasutaYunikon	8417aa98ca	fix: docker is able to change directory	2026-03-12 23:50:17 +01:00
MasutaYunikon	00348996b5	Merge pull request #16 from Masutayunikon/release-please--branches--main chore(main): release 1.7.1	2026-03-12 23:26:36 +01:00
MasutaYunikon	89fba07e35	chore(main): release 1.7.1	2026-03-12 23:15:13 +01:00
MasutaYunikon	59f2c06b61	Merge remote-tracking branch 'origin/main'	2026-03-12 23:14:50 +01:00
MasutaYunikon	0f0b0c07f6	fix: path	2026-03-12 23:14:36 +01:00
MasutaYunikon	0c8fa42f4f	Merge pull request #15 from Masutayunikon/release-please--branches--main chore(main): release 1.7.0	2026-03-12 23:10:17 +01:00
MasutaYunikon	8f6e0340ff	chore(main): release 1.7.0	2026-03-12 22:42:15 +01:00
MasutaYunikon	693f8a96ae	feat: UX improvements, folder picker, download state & NFO support ## Settings - Folder picker pour les paths (navigation dossier côté serveur via GET /api/browse) - Paths vides par défaut, démarrage à / dans le picker - Picker accessible même sous Docker (volumes montés accessibles) - Bouton "Analyser bibliothèque" pour relancer scanMediaPath manuellement (POST /api/scan) - Toggle NFO support (téléchargement dossier GitLab Fankai Pack à l'organisation) - nfoSupport ajouté dans Settings interface + defaults ## Catalogue - Logo "Fankarr" cliquable → retour accueil - Filtres séparés en 2 groupes : état série (orange) \| état téléchargement (bleu) - Groupe 1 : Toutes / Disponibles / Sans torrent - Groupe 2 : DL complet / DL partiel - Tooltip badge torrents → "X torrents téléchargeables" ## Page Série - Anti-spam boutons download : Set au lieu de string, bouton bloqué après envoi - Boutons bloqués si torrent déjà dans qBittorrent (cross-session via poll /api/downloads) - Boutons bloqués si épisode/saison déjà organisé dans la bibliothèque - Barre de progression sous épisode / saison / intégrale (poll 5s) - Badge "✓ téléchargé" à 100% à la place de la barre - Badge "dispo" en bleu, "✓ téléchargé" inline à côté de "dispo" ## Page Téléchargements - Onglets EN COURS / TERMINÉS (défaut : EN COURS) - EN COURS : downloading + paused + checking + error - TERMINÉS : seeding uniquement - Toggle "Masquer organisés" dans l'onglet TERMINÉS - Message vide adapté au contexte ## Organizer - seasonFolder : Saison N sans padding (pour matcher GitLab) - Map SERIE_TITLE_GITLAB_MAP : 9 corrections titres API → GitLab - downloadGitlabFolder : liste récursive + téléchargement NFO/images depuis fankai_pack - Appelé au début de organizeTorrent si nfoSupport activé - Paths vides par défaut dans readSettings du worker ## Backend - POST /api/scan : déclenche scanMediaPath manuellement - GET /api/browse?path= : liste les sous-dossiers d'un chemin - dispatchList : utilise client.config.category en priorité sur la catégorie globale - Catégorie configurable par client torrent (fix torrents non affichés page downloads)	2026-03-12 22:41:46 +01:00
MasutaYunikon	f38a43d396	Merge remote-tracking branch 'origin/main'	2026-03-11 19:48:02 +01:00
MasutaYunikon	510e1f7b5a	fix: rename if the torrent name is not the same as the api	2026-03-11 19:47:53 +01:00
MasutaYunikon	91f5918233	Merge pull request #14 from Masutayunikon/release-please--branches--main chore(main): release 1.6.0	2026-03-11 15:48:48 +01:00
MasutaYunikon	71e3423ad4	chore(main): release 1.6.0	2026-03-11 15:48:19 +01:00
MasutaYunikon	15b4a99c86	Merge remote-tracking branch 'origin/main'	2026-03-11 15:47:55 +01:00
MasutaYunikon	14f02d1bdd	feat: add favicon	2026-03-11 15:47:46 +01:00