Make login page interact with backend (#16)

* Added appwrite package

* Access appwrite config from env

* Added logging service

* Added appwrite in _app

* Added network later

* Added post request in _app

* Added react toast

* Added login api

* Added toast and oauth 2 handler

* Updated _app.js

package.json

@@ -9,12 +9,14 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "appwrite": "^11.0.0",
     "eslint": "8.42.0",
     "eslint-config-next": "13.4.5",
     "next": "13.4.5",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-icons": "^4.10.1",
+    "react-toastify": "^9.1.3",
     "typewriter-effect": "^2.20.1"
   }
 }

src/pages/_app.js

@@ -1,11 +1,68 @@
 import '@/styles/globals.css'
 import Header from "@/component/header";
 import Footer from "@/component/footer";
+import {useEffect, useState} from "react";
+import {logError, logMessage} from "@/service/logging/logging";
+import {Account, Client} from "appwrite";
+import {postRequest} from "@/service/network/network";
+import 'react-toastify/dist/ReactToastify.css';
+import {ToastContainer} from "react-toastify";
 
 export default function App({ Component, pageProps }) {
+  const appwrite_endpoint = process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT;
+  const appwrite_project = process.env.NEXT_PUBLIC_APPWRITE_PROJECT_ID;
+  const application_url = process.env.NEXT_PUBLIC_APPLICATION_URL;
+
+  const [details, setDetails] = useState({
+    account: null,
+    token: null
+  })
+  logMessage(details)
+
+  useEffect(()=>{
+    generateToken().then().catch(logError);
+    setInterval(generateToken, 1000*60*10);
+  }, [])
+
   return <>
-    <Header/>
-    <Component {...pageProps} />
-    <Footer/>
+    <Header token={details.token} />
+    <Component {...pageProps} token={details.token} account={details.account} application_url={application_url} />
+    <Footer />
+    <ToastContainer />
   </>
-}
+
+  async function generateToken() {
+
+    const client = new Client()
+    client.setEndpoint(appwrite_endpoint)
+    client.setProject(appwrite_project)
+
+    const account = new Account(client)
+    var token = null
+
+    try {
+      const response = await account.createJWT();
+      const jwt = response.jwt;
+
+      const result = await postRequest(
+          '/api/login',
+          {
+            jwt: jwt
+          },
+          {
+            "Content-Type": "application/json"
+          },
+          false
+      )
+
+      token = result.data
+    }
+    catch (error) {
+      logError(error)
+    }
+    setDetails({
+      account: account,
+      token: token
+    })
+  }
+}

src/pages/api/login.js

@@ -0,0 +1,23 @@
+import {postRequest} from "@/service/network/network";
+
+export default async function handler(req, res) {
+    if (req.method === "POST") {
+        try {
+            const response = await postRequest(
+                `${process.env.BACKEND_URL}/auth/login`,
+                req.body.jwt,
+                {
+                    "Content-Type": "text/plain"
+                },
+                false
+            );
+            res.status(response.status).json(response.data);
+        }
+        catch (_) {
+            res.status(404).json({message: "Auth not found"})
+        }
+    }
+    else {
+        res.status(404).json({message: "Not found"})
+    }
+}