1 files changed, 25 insertions, 0 deletions
diff --git a/extension/react-app/src/components/Layout.tsx b/extension/react-app/src/components/Layout.tsx
index 54a4517f..86192afb 100644
--- a/extension/react-app/src/components/Layout.tsx
+++ b/extension/react-app/src/components/Layout.tsx
@@ -17,6 +17,7 @@ import {
   FolderIcon,
   BookOpenIcon,
   ChatBubbleOvalLeftEllipsisIcon,
+  SparklesIcon,
 } from "@heroicons/react/24/outline";
 import HeaderButtonWithText from "./HeaderButtonWithText";
 import { useNavigate } from "react-router-dom";
@@ -138,6 +139,30 @@ const Layout = () => {
           {bottomMessage}
         </BottomMessageDiv>
         <Footer>
+          <SparklesIcon
+            visibility={
+              localStorage.getItem("hideFeature") === "true"
+                ? "hidden"
+                : "visible"
+            }
+            className="mr-auto cursor-pointer"
+            onClick={() => {
+              localStorage.setItem("hideFeature", "true");
+            }}
+            onMouseEnter={() => {
+              dispatch(
+                setBottomMessage(
+                  "🎁 New Feature: Use ⌘D automatically debug errors in the terminal"
+                )
+              );
+            }}
+            onMouseLeave={() => {
+              dispatch(setBottomMessage(undefined));
+            }}
+            width="1.3em"
+            height="1.3em"
+            color="yellow"
+          />
           <HeaderButtonWithText
             onClick={() => {
               client?.loadSession(undefined);