[GSW-624] feat: use react query commonly

README.md

@@ -1,4 +1,4 @@
-# Gnoswap Interface
+# Gnoswap Interface 
 Welcome to the open source interface for Gnoswap, the first decentralized exchange (DEX) powered by Gnoland, designed to simplify concentrated liquidity experience and increase capital efficiency for traders.
 
 _Note: Gnoswap is in active development and not yet in production, and we welcome your contributions! Please check our [contribution guidelines](https://github.com/gnoswap-labs/gnoswap-interface#contributing--support) and the [latest release](https://github.com/gnoswap-labs/gnoswap-interface/releases) to see the current development status._

packages/web/src/hooks/common/useForceRefetchQuery.tsx

@@ -0,0 +1,7 @@
+import { useQueryClient } from "@tanstack/react-query";
+
+export const useForceRefetchQuery = () => {
+  const client = useQueryClient();
+
+  return client.invalidateQueries.bind(client);
+};

packages/web/src/react-query/token/index.ts

@@ -0,0 +1,2 @@
+export * from "./types";
+export * from "./queries";

packages/web/src/react-query/token/queries.ts

@@ -0,0 +1,28 @@
+import { TokenListResponse, TokenPriceListResponse } from "@repositories/token";
+import { UseQueryOptions, useQuery } from "@tanstack/react-query";
+import { useGnoswapContext } from "@hooks/common/use-gnoswap-context";
+import { QUERY_KEY } from "./types";
+
+export const useGetTokensList = (
+  options?: UseQueryOptions<TokenListResponse, Error>
+) => {
+  const { tokenRepository } = useGnoswapContext();
+
+  return useQuery<TokenListResponse, Error>({
+    queryKey: [QUERY_KEY.tokens],
+    queryFn: () => tokenRepository.getTokens(),
+    enabled: false,
+    ...options,
+  });
+};
+
+export const useGetTokenPrices = (
+  options?: UseQueryOptions<TokenPriceListResponse, Error>
+) => {
+  const { tokenRepository } = useGnoswapContext();
+  return useQuery<TokenPriceListResponse, Error>({
+    queryKey: [QUERY_KEY.tokenPrices],
+    queryFn: () => tokenRepository.getTokenPrices(),
+    ...options,
+  });
+};

packages/web/src/react-query/token/types.ts

@@ -0,0 +1,7 @@
+export interface IExampleTypeRequest {}
+export interface IExampleTypeResponse {}
+
+export enum QUERY_KEY {
+  tokens = "tokens",
+  tokenPrices = "token_prices",
+}