fix: disabled ui state and update the ui state on sidebar accordingly

Author: bajrangCoder

src/pages/plugins/item.js

@@ -44,7 +44,7 @@ export default function Item({
       className="list-item"
       data-action="open"
       data-installed={(!!installed).toString()}
-      style={enabled === false ? { opacity: 0.5, filter: 'grayscale(0.7)' } : {}}
+      style={enabled === false ? { opacity: 0.6 } : {}}
     >
       <div className="plugin-header">
         <div className="plugin-icon">

src/sidebarApps/extensions/index.js

@@ -390,9 +390,7 @@ function ListItem({ icon, name, id, version, downloads, installed, source }) {
 			data-plugin-id={id}
 			data-plugin-enabled={enabled !== false}
 			className="tile"
-			style={
-				enabled === false ? { opacity: 0.5, filter: "grayscale(0.7)" } : {}
-			}
+			style={enabled === false ? { opacity: 0.6 } : {}}
 		>
 			<span className="icon" style={{ backgroundImage: `url(${icon})` }} />
 			<span
@@ -682,6 +680,12 @@ async function more_plugin_action(id, pluginName) {
 					await loadPlugin(id);
 					window.toast(strings["plugin_enabled"] || "Plugin enabled");
 				}
+				if (!$explore.collapsed) {
+					$explore.ontoggle();
+				}
+				if (!$installed.collapsed) {
+					$installed.ontoggle();
+				}
 			}
 			break;
 	}