refactor(web): remove unused isEventDirty logic and related props from event forms

Author: tyler-dane

packages/web/src/views/Calendar/components/Draft/grid/GridDraft.tsx

@@ -63,11 +63,6 @@ export const GridDraft: FC<Props> = ({ measurements, weekProps }) => {
     handleDrag,
   );
 
-  const formDirty = useMemo(
-    () => (draft ? actions.isEventDirty(draft) : false),
-    [draft, actions.isEventDirty],
-  );
-
   if (!draft) return null;
 
   return (
@@ -115,7 +110,6 @@ export const GridDraft: FC<Props> = ({ measurements, weekProps }) => {
                 onConvert={onConvert}
                 onDelete={onDelete}
                 onDuplicate={duplicateEvent}
-                disableSaveBtn={!formDirty}
                 onSubmit={onSubmit}
                 setEvent={setDraft}
               />

packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.test.ts

@@ -15,6 +15,7 @@ import {
 import { devAlert } from "@core/util/app.util";
 import dayjs, { Dayjs } from "@core/util/date/dayjs";
 import { getUserId } from "@web/auth/auth.util";
+import { isEventDirty } from "@web/common/parsers/event.parser";
 import { PartialMouseEvent } from "@web/common/types/util.types";
 import {
   Schema_GridEvent,
@@ -155,33 +156,6 @@ export const useDraftActions = (
     [reduxDraft, isRecurrence],
   );
 
-  const isEventDirty = useCallback(
-    (currentDraft: Schema_WebEvent): boolean => {
-      if (!reduxDraft) return true; // New event is always dirty
-
-      // Compare relevant fields that can change in the form
-      const fieldsToCompare = [
-        "title",
-        "description",
-        "startDate",
-        "endDate",
-        "priority",
-        "recurrence",
-      ] as const;
-
-      return fieldsToCompare.some((field) => {
-        const current = currentDraft[field];
-        const original = reduxDraft[field];
-        const recurrence = field === "recurrence";
-
-        return recurrence
-          ? isRecurrenceChanged(currentDraft)
-          : current !== original;
-      });
-    },
-    [reduxDraft, isRecurrenceChanged],
-  );
-
   const closeForm = useCallback(() => {
     setIsFormOpen(false);
   }, [setIsFormOpen]);
@@ -262,24 +236,44 @@ export const useDraftActions = (
     setIsFormOpen(true);
   }, [setIsFormOpen]);
 
+  const determineSubmitAction = useCallback(
+    (draft: Schema_WebEvent) => {
+      const isExisting = draft._id;
+      const isOptimistic = draft._id?.startsWith(ID_OPTIMISTIC_PREFIX);
+      if (isExisting && !isOptimistic) {
+        if (isFormOpenBeforeDragging) {
+          openForm();
+          return "OPEN_FORM";
+        }
+        const isSame = !isEventDirty(draft, reduxDraft);
+        if (isSame) {
+          // no need to make HTTP request
+          discard();
+          return "DISCARD";
+        }
+      }
+      return "SUBMIT";
+    },
+    [reduxDraft, isFormOpenBeforeDragging, openForm, discard],
+  );
+
   const submit = useCallback(
     async (
       draft: Schema_GridEvent,
       applyTo: RecurringEventUpdateScope = RecurringEventUpdateScope.THIS_EVENT,
     ) => {
-      // For new events, skip the dirty check and allow saving blank events
-      const isNewEvent =
-        !draft._id || draft._id.startsWith(ID_OPTIMISTIC_PREFIX);
-
-      // Check if the event has actually changed (skip for new events)
-      if (!isNewEvent && !isEventDirty(draft)) {
-        // No changes detected, just close the form without making HTTP request
-        if (isFormOpenBeforeDragging) {
+      const action = determineSubmitAction(draft);
+      switch (action) {
+        case "OPEN_FORM":
           openForm();
-        } else {
+          return;
+        case "DISCARD":
           discard();
-        }
-        return;
+          return;
+        case "SUBMIT":
+        default:
+          // Continue with the submit logic below
+          break;
       }
 
       const userId = await getUserId();
@@ -293,8 +287,9 @@ export const useDraftActions = (
       }
 
       const { startOfView, endOfView } = weekProps.component;
+      const isExisting = draft._id;
 
-      if (!isNewEvent) {
+      if (isExisting) {
         const isDateWithinView = (date: string) =>
           dayjs(date).isBetween(startOfView, endOfView, null, "[]");
 
@@ -344,7 +339,6 @@ export const useDraftActions = (
       }
     },
     [
-      isEventDirty,
       isFormOpenBeforeDragging,
       weekProps,
       currentWeekEvents,
@@ -631,7 +625,6 @@ export const useDraftActions = (
     openForm,
     reset,
     resize,
-    isEventDirty,
     isInstance,
     isRecurrence,
     isRecurrenceChanged,

packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.ts

@@ -9,7 +9,7 @@ export const useDraftConfirmation = ({
 }: Omit<ReturnType<typeof useDraftContext>, "setters" | "confirmation">) => {
   const { discard, deleteEvent, submit } = actions;
   const { isRecurrenceChanged } = actions;
-  const { isInstance, isRecurrence, isEventDirty } = actions;
+  const { isInstance, isRecurrence } = actions;
   const { draft } = state;
 
   const recurrenceChanged = useMemo(
@@ -45,9 +45,6 @@ export const useDraftConfirmation = ({
       const isRecurringEvent = isRecurrence();
       const instanceEvent = isInstance();
       const toStandAlone = instanceEvent && rule === null;
-      const dirty = isEventDirty(_draft);
-
-      if (!dirty) return discard();
 
       if (!toStandAlone && isRecurringEvent) {
         setFinalDraft(_draft);
@@ -69,7 +66,6 @@ export const useDraftConfirmation = ({
       submit,
       setRecurrenceUpdateScopeDialogOpen,
       setFinalDraft,
-      isEventDirty,
       isRecurrence,
       isInstance,
       discard,

packages/web/src/views/Calendar/components/Draft/hooks/state/useDraftConfirmation.ts

@@ -45,7 +45,6 @@ export const EventForm: React.FC<FormProps> = ({
   onSubmit,
   onDuplicate,
   setEvent,
-  disableSaveBtn,
   ...props
 }) => {
   const { title } = event || {};
@@ -350,7 +349,6 @@ export const EventForm: React.FC<FormProps> = ({
       />
 
       <SaveSection
-        disableSaveBtn={disableSaveBtn}
         priority={priority}
         onSubmit={onSubmitForm}
         onCancel={onClose}

packages/web/src/views/Forms/EventForm/EventForm.tsx

@@ -89,16 +89,6 @@ describe("SaveSection", () => {
       expect(mockOnCancel).toHaveBeenCalledTimes(1);
     });
 
-    it("does not call onSubmit when save button is disabled and clicked", async () => {
-      render(<SaveSection onSubmit={mockOnSubmit} disableSaveBtn={true} />);
-
-      const saveButton = screen.getByRole("tab", { name: "Save" });
-      // Use fireEvent instead of userEvent for disabled elements
-      fireEvent.click(saveButton);
-
-      expect(mockOnSubmit).not.toHaveBeenCalled();
-    });
-
     it("handles keyboard navigation with tabIndex", () => {
       render(<SaveSection onSubmit={mockOnSubmit} onCancel={mockOnCancel} />);
 

packages/web/src/views/Forms/EventForm/SaveSection/SaveSection.test.tsx

@@ -9,7 +9,6 @@ import { StyledSubmitRow } from "../styled";
 interface Props {
   saveText?: string;
   cancelText?: string;
-  disableSaveBtn?: boolean;
   onSubmit: () => void;
   onCancel?: () => void;
   priority?: Priority;
@@ -19,14 +18,10 @@ export const SaveSection: React.FC<Props> = ({
   saveText = "Save",
   cancelText = "Cancel",
   onSubmit: _onSubmit,
-  disableSaveBtn,
   onCancel,
   priority,
 }) => {
-  const onSave = useCallback(
-    () => (disableSaveBtn ? null : _onSubmit()),
-    [disableSaveBtn, _onSubmit],
-  );
+  const onSave = useCallback(() => _onSubmit(), [_onSubmit]);
 
   return (
     <StyledSubmitRow>
@@ -54,7 +49,6 @@ export const SaveSection: React.FC<Props> = ({
         <StyledSaveBtn
           minWidth={110}
           priority={priority!}
-          disabled={disableSaveBtn}
           role="tab"
           tabIndex={0}
           aria-keyshortcuts="Meta+Enter"