add auth endpoint to verify token

webapp/src/App.tsx

@@ -1,20 +1,22 @@
 // App.tsx
-import { HashRouter as Router, Route, Routes } from 'react-router-dom';
-import Dashboard from './pages/Dashboard';
-import LandingPage from './pages/LandingPage';
-import Server from './pages/Server';
+import { BrowserRouter, Route, Routes } from "react-router-dom";
+import Dashboard from "./pages/Dashboard";
+import LandingPage from "./pages/LandingPage";
+import Server from "./pages/Server";
+import AuthComponent from "./components/Auth";
 
 const App = () => {
   return (
-    <Router>
+    <BrowserRouter>
       <div>
         <Routes>
           <Route path="/" element={<LandingPage />} />
+          <Route path="/auth" element={<AuthComponent />} />
           <Route path="/dashboard" element={<Dashboard />} />
           <Route path="/server" element={<Server />} />
         </Routes>
       </div>
-    </Router>
+    </BrowserRouter>
   );
 };
 

webapp/src/components/Auth.tsx

@@ -0,0 +1,26 @@
+// AuthComponent.tsx
+import React, { useEffect } from "react";
+import { useSearchParams, redirect } from "react-router-dom";
+import { verifyToken } from "../modules/api";
+
+const AuthComponent = () => {
+  const verify = async (token: string | null) => {
+    const res = await verifyToken(token);
+    console.log(res.data);
+  };
+
+  useEffect(() => {
+    const [searchParams, setSearchParams] = useSearchParams();
+    const token = searchParams.get("token");
+    console.log("Token:", token);
+    verify(token);
+  }, []);
+
+  return (
+    <div>
+      <p>Authenticating...</p>
+    </div>
+  );
+};
+
+export default AuthComponent;

webapp/src/index.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import ReactDOM from "react-dom";
+import ReactDOM from "react-dom/client";
 import "./index.css";
 import App from "./App";
 
@@ -42,7 +42,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react";
 
 const wallets = [new PetraWallet()];
 
-ReactDOM.render(
+ReactDOM.createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
     {/* <WagmiConfig client={wagmiClient}>
       <RainbowKitProvider
@@ -63,6 +63,5 @@ ReactDOM.render(
     </AptosWalletAdapterProvider>
     {/* </RainbowKitProvider>
     </WagmiConfig> */}
-  </React.StrictMode>,
-  document.getElementById("root")
+  </React.StrictMode>
 );

webapp/src/modules/Utils.ts

@@ -1,4 +1,7 @@
 export function getBaseUrl(): string {
   const { protocol, host } = window.location;
   return `${protocol}//${host}`;
+}
+export function getGatewayURL(): string | undefined {
+  return process.env.GATEWAY_URL;
 }

webapp/src/modules/api.ts

@@ -1,9 +1,9 @@
 import axios, { AxiosRequestConfig, AxiosResponse } from 'axios';
-import { getBaseUrl } from './Utils';
+import { getBaseUrl, getGatewayURL } from './Utils';
 import Cookies from 'js-cookie';
 
 const baseURL = getBaseUrl()
-
+const gatewayURL = getGatewayURL()
 export interface UpdateClientPayload {
   id: string;
   name: string;
@@ -192,4 +192,18 @@ export const getToken = async (signature: string | string[] | undefined, challen
     throw error;
   }
   return response;
-};
+};
+
+export async function verifyToken(token: string | null) {
+  const url = `${gatewayURL}/api/v1.0/webapp/auth`
+  const response = await axios.get(url, {
+    headers: {
+      "Authorization": `Bearer ${Cookies.get("token")}`
+    }
+  });
+  if (response.status === 200) {
+    return response.data;
+  } else {
+    throw new Error(`Request failed with status: ${response.status}`);
+  }
+}