From 1e7e8cf6da4dfaba7848a831a5df52da6c96d706 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20P=C3=B6ttker?= <bjoern@poettker-holtrup.de>
Date: Mon, 18 May 2026 20:53:17 +0200
Subject: [PATCH] feat: inject PAPERLESS_URL environment variable and update
 document link rendering in MailDetailPage

---
 docker-compose.yml                            |  1 +
 paperless-frontend/docker-entrypoint.sh       |  1 +
 .../src/pages/MailDetailPage.tsx              | 37 ++++++++++---------
 3 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/docker-compose.yml b/docker-compose.yml
index 1e6d33e..330718e 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -55,6 +55,7 @@ services:
       - "${FRONTEND_PORT:-7600}:80"
     environment:
       - VITE_API_URL=
+      - PAPERLESS_URL=${PAPERLESS_URL:-http://paperless:8000}
       - VITE_OIDC_AUTHORITY=${VITE_OIDC_AUTHORITY:-https://auth.poettker-holtrup.de/application/o/paperlessmanager/}
       - VITE_OIDC_CLIENT_ID=${VITE_OIDC_CLIENT_ID:-ogOeIlrcsf2spjuwyOc7CuAPrRkRSt3RXfYguoLn}
       - VITE_OIDC_REDIRECT_URI=${VITE_OIDC_REDIRECT_URI:-https://px-7a9b2.poettker-cloud.de/auth/callback}
diff --git a/paperless-frontend/docker-entrypoint.sh b/paperless-frontend/docker-entrypoint.sh
index 7dae553..8583e9b 100644
--- a/paperless-frontend/docker-entrypoint.sh
+++ b/paperless-frontend/docker-entrypoint.sh
@@ -7,6 +7,7 @@ ENV_JS="/usr/share/nginx/html/env-config.js"
 cat <<EOF > "$ENV_JS"
 window.__ENV__ = {
   VITE_API_URL: "${VITE_API_URL:-}",
+  PAPERLESS_URL: "${PAPERLESS_URL:-}",
   VITE_OIDC_AUTHORITY: "${VITE_OIDC_AUTHORITY:-}",
   VITE_OIDC_CLIENT_ID: "${VITE_OIDC_CLIENT_ID:-}",
   VITE_OIDC_REDIRECT_URI: "${VITE_OIDC_REDIRECT_URI:-}",
diff --git a/paperless-frontend/src/pages/MailDetailPage.tsx b/paperless-frontend/src/pages/MailDetailPage.tsx
index bfb21f7..c06cd5a 100644
--- a/paperless-frontend/src/pages/MailDetailPage.tsx
+++ b/paperless-frontend/src/pages/MailDetailPage.tsx
@@ -3,7 +3,7 @@ import { useParams, useNavigate } from 'react-router-dom';
 import {
   Card, Button, Space, Spin, Tag, Typography, Table, message, Empty, Popconfirm
 } from 'antd';
-import { ArrowLeftOutlined, FileTextOutlined, CloseCircleOutlined } from '@ant-design/icons';
+import { ArrowLeftOutlined, FileTextOutlined, CloseCircleOutlined, LinkOutlined } from '@ant-design/icons';
 import type { ColumnsType } from 'antd/es/table';
 import dayjs from 'dayjs';
 import { emailsApi, type EmailItem, type EmailAttachment } from '../api/emails';
@@ -108,22 +108,23 @@ export default function MailDetailPage() {
         
         return (
           <Space size={[0, 4]} wrap>
-            {entries.map(([, id]) => (
-              <Tag 
-                color="blue" 
-                key={id} 
-                style={{ cursor: 'pointer' }} 
-                onClick={(e) => {
-                  e.stopPropagation();
-                  const paperlessUrl = getEnv('VITE_PAPERLESS_URL');
-                  if (paperlessUrl) {
-                    window.open(`${paperlessUrl}/documents/${id}`, '_blank');
-                  }
-                }}
-              >
-                {id}
-              </Tag>
-            ))}
+            {entries.map(([, id]) => {
+              const paperlessUrl = getEnv('PAPERLESS_URL');
+              return (
+                <a
+                  key={id}
+                  href={paperlessUrl ? `${paperlessUrl}/documents/${id}` : undefined}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  onClick={(e) => e.stopPropagation()}
+                >
+                  <Tag color="blue" style={{ cursor: 'pointer' }}>
+                    <LinkOutlined style={{ marginRight: 4 }} />
+                    {id}
+                  </Tag>
+                </a>
+              );
+            })}
           </Space>
         );
       }
@@ -236,7 +237,7 @@ export default function MailDetailPage() {
               )
             ) : (
               <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%', color: '#888' }}>
-                <Space direction="vertical" align="center">
+                <Space vertical align="center">
                   <FileTextOutlined style={{ fontSize: 48 }} />
                   <Text type="secondary">Kein Anhang ausgewählt</Text>
                 </Space>