requested changes & edge cases

frontend/src/hooks/api/secrets/queries.tsx

@@ -80,6 +80,7 @@ export const mergePersonalSecrets = (rawSecrets: SecretV3Raw[]) => {
       comment: el.secretComment || "",
       reminderRepeatDays: el.secretReminderRepeatDays,
       reminderNote: el.secretReminderNote,
+      secretReminderRecipients: el.secretReminderRecipients,
       createdAt: el.createdAt,
       updatedAt: el.updatedAt,
       version: el.version,

frontend/src/hooks/api/secrets/types.ts

@@ -7,6 +7,14 @@ export enum SecretType {
   Personal = "personal"
 }
 
+export type SecretReminderRecipient = {
+  user: {
+    id: string;
+    username: string;
+    email: string;
+  };
+  id: string;
+};
 export type EncryptedSecret = {
   id: string;
   version: number;
@@ -56,6 +64,7 @@ export type SecretV3RawSanitized = {
   secretMetadata?: { key: string; value: string }[];
   isReminderEvent?: boolean;
   isRotatedSecret?: boolean;
+  secretReminderRecipients?: SecretReminderRecipient[];
   rotationId?: string;
 };
 
@@ -81,6 +90,7 @@ export type SecretV3Raw = {
   updatedAt: string;
   isRotatedSecret?: boolean;
   rotationId?: string;
+  secretReminderRecipients?: SecretReminderRecipient[];
 };
 
 export type SecretV3RawResponse = {

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

@@ -58,7 +58,6 @@ export const CreateReminderForm = ({
   const {
     register,
     control,
-    reset,
     setValue,
     handleSubmit,
     formState: { isSubmitting }
@@ -74,19 +73,10 @@ export const CreateReminderForm = ({
     onOpenChange(false, data);
   };
 
-  useEffect(() => {
-    if (isOpen) {
-      reset({
-        days: repeatDays || undefined,
-        note: note || ""
-      });
-    }
-  }, [isOpen]);
-
   useEffect(() => {
     // On initial load, filter the members to only include the recipients
     if (members.length) {
-      const filteredMembers = members.filter((m) => recipients?.includes(m.id));
+      const filteredMembers = members.filter((m) => recipients?.find((r) => r === m.user.id));
       setValue(
         "recipients",
         filteredMembers.map((m) => ({
@@ -95,7 +85,7 @@ export const CreateReminderForm = ({
         }))
       );
     }
-  }, [members, isOpen]);
+  }, [members, isOpen, recipients]);
 
   return (
     <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
@@ -122,6 +112,7 @@ export const CreateReminderForm = ({
                         onChange={(el) => setValue("days", parseInt(el.target.value, 10))}
                         type="number"
                         placeholder="31"
+                        defaultValue={repeatDays || undefined}
                         value={field.value || undefined}
                       />
                     </FormControl>
@@ -144,6 +135,7 @@ export const CreateReminderForm = ({
                 placeholder="Remember to rotate the AWS secret every month."
                 className="border border-mineshaft-600 text-sm"
                 rows={8}
+                defaultValue={note || ""}
                 reSize="none"
                 cols={30}
                 {...register("note")}

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

@@ -1,3 +1,4 @@
+import { useEffect } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { subject } from "@casl/ability";
 import { faCircleQuestion, faEye } from "@fortawesome/free-regular-svg-icons";
@@ -235,6 +236,16 @@ export const SecretDetailSidebar = ({
   const secretReminderRepeatDays = watch("reminderRepeatDays");
   const secretReminderNote = watch("reminderNote");
   const secretReminderRecipients = watch("reminderRecipients");
+  useEffect(() => {
+    setValue(
+      "reminderRecipients",
+      secret?.secretReminderRecipients?.map((el) => el.user.id),
+      {
+        shouldDirty: false
+      }
+    );
+  }, [secret?.secretReminderRecipients]);
+
   const getModifiedByIcon = (userType: string | undefined | null) => {
     switch (userType) {
       case ActorType.USER:

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

@@ -49,6 +49,8 @@ export const SecretListView = ({
   isProtectedBranch = false,
   importedBy
 }: Props) => {
+  console.log("secretssssss", secrets);
+
   const queryClient = useQueryClient();
   const { popUp, handlePopUpToggle, handlePopUpOpen, handlePopUpClose } = usePopUp([
     "deleteSecret",
@@ -184,6 +186,12 @@ export const SecretListView = ({
       const tagIds = tags?.map(({ id }) => id);
       const oldTagIds = (orgSecret?.tags || []).map(({ id }) => id);
       const isSameTags = JSON.stringify(tagIds) === JSON.stringify(oldTagIds);
+
+      const isSameRecipients =
+        !reminderRecipients?.some(
+          (newId) => !orgSecret.secretReminderRecipients?.find((oldId) => newId === oldId.user.id)
+        ) && reminderRecipients?.length === orgSecret.secretReminderRecipients?.length;
+
       const isSharedSecUnchanged =
         (
           [
@@ -196,7 +204,9 @@ export const SecretListView = ({
             "reminderRecipients",
             "secretMetadata"
           ] as const
-        ).every((el) => orgSecret[el] === modSecret[el]) && isSameTags;
+        ).every((el) => orgSecret[el] === modSecret[el]) &&
+        isSameTags &&
+        isSameRecipients;
 
       try {
         // personal secret change