diff --git a/package-lock.json b/package-lock.json
index 2758594..d2f5e7a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "website",
       "version": "0.0.0",
       "dependencies": {
+        "@tanstack/react-query": "^5.64.2",
         "antd": "^5.21.1",
         "axios": "^1.7.5",
         "formik": "^2.4.6",
@@ -1634,6 +1635,32 @@
         "win32"
       ]
     },
+    "node_modules/@tanstack/query-core": {
+      "version": "5.64.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.64.2.tgz",
+      "integrity": "sha512-hdO8SZpWXoADNTWXV9We8CwTkXU88OVWRBcsiFrk7xJQnhm6WRlweDzMD+uH+GnuieTBVSML6xFa17C2cNV8+g==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/react-query": {
+      "version": "5.64.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.64.2.tgz",
+      "integrity": "sha512-3pakNscZNm8KJkxmovvtZ4RaXLyiYYobwleTMvpIGUoKRa8j8VlrQKNl5W8VUEfVfZKkikvXVddLuWMbcSCA1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-core": "5.64.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": "^18 || ^19"
+      }
+    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -5764,6 +5791,19 @@
       "dev": true,
       "optional": true
     },
+    "@tanstack/query-core": {
+      "version": "5.64.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.64.2.tgz",
+      "integrity": "sha512-hdO8SZpWXoADNTWXV9We8CwTkXU88OVWRBcsiFrk7xJQnhm6WRlweDzMD+uH+GnuieTBVSML6xFa17C2cNV8+g=="
+    },
+    "@tanstack/react-query": {
+      "version": "5.64.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.64.2.tgz",
+      "integrity": "sha512-3pakNscZNm8KJkxmovvtZ4RaXLyiYYobwleTMvpIGUoKRa8j8VlrQKNl5W8VUEfVfZKkikvXVddLuWMbcSCA1Q==",
+      "requires": {
+        "@tanstack/query-core": "5.64.2"
+      }
+    },
     "@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
diff --git a/package.json b/package.json
index 1ca9aee..9f077b3 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@tanstack/react-query": "^5.64.2",
     "antd": "^5.21.1",
     "axios": "^1.7.5",
     "formik": "^2.4.6",
diff --git a/src/apis/view.ts b/src/apis/view.ts
new file mode 100644
index 0000000..12aae0b
--- /dev/null
+++ b/src/apis/view.ts
@@ -0,0 +1,13 @@
+import useAddMutation from "./helpers/useAddMutation";
+
+const API = {
+  GET: "",
+  ADD: "https://tracking.point-dev.net/api/view",
+  DELETE: "",
+  UPDATE: "",
+};
+
+const KEY = "view";
+
+
+export const useSendTopicName = () => useAddMutation(KEY, API.ADD);
diff --git a/src/main.tsx b/src/main.tsx
index e0ba81b..26d14ae 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,4 +1,6 @@
 import { createRoot } from 'react-dom/client';
-import App from './App.tsx';
 
-createRoot(document.getElementById('root')!).render(<App />);
+import App from './App.tsx';
+import QueryProvider from './lib/ReactQueryProvider.tsx';
+
+createRoot(document.getElementById('root')!).render(<QueryProvider><App /></QueryProvider>);
diff --git a/src/pages/Download/Download.tsx b/src/pages/Download/Download.tsx
index 5e5e9d9..65f10bf 100644
--- a/src/pages/Download/Download.tsx
+++ b/src/pages/Download/Download.tsx
@@ -6,9 +6,24 @@ import { Spin } from 'antd';
 import Layout from '../../components/layout/Layout';
 import { ExternalRedirect } from '../../utils/ExternalRedirect';
 import {  Links } from '../../../data.json';
+import { useLocation } from 'react-router-dom';
+import { useSendTopicName } from '../../apis/view';
 
 const Download = () => {
   const { DeviceType, setDeviceType }: any = useDetectDeviceType();
+  const location = useLocation();
+
+  const params = new URLSearchParams(location.search);
+  const src = params.get('src');
+  const {mutate,} = useSendTopicName()
+  useEffect(() =>{
+    mutate(
+      {
+        "topic_name": src,
+     "project_name": "zaker"
+     }
+    )
+  },[])
 
   useEffect(() => {
     setDeviceType(detectDeviceType());