From c36d84dbf93a13d1fd84778947c013c20ec46ac9 Mon Sep 17 00:00:00 2001
From: memoyil <2213635+memoyil@users.noreply.github.com>
Date: Fri, 25 Oct 2024 15:00:06 +0200
Subject: [PATCH] fix: Pcsx user settings not considered reset and not disabled
 on first click (#10874)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Issues:

If pcsx feature enabled and there is no user setting, disabling it not
make reset button appear.

Disabling the pcsx feature not work on first click and it has to be
clicked again

<!--
Before opening a pull request, please read the [contributing
guidelines](https://github.com/pancakeswap/pancake-frontend/blob/develop/CONTRIBUTING.md)
first
-->


<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on enhancing the `usePCSX` hook and related state
management in the `smartRouter` module by adding a reset functionality
and improving the handling of user preferences.

### Detailed summary
- Updated `usePCSX` to return a reset function along with state.
- Introduced `useCallback` for setting user preferences in `usePCSX`.
- Modified `useUserXEnable` to return a reset function.
- Enhanced `useRoutingSettingChanged` to include reset functionality for
routing settings.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your
question}`

<!-- end pr-codex -->
---
 apps/web/src/hooks/usePCSX.ts          | 13 +++++++++----
 apps/web/src/state/user/smartRouter.ts | 14 ++++++++++++--
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/apps/web/src/hooks/usePCSX.ts b/apps/web/src/hooks/usePCSX.ts
index 91f853e625182..1ef6a34f902d7 100644
--- a/apps/web/src/hooks/usePCSX.ts
+++ b/apps/web/src/hooks/usePCSX.ts
@@ -2,7 +2,7 @@ import { ChainId } from '@pancakeswap/chains'
 import { EXPERIMENTAL_FEATURES } from 'config/experimentalFeatures'
 import { SUPPORTED_CHAINS } from 'config/pcsx'
 import { useExperimentalFeatureEnabled } from 'hooks/useExperimentalFeatureEnabled'
-import { useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
 import { useUserXEnable } from 'state/user/smartRouter'
 
 export function usePCSXFeatureEnabled() {
@@ -11,10 +11,15 @@ export function usePCSXFeatureEnabled() {
 
 export const usePCSX = () => {
   const featureEnabled = usePCSXFeatureEnabled()
-  const [xEnabled, setX] = useUserXEnable()
+  const [xEnabled, setX, reset] = useUserXEnable()
   const enabled = Boolean(xEnabled ?? featureEnabled)
-
-  return [enabled, setX] as const
+  const setUserX = useCallback(
+    (updater: boolean | ((current: boolean) => boolean)) => {
+      setX(typeof updater === 'function' ? updater(enabled) : updater)
+    },
+    [enabled],
+  )
+  return [enabled, setUserX, featureEnabled, reset] as const
 }
 
 export function usePCSXEnabledOnChain(chainId?: ChainId) {
diff --git a/apps/web/src/state/user/smartRouter.ts b/apps/web/src/state/user/smartRouter.ts
index 90465fd1db335..6dfffb218711f 100644
--- a/apps/web/src/state/user/smartRouter.ts
+++ b/apps/web/src/state/user/smartRouter.ts
@@ -1,6 +1,9 @@
 import { userSingleHopAtom } from '@pancakeswap/utils/user'
 import { atom, useAtom, useAtomValue } from 'jotai'
+import { useResetAtom } from 'jotai/utils'
 import atomWithStorageWithErrorCatch from 'utils/atomWithStorageWithErrorCatch'
+import { usePCSX } from 'hooks/usePCSX'
+import { useCallback } from 'react'
 
 const userUseStableSwapAtom = atomWithStorageWithErrorCatch<boolean>('pcs:useStableSwap', true)
 const userUseV2SwapAtom = atomWithStorageWithErrorCatch<boolean>('pcs:useV2Swap', true)
@@ -9,7 +12,8 @@ const userUserSplitRouteAtom = atomWithStorageWithErrorCatch<boolean>('pcs:useSp
 const userUseXAtom = atomWithStorageWithErrorCatch<boolean | undefined>('pcs:useX', undefined)
 
 export function useUserXEnable() {
-  return useAtom(userUseXAtom)
+  const reset = useResetAtom(userUseXAtom)
+  return [...useAtom(userUseXAtom), reset] as const
 }
 
 export function useUserStableSwapEnable() {
@@ -56,5 +60,11 @@ const derivedRoutingSettingChangedAtom = atom(
 )
 
 export function useRoutingSettingChanged() {
-  return useAtom(derivedRoutingSettingChangedAtom)
+  const [enabled, _, featureEnabled, resetX] = usePCSX()
+  const [derivedRoutingSettingChanged, reset] = useAtom(derivedRoutingSettingChangedAtom)
+  const resetRoutingSettings = useCallback(() => {
+    reset()
+    resetX()
+  }, [reset, resetX])
+  return [derivedRoutingSettingChanged || enabled !== featureEnabled, resetRoutingSettings] as const
 }