refactor: remove derived-state useEffect/useMemo patterns

packages/web/src/components/common/line-graph/LineGraph.tsx

@@ -184,7 +184,7 @@ const LineGraph: React.FC<LineGraphProps> = ({
   const [baseLineYAxis, setBaseLineYAxis] = useState<string[]>([]);
   const [baseLineNumberWidth, setBaseLineNumberWidth] = useState<number>(0);
   const { height: customHeight = 0, locationTooltip } = customData;
-  const baseLineCount = useMemo(() => 4, []);
+  const baseLineCount = 4;
   const theme = useTheme();
 
   const isFocus = useCallback(() => {

packages/web/src/hooks/common/use-referral.spec.tsx

@@ -0,0 +1,74 @@
+import { renderHook } from "@testing-library/react";
+
+let mockLeaderboardMyInfo: { referralPoint?: string; referrerAddress?: string } | undefined = undefined;
+
+jest.mock("@query/leaderboard", () => ({
+  useGetLeaderboardByAddress: () => ({
+    data: mockLeaderboardMyInfo,
+    refetch: jest.fn(),
+  }),
+}));
+
+jest.mock("@hooks/wallet/data/use-wallet", () => ({
+  useWallet: () => ({
+    account: { address: "g1testaddress" },
+  }),
+}));
+
+jest.mock("./use-custom-router", () => () => ({
+  getReferrerParameter: () => null,
+  pathname: "/",
+  query: {},
+  replace: jest.fn(),
+  push: jest.fn(),
+}));
+
+jest.mock("@utils/validation-utils", () => ({
+  isValidAddress: (addr: string) => addr.startsWith("g1"),
+}));
+
+jest.mock("@states/common", () => ({
+  GNOSWAP_REFERRAL_CODE: "GNOSWAP_REFERRAL",
+}));
+
+jest.mock("@constants/page.constant", () => ({
+  QUERY_PARAMETER: { REFERRER: "referrer" },
+}));
+
+import { useReferral } from "./use-referral";
+
+describe("useReferral — referralEarnedPoints derivation", () => {
+  beforeEach(() => {
+    mockLeaderboardMyInfo = undefined;
+  });
+
+  it("returns 0 when leaderboardMyInfo is undefined", () => {
+    mockLeaderboardMyInfo = undefined;
+    const { result } = renderHook(() => useReferral());
+    expect(result.current.referralEarnedPoints).toBe(0);
+  });
+
+  it("returns 0 when referralPoint is undefined", () => {
+    mockLeaderboardMyInfo = {};
+    const { result } = renderHook(() => useReferral());
+    expect(result.current.referralEarnedPoints).toBe(0);
+  });
+
+  it("returns parsed integer for valid numeric string", () => {
+    mockLeaderboardMyInfo = { referralPoint: "42" };
+    const { result } = renderHook(() => useReferral());
+    expect(result.current.referralEarnedPoints).toBe(42);
+  });
+
+  it("returns 0 for non-numeric string", () => {
+    mockLeaderboardMyInfo = { referralPoint: "abc" };
+    const { result } = renderHook(() => useReferral());
+    expect(result.current.referralEarnedPoints).toBe(0);
+  });
+
+  it("returns parsed integer ignoring decimals", () => {
+    mockLeaderboardMyInfo = { referralPoint: "123.456" };
+    const { result } = renderHook(() => useReferral());
+    expect(result.current.referralEarnedPoints).toBe(123);
+  });
+});

packages/web/src/hooks/common/use-referral.tsx

@@ -35,10 +35,9 @@ export const useReferral = () => {
   const [storedReferralAddress, setStoredReferralAddress] = React.useState<string | null>(null);
   const apiReferrerAddress = leaderboardMyInfo?.referrerAddress || "";
 
-  const referralEarnedPoints = React.useMemo(() => {
-    if (!leaderboardMyInfo?.referralPoint) return 0;
-    return parseInt(leaderboardMyInfo.referralPoint) || 0;
-  }, [leaderboardMyInfo?.referralPoint]);
+  const referralEarnedPoints = leaderboardMyInfo?.referralPoint
+    ? parseInt(leaderboardMyInfo.referralPoint) || 0
+    : 0;
 
   const generateReferralLink = React.useCallback((): string => {
     if (typeof window === "undefined" || !account?.address) return "";

packages/web/src/hooks/pool/data/use-decrease-handle.spec.tsx

@@ -0,0 +1,136 @@
+import { renderHook } from "@testing-library/react";
+import { Provider as JotaiProvider } from "jotai";
+import GnoswapThemeProvider from "@providers/gnoswap-theme-provider/GnoswapThemeProvider";
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <JotaiProvider>
+    <GnoswapThemeProvider>
+      {children}
+    </GnoswapThemeProvider>
+  </JotaiProvider>
+);
+
+const mockPositions: unknown[] = [];
+let mockSelectedPosition: unknown = null;
+
+jest.mock("jotai", () => {
+  const actual = jest.requireActual("jotai");
+  return {
+    ...actual,
+    useAtom: () => [mockSelectedPosition, jest.fn()],
+  };
+});
+
+jest.mock("@hooks/common/use-custom-router", () => () => ({
+  getPoolPath: () => "tokenA:tokenB:3000",
+  getPositionId: () => "1",
+  push: jest.fn(),
+  movePageWithPoolPath: jest.fn(),
+}));
+
+jest.mock("@hooks/pool/data/use-position-data", () => ({
+  usePositionData: () => ({
+    positions: mockPositions,
+    refetch: jest.fn(),
+  }),
+}));
+
+jest.mock("@hooks/token/data/use-gnot-wugnot", () => ({
+  useGnotToGnot: () => ({
+    getGnotPath: (token: { name: string; symbol: string; logoURI: string }) => token,
+  }),
+}));
+
+jest.mock("@hooks/token/data/use-token-amount-input", () => ({
+  useTokenAmountInput: () => ({
+    amount: "0",
+    balance: "0",
+    changeAmount: jest.fn(),
+  }),
+}));
+
+jest.mock("@hooks/token/data/use-token-data", () => ({
+  useTokenData: () => ({
+    tokenPrices: {},
+  }),
+}));
+
+jest.mock("@hooks/wallet/data/use-wallet", () => ({
+  useWallet: () => ({
+    connected: true,
+    account: { address: "g1test" },
+    loadingConnect: "done",
+  }),
+}));
+
+jest.mock("@utils/swap-utils", () => ({
+  tickToPrice: (tick: number) => tick,
+  tickToPriceStr: (tick: number) => `${tick}`,
+  isEndTickBy: () => false,
+  getDepositAmountsByLiquidity: () => ({ amountA: "0", amountB: "0" }),
+}));
+
+jest.mock("@utils/token-utils", () => ({
+  makeDisplayTokenAmount: () => 0,
+}));
+
+jest.mock("@utils/common", () => ({
+  checkGnotPath: (path: string) => path,
+}));
+
+jest.mock("@utils/new-number-utils", () => ({
+  formatOtherPrice: (val: number) => `$${val}`,
+}));
+
+jest.mock("@hooks/pool/data/use-select-pool", () => ({
+  useSelectPool: () => ({
+    depositRatio: null,
+    feeBoost: null,
+    compareToken: null,
+    selectedFullRange: false,
+  }),
+}));
+
+import { useDecreaseHandle } from "./use-decrease-handle";
+
+function makePosition(currentTick: number, tickLower: number, tickUpper: number, closed = false) {
+  return {
+    lpTokenId: 1,
+    tickLower,
+    tickUpper,
+    closed,
+    liquidity: "1000",
+    tokenABalance: "100",
+    tokenBBalance: "200",
+    unclaimedFeeAAmount: "0",
+    unclaimedFeeBAmount: "0",
+    rewards: [],
+    pool: {
+      currentTick,
+      fee: "3000",
+      tokenA: { path: "tokenA", name: "TokenA", symbol: "TA", logoURI: "", decimals: 6, priceID: "tokenA" },
+      tokenB: { path: "tokenB", name: "TokenB", symbol: "TB", logoURI: "", decimals: 6, priceID: "tokenB" },
+    },
+  };
+}
+
+describe("useDecreaseHandle — derived values", () => {
+  afterEach(() => {
+    mockSelectedPosition = null;
+    mockPositions.length = 0;
+  });
+
+  describe("loading", () => {
+    it("returns true when selectedPosition is null", () => {
+      mockSelectedPosition = null;
+      const { result } = renderHook(() => useDecreaseHandle(), { wrapper });
+      expect(result.current.loading).toBe(true);
+    });
+
+    it("returns false when selectedPosition exists", () => {
+      mockSelectedPosition = makePosition(100, 50, 150);
+      const { result } = renderHook(() => useDecreaseHandle(), { wrapper });
+      expect(result.current.loading).toBe(false);
+    });
+  });
+});

packages/web/src/hooks/pool/data/use-decrease-handle.tsx

@@ -64,9 +64,7 @@ export const useDecreaseHandle = () => {
     },
   });
 
-  const loading = useMemo(() => {
-    return !selectedPosition;
-  }, [selectedPosition]);
+  const loading = !selectedPosition;
 
   useEffect(() => {
     if (!selectedPosition && positions.length > 0 && positionId) {
@@ -79,7 +77,7 @@ export const useDecreaseHandle = () => {
 
       setSelectedPosition(position);
     }
-  }, [selectedPosition, positions, positionId, poolPath, selectedPosition]);
+  }, [selectedPosition, positions, positionId, poolPath]);
 
   const { connected, account, loadingConnect } = useWallet();
   const minPriceStr = useMemo(() => {
@@ -125,15 +123,10 @@ export const useDecreaseHandle = () => {
     };
   }, [selectedPosition?.pool]);
 
-  const inRange = useMemo(() => {
-    if (!selectedPosition) return false;
-    const { tickLower, tickUpper, pool } = selectedPosition;
-    const currentTick = pool.currentTick;
-    if (currentTick < tickLower || currentTick > tickUpper) {
-      return false;
-    }
-    return true;
-  }, [selectedPosition]);
+  const inRange = !selectedPosition
+    ? false
+    : selectedPosition.pool.currentTick >= selectedPosition.tickLower &&
+      selectedPosition.pool.currentTick <= selectedPosition.tickUpper;
 
   const rangeStatus = useMemo(() => {
     return selectedPosition?.closed