Runde Bedienelemente, Admin zusammengelegt, Kanäle entfallen
Vier der acht Änderungswünsche. **Knöpfe.** Rund vierzig der siebzig Knöpfe waren blosser Text in Akzentfarbe, von einem Link nicht zu unterscheiden. Jeder trägt jetzt Rahmen und Grundfläche, über die Klasse .btn an einer Stelle definiert statt siebzigmal als Klassenkette. Beim Drücken zieht der Knopf sich zusammen und bekommt einen inneren Ring — er wirkt kurz dicker, ohne dass die Rahmenbreite sich ändert und das Umfeld springt; die Rückmeldung setzt ohne Verzögerung ein und klingt langsam ab, sonst bliebe ein kurzer Klick unsichtbar. Dazu die neue Regel: Flächen bleiben eckig, alles Bedienbare ist rund. Damit ist die Rundung eine Auskunft und keine Verzierung. **Verwaltung.** Rollen, Vorlagen und Änderungsrichtlinie waren drei Einträge in der Kopfzeile für etwas, das man selten und dann zusammenhängend braucht. Jetzt ein Eintrag /admin mit Reiterleiste, dazu eine gemeinsame Tabs-Komponente, die auch der Fallakte zeigt, welcher Reiter offen ist. **Kanäle.** Ersatzlos entfernt, mitsamt Tabelle. Der Chat gehört dorthin, wo der Vorgang steht; ein eigener Reiter mit freien Räumen war der Rückweg nach Discord. Die Personalakte hat jetzt denselben Chat wie die Fallakte — ohne „als Vermerk übernehmen", denn dafür braucht es einen Verlauf, und Meldungen gehen nur an Erwähnte, nie in den allgemeinen Kanal: dass es zu jemandem eine Personalakte gibt, ist selbst eine Auskunft. Ein CHECK erzwingt jetzt, dass eine Nachricht zu genau einem Ort gehört. **Kopfzeile.** Suchbalken statt Suchlink, als gewöhnliches Formular ohne ein Byte im Bündel. Thema, Benachrichtigungen und Abmelden sitzen hinter dem Profilbild, das von Discord kommt; wer keins hat, bekommt seine Initialen. Nebenbei: Aktenzeichen in Tests waren nur auf vier Stellen eindeutig und kollidierten zwischen Läufen, weil Akten nicht löschbar sind.
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
import type { ReactNode } from 'react'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { adminSections, hasAdminAccess } from './sections'
|
||||
import { Tabs } from '@/components/Tabs'
|
||||
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
/**
|
||||
* Kopf und Leiste der Verwaltung.
|
||||
*
|
||||
* Wie bei der Fallakte sind die Bereiche **eigene Seiten** unter einem
|
||||
* gemeinsamen Layout, keine umgeschalteten Blöcke. Wer gar keinen Bereich
|
||||
* sehen darf, bekommt 404 — die Verwaltung ist für ihn nicht vorhanden.
|
||||
*/
|
||||
export default async function AdminLayout({ children }: { children: ReactNode }) {
|
||||
const user = await requireUser()
|
||||
if (!hasAdminAccess(user.permissions)) notFound()
|
||||
|
||||
const bereiche = adminSections(user.permissions)
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<header>
|
||||
<h1 className="font-condensed">{de.admin.heading}</h1>
|
||||
<p className="mt-1 text-2xs text-text-dim">{de.admin.intro}</p>
|
||||
</header>
|
||||
|
||||
<Tabs tabs={bereiche.map((bereich) => ({ href: bereich.href, label: bereich.label }))} />
|
||||
|
||||
<div className="mt-8">{children}</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
import type { Metadata } from 'next'
|
||||
import Link from 'next/link'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { adminSections } from './sections'
|
||||
|
||||
export const metadata: Metadata = { title: de.admin.heading }
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
/**
|
||||
* Die Startseite der Verwaltung: was es gibt und wofür es da ist.
|
||||
*
|
||||
* Kein Weiterleiten auf den ersten Bereich. Wer die Verwaltung öffnet, weiss
|
||||
* nicht immer, wo das Gesuchte liegt — eine Liste mit einem Satz je Bereich
|
||||
* beantwortet das schneller als das Durchklicken der Leiste.
|
||||
*/
|
||||
export default async function AdminIndexPage() {
|
||||
const user = await requireUser()
|
||||
const bereiche = adminSections(user.permissions)
|
||||
|
||||
return (
|
||||
<ul className="border-t border-line">
|
||||
{bereiche.map((bereich) => (
|
||||
<li key={bereich.key} className="border-b border-line">
|
||||
<Link href={bereich.href} className="block py-3 no-underline">
|
||||
<span className="font-condensed text-text">{bereich.label}</span>
|
||||
<span className="mt-0.5 block text-2xs text-text-dim">{bereich.description}</span>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
@@ -74,7 +74,7 @@ export function PolicyForm({
|
||||
setGrace(Number(event.target.value))
|
||||
setSaved(false)
|
||||
}}
|
||||
className="mt-1.5 block w-24 border border-line bg-raised px-3 py-2 font-mono text-sm disabled:text-text-dim"
|
||||
className="mt-1.5 block w-24 field font-mono disabled:text-text-dim"
|
||||
/>
|
||||
</label>
|
||||
|
||||
@@ -95,7 +95,7 @@ export function PolicyForm({
|
||||
type="button"
|
||||
onClick={submit}
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-4 py-2 font-condensed text-xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : settingsText.save}
|
||||
</button>
|
||||
|
||||
@@ -13,8 +13,8 @@ export default async function PolicyPage() {
|
||||
const setting = await db.appSetting.findUnique({ where: { id: 1 } })
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-(--container-measure) px-6 py-10">
|
||||
<h1 className="font-condensed">{de.settings.heading}</h1>
|
||||
<section>
|
||||
<h2 className="font-condensed">{de.settings.heading}</h2>
|
||||
<p className="mt-2 text-text-dim">{de.settings.intro}</p>
|
||||
<PolicyForm
|
||||
initial={{
|
||||
@@ -23,6 +23,6 @@ export default async function PolicyPage() {
|
||||
entryEditMarkGrace: setting?.entryEditMarkGrace ?? false,
|
||||
}}
|
||||
/>
|
||||
</main>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -91,7 +91,7 @@ export function RoleRow({
|
||||
setCategory(event.target.value)
|
||||
setSaved(false)
|
||||
}}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
>
|
||||
{CATEGORIES.map((value) => (
|
||||
<option key={value} value={value}>
|
||||
@@ -109,7 +109,7 @@ export function RoleRow({
|
||||
setClearanceLevel(Number(event.target.value))
|
||||
setSaved(false)
|
||||
}}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
@@ -160,7 +160,7 @@ export function RoleRow({
|
||||
type="button"
|
||||
onClick={submit}
|
||||
disabled={pending || !dirty}
|
||||
className="border border-line bg-raised px-3 py-1.5 font-condensed text-xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? roleAdminText.saving : roleAdminText.save}
|
||||
</button>
|
||||
|
||||
@@ -27,8 +27,8 @@ export default async function RoleAdminPage() {
|
||||
])
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<h1 className="font-condensed">{de.roleAdmin.heading}</h1>
|
||||
<section>
|
||||
<h2 className="font-condensed">{de.roleAdmin.heading}</h2>
|
||||
<p className="mt-2 max-w-(--container-measure) text-text-dim">{de.roleAdmin.intro}</p>
|
||||
|
||||
{mappings.length === 0 ? (
|
||||
@@ -73,6 +73,6 @@ export default async function RoleAdminPage() {
|
||||
})}
|
||||
</>
|
||||
)}
|
||||
</main>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,53 @@
|
||||
import type { EffectivePermissions } from '@/lib/auth/permissions'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
|
||||
/**
|
||||
* Die Bereiche der Verwaltung, an einer Stelle.
|
||||
*
|
||||
* Vorher standen Rollenverwaltung, Vorlagen und Änderungsrichtlinie als drei
|
||||
* eigene Einträge in der Kopfzeile — drei Einträge für etwas, das man selten
|
||||
* und dann meist zusammenhängend braucht. Jetzt ist es ein Eintrag mit einer
|
||||
* Leiste darunter.
|
||||
*
|
||||
* Die Rechteprüfung steht hier **nicht** als Berechtigung, sondern nur für die
|
||||
* Anzeige: jede Seite prüft selbst noch einmal mit `requirePermission`. Eine
|
||||
* versteckte Kachel ist kein Schutz.
|
||||
*/
|
||||
export type AdminSection = {
|
||||
key: string
|
||||
href: string
|
||||
label: string
|
||||
description: string
|
||||
}
|
||||
|
||||
export function adminSections(p: EffectivePermissions): AdminSection[] {
|
||||
const darf = (recht: 'roles.manage' | 'template.manage' | 'admin'): boolean =>
|
||||
p.isAdmin || (recht !== 'admin' && p.permissions.has(recht))
|
||||
|
||||
const alle: (AdminSection & { sichtbar: boolean })[] = [
|
||||
{ key: 'roles', href: '/admin/rollen', sichtbar: darf('roles.manage'), ...text('roles') },
|
||||
{
|
||||
key: 'templates',
|
||||
href: '/admin/vorlagen',
|
||||
sichtbar: darf('template.manage'),
|
||||
...text('templates'),
|
||||
},
|
||||
{ key: 'policy', href: '/admin/richtlinie', sichtbar: darf('admin'), ...text('policy') },
|
||||
{ key: 'log', href: '/admin/protokoll', sichtbar: darf('admin'), ...text('log') },
|
||||
{ key: 'system', href: '/admin/system', sichtbar: darf('admin'), ...text('system') },
|
||||
]
|
||||
|
||||
return alle.filter((bereich) => bereich.sichtbar).map(({ sichtbar: _, ...rest }) => rest)
|
||||
}
|
||||
|
||||
function text(key: string): { label: string; description: string } {
|
||||
return {
|
||||
label: de.admin.sections[key] ?? key,
|
||||
description: de.admin.descriptions[key] ?? '',
|
||||
}
|
||||
}
|
||||
|
||||
/** Ob jemand die Verwaltung überhaupt sieht. Für die Kopfzeile. */
|
||||
export function hasAdminAccess(p: EffectivePermissions): boolean {
|
||||
return p.isAdmin || p.permissions.has('roles.manage') || p.permissions.has('template.manage')
|
||||
}
|
||||
@@ -54,8 +54,8 @@ export default async function SystemPage() {
|
||||
await requirePermission('admin')
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-(--container-measure) px-6 py-10">
|
||||
<h1 className="font-condensed">{de.health.heading}</h1>
|
||||
<section>
|
||||
<h2 className="font-condensed">{de.health.heading}</h2>
|
||||
<Suspense
|
||||
fallback={
|
||||
<div className="mt-6">
|
||||
@@ -91,7 +91,7 @@ export default async function SystemPage() {
|
||||
<a href="/api/admin/export?kind=bundle">{de.export.bundle}</a>
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -85,7 +85,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
<input
|
||||
value={name}
|
||||
onChange={(event) => setName(event.target.value)}
|
||||
className="mt-1 block w-full border border-line bg-raised px-2 py-1 text-sm"
|
||||
className="mt-1 block w-full field"
|
||||
/>
|
||||
</label>
|
||||
|
||||
@@ -94,7 +94,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
<input
|
||||
value={description}
|
||||
onChange={(event) => setDescription(event.target.value)}
|
||||
className="mt-1 block w-full border border-line bg-raised px-2 py-1 text-sm"
|
||||
className="mt-1 block w-full field"
|
||||
/>
|
||||
</label>
|
||||
|
||||
@@ -104,7 +104,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
<input
|
||||
value={numberPrefix}
|
||||
onChange={(event) => setNumberPrefix(event.target.value)}
|
||||
className="mt-1 block w-32 border border-line bg-raised px-2 py-1 font-mono text-sm"
|
||||
className="mt-1 block w-32 field font-mono"
|
||||
/>
|
||||
</label>
|
||||
<label className="block">
|
||||
@@ -115,7 +115,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
max={8}
|
||||
value={numberPadding}
|
||||
onChange={(event) => setNumberPadding(Number(event.target.value))}
|
||||
className="mt-1 block w-20 border border-line bg-raised px-2 py-1 font-mono text-sm"
|
||||
className="mt-1 block w-20 field font-mono"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
@@ -127,7 +127,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
onChange={(event) => setJson(event.target.value)}
|
||||
rows={16}
|
||||
spellCheck={false}
|
||||
className="mt-1 block w-full border border-line bg-raised px-2 py-1 font-mono text-2xs"
|
||||
className="mt-1 block w-full field font-mono text-2xs"
|
||||
/>
|
||||
<span className="mt-1 block text-2xs text-text-dim">{templateAdminText.fieldsHelp}</span>
|
||||
</label>
|
||||
@@ -137,7 +137,7 @@ export function TemplateEditor({ vorlage }: { vorlage: Vorlage }) {
|
||||
type="button"
|
||||
onClick={submit}
|
||||
disabled={pending || !geparst.ok}
|
||||
className="border border-line bg-raised px-3 py-1.5 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : templateAdminText.save}
|
||||
</button>
|
||||
|
||||
@@ -17,8 +17,8 @@ export default async function TemplateAdminPage() {
|
||||
})
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<h1 className="font-condensed">{de.templateAdmin.heading}</h1>
|
||||
<section>
|
||||
<h2 className="font-condensed">{de.templateAdmin.heading}</h2>
|
||||
<p className="mt-2 max-w-(--container-measure) text-text-dim">{de.templateAdmin.intro}</p>
|
||||
|
||||
{vorlagen.length === 0 ? (
|
||||
@@ -41,6 +41,6 @@ export default async function TemplateAdminPage() {
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</main>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -27,7 +27,7 @@ function toMessage(error: unknown): string {
|
||||
|
||||
const scope = z.union([
|
||||
z.object({ kind: z.literal('case'), caseNumber: z.string().min(1) }),
|
||||
z.object({ kind: z.literal('channel'), key: z.string().min(1) }),
|
||||
z.object({ kind: z.literal('personnel'), fileId: z.string().min(1) }),
|
||||
])
|
||||
|
||||
const sendSchema = z.object({
|
||||
@@ -114,7 +114,7 @@ export async function adoptAsEntryAction(input: unknown): Promise<ActionResult>
|
||||
}
|
||||
|
||||
const readSchema = z.object({
|
||||
scopeType: z.enum(['case', 'channel']),
|
||||
scopeType: z.enum(['case', 'personnel']),
|
||||
scopeId: z.string().min(1),
|
||||
})
|
||||
|
||||
|
||||
@@ -63,7 +63,7 @@ export function DocumentActions({
|
||||
if (!confirm(documentText.finalizeHint)) return
|
||||
run(() => finalizeDocumentAction({ documentNumber }))
|
||||
}}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{documentText.finalize}
|
||||
</button>
|
||||
@@ -78,7 +78,7 @@ export function DocumentActions({
|
||||
value={nextLevel}
|
||||
onChange={(event) => setNextLevel(Number(event.target.value))}
|
||||
aria-label={clearanceText.classification}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
@@ -98,7 +98,7 @@ export function DocumentActions({
|
||||
}),
|
||||
)
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{commonText.save}
|
||||
</button>
|
||||
@@ -110,7 +110,7 @@ export function DocumentActions({
|
||||
rows={2}
|
||||
placeholder={caseText.reclassifyReason}
|
||||
aria-label={caseText.reclassifyReason}
|
||||
className="mt-2 block w-full max-w-sm border border-line bg-raised px-3 py-2 text-2xs"
|
||||
className="mt-2 block w-full max-w-sm field text-2xs"
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
@@ -126,21 +126,21 @@ export function DocumentActions({
|
||||
rows={2}
|
||||
placeholder={documentText.retractReason}
|
||||
aria-label={documentText.retractReason}
|
||||
className="block w-full max-w-sm border border-line bg-raised px-3 py-2 text-2xs"
|
||||
className="block w-full max-w-sm field text-2xs"
|
||||
/>
|
||||
<div className="mt-2 flex gap-3">
|
||||
<button
|
||||
type="button"
|
||||
disabled={pending || reason.trim().length < 10}
|
||||
onClick={() => run(() => retractDocumentAction({ documentNumber, reason }))}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-stamp-4 disabled:text-text-dim"
|
||||
className="btn btn-sm text-stamp-4"
|
||||
>
|
||||
{documentText.retract}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setRetracting(false)}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
@@ -150,7 +150,7 @@ export function DocumentActions({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setRetracting(true)}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{documentText.retract}
|
||||
</button>
|
||||
|
||||
@@ -30,7 +30,7 @@ export function NotifyForm({ current }: { current: string }) {
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-4 py-2 font-condensed text-xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{notifyText.save}
|
||||
</button>
|
||||
|
||||
@@ -53,14 +53,14 @@ export function Approvals({ jobs }: { jobs: Auftrag[] }) {
|
||||
if (ergebnis.error) setFehler(ergebnis.error)
|
||||
})
|
||||
}
|
||||
className="border border-line bg-raised px-2 py-0.5 font-condensed text-accent"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{exportText.approve}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setAblehnung(auftrag.id)}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{exportText.reject}
|
||||
</button>
|
||||
@@ -74,7 +74,7 @@ export function Approvals({ jobs }: { jobs: Auftrag[] }) {
|
||||
rows={2}
|
||||
placeholder={exportText.rejectReason}
|
||||
aria-label={exportText.rejectReason}
|
||||
className="block w-full max-w-sm border border-line bg-raised px-3 py-2 text-2xs"
|
||||
className="block w-full max-w-sm field text-2xs"
|
||||
/>
|
||||
<div className="mt-1 flex gap-3 text-2xs">
|
||||
<button
|
||||
@@ -93,14 +93,14 @@ export function Approvals({ jobs }: { jobs: Auftrag[] }) {
|
||||
}
|
||||
})
|
||||
}
|
||||
className="font-condensed text-stamp-4 disabled:text-text-dim"
|
||||
className="btn btn-sm text-stamp-4"
|
||||
>
|
||||
{exportText.reject}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setAblehnung(null)}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
|
||||
@@ -52,7 +52,7 @@ export function CaseActions({
|
||||
<select
|
||||
value={nextStatus}
|
||||
onChange={(event) => setNextStatus(event.target.value)}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
>
|
||||
{statusTargets.map((target) => (
|
||||
<option key={target} value={target}>
|
||||
@@ -64,7 +64,7 @@ export function CaseActions({
|
||||
value={statusReason}
|
||||
onChange={(event) => setStatusReason(event.target.value)}
|
||||
placeholder={entryText.changeReason}
|
||||
className="w-56 border border-line bg-raised px-2 py-1"
|
||||
className="w-56 field"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
@@ -80,7 +80,7 @@ export function CaseActions({
|
||||
`${caseText.statusChange}: ${caseText.statusNames[nextStatus] ?? nextStatus}?`,
|
||||
)
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : commonText.save}
|
||||
</button>
|
||||
@@ -94,7 +94,7 @@ export function CaseActions({
|
||||
<select
|
||||
value={nextLevel}
|
||||
onChange={(event) => setNextLevel(Number(event.target.value))}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
>
|
||||
{levels
|
||||
.filter((level) => level.level <= maxLevel)
|
||||
@@ -111,7 +111,7 @@ export function CaseActions({
|
||||
value={levelReason}
|
||||
onChange={(event) => setLevelReason(event.target.value)}
|
||||
placeholder={caseText.reclassifyReason}
|
||||
className="w-64 border border-line bg-raised px-2 py-1"
|
||||
className="w-64 field"
|
||||
/>
|
||||
) : null}
|
||||
<button
|
||||
@@ -128,7 +128,7 @@ export function CaseActions({
|
||||
`${caseText.reclassify}: ${nextLevel}?`,
|
||||
)
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : commonText.save}
|
||||
</button>
|
||||
|
||||
@@ -72,7 +72,7 @@ export function CaseLinks({
|
||||
if (!ergebnis.ok) setFehler(ergebnis.error)
|
||||
})
|
||||
}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{linkText.remove}
|
||||
</button>
|
||||
@@ -110,7 +110,7 @@ export function CaseLinks({
|
||||
onChange={(event) => setTarget(event.target.value)}
|
||||
placeholder={linkText.target}
|
||||
aria-label={linkText.target}
|
||||
className="border border-line bg-raised px-2 py-1 font-mono text-2xs"
|
||||
className="field font-mono text-2xs"
|
||||
/>
|
||||
</AddPanel>
|
||||
) : null}
|
||||
|
||||
@@ -53,13 +53,13 @@ export function EntryActions({
|
||||
value={reason}
|
||||
onChange={(event) => setReason(event.target.value)}
|
||||
placeholder={entryText.retractReason}
|
||||
className="w-64 border border-line bg-raised px-2 py-1"
|
||||
className="w-64 field"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
disabled={pending}
|
||||
onClick={() => run(() => restoreEntryAction({ entryId, caseNumber, reason }))}
|
||||
className="font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{entryText.restore}
|
||||
</button>
|
||||
@@ -73,7 +73,7 @@ export function EntryActions({
|
||||
return (
|
||||
<div className="mt-1.5 flex gap-3 text-2xs">
|
||||
{canEdit ? (
|
||||
<button type="button" onClick={() => setMode('edit')} className="font-condensed text-accent">
|
||||
<button type="button" onClick={() => setMode('edit')} className="btn btn-sm btn-primary">
|
||||
{entryText.edit}
|
||||
</button>
|
||||
) : null}
|
||||
@@ -81,7 +81,7 @@ export function EntryActions({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setMode('retract')}
|
||||
className="font-condensed text-accent"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{entryText.retract}
|
||||
</button>
|
||||
@@ -97,7 +97,7 @@ export function EntryActions({
|
||||
value={draft}
|
||||
onChange={(event) => setDraft(event.target.value)}
|
||||
rows={4}
|
||||
className="block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="block w-full field"
|
||||
/>
|
||||
) : null}
|
||||
|
||||
@@ -105,7 +105,7 @@ export function EntryActions({
|
||||
value={reason}
|
||||
onChange={(event) => setReason(event.target.value)}
|
||||
placeholder={mode === 'edit' ? entryText.changeReason : entryText.retractReason}
|
||||
className="mt-2 block w-full border border-line bg-raised px-2 py-1"
|
||||
className="mt-2 block w-full field"
|
||||
/>
|
||||
|
||||
<div className="mt-2 flex items-center gap-3">
|
||||
@@ -119,7 +119,7 @@ export function EntryActions({
|
||||
: retractEntryAction({ entryId, caseNumber, reason }),
|
||||
)
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : mode === 'edit' ? entryText.editSave : entryText.retract}
|
||||
</button>
|
||||
@@ -131,7 +131,7 @@ export function EntryActions({
|
||||
setReason('')
|
||||
setError(null)
|
||||
}}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{entryText.cancel}
|
||||
</button>
|
||||
|
||||
@@ -67,12 +67,12 @@ export function EntryComposer({ caseNumber }: { caseNumber: string }) {
|
||||
}}
|
||||
rows={3}
|
||||
placeholder={caseText.entryPlaceholder}
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending || draft.trim().length === 0}
|
||||
className="mt-2 border border-line bg-raised px-3 py-1.5 font-condensed text-xs text-accent disabled:text-text-dim"
|
||||
className="mt-2 btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : entryText.create}
|
||||
</button>
|
||||
|
||||
@@ -77,7 +77,7 @@ export function Participants({
|
||||
if (!ergebnis.ok) setFehler(ergebnis.error)
|
||||
})
|
||||
}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{participantText.remove}
|
||||
</button>
|
||||
|
||||
@@ -35,7 +35,8 @@ export function WatchToggle({
|
||||
else setAktiv(ergebnis.watching)
|
||||
})
|
||||
}
|
||||
className={`font-condensed text-2xs ${aktiv ? 'text-accent' : 'text-text-dim'}`}
|
||||
aria-pressed={aktiv}
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{aktiv ? watchText.unwatch : watchText.watch}
|
||||
</button>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import type { ReactNode } from 'react'
|
||||
import Link from 'next/link'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { db } from '@/lib/db'
|
||||
import { Tabs } from '@/components/Tabs'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { loadVisibleCase } from '@/lib/cases/service'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
@@ -52,12 +52,13 @@ export default async function CaseLayout({
|
||||
])
|
||||
const level = levels.find((l) => l.level === akte.classification)
|
||||
|
||||
const basis = `/faelle/${akte.caseNumber}`
|
||||
const reiter = [
|
||||
{ href: '', label: de.case.tabFile },
|
||||
{ href: '/beteiligte', label: de.case.tabRelations },
|
||||
{ href: '/dokumente', label: de.case.tabDocuments },
|
||||
{ href: '/aenderungen', label: de.case.changes },
|
||||
{ href: '/export', label: de.export.heading },
|
||||
{ href: basis, label: de.case.tabFile },
|
||||
{ href: `${basis}/beteiligte`, label: de.case.tabRelations },
|
||||
{ href: `${basis}/dokumente`, label: de.case.tabDocuments },
|
||||
{ href: `${basis}/aenderungen`, label: de.case.changes },
|
||||
{ href: `${basis}/export`, label: de.export.heading },
|
||||
]
|
||||
|
||||
return (
|
||||
@@ -97,13 +98,7 @@ export default async function CaseLayout({
|
||||
/>
|
||||
</header>
|
||||
|
||||
<nav className="mt-8 flex flex-wrap gap-4 border-b border-line pb-2 font-condensed text-xs">
|
||||
{reiter.map((eintrag) => (
|
||||
<Link key={eintrag.href} href={`/faelle/${akte.caseNumber}${eintrag.href}`}>
|
||||
{eintrag.label}
|
||||
</Link>
|
||||
))}
|
||||
</nav>
|
||||
<Tabs tabs={reiter} />
|
||||
|
||||
<div className="mt-8">{children}</div>
|
||||
</main>
|
||||
|
||||
@@ -30,7 +30,7 @@ export function NewCaseForm({
|
||||
required
|
||||
minLength={3}
|
||||
maxLength={200}
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -42,7 +42,7 @@ export function NewCaseForm({
|
||||
id="templateKey"
|
||||
name="templateKey"
|
||||
required
|
||||
className="mt-1.5 block border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block field"
|
||||
>
|
||||
{templates.map((template) => (
|
||||
<option key={template.key} value={template.key}>
|
||||
@@ -61,7 +61,7 @@ export function NewCaseForm({
|
||||
id="classification"
|
||||
name="classification"
|
||||
defaultValue={defaultLevel}
|
||||
className="mt-1.5 block border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block field"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
@@ -82,7 +82,7 @@ export function NewCaseForm({
|
||||
id="personnelFileId"
|
||||
name="personnelFileId"
|
||||
defaultValue=""
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
>
|
||||
<option value="">{caseText.subjectNone}</option>
|
||||
{people.map((person) => (
|
||||
@@ -98,7 +98,7 @@ export function NewCaseForm({
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-4 py-2 font-condensed text-xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? caseText.saving : caseText.create}
|
||||
</button>
|
||||
|
||||
@@ -1,116 +0,0 @@
|
||||
'use client'
|
||||
|
||||
import { useActionState, useState } from 'react'
|
||||
import { channelText } from '@/lib/i18n/chat'
|
||||
import { clearanceText, commonText } from '@/lib/i18n/common'
|
||||
import { createChannelAction, type ActionResult } from './actions'
|
||||
|
||||
export function NewChannelForm({ levels }: { levels: { level: number; name: string }[] }) {
|
||||
const [offen, setOffen] = useState(false)
|
||||
const [state, action, pending] = useActionState<ActionResult | null, FormData>(
|
||||
createChannelAction,
|
||||
null,
|
||||
)
|
||||
|
||||
if (!offen) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOffen(true)}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent"
|
||||
>
|
||||
{channelText.create}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<form action={action} className="max-w-(--container-measure) border border-line p-4">
|
||||
<p className="font-condensed text-xs text-text-dim">{channelText.createTitle}</p>
|
||||
|
||||
<div className="mt-3 grid gap-4 sm:grid-cols-2">
|
||||
<div>
|
||||
<label htmlFor="name" className="font-condensed text-2xs text-text-dim">
|
||||
{channelText.name}
|
||||
</label>
|
||||
<input
|
||||
id="name"
|
||||
name="name"
|
||||
required
|
||||
minLength={2}
|
||||
maxLength={120}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="key" className="font-condensed text-2xs text-text-dim">
|
||||
{channelText.key}
|
||||
</label>
|
||||
<input
|
||||
id="key"
|
||||
name="key"
|
||||
required
|
||||
pattern="[a-z0-9][a-z0-9-]{1,40}"
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 font-mono text-sm"
|
||||
/>
|
||||
<p className="mt-1 text-2xs text-text-dim">{channelText.keyHint}</p>
|
||||
</div>
|
||||
|
||||
<div className="sm:col-span-2">
|
||||
<label htmlFor="description" className="font-condensed text-2xs text-text-dim">
|
||||
{channelText.description}
|
||||
</label>
|
||||
<input
|
||||
id="description"
|
||||
name="description"
|
||||
maxLength={500}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="minClearance" className="font-condensed text-2xs text-text-dim">
|
||||
{channelText.minClearance}
|
||||
</label>
|
||||
<select
|
||||
id="minClearance"
|
||||
name="minClearance"
|
||||
defaultValue={0}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
{level.level} · {level.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
<p className="mt-1 text-2xs text-text-dim">
|
||||
{channelText.minClearanceHint} {clearanceText.label}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{state && !state.ok ? (
|
||||
<p className="mt-3 font-condensed text-2xs text-stamp-4">{state.error}</p>
|
||||
) : null}
|
||||
|
||||
<div className="mt-4 flex gap-3">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent disabled:text-text-dim"
|
||||
>
|
||||
{pending ? commonText.loading : channelText.create}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOffen(false)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
)
|
||||
}
|
||||
@@ -1,70 +0,0 @@
|
||||
import type { Metadata } from 'next'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { AccessError } from '@/lib/errors'
|
||||
import { loadChatView } from '@/lib/chat/load'
|
||||
import { db } from '@/lib/db'
|
||||
import { visibleChannelWhere } from '@/lib/access/chatFilter'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { Chat } from '@/components/chat/Chat'
|
||||
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
export async function generateMetadata({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ key: string }>
|
||||
}): Promise<Metadata> {
|
||||
const { key } = await params
|
||||
return { title: `#${key}` }
|
||||
}
|
||||
|
||||
export default async function ChannelPage({ params }: { params: Promise<{ key: string }> }) {
|
||||
const user = await requireUser()
|
||||
const { key } = await params
|
||||
|
||||
const kanal = await db.channel.findFirst({
|
||||
where: { AND: [visibleChannelWhere(user.permissions), { key, isArchived: false }] },
|
||||
select: { id: true, key: true, name: true, description: true },
|
||||
})
|
||||
// Kein Zugriff heisst 404.
|
||||
if (!kanal) notFound()
|
||||
|
||||
let ansicht
|
||||
try {
|
||||
ansicht = await loadChatView(user.permissions, { kind: 'channel', key: kanal.key })
|
||||
} catch (error) {
|
||||
if (error instanceof AccessError) notFound()
|
||||
throw error
|
||||
}
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<header>
|
||||
<span className="font-mono text-xs text-text-dim">#{kanal.key}</span>
|
||||
<h1 className="mt-1 font-condensed">{kanal.name}</h1>
|
||||
{kanal.description ? (
|
||||
<p className="mt-2 max-w-(--container-measure) text-sm text-text-dim">
|
||||
{kanal.description}
|
||||
</p>
|
||||
) : null}
|
||||
</header>
|
||||
|
||||
<div className="mt-8">
|
||||
<Chat
|
||||
scope={{ kind: 'channel', key: kanal.key, channelId: kanal.id }}
|
||||
topic={`channel:${kanal.id}`}
|
||||
initial={ansicht.messages}
|
||||
initialReactions={ansicht.reactions}
|
||||
currentUserId={user.id}
|
||||
lastReadAt={ansicht.lastReadAt}
|
||||
// Ein Vermerk gehört in eine Akte. Ein Kanal hat keine.
|
||||
canAdopt={false}
|
||||
mentionNames={ansicht.mentionNames}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<p className="mt-4 text-2xs text-text-dim">{de.chat.hint}</p>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
@@ -1,40 +0,0 @@
|
||||
'use server'
|
||||
|
||||
import { redirect } from 'next/navigation'
|
||||
import { z } from 'zod'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { AccessError } from '@/lib/errors'
|
||||
import { createChannel } from '@/lib/chat/service'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
|
||||
export type ActionResult = { ok: true } | { ok: false; error: string }
|
||||
|
||||
const schema = z.object({
|
||||
key: z.string().min(2).max(40),
|
||||
name: z.string().min(2).max(120),
|
||||
description: z.string().max(500).optional(),
|
||||
minClearance: z.coerce.number().int().min(0).max(5),
|
||||
})
|
||||
|
||||
export async function createChannelAction(
|
||||
_prev: ActionResult | null,
|
||||
formData: FormData,
|
||||
): Promise<ActionResult> {
|
||||
const user = await requireUser()
|
||||
const parsed = schema.safeParse(Object.fromEntries(formData))
|
||||
if (!parsed.success) return { ok: false, error: de.actionErrors.default! }
|
||||
|
||||
let key: string
|
||||
try {
|
||||
const kanal = await createChannel(user.permissions, parsed.data)
|
||||
key = kanal.key
|
||||
} catch (error) {
|
||||
if (error instanceof AccessError) {
|
||||
return { ok: false, error: de.actionErrors[error.code] ?? de.actionErrors.default! }
|
||||
}
|
||||
console.error('[kanaele] unerwartet', error)
|
||||
return { ok: false, error: de.actionErrors.default! }
|
||||
}
|
||||
|
||||
redirect(`/kanaele/${key}`)
|
||||
}
|
||||
@@ -1,71 +0,0 @@
|
||||
import type { Metadata } from 'next'
|
||||
import Link from 'next/link'
|
||||
import { db } from '@/lib/db'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { listChannels } from '@/lib/chat/service'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { StampMark } from '@/components/StampMark'
|
||||
import { NewChannelForm } from './NewChannelForm'
|
||||
|
||||
export const metadata: Metadata = { title: de.channel.heading }
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
/**
|
||||
* Freie Kanäle: Räume für Absprachen, die zu keiner Akte gehören.
|
||||
*
|
||||
* Ein Kanal über der Stufe des Lesers taucht nicht auf. Anders als bei Akten
|
||||
* ist die Existenz eines Kanals aber kein Geheimnis für die, die seine Stufe
|
||||
* haben — ein Raum, den man erraten müsste, wäre keiner.
|
||||
*/
|
||||
export default async function ChannelListPage() {
|
||||
const user = await requireUser()
|
||||
|
||||
const [kanaele, levels] = await Promise.all([
|
||||
listChannels(user.permissions),
|
||||
db.clearanceLevelConfig.findMany({ orderBy: { level: 'asc' } }),
|
||||
])
|
||||
const levelName = new Map(levels.map((l) => [l.level, l.name]))
|
||||
const darfAnlegen = user.permissions.isAdmin || user.permissions.permissions.has('case.create')
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<h1 className="font-condensed">{de.channel.heading}</h1>
|
||||
<p className="mt-2 max-w-(--container-measure) text-sm text-text-dim">
|
||||
{de.channel.intro}
|
||||
</p>
|
||||
|
||||
{kanaele.length === 0 ? (
|
||||
<p className="mt-10 text-text-dim">{de.channel.empty}</p>
|
||||
) : (
|
||||
<ul className="mt-6 border-t border-line">
|
||||
{kanaele.map((kanal) => (
|
||||
<li key={kanal.id} className="border-b border-line">
|
||||
<Link
|
||||
href={`/kanaele/${kanal.key}`}
|
||||
prefetch
|
||||
className="flex flex-wrap items-baseline gap-x-4 gap-y-1 py-3 text-text no-underline"
|
||||
>
|
||||
<span className="font-mono text-xs text-text-dim">#{kanal.key}</span>
|
||||
<span className="grow">{kanal.name}</span>
|
||||
{kanal.minClearance > 0 ? (
|
||||
<StampMark
|
||||
level={kanal.minClearance}
|
||||
name={levelName.get(kanal.minClearance) ?? de.common.unknown}
|
||||
/>
|
||||
) : null}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
{darfAnlegen ? (
|
||||
<div className="mt-8">
|
||||
<NewChannelForm
|
||||
levels={levels.filter((l) => l.level <= user.permissions.clearanceLevel)}
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
</main>
|
||||
)
|
||||
}
|
||||
+35
-28
@@ -3,9 +3,21 @@ import { signOut } from '@/auth'
|
||||
import { requireUser } from '@/lib/auth/current'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { PaletteTrigger } from '@/components/palette/PaletteTrigger'
|
||||
import { ThemeToggle } from '@/components/ThemeToggle'
|
||||
import { ProfileMenu } from '@/components/ProfileMenu'
|
||||
import { Avatar } from '@/components/Avatar'
|
||||
import { SearchBar } from '@/components/SearchBar'
|
||||
import { Vitals } from '@/components/Vitals'
|
||||
import { hasAdminAccess } from './admin/sections'
|
||||
|
||||
/**
|
||||
* Das Rahmenwerk der angemeldeten Anwendung.
|
||||
*
|
||||
* Die Kopfzeile trägt links die Bereiche der Arbeit — Übersicht, Fallakten,
|
||||
* Personalakten, Verwaltung — und rechts alles, was den Nutzer selbst
|
||||
* betrifft: Suchbalken und Profilbild. Thema, Benachrichtigungen und Abmelden
|
||||
* standen früher zwischen den Aktenbereichen und nahmen dort den Platz weg,
|
||||
* den die Arbeit braucht; sie sitzen jetzt hinter dem Profilbild.
|
||||
*/
|
||||
export default async function AppLayout({ children }: { children: React.ReactNode }) {
|
||||
const user = await requireUser()
|
||||
|
||||
@@ -14,48 +26,43 @@ export default async function AppLayout({ children }: { children: React.ReactNod
|
||||
await signOut({ redirectTo: '/anmelden' })
|
||||
}
|
||||
|
||||
const darfPersonal =
|
||||
user.permissions.isAdmin || user.permissions.permissions.has('personnel.read')
|
||||
|
||||
return (
|
||||
<div className="min-h-dvh">
|
||||
{/* Strg+K. Winzig; die Palette selbst wird erst beim Öffnen geholt. */}
|
||||
<PaletteTrigger />
|
||||
<Vitals />
|
||||
<header className="border-b border-line">
|
||||
<div className="mx-auto flex max-w-5xl flex-wrap items-center gap-x-6 gap-y-2 px-6 py-3">
|
||||
<div className="mx-auto flex max-w-5xl flex-wrap items-center gap-x-5 gap-y-3 px-6 py-3">
|
||||
<Link href="/uebersicht" className="font-condensed text-text no-underline">
|
||||
{de.app.shortName}
|
||||
</Link>
|
||||
|
||||
<nav className="flex gap-4 font-condensed text-xs">
|
||||
<nav className="flex flex-wrap gap-4 font-condensed text-xs">
|
||||
<Link href="/uebersicht">{de.nav.dashboard}</Link>
|
||||
<Link href="/faelle">{de.nav.cases}</Link>
|
||||
{user.permissions.isAdmin || user.permissions.permissions.has('personnel.read') ? (
|
||||
<Link href="/personalakten">{de.nav.personnel}</Link>
|
||||
) : null}
|
||||
<Link href="/suche">{de.nav.search}</Link>
|
||||
<Link href="/kanaele">{de.channel.heading}</Link>
|
||||
<Link href="/einstellungen">{de.notify.heading}</Link>
|
||||
{user.permissions.isAdmin || user.permissions.permissions.has('roles.manage') ? (
|
||||
<>
|
||||
<Link href="/admin/rollen">{de.nav.admin}</Link>
|
||||
{user.permissions.isAdmin ||
|
||||
user.permissions.permissions.has('template.manage') ? (
|
||||
<Link href="/admin/vorlagen">{de.templateAdmin.heading}</Link>
|
||||
) : null}
|
||||
{user.permissions.isAdmin ? (
|
||||
<Link href="/admin/richtlinie">{de.settings.heading}</Link>
|
||||
) : null}
|
||||
</>
|
||||
{darfPersonal ? <Link href="/personalakten">{de.nav.personnel}</Link> : null}
|
||||
{hasAdminAccess(user.permissions) ? (
|
||||
<Link href="/admin">{de.nav.admin}</Link>
|
||||
) : null}
|
||||
</nav>
|
||||
|
||||
<div className="ml-auto flex items-center gap-3 text-xs text-text-dim">
|
||||
<ThemeToggle />
|
||||
<span className="font-mono">{user.displayName}</span>
|
||||
<form action={abmelden}>
|
||||
<button type="submit" className="font-condensed text-accent">
|
||||
{de.auth.signOut}
|
||||
</button>
|
||||
</form>
|
||||
<div className="ml-auto flex items-center gap-3">
|
||||
<SearchBar />
|
||||
<ProfileMenu
|
||||
displayName={user.displayName}
|
||||
username={user.username}
|
||||
signOutAction={abmelden}
|
||||
avatar={
|
||||
<Avatar
|
||||
userId={user.id}
|
||||
avatarHash={user.avatarHash}
|
||||
displayName={user.displayName}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
@@ -63,7 +63,7 @@ export function Assignments({
|
||||
if (!ergebnis.ok) setFehler(ergebnis.error)
|
||||
})
|
||||
}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{assignmentText.remove}
|
||||
</button>
|
||||
|
||||
@@ -42,7 +42,7 @@ export function LinkCase({ personnelFileId }: { personnelFileId: string }) {
|
||||
onChange={(event) => setCaseNumber(event.target.value)}
|
||||
placeholder={linkText.target}
|
||||
aria-label={linkText.target}
|
||||
className="border border-line bg-raised px-2 py-1 font-mono text-2xs"
|
||||
className="field font-mono text-2xs"
|
||||
/>
|
||||
</AddPanel>
|
||||
)
|
||||
|
||||
@@ -79,7 +79,7 @@ export function PersonnelHead({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setEditing(true)}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{personnelText.edit}
|
||||
</button>
|
||||
@@ -129,7 +129,7 @@ export function PersonnelHead({
|
||||
name="note"
|
||||
rows={3}
|
||||
defaultValue={file.note ?? ''}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1 block w-full field"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -141,14 +141,14 @@ export function PersonnelHead({
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{pending ? commonText.loading : commonText.save}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setEditing(false)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
@@ -179,7 +179,7 @@ function Reclassify({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOpen(true)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{personnelText.reclassify}
|
||||
</button>
|
||||
@@ -193,7 +193,7 @@ function Reclassify({
|
||||
value={to}
|
||||
onChange={(event) => setTo(Number(event.target.value))}
|
||||
aria-label={clearanceText.classification}
|
||||
className="border border-line bg-raised px-2 py-1 text-2xs"
|
||||
className="field text-2xs"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
@@ -211,14 +211,14 @@ function Reclassify({
|
||||
else setError(result.error)
|
||||
})
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent disabled:text-text-dim"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{commonText.save}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOpen(false)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
@@ -233,7 +233,7 @@ function Reclassify({
|
||||
rows={2}
|
||||
placeholder={caseText.reclassifyReason}
|
||||
aria-label={caseText.reclassifyReason}
|
||||
className="mt-2 block w-full border border-line bg-raised px-3 py-2 text-2xs"
|
||||
className="mt-2 block w-full field text-2xs"
|
||||
/>
|
||||
) : null}
|
||||
|
||||
@@ -282,7 +282,7 @@ function Feld({
|
||||
minLength={required ? 2 : undefined}
|
||||
maxLength={120}
|
||||
defaultValue={defaultValue ?? ''}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1 block w-full field"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -14,6 +14,8 @@ import {
|
||||
import { listDocuments, listTemplatesFor } from '@/lib/documents/service'
|
||||
import { canWritePersonnel } from '@/lib/access/documentWrite'
|
||||
import { trackOpen } from '@/lib/recent/track'
|
||||
import { loadChatView } from '@/lib/chat/load'
|
||||
import { ChatLazy } from '@/components/chat/ChatLazy'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { StampMark, classificationEdgeStyle } from '@/components/StampMark'
|
||||
import { SkeletonLine } from '@/components/Skeleton'
|
||||
@@ -160,6 +162,40 @@ async function AssignmentBlock({
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Der Chat einer Personalakte.
|
||||
*
|
||||
* Denselben formlosen Teil hat die Fallakte auch. Er steht bewusst **in** der
|
||||
* Akte und nicht in einem freien Raum daneben: über eine Person zu reden, ohne
|
||||
* dass das Gespräch bei ihrer Akte steht, war genau das, was vorher auf
|
||||
* Discord passiert ist. Siehe docs/13-entscheidungen.md.
|
||||
*
|
||||
* Übernehmen als Vermerk gibt es hier nicht — dafür braucht es einen Verlauf,
|
||||
* und den führt nur die Fallakte.
|
||||
*/
|
||||
async function ChatBlock({
|
||||
file,
|
||||
user,
|
||||
}: {
|
||||
file: { id: string }
|
||||
user: { id: string; permissions: EffectivePermissions }
|
||||
}) {
|
||||
const ansicht = await loadChatView(user.permissions, { kind: 'personnel', fileId: file.id })
|
||||
|
||||
return (
|
||||
<ChatLazy
|
||||
scope={{ kind: 'personnel', fileId: file.id }}
|
||||
topic={`personnel:${file.id}`}
|
||||
initial={ansicht.messages}
|
||||
initialReactions={ansicht.reactions}
|
||||
currentUserId={user.id}
|
||||
lastReadAt={ansicht.lastReadAt}
|
||||
canAdopt={false}
|
||||
mentionNames={ansicht.mentionNames}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export default async function PersonnelPage({ params }: { params: Promise<{ id: string }> }) {
|
||||
const user = await requirePermission('personnel.read')
|
||||
const { id } = await params
|
||||
@@ -249,6 +285,15 @@ export default async function PersonnelPage({ params }: { params: Promise<{ id:
|
||||
</Suspense>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="mt-10">
|
||||
<h2 className="font-condensed">{de.chat.heading}</h2>
|
||||
<div className="mt-4">
|
||||
<Suspense fallback={<SkeletonLine width="60%" />}>
|
||||
<ChatBlock file={akte} user={user} />
|
||||
</Suspense>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -40,7 +40,7 @@ export function NewPersonnelForm({
|
||||
id="userId"
|
||||
name="userId"
|
||||
defaultValue=""
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
>
|
||||
<option value="">{personnelText.noAccount}</option>
|
||||
{members.map((member) => (
|
||||
@@ -79,7 +79,7 @@ export function NewPersonnelForm({
|
||||
id="note"
|
||||
name="note"
|
||||
rows={3}
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
/>
|
||||
<p className="mt-1 text-2xs text-text-dim">{personnelText.noteHelp}</p>
|
||||
</div>
|
||||
@@ -93,7 +93,7 @@ export function NewPersonnelForm({
|
||||
id="classification"
|
||||
name="classification"
|
||||
defaultValue={defaultLevel}
|
||||
className="mt-1.5 block border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block field"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
@@ -110,7 +110,7 @@ export function NewPersonnelForm({
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-4 py-2 font-condensed text-sm text-accent disabled:text-text-dim"
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{pending ? commonText.loading : personnelText.create}
|
||||
</button>
|
||||
@@ -140,7 +140,7 @@ function Feld({
|
||||
required={required}
|
||||
minLength={minLength}
|
||||
maxLength={120}
|
||||
className="mt-1.5 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="mt-1.5 block w-full field"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -49,7 +49,7 @@ export default async function PersonnelListPage({
|
||||
defaultValue={q ?? ''}
|
||||
placeholder={de.personnel.search}
|
||||
aria-label={de.personnel.search}
|
||||
className="w-full max-w-sm border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="w-full max-w-sm field"
|
||||
/>
|
||||
{status ? <input type="hidden" name="status" value={status} /> : null}
|
||||
{darfAnlegen ? (
|
||||
|
||||
@@ -47,7 +47,7 @@ export function SavedViews({
|
||||
disabled={pending}
|
||||
title={searchText.deleteView}
|
||||
onClick={() => startTransition(async () => void (await deleteViewAction({ id: view.id })))}
|
||||
className="text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
×
|
||||
</button>
|
||||
@@ -62,7 +62,7 @@ export function SavedViews({
|
||||
placeholder={searchText.saveViewName}
|
||||
aria-label={searchText.saveViewName}
|
||||
maxLength={60}
|
||||
className="border border-line bg-raised px-2 py-1"
|
||||
className="field"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
@@ -78,14 +78,14 @@ export function SavedViews({
|
||||
}
|
||||
})
|
||||
}
|
||||
className="border border-line bg-raised px-2 py-1 font-condensed text-accent disabled:text-text-dim"
|
||||
className="btn btn-sm btn-primary"
|
||||
>
|
||||
{commonText.save}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOffen(false)}
|
||||
className="font-condensed text-text-dim"
|
||||
className="btn btn-sm"
|
||||
>
|
||||
{commonText.cancel}
|
||||
</button>
|
||||
@@ -94,7 +94,7 @@ export function SavedViews({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOffen(true)}
|
||||
className="ml-auto font-condensed text-text-dim"
|
||||
className="ml-auto btn btn-sm"
|
||||
>
|
||||
{searchText.saveView}
|
||||
</button>
|
||||
|
||||
@@ -50,7 +50,7 @@ export function SearchBox({ filters }: { filters: SearchFilters }) {
|
||||
placeholder={searchText.placeholder}
|
||||
aria-label={searchText.placeholder}
|
||||
autoFocus
|
||||
className="w-full max-w-xl border border-line bg-raised px-3 py-2 text-sm"
|
||||
className="w-full max-w-xl field"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -57,7 +57,7 @@ export default async function DashboardPage() {
|
||||
<h2 className="font-condensed">{de.dashboard.opened}</h2>
|
||||
{daten.geoeffnet.length > 0 ? (
|
||||
<form action={clearRecentAction}>
|
||||
<button type="submit" className="font-condensed text-2xs text-text-dim">
|
||||
<button type="submit" className="btn btn-sm">
|
||||
{de.dashboard.openedClear}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user