feat: monorepo

apps/web/src/components/FeedbackButton.tsx

@@ -0,0 +1,34 @@
+import { useState } from "react";
+
+import chatIconDark from "~/assets/chat-dark.json";
+import chatIconLight from "~/assets/chat-light.json";
+import LottieIcon from "~/components/LottieIcon";
+import { useTheme } from "~/providers/theme";
+
+const FeedbackButton: React.FC = () => {
+  const { activeTheme } = useTheme();
+  const [isHovered, setIsHovered] = useState(false);
+  const [index, setIndex] = useState(0);
+
+  const handleMouseEnter = () => {
+    setIsHovered(true);
+    setIndex((index) => index + 1);
+  };
+
+  return (
+    <button
+      type="button"
+      onMouseEnter={handleMouseEnter}
+      className="flex items-center rounded-md border-[1px] border-light-600 bg-light-50 px-2.5 py-1.5 text-sm font-normal text-neutral-900 shadow-sm dark:border-dark-400 dark:bg-dark-50 dark:text-dark-1000"
+    >
+      <LottieIcon
+        index={index}
+        json={activeTheme === "dark" ? chatIconDark : chatIconLight}
+        isPlaying={isHovered}
+      />
+      <span className="ml-1">Feedback</span>
+    </button>
+  );
+};
+
+export default FeedbackButton;