knee-cola/evidencija-rezija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/accordion-collapse' into develop

Browse Source
This commit is contained in:
Nikola Derežić
2024-02-01 15:35:49 +01:00
parent 5feabdf4f5 85aea1fa6d
commit 5eb12d2179
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/ui/MonthCard.tsx
View File

@@ -18,8 +18,9 @@ export const MonthCard:FC<MonthCardProps> = ({ yearMonth, children, monthlyExpen
const router = useRouter(); const router = useRouter();
const elRef = useRef<HTMLDivElement>(null); const elRef = useRef<HTMLDivElement>(null);
// setting the `month` will activate the accordion belonging to that month // Setting the `month` will activate the accordion belonging to that month
const handleChange = (event:any) => router.push(`/?year=${yearMonth.year}&month=${yearMonth.month}`); // If the accordion is already active, it will collapse it
const handleChange = (event:any) => router.push(expanded ? `/?year=${yearMonth.year}` : `/?year=${yearMonth.year}&month=${yearMonth.month}`);
useEffect(() => { useEffect(() => {
if(expanded && elRef.current) { if(expanded && elRef.current) {
@@ -30,7 +31,7 @@ export const MonthCard:FC<MonthCardProps> = ({ yearMonth, children, monthlyExpen
return( return(
<div className="collapse collapse-plus bg-base-200 my-1" ref={elRef}> <div className="collapse collapse-plus bg-base-200 my-1" ref={elRef}>
<input type="radio" name="my-accordion-3" checked={expanded} onChange={handleChange} /> <input type="checkbox" name="my-accordion-3" checked={expanded} onChange={handleChange} />
<div className="collapse-title text-xl font-medium"> <div className="collapse-title text-xl font-medium">
{`${formatYearMonth(yearMonth)}`} {`${formatYearMonth(yearMonth)}`}
{ {