Title, Provider, tags from paperless

frontend/src/components/PaperlessSearchDialog.tsx

@@ -24,6 +24,7 @@ import { useTranslation } from "react-i18next";
 import { searchPaperlessDocuments } from "../api/contracts";
 import { useSnackbar } from "../hooks/useSnackbar";
 import { PaperlessDocument, PaperlessSearchResponse } from "../types";
+import { extractPaperlessProvider, extractPaperlessTags, extractPaperlessTitle } from "../utils/paperless";
 
 interface Props {
   open: boolean;
@@ -101,27 +102,41 @@ export default function PaperlessSearchDialog({ open, onClose, onSelect }: Props
           )}
           {results && results.results.length > 0 && (
             <List>
-              {results.results.map((doc) => (
-                <ListItem key={doc.id} disablePadding>
-                  <ListItemButton
-                    onClick={() => {
-                      onSelect(doc);
-                      onClose();
-                    }}
-                  >
-                    <ListItemText
-                      primary={doc.title ?? `Dokument #${doc.id}`}
-                      secondary={
-                        <Box component="span" sx={{ display: "block", color: "text.secondary" }}>
-                          {(doc as Record<string, unknown>).correspondent
-                            ? `${t("paperlessDialog.correspondent")}: ${(doc as Record<string, unknown>).correspondent}`
-                            : ""}
-                        </Box>
-                      }
-                    />
-                  </ListItemButton>
-                </ListItem>
-              ))}
+              {results.results.map((doc) => {
+                const title = extractPaperlessTitle(doc) ?? `Dokument #${doc.id ?? "?"}`;
+                const correspondent = extractPaperlessProvider(doc);
+                const tags = extractPaperlessTags(doc);
+
+                return (
+                  <ListItem key={doc.id} disablePadding>
+                    <ListItemButton
+                      onClick={() => {
+                        onSelect(doc);
+                        onClose();
+                      }}
+                    >
+                      <ListItemText
+                        primary={title}
+                        secondary={
+                          <Box component="span" sx={{ display: "block", color: "text.secondary" }}>
+                            {correspondent && (
+                              <Typography variant="body2" color="inherit">
+                                {t("paperlessDialog.correspondent")}: {correspondent}
+                              </Typography>
+                            )}
+                            {tags.length > 0 && (
+                              <Typography variant="body2" color="inherit">
+                                {tags.slice(0, 5).join(", ")}
+                                {tags.length > 5 ? "…" : ""}
+                              </Typography>
+                            )}
+                          </Box>
+                        }
+                      />
+                    </ListItemButton>
+                  </ListItem>
+                );
+              })}
             </List>
           )}
         </Stack>