🧹 Chore: cleanup sidebar draft effects and actions

Author: tyler-dane

packages/web/src/views/Calendar/components/Draft/sidebar/context/SidebarDraftProvider.tsx

@@ -1,11 +1,8 @@
 import React, { ReactNode } from "react";
-import { Categories_Event } from "@core/types/event.types";
-import { selectDraftCategory } from "@web/ducks/events/selectors/draft.selectors";
-import { useAppSelector } from "@web/store/store.hooks";
 import { DateCalcs } from "@web/views/Calendar/hooks/grid/useDateCalcs";
 import { Measurements_Grid } from "@web/views/Calendar/hooks/grid/useGridLayout";
-import { useDraftForm } from "../../hooks/state/useDraftForm";
 import { useSidebarActions } from "../hooks/useSidebarActions";
+import { useSidebarEffects } from "../hooks/useSidebarEffects";
 import { useSidebarState } from "../hooks/useSidebarState";
 import { SidebarDraftContext } from "./SidebarDraftContext";
 
@@ -19,23 +16,9 @@ export const SidebarDraftProvider = ({
   dateCalcs,
   measurements,
 }: Props) => {
-  const { setters, state: _state } = useSidebarState(measurements);
-  const actions = useSidebarActions(dateCalcs, _state, setters);
-
-  const _category = useAppSelector(selectDraftCategory);
-  const category = _category || Categories_Event.TIMED;
-  const formProps = useDraftForm(
-    category,
-    _state.isSomedayFormOpen,
-    actions.discard,
-    actions.reset,
-    setters.setIsSomedayFormOpen,
-  );
-
-  const state = {
-    ..._state,
-    formProps,
-  };
+  const { setters, state } = useSidebarState(measurements);
+  const actions = useSidebarActions(dateCalcs, state, setters);
+  useSidebarEffects(state, actions);
 
   return (
     <SidebarDraftContext.Provider value={{ state, setters, actions }}>

packages/web/src/views/Calendar/components/Draft/sidebar/hooks/useSidebarActions.ts

@@ -88,6 +88,10 @@ export const useSidebarActions = (
     }
   };
 
+  const closeForm = () => {
+    setIsSomedayFormOpen(false);
+  };
+
   // call this when enabling DND for drafts
   const convertSomedayDraftToTimed = (
     dropItem: DropResult_ReactDND,
@@ -417,6 +421,7 @@ export const useSidebarActions = (
 
   return {
     close,
+    closeForm,
     createDefaultSomeday,
     discard,
     onDraft,

packages/web/src/views/Calendar/components/Draft/sidebar/hooks/useSidebarEffects.ts

@@ -1,30 +1,37 @@
 import { useEffect } from "react";
-import {
-  selectIsDrafting,
-  selectIsDraftingExisting,
-  selectIsDraftingSomeday,
-} from "@web/ducks/events/selectors/draft.selectors";
+import { selectIsDNDing } from "@web/ducks/events/selectors/draft.selectors";
 import { useAppSelector } from "@web/store/store.hooks";
 import { Actions_Sidebar } from "./useSidebarActions";
+import { State_Sidebar } from "./useSidebarState";
 
-export const useSidebarEffects = (util: Actions_Sidebar) => {
-  const { resetLocalDraftStateIfNeeded, createDefaultSomeday } = util;
-
-  const isDrafting = useAppSelector(selectIsDrafting);
-  const isDraftingExisting = useAppSelector(selectIsDraftingExisting);
-  const isDraftingSomeday = useAppSelector(selectIsDraftingSomeday);
-
-  useEffect(() => {
-    const isSidebarStatePotentiallyStale = !isDraftingSomeday;
-    if (isSidebarStatePotentiallyStale) {
-      resetLocalDraftStateIfNeeded();
-    }
-  }, [isDraftingSomeday, resetLocalDraftStateIfNeeded]);
+export const useSidebarEffects = (
+  state: State_Sidebar,
+  actions: Actions_Sidebar,
+) => {
+  const isDNDing = useAppSelector(selectIsDNDing);
 
   useEffect(() => {
-    const shouldStartNew = isDrafting && !isDraftingExisting;
-    if (shouldStartNew) {
-      createDefaultSomeday();
+    if (isDNDing && state.isSomedayFormOpen) {
+      actions.closeForm();
     }
-  }, [isDraftingExisting, isDrafting, createDefaultSomeday]);
+  }, [isDNDing, state.isSomedayFormOpen, actions]);
 };
+//++ TODO delete
+//   const { resetLocalDraftStateIfNeeded, createDefaultSomeday } = actions;
+
+//   const isDrafting = useAppSelector(selectIsDrafting);
+//   const isDraftingExisting = useAppSelector(selectIsDraftingExisting);
+//   const isDraftingSomeday = useAppSelector(selectIsDraftingSomeday);
+// useEffect(() => {
+//   const isSidebarStatePotentiallyStale = !isDraftingSomeday;
+//   if (isSidebarStatePotentiallyStale) {
+//     resetLocalDraftStateIfNeeded();
+//   }
+// }, [isDraftingSomeday, resetLocalDraftStateIfNeeded]);
+
+// useEffect(() => {
+//   const shouldStartNew = isDrafting && !isDraftingExisting;
+//   if (shouldStartNew) {
+//     createDefaultSomeday();
+//   }
+// }, [isDraftingExisting, isDrafting, createDefaultSomeday]);

packages/web/src/views/Calendar/components/Sidebar/SomedayTab/WeekSection/SomedayEvents/SomedayEventContainer/SomedayEventContainer.tsx

@@ -81,7 +81,7 @@ export const SomedayEventContainer = ({
               <SomedayEventForm
                 event={event}
                 onClose={() => {
-                  setters.setIsSomedayFormOpen(false);
+                  actions.closeForm();
                   actions.close();
                 }}
                 onSubmit={onSubmit}