Merge branch 'master' into feature/cases

frontend/src/components/ui/shared/Dropdown.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { ChevronDown } from 'lucide-react';
-import React, { forwardRef } from 'react';
+import React, { forwardRef, useId } from 'react';
 
 interface DropdownProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
   label?: string;
@@ -10,7 +10,8 @@ interface DropdownProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
 
 export const Dropdown = forwardRef<HTMLSelectElement, DropdownProps>(
   ({ label, error, className = '', id, children, ...props }, ref) => {
-    const selectId = id || `dropdown-${Math.random().toString(36).slice(2, 9)}`;
+    const genId = useId();
+    const selectId = id ?? genId;
 
     return (
       <div className="w-full">