refactor: modularize form fields into a separate component

2026-05-04 15:56:56 +00:00 · 2026-04-10 15:38:17 +05:30
parent 3898cb5726
commit 44b1ed5153
2 changed files with 105 additions and 53 deletions
@@ -0,0 +1,32 @@
+import type { UseFormRegisterReturn } from "react-hook-form";
+
+interface FormFieldProps {
+  label: string;
+  type?: string;
+  placeholder?: string;
+  registration: UseFormRegisterReturn;
+  error?: string;
+}
+
+export default function FormField({
+  label,
+  type = "text",
+  placeholder,
+  registration,
+  error,
+}: FormFieldProps) {
+  return (
+    <div className="form-control">
+      <label className="field-label font-display text-primary-content">{label}</label>
+      <input
+        {...registration}
+        type={type}
+        placeholder={placeholder}
+        className={`input input-bordered focus:input-primary ${
+          error ? "input-error" : ""
+        }`}
+      />
+      {error && <p className="field-error">{error}</p>}
+    </div>
+  );
+}