From a4f2b0da3a4be882c948d5071b123cedd2247af3 Mon Sep 17 00:00:00 2001
From: Piotr Monwid-Olechnowicz <hasparus@gmail.com>
Date: Wed, 10 Sep 2025 00:56:26 +0200
Subject: [PATCH] Add a filename and downlod button

---
 src/app/conf/2025/schedule/[id]/page.tsx      | 37 +++++++++++++++----
 .../_design-system/pixelarticons/download.svg |  5 +++
 2 files changed, 34 insertions(+), 8 deletions(-)
 create mode 100644 src/app/conf/_design-system/pixelarticons/download.svg

diff --git a/src/app/conf/2025/schedule/[id]/page.tsx b/src/app/conf/2025/schedule/[id]/page.tsx
index cb3ee7a151..7a2013c662 100644
--- a/src/app/conf/2025/schedule/[id]/page.tsx
+++ b/src/app/conf/2025/schedule/[id]/page.tsx
@@ -23,6 +23,7 @@ import { Button } from "@/app/conf/_design-system/button"
 import { SessionTags } from "../../components/session-tags"
 import { formatDescription } from "./format-description"
 import { formatBlockTime } from "../_components/format-block-time"
+import DownloadIcon from "@/app/conf/_design-system/pixelarticons/download.svg?svgr"
 
 type SessionProps = { params: { id: string } }
 
@@ -123,15 +124,35 @@ export default function SessionPage({ params }: SessionProps) {
                     <h3 className="typography-h2 my-8 px-2 sm:px-3 lg:my-16">
                       Session resources
                     </h3>
-                    <section>
-                      {session.files?.map(({ path }) => (
-                        <iframe
-                          key={path}
-                          src={path}
-                          className="aspect-video size-full"
-                        />
+                    <ul className="flex max-w-full flex-col gap-y-2">
+                      {session.files?.map(({ path, name }) => (
+                        <li key={path}>
+                          <iframe
+                            src={path}
+                            className="aspect-video size-full"
+                          />
+                          <div className="flex items-stretch justify-between overflow-hidden">
+                            <a
+                              className="typography-link flex items-center truncate p-3 leading-none text-neu-700 max-xs:hidden sm:px-6"
+                              href={path}
+                            >
+                              <span className="inline-block truncate">
+                                {name}
+                              </span>
+                            </a>
+                            <Button
+                              href={path}
+                              variant="tertiary"
+                              className="shrink-0"
+                              download
+                            >
+                              Download
+                              <DownloadIcon className="size-6" />
+                            </Button>
+                          </div>
+                        </li>
                       ))}
-                    </section>
+                    </ul>
                   </>
                 )}
               </div>
diff --git a/src/app/conf/_design-system/pixelarticons/download.svg b/src/app/conf/_design-system/pixelarticons/download.svg
new file mode 100644
index 0000000000..21cf2d2e20
--- /dev/null
+++ b/src/app/conf/_design-system/pixelarticons/download.svg
@@ -0,0 +1,5 @@
+<svg fill="currentColor" viewBox="0 0 24 24">
+  <path
+    d="M13 17V3h-2v10H9v-2H7v2h2v2h2v2h2zm8 2v-4h-2v4H5v-4H3v6h18v-2zm-8-6v2h2v-2h2v-2h-2v2h-2z"
+  />
+</svg>