feat(accordion-component): Accordion mit collapsible Sections [tsc:fail]
This commit is contained in:
parent
11f4d10645
commit
8c9a0e8674
@ -1,5 +1,8 @@
|
||||
{
|
||||
"completed_features": [],
|
||||
"current_feature": "tabs-component",
|
||||
"started_at": "2026-05-23T09:48:28.280761"
|
||||
"current_feature": "accordion-component",
|
||||
"started_at": "2026-05-23T09:48:28.280761",
|
||||
"attempted_features": [
|
||||
"tabs-component"
|
||||
]
|
||||
}
|
||||
@ -3737,3 +3737,21 @@ src/index.ts(27,25): error TS2769: No overload matches this call.
|
||||
Overload 1 of 3, '(plugin: FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
||||
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
||||
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>,
|
||||
- `09:48:43` **INFO** Committed feature tabs-component
|
||||
- `09:48:43` **INFO** Pushed: rc=0
|
||||
|
||||
## Phase-3 Feature: accordion-component (2026-05-23 09:48:43)
|
||||
|
||||
- `09:48:43` **INFO** Description: Accordion mit collapsible Sections
|
||||
- `09:48:43` **INFO** Generating apps/web/src/components/Accordion.tsx (Accordion-Component. Props: items (array {id, title, content: ReactNod…)
|
||||
- `09:48:58` **INFO** wrote 1724 chars in 15.0s (attempt 1)
|
||||
- `09:48:58` **INFO** Running tsc --noEmit on api…
|
||||
- `09:49:00` **WARN** tsc errors:
|
||||
src/db/schema.ts(37,14): error TS7022: 'customers' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.
|
||||
src/db/schema.ts(45,59): error TS7024: Function implicitly has return type 'any' because it does not have a return type annotation and is referenced directly or indirectly in one of its return expressions.
|
||||
src/db/schema.ts(49,14): error TS7022: 'projects' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.
|
||||
src/db/schema.ts(53,56): error TS7024: Function implicitly has return type 'any' because it does not have a return type annotation and is referenced directly or indirectly in one of its return expressions.
|
||||
src/index.ts(27,25): error TS2769: No overload matches this call.
|
||||
Overload 1 of 3, '(plugin: FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
||||
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
||||
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>,
|
||||
|
||||
61
apps/web/src/components/Accordion.tsx
Normal file
61
apps/web/src/components/Accordion.tsx
Normal file
@ -0,0 +1,61 @@
|
||||
import React, { useState } from 'react';
|
||||
import { ChevronDown } from 'lucide-react';
|
||||
|
||||
interface AccordionItem {
|
||||
id: string;
|
||||
title: string;
|
||||
content: React.ReactNode;
|
||||
}
|
||||
|
||||
interface AccordionProps {
|
||||
items: AccordionItem[];
|
||||
allowMultiple?: boolean;
|
||||
}
|
||||
|
||||
export default function Accordion({ items, allowMultiple = false }: AccordionProps) {
|
||||
const [openIds, setOpenIds] = useState<Set<string>>(new Set());
|
||||
|
||||
const toggleItem = (id: string) => {
|
||||
setOpenIds((prev) => {
|
||||
const next = new Set(prev);
|
||||
if (next.has(id)) {
|
||||
next.delete(id);
|
||||
} else {
|
||||
if (!allowMultiple) {
|
||||
next.clear();
|
||||
}
|
||||
next.add(id);
|
||||
}
|
||||
return next;
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-2 w-full">
|
||||
{items.map((item) => {
|
||||
const isOpen = openIds.has(item.id);
|
||||
return (
|
||||
<div
|
||||
key={item.id}
|
||||
className="border border-slate-200 dark:border-slate-800 rounded-lg overflow-hidden"
|
||||
>
|
||||
<button
|
||||
onClick={() => toggleItem(item.id)}
|
||||
className="flex items-center justify-between w-full p-4 text-left font-medium transition-colors hover:bg-slate-50 dark:hover:bg-slate-900"
|
||||
>
|
||||
<span>{item.title}</span>
|
||||
<ChevronDown
|
||||
className={`w-5 h-5 transition-transform duration-200 ${isOpen ? 'rotate-180' : ''}`}
|
||||
/>
|
||||
</button>
|
||||
{isOpen && (
|
||||
<div className="p-4 pt-0 border-t border-slate-100 dark:border-slate-800 text-slate-600 dark:text-slate-400">
|
||||
{item.content}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user