add google analytics

i-mader · Jun 9, 2024 · 6afe910 · 6afe910
1 parent 2602ae8
commit 6afe910
Show file tree

Hide file tree

Showing 8 changed files with 152 additions and 1 deletion.
diff --git a/.env b/.env
@@ -0,0 +1,2 @@
+REACT_APP_API_URL=https://i-mader.tech
+NEXT_PUBLIC_MEASUREMENT_ID=G-3FNP2LS55J
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "@ant-design/nextjs-registry": "^1.0.0",
     "antd": "^5.17.4",
+    "axios": "^1.7.2",
     "next": "14.2.3",
     "pm2": "^5.4.0",
     "react": "^18",

diff --git a/src/GoogleAnalytics.tsx b/src/GoogleAnalytics.tsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import Script from 'next/script';
+
+const GoogleAnalytics = () => {
+  return (
+    <>
+      <Script
+        strategy='lazyOnload'
+        src={`https://www.googletagmanager.com/gtag/js?id=${process.env.NEXT_PUBLIC_MEASUREMENT_ID}`}
+      />
+
+      <Script id='' strategy='lazyOnload'>
+        {`
+              window.dataLayer = window.dataLayer || [];
+              function gtag(){dataLayer.push(arguments);}
+              gtag('js', new Date());
+              gtag('config', '${process.env.NEXT_PUBLIC_MEASUREMENT_ID}', {
+              page_path: window.location.pathname,
+              });
+          `}
+      </Script>
+    </>
+  );
+};
+
+export default GoogleAnalytics;
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -3,6 +3,7 @@ import { Inter } from "next/font/google";
 import "./globals.css";
 import { AntdRegistry } from "@ant-design/nextjs-registry";
 import LayoutHome from "@/components/wrapper/layout-home";
+import GoogleAnalytics from "@/GoogleAnalytics";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -29,7 +30,8 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
-      <body className={inter.className}>
+      <body>
+      <GoogleAnalytics />
         <AntdRegistry>
           <LayoutHome>{children}</LayoutHome>
         </AntdRegistry>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -1,3 +1,4 @@
+import Script from 'next/script'
 import Hero from "./ui/section/hero";
 import WhyChooseUs from "./ui/section/why-choose-us";
 import Blog from "./ui/section/blog";

diff --git a/src/hooks/useContact.ts b/src/hooks/useContact.ts
@@ -0,0 +1,52 @@
+import axios from 'axios';
+import useSWR from 'swr';
+// import { Task } from '../types/task';
+
+export const useTasks = (callback?: Function) => {
+  const api = axios.create({
+    baseURL: process.env.REACT_APP_API_URL,
+  });
+
+  const fetcher = (url: string) => api.get(url).then((res) => res.data);
+
+//   const { data, error, mutate } = useSWR<Task[], Error>('/tasks', fetcher, {
+//     onSuccess: (data, key) => {
+//       if (callback) callback();
+//     },
+//   });
+
+//   const createTask = async (task: Task) => {
+//     if (!data) {
+//       return false;
+//     }
+//     const result = await api.post<Task>('//api/v1/contact-us/add', task);
+//     mutate([...data, result.data]);
+//   };
+
+//   const updateTask = async (task: Task) => {
+//     if (!data) {
+//       return false;
+//     }
+//     const { data: updatedTask } = await api.patch<Task>(
+//       `/tasks/${task.id}`,
+//       task
+//     );
+//     mutate(
+//       data.map(
+//         (task) => (task.id === updatedTask.id ? updatedTask : task),
+//         false
+//       )
+//     );
+//   };
+
+//   const removeTask = async (task: Task) => {
+//     if (!data) {
+//       return false;
+//     }
+//     await api.delete<Task>(`/tasks/${task.id}`);
+//     mutate(data.filter((item) => item.id === task.id, false));
+//   };
+
+//   return { data, error, createTask, updateTask, removeTask };
+//   return { data, error, createTask };
+};
diff --git a/src/types/contact-us.ts b/src/types/contact-us.ts
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		REACT_APP_API_URL=https://i-mader.tech
		NEXT_PUBLIC_MEASUREMENT_ID=G-3FNP2LS55J