Split the 854-line DSR detail page into colocated components under _components/ and a data-loading hook under _hooks/. No behavior changes. page.tsx is now 172 LOC, all extracted files under 300 LOC. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
42 lines
1.7 KiB
TypeScript
42 lines
1.7 KiB
TypeScript
'use client'
|
|
|
|
import React from 'react'
|
|
import Link from 'next/link'
|
|
import { DSRRequest, DSR_TYPE_INFO } from '@/lib/sdk/dsr/types'
|
|
|
|
export function DSRHeader({ request }: { request: DSRRequest }) {
|
|
const typeInfo = DSR_TYPE_INFO[request.type]
|
|
|
|
return (
|
|
<div className="flex items-center justify-between">
|
|
<div className="flex items-center gap-4">
|
|
<Link
|
|
href="/sdk/dsr"
|
|
className="p-2 text-gray-500 hover:text-gray-700 hover:bg-gray-100 rounded-lg transition-colors"
|
|
>
|
|
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 19l-7-7m0 0l7-7m-7 7h18" />
|
|
</svg>
|
|
</Link>
|
|
<div>
|
|
<div className="flex items-center gap-2">
|
|
<span className="text-sm text-gray-500 font-mono">{request.referenceNumber}</span>
|
|
<span className={`px-2 py-1 text-xs rounded-full ${typeInfo.bgColor} ${typeInfo.color}`}>
|
|
{typeInfo.article} {typeInfo.label}
|
|
</span>
|
|
</div>
|
|
<h1 className="text-2xl font-bold text-gray-900 mt-1">
|
|
{request.requester.name}
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
<button className="flex items-center gap-2 px-4 py-2 text-gray-600 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors">
|
|
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
|
|
</svg>
|
|
Exportieren
|
|
</button>
|
|
</div>
|
|
)
|
|
}
|