From 9116dd1085a1319e4cdf8762784d38f2a088abd6 Mon Sep 17 00:00:00 2001
From: SomeCodecat <88855796+SomeCodecat@users.noreply.github.com>
Date: Tue, 13 May 2025 14:22:09 +0200
Subject: [PATCH] fix: use name prop for label and input id in LabeledInput
 component

---
 src/components/labeled-input.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/labeled-input.tsx b/src/components/labeled-input.tsx
index 7b4768a..7a416d4 100644
--- a/src/components/labeled-input.tsx
+++ b/src/components/labeled-input.tsx
@@ -6,23 +6,24 @@ export default function LabeledInput({
   label,
   placeholder,
   value,
+  name,
 }: {
   type: 'text' | 'email' | 'password';
   label: string;
   placeholder?: string;
   value?: string;
+  name?: string;
 }) {
-  const elementId = Math.random().toString(36).substring(2, 15);
-
   return (
     <div className='flex flex-col gap-1'>
-      <Label htmlFor={elementId}>{label}</Label>
+      <Label htmlFor={name}>{label}</Label>
 
       <Input
         type={type}
         placeholder={placeholder}
         defaultValue={value}
-        id={elementId}
+        id={name}
+        name={name}
       />
     </div>
   );