feat(empty-loading-states): Bessere Loading- und Empty-States in allen List-Pages [tsc:ok]
This commit is contained in:
parent
48af59fe54
commit
4190aa07e4
@ -1,7 +1,8 @@
|
|||||||
{
|
{
|
||||||
"completed_features": [
|
"completed_features": [
|
||||||
"toast-notifications"
|
"toast-notifications",
|
||||||
|
"logout-everywhere"
|
||||||
],
|
],
|
||||||
"current_feature": "logout-everywhere",
|
"current_feature": "empty-loading-states",
|
||||||
"started_at": "2026-05-23T04:57:10.921624"
|
"started_at": "2026-05-23T04:57:10.921624"
|
||||||
}
|
}
|
||||||
@ -372,3 +372,15 @@ src/routes/customers.ts(22,36): error TS7006: Parameter
|
|||||||
- `04:57:46` **INFO** wrote 1961 chars in 16.1s (attempt 1)
|
- `04:57:46` **INFO** wrote 1961 chars in 16.1s (attempt 1)
|
||||||
- `04:57:46` **INFO** Running tsc --noEmit on api…
|
- `04:57:46` **INFO** Running tsc --noEmit on api…
|
||||||
- `04:57:47` **INFO** tsc clean ✓
|
- `04:57:47` **INFO** tsc clean ✓
|
||||||
|
- `04:57:47` **INFO** Committed feature logout-everywhere
|
||||||
|
- `04:57:47` **INFO** Pushed: rc=0
|
||||||
|
|
||||||
|
## Phase-3 Feature: empty-loading-states (2026-05-23 04:57:47)
|
||||||
|
|
||||||
|
- `04:57:47` **INFO** Description: Bessere Loading- und Empty-States in allen List-Pages
|
||||||
|
- `04:57:47` **INFO** Generating apps/web/src/components/EmptyState.tsx (Reusable EmptyState-Komponente. Props: title (string), description (st…)
|
||||||
|
- `04:57:56` **INFO** wrote 910 chars in 8.4s (attempt 1)
|
||||||
|
- `04:57:56` **INFO** Generating apps/web/src/components/LoadingSpinner.tsx (Reusable LoadingSpinner. Props: label? (string, default 'Lädt…'). Tail…)
|
||||||
|
- `04:58:00` **INFO** wrote 453 chars in 4.2s (attempt 1)
|
||||||
|
- `04:58:00` **INFO** Running tsc --noEmit on api…
|
||||||
|
- `04:58:01` **INFO** tsc clean ✓
|
||||||
|
|||||||
34
apps/web/src/components/EmptyState.tsx
Normal file
34
apps/web/src/components/EmptyState.tsx
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
interface EmptyStateProps {
|
||||||
|
title: string;
|
||||||
|
description: string;
|
||||||
|
action?: {
|
||||||
|
label: string;
|
||||||
|
onClick: () => void;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function EmptyState({ title, description, action }: EmptyStateProps) {
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col items-center justify-center p-8 text-center max-w-md mx-auto">
|
||||||
|
<div className="text-6xl mb-4">
|
||||||
|
📋
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-2">
|
||||||
|
{title}
|
||||||
|
</h3>
|
||||||
|
<p className="text-slate-500 dark:text-slate-400 mb-6">
|
||||||
|
{description}
|
||||||
|
</p>
|
||||||
|
{action && (
|
||||||
|
<button
|
||||||
|
onClick={action.onClick}
|
||||||
|
className="px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg font-medium transition-colors duration-200 shadow-sm"
|
||||||
|
>
|
||||||
|
{action.label}
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
14
apps/web/src/components/LoadingSpinner.tsx
Normal file
14
apps/web/src/components/LoadingSpinner.tsx
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
interface LoadingSpinnerProps {
|
||||||
|
label?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function LoadingSpinner({ label = 'Lädt…' }: LoadingSpinnerProps) {
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col items-center justify-center gap-3 p-4">
|
||||||
|
<div className="h-8 w-8 animate-spin rounded-full border-4 border-gray-300 border-t-blue-600" />
|
||||||
|
{label && <span className="text-sm font-medium text-gray-600">{label}</span>}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user