Phase 7 abgeschlossen: Suche mit gestuftem Index, Facetten, Palette
Der bisherige Suchvektor enthielt nur, was jeder sehen darf. Das war leck-sicher und unbrauchbar zugleich: ab Stufe 1 fand die Suche nichts von dem, was einen Fall ausmacht. SearchIndex hält jetzt sechs Zeilen je Ziel, eine pro Freigabestufe. Die Zeile zur Stufe N enthält alles, was ein Leser dieser Stufe sehen darf. Eine Suche nimmt genau diese eine Zeile und kann deshalb nichts finden, was sie nicht lesen darf — auch keinen höher eingestuften Eintrag in einer sichtbaren Akte. Schwärzungen werden dabei stufenweise aufgelöst: strip_redactions_above entfernt nur, was über der Stufe liegt. Sonst fände ein Leser der Stufe 4 einen Namen nicht, den er auf der Seite im Klartext sieht, und ein Leser der Stufe 1 einen, den er dort nur als Balken sieht. Die Suchbedingung ist nicht die Zugriffsprüfung: der Volltext liefert Kandidaten, die Sichtbarkeit kommt aus visibleCaseWhere — derselben Funktion wie in der Fallliste, und Treffer, Trefferzahl und Facettenzähler entstehen gemeinsam in einer Abfrage. Eine in SQL nachgebaute Sichtbarkeitsregel wäre die Sorte Duplikat, die auseinanderläuft. Filter stehen in der Adresse. Damit ist jeder Zustand teilbar, der Zurück-Knopf tut das Richtige, und eine gespeicherte Ansicht ist ein Lesezeichen. Die mitgelieferten Ansichten stehen im Programm, weil sie von der Gegenwart abhängen. Strg+K öffnet die Kommandopalette. Im Grundgerüst steckt nur das Tastaturereignis, die Palette selbst wird beim Öffnen geholt — das kostet die anderen Seiten rund hundert Byte. Offen geblieben: "Zuletzt geöffnet" als Ansicht. Dafür müsste jeder Aufruf jeder Akte mitgeschrieben werden; das wäre eine Überwachungsfunktion, die niemand bestellt hat. In TASKS vermerkt. 165 Tests im Web-Paket, 17 in der Datenbank, 7 im Worker, 34 e2e. Grösste Route bei 119,7 kB gegen 120 erlaubte.
This commit is contained in:
Harlekin
@@ -0,0 +1,240 @@
|
||||
import type { Metadata } from 'next'
|
||||
import Link from 'next/link'
|
||||
import { db } from '@/lib/db'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { parseFilters, toSearchParams, SEARCH_KINDS } from '@/lib/search/query'
|
||||
import { searchCases, searchDocuments, searchPersonnel } from '@/lib/search/service'
|
||||
import { builtinViews } from '@/lib/search/views'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { StampMark, classificationEdgeStyle } from '@/components/StampMark'
|
||||
import { StatusTags } from '@/components/StatusTags'
|
||||
import { SearchBox } from './SearchBox'
|
||||
import { SavedViews } from './SavedViews'
|
||||
|
||||
export const metadata: Metadata = { title: de.search.heading }
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
/**
|
||||
* Suchseite.
|
||||
*
|
||||
* Alles läuft über Adressparameter: das macht jeden Zustand teilbar, den
|
||||
* Zurück-Knopf richtig und eine gespeicherte Ansicht zu dem, was sie ist —
|
||||
* ein Lesezeichen. Siehe lib/search/query.ts.
|
||||
*/
|
||||
export default async function SearchPage({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<Record<string, string | string[] | undefined>>
|
||||
}) {
|
||||
const user = await requireUser()
|
||||
const roh = await searchParams
|
||||
const filters = parseFilters(
|
||||
Object.fromEntries(
|
||||
Object.entries(roh).map(([k, v]) => [k, Array.isArray(v) ? v[0] : v]),
|
||||
),
|
||||
)
|
||||
|
||||
const [levels, gespeichert] = await Promise.all([
|
||||
db.clearanceLevelConfig.findMany({ orderBy: { level: 'asc' } }),
|
||||
db.savedView.findMany({
|
||||
where: { userId: user.id },
|
||||
orderBy: [{ sortOrder: 'asc' }, { createdAt: 'asc' }],
|
||||
select: { id: true, name: true, query: true },
|
||||
}),
|
||||
])
|
||||
const levelName = new Map(levels.map((l) => [l.level, l.name]))
|
||||
|
||||
const ergebnis =
|
||||
filters.kind === 'document'
|
||||
? await searchDocuments(user.permissions, filters)
|
||||
: filters.kind === 'personnel'
|
||||
? await searchPersonnel(user.permissions, filters)
|
||||
: await searchCases(user.permissions, filters)
|
||||
|
||||
const statusTags = filters.kind === 'personnel' ? await listStatusTags() : []
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<div className="flex flex-wrap items-baseline justify-between gap-4">
|
||||
<h1 className="font-condensed">{de.search.heading}</h1>
|
||||
<span className="font-mono text-xs text-text-dim">
|
||||
{de.search.countLabel(ergebnis.total)}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<SearchBox filters={filters} />
|
||||
|
||||
<nav className="mt-4 flex flex-wrap gap-4 font-condensed text-xs">
|
||||
{SEARCH_KINDS.map((kind) => (
|
||||
<Link
|
||||
key={kind}
|
||||
href={`/suche?${toSearchParams({ ...filters, kind, cursor: undefined })}`}
|
||||
className={kind === filters.kind ? 'text-accent' : undefined}
|
||||
>
|
||||
{de.search.kinds[kind]}
|
||||
</Link>
|
||||
))}
|
||||
</nav>
|
||||
|
||||
<SavedViews
|
||||
builtins={builtinViews()}
|
||||
saved={gespeichert}
|
||||
currentQuery={toSearchParams({ ...filters, cursor: undefined })}
|
||||
/>
|
||||
|
||||
{'facets' in ergebnis ? (
|
||||
<div className="mt-6 flex flex-wrap gap-x-8 gap-y-3 border-t border-line pt-4 text-2xs">
|
||||
<Facette
|
||||
label={de.case.status}
|
||||
werte={ergebnis.facets.status.map((f) => ({
|
||||
...f,
|
||||
label: de.case.statusNames[f.value] ?? f.value,
|
||||
}))}
|
||||
param="status"
|
||||
filters={filters}
|
||||
/>
|
||||
<Facette
|
||||
label={de.case.type}
|
||||
werte={ergebnis.facets.templateKey.map((f) => ({ ...f, label: f.value }))}
|
||||
param="templateKey"
|
||||
filters={filters}
|
||||
/>
|
||||
<Facette
|
||||
label={de.clearance.classification}
|
||||
werte={ergebnis.facets.classification.map((f) => ({
|
||||
...f,
|
||||
label: `${f.value} · ${levelName.get(Number(f.value)) ?? ''}`,
|
||||
}))}
|
||||
param="classification"
|
||||
filters={filters}
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
{ergebnis.truncated ? (
|
||||
<p className="mt-4 text-2xs text-stamp-3">{de.search.truncated}</p>
|
||||
) : null}
|
||||
|
||||
{ergebnis.hits.length === 0 ? (
|
||||
<p className="mt-10 text-text-dim">
|
||||
{filters.q ? de.search.empty : de.search.emptyNoQuery}
|
||||
</p>
|
||||
) : (
|
||||
<ul className="mt-6 border-t border-line">
|
||||
{ergebnis.hits.map((treffer) => (
|
||||
<li key={treffer.id} className="border-b border-line">
|
||||
{'caseNumber' in treffer ? (
|
||||
<Link
|
||||
href={`/faelle/${treffer.caseNumber}`}
|
||||
prefetch
|
||||
className="flex flex-wrap items-baseline gap-x-4 gap-y-1 py-3 pl-3 text-text no-underline"
|
||||
style={classificationEdgeStyle(treffer.classification)}
|
||||
>
|
||||
<span className="font-mono text-xs text-text-dim">{treffer.caseNumber}</span>
|
||||
<span className="grow">{treffer.title}</span>
|
||||
<span className="font-condensed text-2xs text-text-dim">
|
||||
{de.case.statusNames[treffer.status] ?? treffer.status}
|
||||
</span>
|
||||
<StampMark
|
||||
level={treffer.classification}
|
||||
name={levelName.get(treffer.classification) ?? de.common.unknown}
|
||||
/>
|
||||
</Link>
|
||||
) : 'documentNumber' in treffer ? (
|
||||
<Link
|
||||
href={`/dokumente/${treffer.documentNumber}`}
|
||||
prefetch
|
||||
className="flex flex-wrap items-baseline gap-x-4 gap-y-1 py-3 pl-3 text-text no-underline"
|
||||
style={classificationEdgeStyle(treffer.classification)}
|
||||
>
|
||||
<span className="font-mono text-xs text-text-dim">
|
||||
{treffer.documentNumber}
|
||||
</span>
|
||||
<span className="grow">{treffer.title}</span>
|
||||
<span className="font-condensed text-2xs text-text-dim">
|
||||
{de.document.statusNames[treffer.status] ?? treffer.status}
|
||||
</span>
|
||||
</Link>
|
||||
) : (
|
||||
<Link
|
||||
href={`/personalakten/${treffer.id}`}
|
||||
prefetch
|
||||
className="flex flex-wrap items-baseline gap-x-4 gap-y-1 py-3 pl-3 text-text no-underline"
|
||||
style={classificationEdgeStyle(treffer.classification)}
|
||||
>
|
||||
<span className="grow">{treffer.displayName}</span>
|
||||
{treffer.rank ? (
|
||||
<span className="font-condensed text-2xs text-text-dim">{treffer.rank}</span>
|
||||
) : null}
|
||||
<StatusTags tags={treffer.statusTags} known={statusTags} />
|
||||
</Link>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
{'cursor' in ergebnis && ergebnis.cursor ? (
|
||||
<p className="mt-6">
|
||||
<Link
|
||||
href={`/suche?${toSearchParams({ ...filters, cursor: ergebnis.cursor })}`}
|
||||
className="font-condensed text-xs"
|
||||
>
|
||||
{de.search.more}
|
||||
</Link>
|
||||
</p>
|
||||
) : null}
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
async function listStatusTags() {
|
||||
return db.personnelStatusTag.findMany({
|
||||
where: { isActive: true },
|
||||
orderBy: { sortOrder: 'asc' },
|
||||
select: { key: true, name: true, colorToken: true },
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Eine Facette. Die Zahlen stammen aus derselben Abfrage wie die Liste — ein
|
||||
* Zähler, der mehr zählt als die Liste zeigt, wäre selbst eine Information.
|
||||
*/
|
||||
function Facette({
|
||||
label,
|
||||
werte,
|
||||
param,
|
||||
filters,
|
||||
}: {
|
||||
label: string
|
||||
werte: { value: string; label: string; count: number }[]
|
||||
param: 'status' | 'templateKey' | 'classification'
|
||||
filters: ReturnType<typeof parseFilters>
|
||||
}) {
|
||||
if (werte.length === 0) return null
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p className="font-condensed text-text-dim">{label}</p>
|
||||
<ul className="mt-1 space-y-0.5">
|
||||
{werte.slice(0, 6).map((wert) => {
|
||||
const aktiv = String(filters[param] ?? '') === wert.value
|
||||
return (
|
||||
<li key={wert.value}>
|
||||
<Link
|
||||
href={`/suche?${toSearchParams({
|
||||
...filters,
|
||||
[param]: aktiv ? undefined : wert.value,
|
||||
cursor: undefined,
|
||||
})}`}
|
||||
className={aktiv ? 'text-accent' : 'text-text'}
|
||||
>
|
||||
{wert.label} <span className="font-mono text-text-dim">{wert.count}</span>
|
||||
</Link>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user