Add Paul's Toolbox Contents

popup/index.tsx

@@ -0,0 +1,49 @@
+import { useState } from "react";
+import Menu from "./menu";
+import Read from "./read";
+import Toy from "./bili";
+import Message from "~components/ui/message";
+import { clsn } from "~utils";
+import "assets/global.css";
+import styles from "./popup.module.less";
+
+function IndexPopup() {
+  const [data, setData] = useState("")
+
+  const [tab, setTab] = useState<string>();
+
+  const onBack = () => {
+    setTab(undefined);
+  }
+
+  const onClickMenu = (value: string) => {
+    if (value === "options") {
+      chrome.runtime.openOptionsPage();
+      return;
+    }
+
+    setTab(value);
+  }
+
+  const renderBody = () => {
+    if (tab === "read") {
+      return <Read onBack={onBack} />;
+    }
+    if (tab === "toy") {
+      return <Toy onBack={onBack} />;
+    }
+
+    return <Menu onClick={onClickMenu} />;
+  }
+
+  return (
+    <>
+      <div className={clsn(styles.root, tab && styles.hasTab)}>
+        {renderBody()}
+      </div>
+      <Message />
+    </>
+  );
+}
+
+export default IndexPopup;