From 9e77aebb58076680857c42c85be82a6bb7e92c25 Mon Sep 17 00:00:00 2001
From: programminglaboratorys <programming.laboratorys@gmail.com>
Date: Mon, 30 Sep 2024 07:17:07 +0300
Subject: [PATCH] add style

---
 src/plugins/statusPresets/index.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/plugins/statusPresets/index.tsx b/src/plugins/statusPresets/index.tsx
index 21bafe466..bc039207f 100644
--- a/src/plugins/statusPresets/index.tsx
+++ b/src/plugins/statusPresets/index.tsx
@@ -71,6 +71,10 @@ const RenderStatusMenuItem = ({ status }: { status: DiscordStatus; }) => {
     };
 
     return <div className={StatusStyles.statusItem}
+        style={isHovering ? {
+            backgroundColor: "var(--menu-item-default-hover-bg)",
+            color: "var(--white)"
+        } : {}}
         onMouseOver={handleMouseOver}
         onMouseOut={handleMouseOut}>
         <Clickable
@@ -89,8 +93,8 @@ const RenderStatusMenuItem = ({ status }: { status: DiscordStatus; }) => {
 
 const StatusSubMenuComponent = () => {
     return <Menu.Menu navId="sp-custom-status-submenu" onClose={() => { }}>
-        {Object.values((settings.store.StatusPresets as { [k: string]: DiscordStatus; })).map(status => <Menu.MenuItem
-            id={"status-presets-" + status.text}
+        {Object.entries((settings.store.StatusPresets as { [k: string]: DiscordStatus; })).map(([index, status]) => <Menu.MenuItem
+            id={"status-presets-" + index}
             label={status.status}
             action={() => setStatus(status.text, status.emojiInfo, status.clearAfter, { "location": { "section": "Account Panel", "object": "Avatar" } })}
             render={() => <RenderStatusMenuItem status={status} />}