From 400b696f74d7bde3717483ed7cfec5b8de675018 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Tue, 13 Feb 2024 00:48:32 +0000
Subject: feature: Add a dismiss button to the browser popup

---
 packages/browser-extension/package.json |  1 +
 packages/browser-extension/src/App.tsx  | 10 +++++++---
 yarn.lock                               | 10 ++++++++++
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/packages/browser-extension/package.json b/packages/browser-extension/package.json
index 3c8a4e8d..0d4f8fb1 100644
--- a/packages/browser-extension/package.json
+++ b/packages/browser-extension/package.json
@@ -12,6 +12,7 @@
   "dependencies": {
     "@types/chrome": "^0.0.260",
     "localforage": "^1.10.0",
+    "lucide-react": "^0.330.0",
     "match-sorter": "^6.3.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
diff --git a/packages/browser-extension/src/App.tsx b/packages/browser-extension/src/App.tsx
index 8a2c4920..1044363b 100644
--- a/packages/browser-extension/src/App.tsx
+++ b/packages/browser-extension/src/App.tsx
@@ -1,3 +1,4 @@
+import { Settings, X } from "lucide-react";
 import SavePage from "./SavePage";
 import usePluginSettings from "./settings";
 import { useNavigate } from "react-router-dom";
@@ -19,9 +20,12 @@ function App() {
     <div className="flex flex-col space-y-2">
       <SavePage settings={settings} />
       <hr />
-      <div className="flex justify-end">
-        <button className="w-2/6" onClick={() => navigate("/options")}>
-          Settings
+      <div className="flex justify-end space-x-3">
+        <button onClick={() => navigate("/options")}>
+          <Settings className="w-4" />
+        </button>
+        <button onClick={() => window.close()}>
+          <X className="w-4" />
         </button>
       </div>
     </div>
diff --git a/yarn.lock b/yarn.lock
index 77301e73..8f424166 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2984,6 +2984,7 @@ __metadata:
     eslint-plugin-react-hooks: "npm:^4.6.0"
     eslint-plugin-react-refresh: "npm:^0.4.5"
     localforage: "npm:^1.10.0"
+    lucide-react: "npm:^0.330.0"
     match-sorter: "npm:^6.3.4"
     postcss: "npm:^8.4.35"
     react: "npm:^18.2.0"
@@ -6170,6 +6171,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"lucide-react@npm:^0.330.0":
+  version: 0.330.0
+  resolution: "lucide-react@npm:0.330.0"
+  peerDependencies:
+    react: ^16.5.1 || ^17.0.0 || ^18.0.0
+  checksum: 10c0/c8bfd082b63a50f4f22dae147923c061a8b460fbc501a241ebdc6f391f13dba9e3cb05686bf6dbdcc8974d08011e0e889aca18cd4a99a7e8a0df450c5469c33d
+  languageName: node
+  linkType: hard
+
 "luxon@npm:^3.2.1":
   version: 3.4.4
   resolution: "luxon@npm:3.4.4"
-- 
cgit v1.2.3-70-g09d2