diff --git a/assets/LOGO_CARRE_BLANC.png b/assets/LOGO_CARRE_BLANC.png
new file mode 100644
index 0000000..a1a2eb6
Binary files /dev/null and b/assets/LOGO_CARRE_BLANC.png differ
diff --git a/components/BackupButtonSee.vue b/components/BackupButtonSee.vue
new file mode 100644
index 0000000..f7d20cb
--- /dev/null
+++ b/components/BackupButtonSee.vue
@@ -0,0 +1,87 @@
+<template>
+  <div class="bg-m-secondary w-[250px] h-[259px] rounded-md mx-4 shadow-md/50 shadow-black">
+    <p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
+      Backup
+    </p>
+    <button
+        type="button"
+        class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="select('bitwarden')"
+    >
+      <p class="font-bold uppercase text-xl ml-[24px]">
+        bitwarden
+      </p>
+      <IconifyIcon
+          icon="mdi:eye"
+          class="text-black text-2xl mr-[24px]"
+      />
+    </button>
+
+    <button
+        type="button"
+        class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="select('inventory')"
+    >
+      <p class="font-bold uppercase text-xl ml-[24px]">
+        inventory
+      </p>
+      <IconifyIcon
+          icon="mdi:eye"
+          class="text-black text-2xl mr-[24px]"
+      />
+    </button>
+
+    <button
+        type="button"
+        class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="select('sirh')"
+    >
+      <p class="font-bold uppercase text-xl ml-[24px]">
+        sirh
+      </p>
+      <IconifyIcon
+          icon="mdi:eye"
+          class="text-black text-2xl mr-[24px]"
+      />
+    </button>
+
+    <button
+        type="button"
+        class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="select('ferme')"
+    >
+      <p class="font-bold uppercase text-xl ml-[24px]">
+        ferme
+      </p>
+      <IconifyIcon
+          icon="mdi:eye"
+          class="text-black text-2xl mr-[24px]"
+      />
+    </button>
+
+    <button
+        type="button"
+        class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="select('user')"
+    >
+      <p class="font-bold uppercase text-xl ml-[24px]">
+        user
+      </p>
+      <IconifyIcon
+          icon="mdi:eye"
+          class="text-black text-2xl mr-[24px]"
+      />
+    </button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { Icon as IconifyIcon } from "@iconify/vue"
+
+const emit = defineEmits(["select"])
+
+const select = (name: string) => {
+  emit("select", name)
+}
+</script>
+
diff --git a/components/BackupList.vue b/components/BackupList.vue
new file mode 100644
index 0000000..b1c4508
--- /dev/null
+++ b/components/BackupList.vue
@@ -0,0 +1,80 @@
+<template>
+  <div class="bg-m-secondary w-[507px] h-[367px] rounded-md mx-4 shadow-md/50 shadow-black">
+    <p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
+      {{ title }}
+    </p>
+
+    <div v-if="loading">
+      <div
+        v-for="n in 6"
+        :key="`backup-skeleton-${n}`"
+        class="relative w-[483px] h-[39px] mx-3 mb-[10px]"
+      >
+        <ButtonSkeleton custom-class="h-full w-full" />
+        <div class="absolute inset-0 flex items-center justify-between px-3">
+          <TextSkeleton custom-class="h-5 w-[260px]" />
+          <CircleSkeleton custom-class="h-6 w-6 rounded-md" />
+        </div>
+      </div>
+    </div>
+
+    <button
+        v-else
+        v-for="file in backups"
+        :key="file"
+        class="bg-m-tertiary w-[483px] h-[39px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
+        @click="downloadBackup(file)"
+    >
+      <p class="text-xl ml-3 truncate max-w-[400px]">
+        {{ file }}
+      </p>
+
+      <IconifyIcon
+          icon="mdi:download"
+          class="text-black text-2xl mr-3"
+      />
+    </button>
+  </div>
+</template>
+<script setup lang="ts">
+import {Icon as IconifyIcon} from "@iconify/vue"
+import ButtonSkeleton from "~/components/skeleton/ButtonSkeleton.vue"
+import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
+import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
+
+const props = defineProps<{
+  folder: string | null
+}>()
+
+const backups = ref<string[]>([])
+const loading = ref(false)
+const title = computed(() => {
+  if (!props.folder) return "Backup"
+  return `Liste des backup de ${props.folder.toUpperCase()}`
+})
+
+const downloadBackup = (file: string) => {
+  if (!props.folder) return
+  const url = `/api/download?folder=${encodeURIComponent(props.folder)}&file=${encodeURIComponent(file)}`
+  window.location.href = url
+}
+
+watch(() => props.folder, async (folder) => {
+  if (!folder) {
+    loading.value = false
+    backups.value = []
+    return
+  }
+
+  loading.value = true
+  try {
+    const data = await $fetch<string[]>(`/api/backups?folder=${folder}`)
+    backups.value = data.slice(0, 6)
+  } catch (error) {
+    console.error("Erreur récupération backups:", error)
+    backups.value = []
+  } finally {
+    loading.value = false
+  }
+})
+</script>
diff --git a/components/DiagramStorage.vue b/components/DiagramStorage.vue
index e2ab372..143ad17 100644
--- a/components/DiagramStorage.vue
+++ b/components/DiagramStorage.vue
@@ -1,33 +1,46 @@
 <template>
   <section class="flex flex-col items-center p-4">
-    <p class="text-center text-xl font-semibold uppercase">{{ hostName }}</p>
-    <div class="relative h-[140px] w-[140px]" :class="statusColorClass">
-      <svg class="h-full w-full -rotate-90" viewBox="0 0 120 120" aria-label="Pourcentage restant">
-        <circle
-          class="fill-none stroke-[rgba(255,255,255,0.22)] [stroke-width:10]"
-          cx="60"
-          cy="60"
-          :r="chartRadius"
-        />
-        <circle
-          class="fill-none stroke-[currentColor] [stroke-linecap:round] [stroke-width:10] transition-[stroke-dashoffset] duration-300"
-          cx="60"
-          cy="60"
-          :r="chartRadius"
-          :style="{ strokeDasharray: `${chartCircumference}`, strokeDashoffset: `${chartOffset}` }"
-        />
-      </svg>
-      <div class="absolute inset-0 flex flex-col items-center justify-center">
-        <strong class="text-2xl leading-none">{{ remainingPercentText }}</strong>
-      </div>
-    </div>
+    <template v-if="loading">
+      <TextSkeleton custom-class="h-7 w-40" />
+      <CircleSkeleton custom-class="mt-2 h-[140px] w-[140px]" />
+      <BlockSkeleton custom-class="mt-2 h-5 w-36" />
+    </template>
 
-    <p class="mt-1 text-center text-sm font-semibold">{{ usedText }} / {{ totalText }}</p>
+    <template v-else>
+      <p class="text-center text-xl font-semibold uppercase">{{ hostName }}</p>
+      <div class="relative h-[140px] w-[140px]" :class="statusColorClass">
+        <svg class="h-full w-full -rotate-90" viewBox="0 0 120 120" aria-label="Pourcentage restant">
+          <circle
+            class="fill-none stroke-[rgba(255,255,255,0.22)] [stroke-width:10]"
+            cx="60"
+            cy="60"
+            :r="chartRadius"
+          />
+          <circle
+            class="fill-none stroke-[currentColor] [stroke-linecap:round] [stroke-width:10] transition-[stroke-dashoffset] duration-300"
+            cx="60"
+            cy="60"
+            :r="chartRadius"
+            :style="{ strokeDasharray: `${chartCircumference}`, strokeDashoffset: `${chartOffset}` }"
+          />
+        </svg>
+        <div class="absolute inset-0 flex flex-col items-center justify-center">
+          <strong class="text-2xl leading-none">{{ remainingPercentText }}</strong>
+        </div>
+      </div>
+
+      <p class="mt-1 text-center text-sm font-semibold">{{ usedText }} / {{ totalText }}</p>
+    </template>
   </section>
 </template>
 
 <script setup lang="ts">
+import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
+import BlockSkeleton from "~/components/skeleton/BlockSkeleton.vue"
+import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
+
 defineProps<{
+  loading: boolean
   hostName: string
   statusColorClass: string
   chartRadius: number
diff --git a/components/MessageDiscord.vue b/components/MessageDiscord.vue
new file mode 100644
index 0000000..aedb3ec
--- /dev/null
+++ b/components/MessageDiscord.vue
@@ -0,0 +1,19 @@
+<script setup>
+const { data: messages } = await useFetch('/api/discord/messages')
+</script>
+
+<template>
+  <div class="bg-m-secondary w-auto h-auto  mx-4 rounded-md shadow-md/50 shadow-black p-2">
+    <div class="mb-2 flex items-center justify-between">
+      <p class="font-bold text-3xl text-m-tertiary">
+        Speedtest
+      </p>
+  <div v-if="messages">
+    <div v-for="m in messages" :key="m.id">
+      <strong>{{ m.author.username }}</strong>
+      <p>{{ m.content }}</p>
+    </div>
+  </div>
+    </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/components/Speedtest.vue b/components/Speedtest.vue
index 9fd6426..c5c766b 100644
--- a/components/Speedtest.vue
+++ b/components/Speedtest.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-m-secondary w-[509px] h-[184px]  mx-4 rounded-md shadow-md/50 shadow-black p-2">
+  <div class="bg-m-secondary w-[507px] h-[184px]  mx-4 rounded-md shadow-md/50 shadow-black p-2">
     <div class="mb-2 flex items-center justify-between">
       <p class="font-bold text-3xl text-m-tertiary">
         Speedtest
@@ -7,7 +7,7 @@
       <IconifyIcon
           icon="mdi:reload"
           class="bg-m-tertiary text-2xl text-black rounded-md shadow-md/50 mr-1 cursor-pointer"
-          @Click="runTests"
+          @click="runTests"
       />
     </div>
     <div class="grid grid-cols-3 gap-3">
@@ -22,8 +22,11 @@
           </p>
         </div>
         <div class="mx-2 flex flex-col items-center justify-center">
-          <span class="text-4xl">
-            {{ download !== null ? `${download}` : "..." }}
+          <template v-if="isTesting">
+            <TextSkeleton custom-class="h-10 w-16 mb-1" />
+          </template>
+          <span v-else class="text-4xl">
+            {{ download !== null ? `${download}` : "--" }}
           </span>
           <p class="font-bold text-xl leading-tight">
             Mbps
@@ -41,8 +44,11 @@
           </p>
         </div>
         <div class="mx-2 flex flex-col items-center justify-center">
-          <span class="text-4xl">
-            {{ upload !== null ? `${upload}` : "..." }}
+          <template v-if="isTesting">
+            <TextSkeleton custom-class="h-10 w-16 mb-1" />
+          </template>
+          <span v-else class="text-4xl">
+            {{ upload !== null ? `${upload}` : "--" }}
           </span>
           <p class="font-bold text-xl leading-tight">
             Mbps
@@ -60,8 +66,11 @@
           </p>
         </div>
         <div class="mx-2 flex flex-col items-center justify-center">
-          <span class="text-4xl">
-            {{ ping !== null ? `${ping}` : "..." }}
+          <template v-if="isTesting">
+            <TextSkeleton custom-class="h-10 w-16 mb-1" />
+          </template>
+          <span v-else class="text-4xl">
+            {{ ping !== null ? `${ping}` : "--" }}
           </span>
           <p class="font-bold text-xl leading-tight">
             Ms
@@ -72,12 +81,14 @@
   </div>
 </template>
 <script setup lang="ts">
-import {onMounted, ref} from "vue";
+import {ref} from "vue";
 import {Icon as IconifyIcon} from "@iconify/vue"
+import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
 
 const ping = ref<number | null>(null)
 const download = ref<number | null>(null)
 const upload = ref<number | null>(null)
+const isTesting = ref(false)
 
 async function testDownload() {
   const start = performance.now()
@@ -121,11 +132,17 @@ async function testPing() {
 }
 
 async function runTests() {
-  await testDownload()
-  await testUpload()
-  await testPing()
+  isTesting.value = true
+  download.value = null
+  upload.value = null
+  ping.value = null
+
+  try {
+    await testDownload()
+    await testUpload()
+    await testPing()
+  } finally {
+    isTesting.value = false
+  }
 }
-onMounted(() => {
-  runTests()
-})
 </script>
diff --git a/components/StatusSite.vue b/components/StatusSite.vue
index 192a946..1d34571 100644
--- a/components/StatusSite.vue
+++ b/components/StatusSite.vue
@@ -1,30 +1,51 @@
 <template>
-  <div class="bg-m-secondary w-[250px] h-auto rounded-md mx-4 shadow-md/50 shadow-black pb-4">
+  <div class="bg-m-secondary w-[250px] h-[292px] rounded-md mx-4 shadow-md/50 shadow-black">
     <p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
       Status
     </p>
-  <div
-      class="bg-m-tertiary w-[200px] h-auto rounded-md shadow-md/50 shadow-m-black mx-[25px] mb-3"
+    <template v-if="loading">
+      <div
+        v-for="n in 3"
+        :key="`skeleton-${n}`"
+        class="relative w-[200px] h-[68px] rounded-md mx-[25px] mb-3"
+      >
+        <ButtonSkeleton custom-class="h-full w-full" />
+        <div class="absolute inset-0 p-2">
+          <TextSkeleton custom-class="h-5 w-24 mb-2" />
+          <div class="flex items-center gap-2">
+            <CircleSkeleton custom-class="h-6 w-6" />
+            <TextSkeleton custom-class="h-5 w-20" />
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <div
+      v-else
+      class="bg-m-tertiary w-[200px] h-[68px] rounded-md shadow-md/50 shadow-m-black mx-[25px] mb-3"
       v-for="row in rows"
       :key="`${row.label}-${row.url}`"
-  >
-    <p class="font-bold text-xl text-m-text mt-2 mx-2 mb-1">
-      {{ row.label }}
-    </p>
-    <div class="mx-2 flex items-center">
-    <span
-        class="inline-block h-[24px] w-[24px] rounded-full mr-2"
-        :class="statusClass(row.status)"
-    />
-      <span class="font-semibold text-lg">
-      {{ statusLabel(row.status) }}
-    </span>
+    >
+      <p class="font-bold text-xl text-m-text mt-2 mx-2 mb-1">
+        {{ row.label }}
+      </p>
+      <div class="mx-2 flex items-center">
+        <span
+          class="inline-block h-[24px] w-[24px] rounded-full mr-2"
+          :class="statusClass(row.status)"
+        />
+        <span class="font-semibold text-lg">
+          {{ statusLabel(row.status) }}
+        </span>
+      </div>
     </div>
   </div>
-  </div>
 </template>
 
 <script setup lang="ts">
+import ButtonSkeleton from "~/components/skeleton/ButtonSkeleton.vue"
+import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
+import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
 import {onBeforeUnmount, onMounted, ref} from "vue"
 
 interface StatusRow {
@@ -52,6 +73,8 @@ const props = withDefaults(
 )
 
 const rows = ref<StatusRow[]>([])
+const loading = ref(true)
+const initialized = ref(false)
 let timer: ReturnType<typeof setInterval> | null = null
 
 const statusClass = (status: number) => {
@@ -67,6 +90,9 @@ const statusLabel = (status: number) => {
 }
 
 const checkStatus = async () => {
+  if (!initialized.value) {
+    loading.value = true
+  }
   try {
     const data = await $fetch<StatusResponse>(props.endpoint)
     rows.value = data.results
@@ -81,6 +107,9 @@ const checkStatus = async () => {
         error: error instanceof Error ? error.message : String(error)
       }
     ]
+  } finally {
+    initialized.value = true
+    loading.value = false
   }
 }
 
diff --git a/components/skeleton/BlockSkeleton.vue b/components/skeleton/BlockSkeleton.vue
new file mode 100644
index 0000000..42e11f4
--- /dev/null
+++ b/components/skeleton/BlockSkeleton.vue
@@ -0,0 +1,14 @@
+<template>
+  <div class="animate-pulse rounded-md bg-m-tertiary/70" :class="customClass" />
+</template>
+
+<script setup lang="ts">
+withDefaults(
+  defineProps<{
+    customClass?: string
+  }>(),
+  {
+    customClass: "h-4 w-full"
+  }
+)
+</script>
diff --git a/components/skeleton/ButtonSkeleton.vue b/components/skeleton/ButtonSkeleton.vue
new file mode 100644
index 0000000..c2fe465
--- /dev/null
+++ b/components/skeleton/ButtonSkeleton.vue
@@ -0,0 +1,17 @@
+<template>
+  <div
+    class="animate-pulse rounded-md bg-m-tertiary/70 shadow-md/50 shadow-m-black"
+    :class="customClass"
+  />
+</template>
+
+<script setup lang="ts">
+withDefaults(
+  defineProps<{
+    customClass?: string
+  }>(),
+  {
+    customClass: "h-[39px] w-full"
+  }
+)
+</script>
diff --git a/components/skeleton/CircleSkeleton.vue b/components/skeleton/CircleSkeleton.vue
new file mode 100644
index 0000000..1284894
--- /dev/null
+++ b/components/skeleton/CircleSkeleton.vue
@@ -0,0 +1,14 @@
+<template>
+  <div class="animate-pulse rounded-full bg-m-tertiary/70" :class="customClass" />
+</template>
+
+<script setup lang="ts">
+withDefaults(
+  defineProps<{
+    customClass?: string
+  }>(),
+  {
+    customClass: "h-10 w-10"
+  }
+)
+</script>
diff --git a/components/skeleton/TextSkeleton.vue b/components/skeleton/TextSkeleton.vue
new file mode 100644
index 0000000..d957d8a
--- /dev/null
+++ b/components/skeleton/TextSkeleton.vue
@@ -0,0 +1,14 @@
+<template>
+  <div class="animate-pulse rounded bg-m-tertiary/70" :class="customClass" />
+</template>
+
+<script setup lang="ts">
+withDefaults(
+  defineProps<{
+    customClass?: string
+  }>(),
+  {
+    customClass: "h-5 w-24"
+  }
+)
+</script>
diff --git a/pages/index.vue b/pages/index.vue
index 20b8c67..d4955c1 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,10 +1,11 @@
 <template>
   <NuxtLayout name="default">
     <template #sidebar>
-      <div class="flex flex-col gap-">
+      <div class="flex flex-col">
         <DiagramStorage
           v-for="item in diagramItems"
           :key="item.key"
+          :loading="loading"
           :host-name="item.hostName"
           :status-color-class="item.statusColorClass"
           :chart-radius="chartRadius"
@@ -18,16 +19,23 @@
     </template>
 
     <p class="font-bold text-4xl my-6 mx-4">Écran de monitoring</p>
+
     <div class="flex">
-      <StatusSite/>
-      <Speedtest/>
+      <div class="flex flex-col gap-4">
+        <StatusSite />
+        <BackupButtonSee @select="selectedBackup = $event" />
+      </div>
+
+      <div class="flex flex-col gap-4">
+        <Speedtest />
+        <BackupList :folder="selectedBackup" />
+        <MessageDiscord/>
+      </div>
     </div>
   </NuxtLayout>
 </template>
 
 <script setup lang="ts">
-import Speedtest from "~/components/Speedtest.vue";
-
 definePageMeta({layout: false})
 import {computed, onMounted, ref} from "vue"
 
@@ -38,6 +46,7 @@ type DiskApiResponse = {
   local?: string | DiskCommandResult
 }
 
+const selectedBackup = ref<string | null>(null)
 const rawResults = ref<Record<SourceKey, string>>({
   remote: "",
   local: ""
diff --git a/server/api/backups.get.ts b/server/api/backups.get.ts
new file mode 100644
index 0000000..2f9a994
--- /dev/null
+++ b/server/api/backups.get.ts
@@ -0,0 +1,156 @@
+import { execFile } from "node:child_process"
+
+const REMOTE_HOST = process.env.BACKUPS_REMOTE_HOST || "malio-b@192.168.0.179"
+const REMOTE_ROOT = process.env.BACKUPS_REMOTE_ROOT || "/home/malio-b/backups"
+const MAX_FILES_PER_FOLDER = Number(process.env.BACKUPS_MAX_FILES || "200")
+const isSafeFolder = (value: string) => /^[a-zA-Z0-9._-]+$/.test(value)
+const shellQuote = (value: string) => `'${value.replace(/'/g, `'\\''`)}'`
+const FOLDER_MAP: Record<string, string> = {
+  ferme: "bdd_recette/ferme",
+  inventory: "bdd_recette/inventory",
+  sirh: "bdd_recette/sirh",
+  user: "bdd_recette/user",
+  bitwarden: "bitwarden"
+}
+
+function runSsh(command: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    execFile(
+      "ssh",
+      ["-o", "BatchMode=yes", "-o", "ConnectTimeout=5", REMOTE_HOST, command],
+      { maxBuffer: 10 * 1024 * 1024 },
+      (error, stdout, stderr) => {
+        if (error) {
+          reject(stderr || error.message)
+          return
+        }
+        resolve(stdout)
+      }
+    )
+  })
+}
+
+function isMissingPathError(error: unknown): boolean {
+  const message = String(error || "").toLowerCase()
+  return message.includes("no such file or directory") || message.includes("cannot access")
+}
+
+function toServerError(error: unknown) {
+  return createError({
+    statusCode: 500,
+    statusMessage: `Erreur SSH backups: ${String(error)}`
+  })
+}
+
+function parseLines(output: string): string[] {
+  return output
+    .split("\n")
+    .map((line) => line.trim())
+    .filter(Boolean)
+}
+
+function quoteDir(pathValue: string) {
+  return shellQuote(pathValue)
+}
+
+async function listRemoteFiles(remoteDir: string): Promise<string[]> {
+  const output = await runSsh(
+    `cd ${quoteDir(remoteDir)} && ls -1A | sort -r | head -n ${MAX_FILES_PER_FOLDER}`
+  )
+  return parseLines(output)
+}
+
+async function listRemoteDirs(remoteRoot: string): Promise<string[]> {
+  const output = await runSsh(
+    `cd ${quoteDir(remoteRoot)} && for d in */; do [ -d "$d" ] && printf '%s\n' "\${d%/}"; done`
+  )
+  return parseLines(output)
+}
+
+async function getLatestRemoteFile(remoteDir: string): Promise<string | null> {
+  const output = await runSsh(
+    `cd ${quoteDir(remoteDir)} && ls -1A | sort -r | head -n 1`
+  )
+  const files = parseLines(output)
+  return files[0] || null
+}
+
+async function remoteDirExists(remoteDir: string): Promise<boolean> {
+  const output = await runSsh(`[ -d ${quoteDir(remoteDir)} ] && echo yes || echo no`)
+  return output.trim() === "yes"
+}
+
+async function resolveFolderRemoteDir(folderName: string): Promise<string | null> {
+  const mapped = FOLDER_MAP[folderName]
+  if (mapped) {
+    return `${REMOTE_ROOT}/${mapped}`
+  }
+
+  const direct = `${REMOTE_ROOT}/${folderName}`
+  if (await remoteDirExists(direct)) {
+    return direct
+  }
+
+  const nested = `${REMOTE_ROOT}/bdd_recette/${folderName}`
+  if (await remoteDirExists(nested)) {
+    return nested
+  }
+
+  return null
+}
+
+export default defineEventHandler(async (event) => {
+  const { folder } = getQuery(event)
+  const folderName = typeof folder === "string" ? folder : null
+
+  // Si un dossier est demandé, on retourne sa liste de fichiers.
+  if (folderName) {
+    if (!isSafeFolder(folderName)) {
+      throw createError({
+        statusCode: 400,
+        statusMessage: "Paramètre folder invalide"
+      })
+    }
+
+    const remoteDir = await resolveFolderRemoteDir(folderName)
+    if (!remoteDir) return []
+
+    try {
+      return await listRemoteFiles(remoteDir)
+    } catch (error) {
+      if (isMissingPathError(error)) return []
+      throw toServerError(error)
+    }
+  }
+
+  // Sinon on récupère le dernier backup de chaque dossier distant.
+  let dirs: string[] = []
+  try {
+    dirs = await listRemoteDirs(REMOTE_ROOT)
+  } catch (error) {
+    throw toServerError(error)
+  }
+
+  const result: Array<{ folder: string; last: string | null }> = []
+
+  for (const dirName of dirs) {
+    const remoteDir = `${REMOTE_ROOT}/${dirName}`
+    try {
+      result.push({
+        folder: dirName,
+        last: await getLatestRemoteFile(remoteDir)
+      })
+    } catch (error) {
+      if (isMissingPathError(error)) {
+        result.push({
+          folder: dirName,
+          last: null
+        })
+        continue
+      }
+      throw toServerError(error)
+    }
+  }
+
+  return result
+})
diff --git a/server/api/discord/messages.get.ts b/server/api/discord/messages.get.ts
new file mode 100644
index 0000000..c004834
--- /dev/null
+++ b/server/api/discord/messages.get.ts
@@ -0,0 +1,15 @@
+export default defineEventHandler(async () => {
+    const token = process.env.DISCORD_BOT_TOKEN
+    const channel = process.env.DISCORD_CHANNEL_ID
+
+    const messages = await $fetch(
+        `https://discord.com/api/v10/channels/${channel}/messages?limit=20`,
+        {
+            headers: {
+                Authorization: `Bot ${token}`
+            }
+        }
+    )
+
+    return messages
+})
\ No newline at end of file
diff --git a/server/api/download.get.ts b/server/api/download.get.ts
index b288c9b..df6034f 100644
--- a/server/api/download.get.ts
+++ b/server/api/download.get.ts
@@ -1,25 +1,136 @@
+import { execFile, spawn } from "node:child_process"
 import { Readable } from "node:stream"
 
-export default defineEventHandler((event) => {
-    const size = 128 * 1024 * 1024
-    let sent = 0
+const REMOTE_HOST = process.env.BACKUPS_REMOTE_HOST || "malio-b@192.168.0.179"
+const REMOTE_ROOT = process.env.BACKUPS_REMOTE_ROOT || "/home/malio-b/backups"
+const FOLDER_MAP: Record<string, string> = {
+  ferme: "bdd_recette/ferme",
+  inventory: "bdd_recette/inventory",
+  sirh: "bdd_recette/sirh",
+  user: "bdd_recette/user",
+  bitwarden: "bitwarden"
+}
 
-    const stream = new Readable({
-        read(chunkSize) {
-            if (sent >= size) {
-                this.push(null)
-                return
-            }
+const isSafeFolder = (value: string) => /^[a-zA-Z0-9._-]+$/.test(value)
+const isSafeFile = (value: string) => /^[^/\\]+$/.test(value)
+const shellQuote = (value: string) => `'${value.replace(/'/g, `'\\''`)}'`
 
-            const remaining = size - sent
-            const chunk = Buffer.alloc(Math.min(chunkSize, remaining), "a")
-            sent += chunk.length
-            this.push(chunk)
+function runSsh(command: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    execFile(
+      "ssh",
+      ["-o", "BatchMode=yes", "-o", "ConnectTimeout=5", REMOTE_HOST, command],
+      { maxBuffer: 5 * 1024 * 1024 },
+      (error, stdout, stderr) => {
+        if (error) {
+          reject(stderr || error.message)
+          return
         }
-    })
+        resolve(stdout)
+      }
+    )
+  })
+}
 
-    setHeader(event, "Content-Type", "application/octet-stream")
-    setHeader(event, "Content-Length", size)
+async function remoteDirExists(remoteDir: string): Promise<boolean> {
+  const output = await runSsh(`[ -d ${shellQuote(remoteDir)} ] && echo yes || echo no`)
+  return output.trim() === "yes"
+}
 
-    return stream
-})
\ No newline at end of file
+async function resolveFolderRemoteDir(folderName: string): Promise<string | null> {
+  const mapped = FOLDER_MAP[folderName]
+  if (mapped) {
+    return `${REMOTE_ROOT}/${mapped}`
+  }
+
+  const direct = `${REMOTE_ROOT}/${folderName}`
+  if (await remoteDirExists(direct)) {
+    return direct
+  }
+
+  const nested = `${REMOTE_ROOT}/bdd_recette/${folderName}`
+  if (await remoteDirExists(nested)) {
+    return nested
+  }
+
+  return null
+}
+
+function buildContentDisposition(fileName: string) {
+  const asciiName = fileName.replace(/[^\x20-\x7E]/g, "_").replace(/["\\]/g, "_")
+  return `attachment; filename="${asciiName}"; filename*=UTF-8''${encodeURIComponent(fileName)}`
+}
+
+function speedtestStream(event: any) {
+  const size = 128 * 1024 * 1024
+  let sent = 0
+
+  const stream = new Readable({
+    read(chunkSize) {
+      if (sent >= size) {
+        this.push(null)
+        return
+      }
+
+      const remaining = size - sent
+      const chunk = Buffer.alloc(Math.min(chunkSize, remaining), "a")
+      sent += chunk.length
+      this.push(chunk)
+    }
+  })
+
+  setHeader(event, "Content-Type", "application/octet-stream")
+  setHeader(event, "Content-Length", size)
+  return stream
+}
+
+export default defineEventHandler(async (event) => {
+  const { folder, file } = getQuery(event)
+  const folderName = typeof folder === "string" ? folder : null
+  const fileName = typeof file === "string" ? file : null
+
+  // Compat mode: utilisé par le test de débit.
+  if (!folderName || !fileName) {
+    return speedtestStream(event)
+  }
+
+  if (!isSafeFolder(folderName) || !isSafeFile(fileName)) {
+    throw createError({ statusCode: 400, statusMessage: "Paramètres invalides" })
+  }
+
+  const remoteDir = await resolveFolderRemoteDir(folderName)
+  if (!remoteDir) {
+    throw createError({ statusCode: 404, statusMessage: "Dossier introuvable" })
+  }
+
+  const remotePath = `${remoteDir}/${fileName}`
+  const existsOutput = await runSsh(`[ -f ${shellQuote(remotePath)} ] && echo yes || echo no`)
+  if (existsOutput.trim() !== "yes") {
+    throw createError({ statusCode: 404, statusMessage: "Fichier introuvable" })
+  }
+
+  setHeader(event, "Content-Type", "application/octet-stream")
+  setHeader(event, "Content-Disposition", buildContentDisposition(fileName))
+
+  const child = spawn("ssh", [
+    "-o",
+    "BatchMode=yes",
+    "-o",
+    "ConnectTimeout=5",
+    REMOTE_HOST,
+    `cat ${shellQuote(remotePath)}`
+  ])
+
+  let stderr = ""
+  child.stderr.on("data", (chunk) => {
+    stderr += chunk.toString()
+  })
+
+  child.on("close", (code) => {
+    if (code !== 0) {
+      console.error(`Erreur téléchargement SSH (${code}): ${stderr}`)
+    }
+  })
+
+  return sendStream(event, child.stdout)
+})