refactor(ui): remove mascot tooltip from sidebar component

Removes the hardcoded mascot tooltip implementation from the Sidebar
component to clean up the component structure. The tooltip logic is
now handled elsewhere.
This commit is contained in:
MythEclipse
2026-06-03 20:09:45 +07:00
parent 8918dd09e2
commit 2bf48f6cd0
+2 -24
View File
@@ -109,30 +109,8 @@ export function Sidebar({
{/* Spacer pushes mascot to bottom */}
<div className="flex-1" />
{/* Mascot PNG with anchored chatbot */}
<div className="relative flex justify-center pb-4">
{!mascotChat.isOpen && (
<motion.div
initial={{ opacity: 0, x: -8, y: 6, scale: 0.96 }}
animate={{ opacity: 1, x: 0, y: 0, scale: 1 }}
transition={{ type: "spring", stiffness: 280, damping: 24 }}
className="pointer-events-none fixed bottom-[100px] left-[72px] z-[9999] w-64"
>
<div className="relative rounded-2xl border border-sky-200/80 bg-white/95 px-4 py-3 text-left shadow-xl shadow-sky-100/70 backdrop-blur-md">
<p className="text-[11px] font-semibold uppercase tracking-wide text-primary/70">
Discord Watcher
</p>
<p className="mt-1 text-xs leading-relaxed text-slate-700">
Halo! Saya mascot mu. Klik aku kalau mau tanya soal obrolan
atau moderasi
</p>
{/* Outer: border layer — triangle pointing left at center-right */}
<div className="absolute -left-[13px] top-1/2 z-10 h-[21px] w-[21px] -translate-y-1/2 bg-sky-200/80 [clip-path:polygon(0_50%,100%_0,100%_100%)]" />
{/* Inner: fill layer — matches bubble bg */}
<div className="absolute -left-3 top-1/2 z-20 h-5 w-5 -translate-y-1/2 bg-white/95 [clip-path:polygon(0_50%,100%_0,100%_100%)]" />
</div>
</motion.div>
)}
{/* Mascot button */}
<div className="flex justify-center pb-4">
<button
type="button"
onClick={() => mascotChat.setIsOpen(!mascotChat.isOpen)}