Simplify undo logic

src/features/liveEvents/components/LiveEventFeedOptionsMenu.tsx

@@ -1,4 +1,3 @@
-import {useRef} from 'react'
 import {View} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
@@ -12,10 +11,7 @@ import * as Dialog from '#/components/Dialog'
 import {Loader} from '#/components/Loader'
 import * as toast from '#/components/Toast'
 import {Span, Text} from '#/components/Typography'
-import {
+import {useUpdateLiveEventPreferences} from '#/features/liveEvents/preferences'
-  type LiveEventPreferencesAction,
-  useUpdateLiveEventPreferences,
-} from '#/features/liveEvents/preferences'
 import {
   type LiveEventFeed,
   type LiveEventFeedMetricContext,
@@ -56,8 +52,6 @@ function Inner({
   metricContext: LiveEventFeedMetricContext
 }) {
   const {_} = useLingui()
-  const canUndo = useRef(true)
-  const undoAction = useRef<LiveEventPreferencesAction | null>(null)
   const {
     isPending,
     mutate: update,
@@ -66,19 +60,19 @@ function Inner({
   } = useUpdateLiveEventPreferences({
     feed,
     metricContext,
-    onSuccess() {
+    onUpdateSuccess({undoAction}) {
       toast.show(
         <toast.Outer>
           <toast.Icon />
           <toast.Text>
             <Trans>Your live event preferences have been updated.</Trans>
           </toast.Text>
-          {canUndo.current && undoAction.current && (
+          {undoAction && (
             <toast.Action
               label={_(msg`Undo`)}
               onPress={() => {
-                if (undoAction.current) {
+                if (undoAction) {
-                  update(undoAction.current)
+                  update(undoAction)
                 }
               }}>
               <Trans>Undo</Trans>
@@ -91,8 +85,7 @@ function Inner({
       )
 
       // must protect to avoid closing an already closed dialog
-      if (canUndo.current) {
+      if (undoAction) {
-        canUndo.current = false
         control.close()
       }
     },
@@ -133,7 +126,6 @@ function Inner({
           color="primary_subtle"
           onPress={() => {
             update({type: 'hideFeed', id: feed.id})
-            undoAction.current = {type: 'unhideFeed', id: feed.id}
           }}>
           <ButtonText>
             <Trans>Hide this event</Trans>
@@ -146,7 +138,6 @@ function Inner({
           color="secondary"
           onPress={() => {
             update({type: 'toggleHideAllFeeds'})
-            undoAction.current = {type: 'toggleHideAllFeeds'}
           }}>
           <ButtonText>
             <Trans>Hide all events</Trans>

src/features/liveEvents/preferences.ts

@@ -17,7 +17,12 @@ import {
 
 export type LiveEventPreferencesAction = Parameters<
   Agent['updateLiveEventPreferences']
->[0]
+>[0] & {
+  /**
+   * Flag that is internal to this hook, do not set when updating prefs
+   */
+  __canUndo?: boolean
+}
 
 export function useLiveEventPreferences() {
   const query = usePreferencesQuery()
@@ -54,8 +59,9 @@ function useWebOnlyDebugLiveEventPreferences() {
 export function useUpdateLiveEventPreferences(props: {
   feed?: LiveEventFeed
   metricContext: LiveEventFeedMetricContext
-  onSuccess?: () => void
+  onUpdateSuccess?: (props: {
-  onError?: (error: Error) => void
+    undoAction: LiveEventPreferencesAction | null
+  }) => void
 }) {
   const queryClient = useQueryClient()
   const agent = useAgent()
@@ -63,10 +69,32 @@ export function useUpdateLiveEventPreferences(props: {
   return useMutation<
     AppBskyActorDefs.LiveEventPreferences,
     Error,
-    LiveEventPreferencesAction
+    LiveEventPreferencesAction,
+    {undoAction: LiveEventPreferencesAction | null}
   >({
-    onError: props?.onError,
+    onSettled(data, error, variables) {
-    onSuccess: props?.onSuccess,
+      // If __canUndo is not explicitly set to false, we allow undo
+      const canUndo = variables.__canUndo === undefined ? true : false
+      let undoAction: LiveEventPreferencesAction | null = null
+
+      switch (variables.type) {
+        case 'hideFeed':
+          undoAction = {type: 'unhideFeed', id: variables.id, __canUndo: false}
+          break
+        case 'unhideFeed':
+          undoAction = {type: 'hideFeed', id: variables.id, __canUndo: false}
+          break
+        case 'toggleHideAllFeeds':
+          undoAction = {type: 'toggleHideAllFeeds', __canUndo: false}
+          break
+      }
+
+      if (data && !error) {
+        props?.onUpdateSuccess?.({
+          undoAction: canUndo ? undoAction : null,
+        })
+      }
+    },
     mutationFn: async action => {
       const updated = await agent.updateLiveEventPreferences(action)