apply stashed change before merge bradley

src/components/CameraSettings/CameraSettingFields.tsx

@@ -16,15 +16,20 @@ const CameraSettingFields = () => {
 
   const validateValues = (values: CameraSettingValues) => {
     const errors: CameraSettingErrorValues = {};
+    // if (Object.keys(errors).length === 0) {
+    //   toast.error("Please fill in required fields");
+    // }
     if (!values.friendlyName) errors.friendlyName = "Required";
     if (!values.cameraAddress) errors.cameraAddress = "Required";
     if (!values.userName) errors.userName = "Required";
     if (!values.password) errors.password = "Required";
+
     return errors;
   };
 
   const handleSubmit = (values: CameraSettingValues) => {
     // post values to endpoint
+    console.log(values);
     toast("Settings Saved");
   };
 
@@ -35,10 +40,10 @@ const CameraSettingFields = () => {
       validate={validateValues}
       validateOnChange={false}
     >
-      {({ errors, touched, setFieldValue }) => (
+      {({ errors, touched }) => (
         <Form className="flex flex-col space-y-4 p-2">
           <div className="flex flex-col space-y-2 relative">
-            <label htmlFor="friendlyName">Friendly Name</label>
+            <label htmlFor="friendlyName">Name</label>
             {touched.friendlyName && errors.friendlyName && (
               <small className="absolute right-0 top-0 text-red-500">
                 {errors.friendlyName}
@@ -53,24 +58,6 @@ const CameraSettingFields = () => {
             />
           </div>
 
-          <div className="flex flex-col space-y-2 relative">
-            <label htmlFor="setupCamera">Setup Camera</label>
-            <Field
-              as="select"
-              id="setupCamera"
-              name="setupCamera"
-              className="p-2 border border-gray-400 rounded-lg text-white bg-[#253445]"
-              onChange={(e: React.ChangeEvent<HTMLSelectElement>) =>
-                setFieldValue("setupCamera", parseInt(e.target.value, 10))
-              }
-            >
-              <option value={1}>1</option>
-              <option value={2}>2</option>
-              <option value={3}>3</option>
-              <option value={4}>4</option>
-            </Field>
-          </div>
-
           <div className="flex flex-col space-y-2 relative">
             <label htmlFor="cameraAddress">Camera Address</label>
             {touched.cameraAddress && errors.cameraAddress && (
@@ -83,8 +70,7 @@ const CameraSettingFields = () => {
               name="cameraAddress"
               type="text"
               className="p-2 border border-gray-400 rounded-lg"
-              placeholder="123, London Road..."
-              autoComplete="street-address"
+              placeholder="RTSP://..."
             />
           </div>