Merge pull request #3625 from Infisical/ENG-2795

fix secret rollback not tainting form

frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretDetailSidebar.tsx

@@ -95,7 +95,6 @@ export const SecretDetailSidebar = ({
   handleSecretShare
 }: Props) => {
   const {
-    register,
     control,
     watch,
     handleSubmit,
@@ -104,7 +103,8 @@ export const SecretDetailSidebar = ({
     formState: { isDirty, isSubmitting }
   } = useForm<TFormSchema>({
     resolver: zodResolver(formSchema),
-    values: secret
+    values: secret,
+    disabled: !secret
   });
 
   const { handlePopUpToggle, popUp, handlePopUpOpen } = usePopUp([
@@ -713,14 +713,25 @@ export const SecretDetailSidebar = ({
                   </FormControl>
                 </div>
               </div>
-              <FormControl label="Comments & Notes">
+              <Controller
+                control={control}
+                name="comment"
+                render={({ field, fieldState: { error } }) => (
+                  <FormControl
+                    label="Comments & Notes"
+                    isError={Boolean(error?.message)}
+                    errorText={error?.message}
+                    className="mb-0"
+                  >
                     <TextArea
                       className="border border-mineshaft-600 bg-bunker-800 text-sm"
-                  {...register("comment")}
                       readOnly={isReadOnly}
                       rows={5}
+                      {...field}
                     />
                   </FormControl>
+                )}
+              />
               <FormControl>
                 {secretReminderRepeatDays && secretReminderRepeatDays > 0 ? (
                   <div className="flex items-center justify-between px-2">
@@ -921,7 +932,9 @@ export const SecretDetailSidebar = ({
                                 variant="outline_bg"
                                 size="sm"
                                 className="h-8 w-8 rounded-md"
-                                onClick={() => setValue("value", secretValue)}
+                                onClick={() =>
+                                  setValue("value", secretValue, { shouldDirty: true })
+                                }
                               >
                                 <FontAwesomeIcon icon={faArrowRotateRight} />
                               </IconButton>