From aa1b57bbcd99da4c6d68c145f7c07ea7bd35c8dc Mon Sep 17 00:00:00 2001 From: Dhravya Date: Fri, 23 Feb 2024 16:04:49 -0700 Subject: chaos --- apps/extension/src/App.tsx | 75 +++++++++++++++++++++++++++++++++++++ apps/extension/src/assets/react.svg | 1 + apps/extension/src/background.ts | 9 +++++ apps/extension/src/content.tsx | 16 ++++++++ apps/extension/src/index.css | 3 ++ apps/extension/src/main.tsx | 10 +++++ apps/extension/src/types/zods.ts | 19 ++++++++++ apps/extension/src/vite-env.d.ts | 1 + 8 files changed, 134 insertions(+) create mode 100644 apps/extension/src/App.tsx create mode 100644 apps/extension/src/assets/react.svg create mode 100644 apps/extension/src/background.ts create mode 100644 apps/extension/src/content.tsx create mode 100644 apps/extension/src/index.css create mode 100644 apps/extension/src/main.tsx create mode 100644 apps/extension/src/types/zods.ts create mode 100644 apps/extension/src/vite-env.d.ts (limited to 'apps/extension/src') diff --git a/apps/extension/src/App.tsx b/apps/extension/src/App.tsx new file mode 100644 index 00000000..8824a7eb --- /dev/null +++ b/apps/extension/src/App.tsx @@ -0,0 +1,75 @@ +import { useEffect, useState } from 'react'; +import { z } from 'zod'; +import { userObj } from './types/zods'; + +function App() { + const [count] = useState(0); + const [userData, setUserData] = useState | null>( + null, + ); + + useEffect(() => { + const doStuff = () => { + chrome.runtime.sendMessage({ type: 'getJwt' }, (response) => { + const jwt = response.jwt; + const loginButton = document.getElementById('login'); + + if (loginButton) + if (jwt) { + fetch('http://localhost:3000/api/store', { + headers: { + Authorization: `Bearer ${jwt}`, + }, + }) + .then((res) => res.json()) + .then((data) => { + const user = userObj.safeParse(data); + if (user.success) { + setUserData(user.data); + } else { + console.error(user.error); + } + }); + loginButton.style.display = 'none'; + } else { + loginButton.style.display = 'block'; + loginButton.addEventListener('click', () => { + chrome.tabs.create({ + url: 'http://localhost:3000/api/auth/signin', + }); + }); + } + }); + }; + + doStuff(); + // Set event listerner for storage change + chrome.storage.onChanged.addListener(() => { + doStuff(); + }); + }, [count]); + + return ( +
+ +
+ {userData && ( +
+ +
+

{userData.data.user.name}

+

{userData.data.user.email}

+
+
+ )} +
+
+ ); +} + +export default App; diff --git a/apps/extension/src/assets/react.svg b/apps/extension/src/assets/react.svg new file mode 100644 index 00000000..6c87de9b --- /dev/null +++ b/apps/extension/src/assets/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/extension/src/background.ts b/apps/extension/src/background.ts new file mode 100644 index 00000000..e4d39edd --- /dev/null +++ b/apps/extension/src/background.ts @@ -0,0 +1,9 @@ +chrome.runtime.onMessage.addListener((request, _, sendResponse) => { + if (request.type === "getJwt") { + chrome.storage.local.get(["jwt"], ({ jwt }) => { + sendResponse({ jwt }); + }); + + return true; + } + }); \ No newline at end of file diff --git a/apps/extension/src/content.tsx b/apps/extension/src/content.tsx new file mode 100644 index 00000000..a086c365 --- /dev/null +++ b/apps/extension/src/content.tsx @@ -0,0 +1,16 @@ +window.addEventListener("message", (event) => { + if (event.source !== window) { + return; + } + const { jwt } = event.data; + if (jwt) { + chrome.storage.local.set({ jwt }, () => { + console.log("JWT saved to local storage", jwt); + }); + } else if (jwt === undefined) { + chrome.storage.local.remove("jwt", () => { + console.log("JWT removed from local storage"); + } + ) + } +}); \ No newline at end of file diff --git a/apps/extension/src/index.css b/apps/extension/src/index.css new file mode 100644 index 00000000..b5c61c95 --- /dev/null +++ b/apps/extension/src/index.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/apps/extension/src/main.tsx b/apps/extension/src/main.tsx new file mode 100644 index 00000000..3d7150da --- /dev/null +++ b/apps/extension/src/main.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import ReactDOM from 'react-dom/client' +import App from './App.tsx' +import './index.css' + +ReactDOM.createRoot(document.getElementById('root')!).render( + + + , +) diff --git a/apps/extension/src/types/zods.ts b/apps/extension/src/types/zods.ts new file mode 100644 index 00000000..b85e2684 --- /dev/null +++ b/apps/extension/src/types/zods.ts @@ -0,0 +1,19 @@ +import { z } from "zod" + +export const userObj = z.object({ + message: z.string(), + data: z.object({ + session: z.object({ + sessionToken: z.string(), + userId: z.string(), + expires: z.string() + }), + user: z.object({ + id: z.string(), + name: z.string(), + email: z.string(), + emailVerified: z.string().nullable(), + image: z.string().nullable() + }) + }) +}) \ No newline at end of file diff --git a/apps/extension/src/vite-env.d.ts b/apps/extension/src/vite-env.d.ts new file mode 100644 index 00000000..11f02fe2 --- /dev/null +++ b/apps/extension/src/vite-env.d.ts @@ -0,0 +1 @@ +/// -- cgit v1.2.3