+options barebones

kyleskimo · Jan 16, 2023 · d50ae83 · d50ae83
1 parent d49d713
commit d50ae83
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 4 deletions.
diff --git a/build.mjs b/build.mjs
@@ -15,7 +15,11 @@ async function deleteBuildDir() {
 
 async function runEsbuild() {
   await esbuild.build({
-    entryPoints: ["src/content-scripts/mainUI.tsx", "src/background/bg.ts"],
+    entryPoints: [
+      "src/content-scripts/mainUI.tsx",
+      "src/background/bg.ts",
+      "src/options/options.tsx",
+    ],
     outdir: buildDir,
     bundle: true,
     minify: minify,
@@ -40,11 +44,16 @@ async function runEsbuild() {
         target: buildDir,
         copyWithFolder: false,
       }),
+      copyStaticFilesPlugin({
+        source: ["src/options/options.html"],
+        target: buildDir + "/options",
+        copyWithFolder: false,
+      }),
       copyStaticFilesPlugin({
         source: ["src/_locales/"],
         target: buildDir,
         copyWithFolder: true,
-      })
+      }),
     ],
   });
 }

diff --git a/src/manifest.json b/src/manifest.json
@@ -22,6 +22,11 @@
       "css": ["content-scripts/mainUI.css"]
     }
   ],
+  "options_ui": {
+    "page": "options/options.html",
+    "open_in_tab": true,
+    "css": ["options/options.css"]
+  },
   "web_accessible_resources": [
     {
       "resources": [

diff --git a/src/manifest.v2.json b/src/manifest.v2.json
@@ -23,15 +23,19 @@
       "id": "{b13d04e3-41db-48b3-842c-8079df93c7ad}"
     }
   },
+  "options_ui": {
+    "page": "options/options.html",
+    "open_in_tab": true,
+    "chrome_style": true
+  },
   "content_scripts": [
     {
       "matches": ["https://chat.openai.com/*"],
       "js": ["content-scripts/mainUI.js"],
       "css": ["content-scripts/mainUI.css"]
     }
   ],
-  "web_accessible_resources":
-  [
+  "web_accessible_resources": [
     "icons/icon48.png",
     "icons/MaterialIcons-Regular.woff2"
   ]

diff --git a/src/options/OptionsApp.tsx b/src/options/OptionsApp.tsx
@@ -0,0 +1,17 @@
+import { h } from "preact"
+import "../style/base.css"
+// import icon from "../assets/icons/icon48.png"
+
+export default function App() {
+
+    return (
+        <div className="wcg-container wcg-mx-auto">
+            <nav className="wcg-flex wcg-flex-row wcg-justify-between wcg-items-center wcg-px-2">
+                <div className="wcg-flex wcg-flex-row wcg-items-center wcg-gap-2">
+                    <img src="../icons/icon48.png" alt="logo" className="wcg-h-8 wcg-w-8" />
+                    <span className="wcg-text-2xl wcg-font-bold">WebChatGPT</span>
+                </div>
+            </nav>
+        </div>
+    )
+}
diff --git a/src/options/options.html b/src/options/options.html
@@ -0,0 +1,11 @@
+<html lang="en">
+<head>
+    <title>WebChatpGPT Options</title>
+    <link rel="stylesheet" href="options.css" />
+</head>
+<body class="wcg-flex wcg-h-full wcg-flex-col wcg-bg-gray-900">
+    <div id="options"></div>
+    <script src="options.js"></script>
+    <!-- <script data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="anzorq" data-description="Support me on Buy me a coffee!" data-message="If you like this extension you can support me and help me pay for the server here!" data-color="#5F7FFF" data-position="Right" data-x_margin="18" data-y_margin="18"></script> -->
+</body>
+</html>
diff --git a/src/options/options.tsx b/src/options/options.tsx
@@ -0,0 +1,5 @@
+import { h, render } from "preact";
+import App from './OptionsApp'
+
+
+render(<App />, document.getElementById("options"))