feat: remove all match host permission

background/index.ts

@@ -1,3 +1,5 @@
+import sniffer from "url:~/pages/sniffer.tsx"
+
 import { Storage } from "@plasmohq/storage"
 
 import { STORAGE_SERVER_STATUS, STORAGE_SERVERS } from "~constants"
@@ -14,7 +16,26 @@ async function checkServer(server: Server) {
   }
 }
 
+/* function initContextMenus() {
+  chrome.contextMenus.create({
+    id: "sniff",
+    title: "Download All Resource",
+    contexts: ["page", "selection", "link", "action"]
+  })
+
+  chrome.contextMenus.onClicked.addListener((info, tab) => {
+    console.log(info, tab)
+    const filePath = sniffer.split("/").pop().split("?")[0]
+    chrome.scripting.executeScript({
+      target: { tabId: tab.id },
+      files: [filePath]
+    })
+  })
+} */
+
 ;(async function () {
+  // initContextMenus()
+
   const storage = new Storage()
 
   async function checkAllServers() {

package.json

@@ -40,12 +40,12 @@
     "typescript": "5.2.2"
   },
   "manifest": {
-    "host_permissions": [
-      "https://*/*"
-    ],
     "permissions": [
       "system.display",
-      "downloads"
+      "downloads",
+      "contextMenus",
+      "activeTab",
+      "scripting"
     ]
   }
 }

contents/sniffer.tsx → pages/sniffer.tsx

@@ -8,6 +8,7 @@ import Stack from "@mui/material/Stack"
 import Typography from "@mui/material/Typography"
 import type { PlasmoGetInlineAnchor, PlasmoGetOverlayAnchor } from "plasmo"
 import { useEffect, useState } from "react"
+import ReactDOM from "react-dom"
 
 // export const getInlineAnchor: PlasmoGetInlineAnchor = async () =>
 //   document.querySelector("div.TimelineItem-avatar")
@@ -29,24 +30,27 @@ function PlasmoOverlay() {
   const [data, setData] = useState("")
 
   return (
-    {/* <CacheProvider value={styleCache}>
+    <CacheProvider value={styleCache}>
       <Stack minWidth={240} bgcolor={"white"} padding={2}>
         <Alert severity="error">This is an error alert — check it out!</Alert>
         <Typography variant="h6">
           Welcome to your{" "}
           <Link href="https://www.plasmo.com" target="_blank">
-            Plasmo 123
+            Plasmo
           </Link>{" "}
           Extension!
         </Typography>
         <Input onChange={(e) => setData(e.target.value)} value={data} />
         <Button href="https://docs.plasmo.com" target="_blank">
-          View Docs 2313
+          View Docs
         </Button>
         <Button variant="contained">Hello world</Button>;
       </Stack>
-    </CacheProvider> */}
+    </CacheProvider>
   )
 }
 
-export default PlasmoOverlay
+const root = document.createElement('div');
+document.body.appendChild(root);
+
+ReactDOM.render(<PlasmoOverlay />, root);