[WIP] Fix Text Color and Letter Case pickers dismissal

src/redux-middleware/closeDropdownsWhenCursorNull.ts

@@ -0,0 +1,22 @@
+import { ThunkMiddleware } from 'redux-thunk'
+import State from '../@types/State'
+import { toggleDropdownActionCreator as toggleDropdown } from '../actions/toggleDropdown'
+
+/** A middleware that closes any open toolbar dropdowns (e.g. Text Color, Letter Case) when the cursor is set to null. This handles cases where cursor becomes null without going through setCursor, such as when the last thought is deleted. */
+const closeDropdownsWhenCursorNull: ThunkMiddleware<State> = ({ getState, dispatch }) => {
+  return next => action => {
+    const prevCursor = getState().cursor
+
+    next(action)
+
+    const state = getState()
+
+    // Close all open dropdowns when cursor transitions from non-null to null.
+    // setCursor already handles this for direct cursor navigation, but other reducers (e.g. deleteThought) may set cursor to null directly.
+    if (prevCursor !== null && state.cursor === null) {
+      dispatch(toggleDropdown())
+    }
+  }
+}
+
+export default closeDropdownsWhenCursorNull

src/stores/app.ts

@@ -12,6 +12,7 @@ import undoRedoEnhancer from '../redux-enhancers/undoRedoEnhancer'
 import updateJumpHistory from '../redux-enhancers/updateJumpHistoryEnhancer'
 import validateStateEnhancer from '../redux-enhancers/validateStateEnhancer'
 import clearSelection from '../redux-middleware/clearSelection'
+import closeDropdownsWhenCursorNull from '../redux-middleware/closeDropdownsWhenCursorNull'
 import doNotDispatchReducer from '../redux-middleware/doNotDispatchReducer'
 import freeThoughts from '../redux-middleware/freeThoughts'
 import loggerMiddleware from '../redux-middleware/loggerMiddleware'
@@ -43,6 +44,7 @@ const middlewareEnhancer = applyMiddleware(
   freeThoughts,
   loggerMiddleware,
   multicursorAlertMiddleware,
+  closeDropdownsWhenCursorNull,
 )
 
 // only validate Redux state in dev and test environments