first commit

.gitignore

@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.output
+stats.html
+stats-*.json
+.wxt
+web-ext.config.ts
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

README.md

@@ -0,0 +1,13 @@
+
+## dev
+
+```bash
+pnpm dev
+```
+
+## publish
+
+```bash
+pnpm build
+pnpm zip
+```

entrypoints/background.ts

@@ -0,0 +1,63 @@
+import { SearchConfig } from "@/lib/type";
+
+const toggleSearch = () => {
+  // Send a message to the active tab
+  browser.tabs.query({ active: true, currentWindow: true }).then((tabs) => {
+    let activeTab = tabs[0];
+    if (!activeTab.id) return;
+    browser.tabs.sendMessage(activeTab.id, {
+      message: "toggle_tsp_extension",
+    });
+  });
+};
+
+export default defineBackground({
+  main() {
+    console.log("Hello background!", { id: browser.runtime.id });
+
+    // MARK: - Install
+    browser.runtime.onInstalled.addListener(function (details) {
+      if (details.reason === "install") {
+        browser.storage.local.set({
+          isWholeWord: false,
+          isCaseSensitive: false,
+          isRegex: false,
+          darkMode: "light",
+          searchNum: "0",
+        } as SearchConfig);
+        // .then(() => {
+        //   // log all storage
+        //   return browser.storage.local.get(null);
+        // })
+        // .then((res) => {
+        //   console.log(res);
+        // });
+      }
+
+      // on extension update
+      // if (details.reason === "update") {
+      // }
+    });
+
+    // MARK: - Toggle
+    // extension icon clicked
+    browser.action.onClicked.addListener((tab) => {
+      toggleSearch();
+    });
+
+    // extension shortcut key pressed
+    browser.commands.onCommand.addListener((command) => {
+      console.log(`Command: ${command}`);
+      if (command === "toggle-search") {
+        toggleSearch();
+      }
+    });
+
+    // MARK: - Messages
+    browser.runtime.onMessage.addListener((message) => {
+      if (message.message === "open-options") {
+        browser.runtime.openOptionsPage();
+      }
+    });
+  },
+});

entrypoints/content/App.tsx

@@ -0,0 +1,89 @@
+import React, { useState } from "react";
+import Search from "./Search";
+import { search, scrollTo, markInstance } from "@/lib/dom";
+import { SearchConfig } from "@/lib/type";
+import { increaseSearchNoBy1 } from "@/lib/storage";
+
+const App: React.FC = () => {
+  const [results, setResults] = useState<NodeListOf<Element> | undefined>();
+  const [numResults, setNumResults] = useState<number>();
+  const [currentIndex, setCurrentIndex] = useState<number>(0);
+
+  // MARK:- Nav handlers
+
+  const scrollToCurrent = () => {
+    if (!results) return;
+    const element = results[currentIndex];
+    if (element) {
+      scrollTo(element);
+    }
+  };
+
+  const onSearch = useCallback((searchText: string, config: SearchConfig) => {
+    search(searchText, config, (num) => {
+      const results = document.querySelectorAll(".tsp-mark");
+      setResults(results);
+      setNumResults(num);
+      setCurrentIndex(0);
+      increaseSearchNoBy1();
+    });
+  }, []);
+
+  const onNext = () => {
+    if (!numResults) return;
+    const nextIndex = currentIndex + 1 < numResults ? currentIndex + 1 : 0;
+    setCurrentIndex(nextIndex);
+    // NOTE: has to force scroll
+    scrollToCurrent();
+  };
+
+  const onPrev = () => {
+    if (!numResults) return;
+    const prevIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : numResults - 1;
+    setCurrentIndex(prevIndex);
+    scrollToCurrent();
+  };
+
+  const onFirst = () => {
+    setCurrentIndex(0);
+    scrollToCurrent();
+  };
+
+  const onLast = () => {
+    setCurrentIndex(Math.max(0, (numResults || 0) - 1));
+    scrollToCurrent();
+  };
+
+  const onClear = () => {
+    markInstance.unmark();
+    setResults(undefined);
+    setNumResults(undefined);
+    setCurrentIndex(0);
+  };
+
+  // MARK:- Effects
+
+  useEffect(() => {
+    const element = results?.[currentIndex];
+    if (element) {
+      results?.forEach((e) => e.classList.remove("current"));
+      element.classList.add("current");
+      scrollTo(element);
+    }
+  }, [currentIndex, results]);
+
+  return (
+    <Search
+      onSearch={onSearch}
+      onNext={onNext}
+      onPrev={onPrev}
+      onFirst={onFirst}
+      onLast={onLast}
+      onClear={onClear}
+      numResults={numResults}
+      currentIndex={currentIndex}
+    />
+  );
+};
+
+export default App;

entrypoints/content/Pdf.tsx

@@ -0,0 +1,15 @@
+import React, { useState, useEffect } from "react";
+// import * as pdfjsLib from "pdfjs-dist";
+import Search from "./Search";
+import { SearchConfig } from "@/lib/type";
+
+interface PdfProps {
+  url: string;
+}
+
+const Pdf: React.FC<PdfProps> = ({ url }) => {
+  // TODO: Implement PDF search
+  return <div></div>;
+};
+
+export default Pdf;