gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-24 23:35:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE-114): use React's useId hook for generating unique checkbox IDs in CheckboxInput

Browse Source
This commit is contained in:
rstubryan
2025-10-21 11:54:57 +07:00
parent 1ee1cf9ea9
commit 25a97e34c7
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/input/CheckboxInput.tsx
+4 -3
View File
@@ -1,6 +1,6 @@
'use client'; 'use client';
import { ChangeEventHandler, FocusEventHandler, ReactNode } from 'react'; import { ChangeEventHandler, FocusEventHandler, ReactNode, useId } from 'react';
import { cn } from '@/lib/helper'; import { cn } from '@/lib/helper';
import FieldMessage from '@/components/helper/FieldMessage'; import FieldMessage from '@/components/helper/FieldMessage';
@@ -101,8 +101,9 @@ const CheckboxInput = ({
error: 'checkbox-error', error: 'checkbox-error',
}; };
// Generate unique ID for accessibility // Generate unique ID for accessibility using React's useId hook for SSR compatibility
const checkboxId = `checkbox-${name}-${Math.random().toString(36).substr(2, 9)}`; const generatedId = useId();
const checkboxId = `checkbox-${name}-${generatedId}`;
// Naked mode - only checkbox, no wrapper structure // Naked mode - only checkbox, no wrapper structure
if (naked) { if (naked) {