diff --git a/public/scripts/extensions.js b/public/scripts/extensions.js index b43f622ed..a4a6d5de9 100644 --- a/public/scripts/extensions.js +++ b/public/scripts/extensions.js @@ -373,15 +373,28 @@ function addExtensionScript(name, manifest) { function showExtensionsDetails() { let html = '
Not connected to the API!
'; + html += modules.length ? `${DOMPurify.sanitize(modules.join(', '))}
` : 'Not connected to the API!
'; html += 'Extension is active. Click to Disable
`; + const isActive = activeExtensions.has(name); + const isDisabled = extension_settings.disabledExtensions.includes(name); + + const titleClass = isActive ? "extension_enabled" : isDisabled ? "extension_disabled" : "extension_missing"; + const iconString = isActive ? "\u2705" : isDisabled ? "\u274C" : ""; + + let toggleElement = `Unavailable`; + if (isActive) { + toggleElement = `Disable`; + } + else if (isDisabled) { + toggleElement = `Enable`; + } + html += `Extension is disabled. Click to Enable
`; - } - else { + else if (!isDisabled) { // Neither active nor disabled const requirements = new Set(manifest.requires); modules.forEach(x => requirements.delete(x)); const requirementsString = DOMPurify.sanitize([...requirements].join(', ')); diff --git a/public/scripts/extensions/floating-prompt/manifest.json b/public/scripts/extensions/floating-prompt/manifest.json index b4b28d587..995536b69 100644 --- a/public/scripts/extensions/floating-prompt/manifest.json +++ b/public/scripts/extensions/floating-prompt/manifest.json @@ -1,5 +1,5 @@ { - "display_name": "Author's Note (Located in Lower Left Options Menu)", + "display_name": "Author's Note", "loading_order": 1, "requires": [], "optional": [], diff --git a/public/style.css b/public/style.css index b9982b54f..6221e8d9b 100644 --- a/public/style.css +++ b/public/style.css @@ -3773,12 +3773,30 @@ label[for="extensions_autoconnect"] { .extensions_info p { margin-bottom: 0.5em; + margin-left: 1em; } .extensions_info .disabled { color: lightgray; } +.extensions_info .toggle_enable { + color: lightgreen; +} +.extensions_info .toggle_disable { + color: rgb(238, 144, 144); +} + +.extensions_info .extension_enabled { + color: green; +} +.extensions_info .extension_disabled { + color: lightgray; +} +.extensions_info .extension_missing { + color: gray; +} + #extensions_list .disabled { text-decoration: line-through; color: lightgray;