diff --git a/src/components/Elements/MainModal/scss/marketplace/_main.scss b/src/components/Elements/MainModal/scss/marketplace/_main.scss
index 0edc1062..b3c83da2 100644
--- a/src/components/Elements/MainModal/scss/marketplace/_main.scss
+++ b/src/components/Elements/MainModal/scss/marketplace/_main.scss
@@ -114,6 +114,18 @@
}
}
+ // Disabled pack styling
+ &.item-disabled {
+ opacity: 0.5;
+
+ .card-title,
+ .card-subtitle {
+ @include themed {
+ color: t($subColor);
+ }
+ }
+ }
+
.item-uninstall-btn {
display: flex;
align-items: center;
diff --git a/src/features/background/api/photoPackAPI.js b/src/features/background/api/photoPackAPI.js
index 1ee3de8b..7decf2cb 100644
--- a/src/features/background/api/photoPackAPI.js
+++ b/src/features/background/api/photoPackAPI.js
@@ -162,12 +162,17 @@ export async function checkAndRefreshAPIPacks() {
export function buildPhotoPool() {
const pool = [];
const installed = JSON.parse(localStorage.getItem('installed') || '[]');
+ const enabledPacks = JSON.parse(localStorage.getItem('enabledPacks') || '{}');
const apiPacksReady = JSON.parse(localStorage.getItem('api_packs_ready') || '[]');
const apiPackCache = JSON.parse(localStorage.getItem('api_pack_cache') || '{}');
installed.forEach((pack) => {
if (pack.type !== 'photos') return;
+ // Filter by enabled status - default to enabled if not in enabledPacks object
+ const packId = pack.id || pack.name;
+ if (enabledPacks[packId] === false) return;
+
if (pack.api_enabled) {
// API pack - check if configured and ready
if (apiPacksReady.includes(pack.id)) {
diff --git a/src/features/background/options/sections/SourceSection.jsx b/src/features/background/options/sections/SourceSection.jsx
index 3a226a92..dfc6f78f 100644
--- a/src/features/background/options/sections/SourceSection.jsx
+++ b/src/features/background/options/sections/SourceSection.jsx
@@ -65,7 +65,9 @@ const SourceSection = ({
toggleFunction={onToggle}
showCreateYourOwn={false}
onUninstall={onPhotoPackUninstall}
+ onTogglePack={() => {}}
viewType="grid"
+ showChips={false}
/>
{/* Settings for API packs */}
diff --git a/src/features/marketplace/components/Items/Items.jsx b/src/features/marketplace/components/Items/Items.jsx
index 7d1ebd91..bdfe1796 100644
--- a/src/features/marketplace/components/Items/Items.jsx
+++ b/src/features/marketplace/components/Items/Items.jsx
@@ -4,7 +4,10 @@ import { MdCheckCircle, MdOutlineUploadFile, MdClose } from 'react-icons/md';
import placeholderIcon from 'assets/icons/marketplace-placeholder.png';
import { Tooltip } from 'components/Elements';
+import { Button } from 'components/Elements';
+import Switch from 'components/Form/Settings/Switch/Switch';
import Dropdown from '../../../../components/Form/Settings/Dropdown/Dropdown';
+import EventBus from 'utils/eventbus';
import { getProxiedImageUrl } from 'utils/marketplace';
function filterItems(item, filter, categoryFilter) {
@@ -60,32 +63,92 @@ function ItemCard({
isInstalled,
isAdded,
onUninstall,
+ onTogglePack,
+ showChips = true,
}) {
item._onCollection = onCollection;
const isSideloaded = item.sideload === true;
+ const packId = item.id || item.name;
+
+ // Use React state to manage enabled status for immediate UI updates
+ const [isEnabled, setIsEnabled] = useState(() => {
+ const enabledPacks = JSON.parse(localStorage.getItem('enabledPacks') || '{}');
+ return enabledPacks[packId] !== false; // Default to enabled if not set
+ });
+
+ const handleTogglePack = (e) => {
+ e.stopPropagation();
+ const newState = !isEnabled;
+
+ // Update local state immediately for UI responsiveness
+ setIsEnabled(newState);
+
+ // Update localStorage
+ const enabledPacks = JSON.parse(localStorage.getItem('enabledPacks') || '{}');
+ enabledPacks[packId] = newState;
+ localStorage.setItem('enabledPacks', JSON.stringify(enabledPacks));
+
+ if (onTogglePack) {
+ onTogglePack(packId, newState);
+ }
+
+ // Emit refresh event for quotes only (background will update on next interval)
+ if (item.type === 'quotes') {
+ EventBus.emit('refresh', 'quote');
+ }
+ };
return (
toggleFunction(item)}
key={item.name}
>
- {isAdded && onUninstall && (
-
e.stopPropagation()}
style={{ position: 'absolute', top: '12px', right: '12px', zIndex: 3 }}
>
-
-
+
+
)}
{isSideloaded && (
- {item.type && (
-
- {variables.getMessage('modals.main.marketplace.' + getTypeTranslationKey(item.type))}
-
- )}
- {item.in_collections && item.in_collections.length > 0 && !onCollection && (
-
- {item.in_collections[0].display_name || item.in_collections[0].name}
-
- )}
-
+ {showChips && (
+
+ {item.type && (
+
+ {variables.getMessage('modals.main.marketplace.' + getTypeTranslationKey(item.type))}
+
+ )}
+ {item.in_collections && item.in_collections.length > 0 && !onCollection && (
+
+ {item.in_collections[0].display_name || item.in_collections[0].name}
+
+ )}
+
+ )}
+
+ {isAdded && onUninstall && (
+