From 55f67212d52202ea5c2cc0a07b715f137598fe7f Mon Sep 17 00:00:00 2001
From: Danny Avila <danny@librechat.ai>
Date: Wed, 16 Jul 2025 00:46:05 -0400
Subject: [PATCH] feat: add react-hook-form dependency and update FormInput
 component to use its types

---
 package-lock.json                            | 18 ++++++++++++++++++
 packages/client/package.json                 |  1 +
 packages/client/src/components/FormInput.tsx |  8 ++++++--
 3 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e6d9a216ba..c8b9a08ecb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -49825,6 +49825,7 @@
         "@rollup/plugin-terser": "^0.4.4",
         "@types/react": "^18.0.0",
         "@types/react-dom": "^18.0.0",
+        "react-hook-form": "^7.60.0",
         "rimraf": "^5.0.1",
         "rollup": "^4.0.0",
         "rollup-plugin-peer-deps-external": "^2.2.4",
@@ -49939,6 +49940,23 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "packages/client/node_modules/react-hook-form": {
+      "version": "7.60.0",
+      "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.60.0.tgz",
+      "integrity": "sha512-SBrYOvMbDB7cV8ZfNpaiLcgjH/a1c7aK0lK+aNigpf4xWLO8q+o4tcvVurv3c4EOyzn/3dCsYt4GKD42VvJ/+A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/react-hook-form"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17 || ^18 || ^19"
+      }
+    },
     "packages/client/node_modules/rimraf": {
       "version": "5.0.10",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.10.tgz",
diff --git a/packages/client/package.json b/packages/client/package.json
index fdee7af2a5..ad759abb5f 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -72,6 +72,7 @@
     "@rollup/plugin-terser": "^0.4.4",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
+    "react-hook-form": "^7.60.0",
     "rimraf": "^5.0.1",
     "rollup": "^4.0.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
diff --git a/packages/client/src/components/FormInput.tsx b/packages/client/src/components/FormInput.tsx
index f09c71ffb3..2d6c55e348 100644
--- a/packages/client/src/components/FormInput.tsx
+++ b/packages/client/src/components/FormInput.tsx
@@ -1,9 +1,13 @@
 import React from 'react';
+import type { ControllerRenderProps, FieldValues, FieldPath } from 'react-hook-form';
 import { Label } from './Label';
 import { Input } from './Input';
 import { cn } from '~/utils';
 
-export default function FormInput({
+export default function FormInput<
+  TFieldValues extends FieldValues = FieldValues,
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+>({
   field,
   label,
   labelClass,
@@ -13,7 +17,7 @@ export default function FormInput({
   placeholder = '',
   type = 'string',
 }: {
-  field: any;
+  field: ControllerRenderProps<TFieldValues, TName>;
   label: string;
   labelClass?: string;
   inputClass?: string;