.

lang/en.json

@@ -2123,7 +2123,9 @@
                 "configuration": "Configuration",
                 "base": "Base",
                 "triggers": "Triggers",
-                "deathMoves": "Deathmoves"
+                "deathMoves": "Deathmoves",
+                "sources": "Sources",
+                "packs": "Packs"
             },
             "Tiers": {
                 "singular": "Tier",

module/applications/dialogs/CompendiumBrowserSettings.mjs

@@ -10,7 +10,7 @@ export default class CompendiumBrowserSettings extends HandlebarsApplicationMixi
     }
 
     static DEFAULT_OPTIONS = {
-        tag: 'form',
+        tag: 'div',
         classes: ['daggerheart', 'dialog', 'dh-style', 'views', 'compendium-brower-settings'],
         window: {
             icon: 'fa-solid fa-book',
@@ -21,21 +21,18 @@ export default class CompendiumBrowserSettings extends HandlebarsApplicationMixi
             height: 'auto'
         },
         actions: {
+            toggleSource: CompendiumBrowserSettings.#toggleSource,
             finish: CompendiumBrowserSettings.#finish
-        },
-        form: {
-            handler: this.updateData,
-            submitOnChange: true,
-            submitOnClose: false
         }
     };
 
     /** @override */
     static PARTS = {
-        main: {
+        packs: {
-            id: 'main',
+            id: 'packs',
-            template: 'systems/daggerheart/templates/dialogs/compendiumBrowserSettingsDialog.hbs'
+            template: 'systems/daggerheart/templates/dialogs/compendiumBrowserSettingsDialog/packs.hbs'
-        }
+        },
+        footer: { template: 'systems/daggerheart/templates/dialogs/compendiumBrowserSettingsDialog/footer.hbs' }
     };
 
     static #browserPackTypes = ['Actor', 'Item'];
@@ -43,45 +40,36 @@ export default class CompendiumBrowserSettings extends HandlebarsApplicationMixi
     _attachPartListeners(partId, htmlElement, options) {
         super._attachPartListeners(partId, htmlElement, options);
 
-        for (const element of htmlElement.querySelectorAll('.source-input')) {
+        for (const element of htmlElement.querySelectorAll('.pack-checkbox'))
-            element.addEventListener('change', this.toggleSource.bind(this));
+            element.addEventListener('change', this.toggleTypedPack.bind(this));
-        }
     }
 
-    getPackageName = pack => (pack.metadata.packageType === 'world' ? 'world' : pack.metadata.packageName);
+    /**@inheritdoc */
-
     async _prepareContext(_options) {
         const context = await super._prepareContext(_options);
 
-        const { excludedCompendiumPacks } = this.browserSettings;
+        const excludedSourceData = this.browserSettings.excludedSources;
-        context.packOptions = game.packs.reduce((acc, pack) => {
+        const excludedPackData = this.browserSettings.excludedPacks;
-            const { type, name, label, packageType, id } = pack.metadata;
+        context.typePackCollections = game.packs.reduce((acc, pack) => {
-            if (!CompendiumBrowserSettings.#browserPackTypes.includes(type)) return acc;
+            const { type, label, packageType, packageName, id } = pack.metadata;
+            if (packageType === 'world' || !CompendiumBrowserSettings.#browserPackTypes.includes(type)) return acc;
 
-            const packageName = this.getPackageName(pack);
+            const sourceChecked =
-            if (!acc[packageName])
+                !excludedSourceData[packageName] ||
-                acc[packageName] = {
+                !excludedSourceData[packageName].excludedDocumentTypes.includes(type);
-                    label:
+            const sourceLabel = game.modules.get(packageName)?.title ?? game.system.title;
-                        packageType === 'world'
+            if (!acc[type]) acc[type] = { label: game.i18n.localize(`DOCUMENT.${type}s`), sources: {} };
-                            ? game.i18n.localize('PACKAGE.Type.world')
+            if (!acc[type].sources[packageName])
-                            : (game.modules.get(packageName)?.title ?? game.system.title),
+                acc[type].sources[packageName] = { label: sourceLabel, checked: sourceChecked, packs: [] };
-                    types: {}
-                };
-            if (!acc[packageName].types[type])
-                acc[packageName].types[type] = {
-                    label: game.i18n.localize(`DOCUMENT.${type}`),
-                    checked: true,
-                    packs: {}
-                };
 
-            if (id === 'daggerheart.ancestries') {
+            const checked = !excludedPackData[id] || !excludedPackData[id].excludedDocumentTypes.includes(type);
-                console.log('test');
+
-            }
+            acc[type].sources[packageName].packs.push({
-            acc[packageName].types[type].packs[id] = {
+                pack: id,
-                label: label,
+                type,
-                checked: !excludedCompendiumPacks[packageName]?.[id]
+                label: id === game.system.id ? game.system.title : game.i18n.localize(label),
-            };
+                checked: checked
-            acc[packageName].types[type].checked &&= acc[packageName].types[type].packs[id].checked;
+            });
 
             return acc;
         }, {});
@@ -89,35 +77,40 @@ export default class CompendiumBrowserSettings extends HandlebarsApplicationMixi
         return context;
     }
 
-    static async updateData(_event, _, formData) {
+    static #toggleSource(event, button) {
-        const { excludedCompendiumPacks } = foundry.utils.expandObject(formData.object);
-        this.browserSettings.excludedCompendiumPacks = Object.keys(excludedCompendiumPacks).reduce(
-            (acc, packageKey) => {
-                const flattenedPack = foundry.utils.flattenObject(excludedCompendiumPacks[packageKey]);
-                acc[packageKey] = Object.keys(flattenedPack).reduce((acc, key) => {
-                    acc[key] = !flattenedPack[key];
-                    return acc;
-                }, {});
-                return acc;
-            },
-            {}
-        );
-        this.render();
-    }
-
-    toggleSource(event) {
         event.stopPropagation();
 
-        const { excludedCompendiumPacks } = this.browserSettings;
+        const target = button.closest('.source-enable-container');
-        const { source, type } = event.target.dataset;
+        const { type, source } = target.dataset;
+        const currentlyExcluded = this.browserSettings.excludedSources[source]
+            ? this.browserSettings.excludedSources[source].excludedDocumentTypes.includes(type)
+            : false;
 
-        const allIncluded = !event.target.checked;
+        if (!this.browserSettings.excludedSources[source])
-        const packs = game.packs.filter(pack => this.getPackageName(pack) === source && pack.metadata.type === type);
+            this.browserSettings.excludedSources[source] = { excludedDocumentTypes: [] };
-        for (const pack of packs) {
+        this.browserSettings.excludedSources[source].excludedDocumentTypes = currentlyExcluded
-            if (!excludedCompendiumPacks[source]) excludedCompendiumPacks[source] = {};
+            ? this.browserSettings.excludedSources[source].excludedDocumentTypes.filter(x => x !== type)
+            : [...(this.browserSettings.excludedSources[source]?.excludedDocumentTypes ?? []), type];
 
-            excludedCompendiumPacks[source][pack.metadata.id] = allIncluded;
+        target.classList.toggle('locked');
-        }
+        target.closest('.source-container').querySelector('.checks-container').classList.toggle('collapsed');
+
+        // this.render();
+    }
+
+    toggleTypedPack(event) {
+        event.stopPropagation();
+
+        const { type, pack } = event.target.dataset;
+        const currentlyExcluded = this.browserSettings.excludedPacks[pack]
+            ? this.browserSettings.excludedPacks[pack].excludedDocumentTypes.includes(type)
+            : false;
+
+        if (!this.browserSettings.excludedPacks[pack])
+            this.browserSettings.excludedPacks[pack] = { excludedDocumentTypes: [] };
+        this.browserSettings.excludedPacks[pack].excludedDocumentTypes = currentlyExcluded
+            ? this.browserSettings.excludedPacks[pack].excludedDocumentTypes.filter(x => x !== type)
+            : [...(this.browserSettings.excludedPacks[pack]?.excludedDocumentTypes ?? []), type];
 
         this.render();
     }

module/applications/ui/itemBrowser.mjs

@@ -215,10 +215,10 @@ export class ItemBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
     loadItems() {
         let loadTimeout = this.toggleLoader(true);
 
-        const excludedCompendiumPacks = game.settings.get(
+        const browserSettings = game.settings.get(
             CONFIG.DH.id,
             CONFIG.DH.SETTINGS.gameSettings.CompendiumBrowserSettings
-        ).excludedCompendiumPacks;
+        );
         const promises = [];
 
         game.packs.forEach(pack => {
@@ -232,13 +232,7 @@ export class ItemBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
 
         Promise.all(promises).then(async result => {
             this.items = ItemBrowser.sortBy(
-                result
+                result.flatMap(r => r).filter(r => !browserSettings.isEntryExcluded.bind(browserSettings)(r)),
-                    .flatMap(r => r)
-                    .filter(x => {
-                        const pack = game.packs.get(x.pack);
-                        const packageName = pack.metadata.packageType === 'world' ? 'world' : pack.metadata.packageName;
-                        return !excludedCompendiumPacks[packageName]?.[x.pack];
-                    }),
                 'name'
             );
 

module/data/compendiumBrowserSettings.mjs

@@ -3,14 +3,33 @@ export default class CompendiumBrowserSettings extends foundry.abstract.DataMode
         const fields = foundry.data.fields;
 
         return {
-            excludedCompendiumPacks: new fields.TypedObjectField(
+            excludedSources: new fields.TypedObjectField(
-                new fields.TypedObjectField(new fields.BooleanField({ required: true, initial: true }))
+                new fields.SchemaField({
+                    excludedDocumentTypes: new fields.ArrayField(
+                        new fields.StringField({ required: true, choices: CONST.SYSTEM_SPECIFIC_COMPENDIUM_TYPES })
+                    )
+                })
+            ),
+            excludedPacks: new fields.TypedObjectField(
+                new fields.SchemaField({
+                    excludedDocumentTypes: new fields.ArrayField(
+                        new fields.StringField({ required: true, choices: CONST.SYSTEM_SPECIFIC_COMPENDIUM_TYPES })
+                    )
+                })
             )
-            // excludedSources: new fields.ArrayField(new fields.StringField({ required: true, nullable: false })),
-            // excludedPacks: new fields.TypedObjectField(new fields.SchemaField({
-            //     attributionKeys: new fields.ArrayField(new fields.StringField({ required: true, nullable: false })),
-            //     excluded: new fields.BooleanField({ required: true, initial: false }),
-            // })),
         };
     }
+
+    isEntryExcluded(item) {
+        const pack = game.packs.get(item.pack);
+        if (!pack) return false;
+
+        const excludedSourceData = this.excludedSources[pack.metadata.packageName];
+        if (excludedSourceData && excludedSourceData.excludedDocumentTypes.includes(pack.metadata.type)) return true;
+
+        const excludedPackData = this.excludedPacks[item.pack];
+        if (excludedPackData && excludedPackData.excludedDocumentTypes.includes(pack.metadata.type)) return true;
+
+        return false;
+    }
 }

styles/less/dialog/compendiumBrowserPackDialog/sheet.less

@@ -1,22 +1,13 @@
 .daggerheart.dialog.dh-style.views.compendium-brower-settings {
-    --text-color: beige;
+    --text-color: light-dark(@dark-blue, @beige);
+    color: var(--text-color);
 
-    .compendium-settings-label {
+    .types-container {
-        text-align: center;
-        display: flex;
-        flex-direction: column;
-        color: light-dark(@dark-blue, @golden);
-        font-size: var(--font-size-24);
-        font-family: @font-subtitle;
-        font-weight: bold;
-    }
-
-    .pack-options-container {
         display: flex;
         flex-direction: column;
         gap: 8px;
 
-        .pack-option-container {
+        .type-container {
             display: flex;
             flex-direction: column;
             gap: 8px;
@@ -32,14 +23,14 @@
                     content: '';
                     flex: 1;
                     height: 2px;
-                    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, @golden 100%);
+                    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, light-dark(@dark-blue, @golden) 100%);
                     margin-right: 8px;
                 }
                 &::after {
                     content: '';
                     flex: 1;
                     height: 2px;
-                    background: linear-gradient(90deg, @golden 0%, rgba(0, 0, 0, 0) 100%);
+                    background: linear-gradient(90deg, light-dark(@dark-blue, @golden) 0%, rgba(0, 0, 0, 0) 100%);
                     margin-left: 8px;
                 }
             }
@@ -48,11 +39,8 @@
                 display: flex;
                 flex-direction: column;
                 gap: 8px;
-                color: var(--text-color);
 
                 .source-container {
-                    padding: 5px;
-                    background: light-dark(@dark-blue-10, @golden-10);
                     display: flex;
                     flex-direction: column;
                     gap: 2px;
@@ -62,21 +50,42 @@
                         justify-content: space-between;
 
                         .source-inner-label-container {
+                            width: 100%;
                             display: flex;
                             align-items: center;
+                            justify-content: space-between;
                             gap: 4px;
-                        }
-                    }
 
-                    .packs-container {
+                            .source-enable-container {
-                        display: grid;
+                                width: 148px;
-                        grid-template-columns: 1fr 1fr;
+                                height: 24px;
-                        gap: 4px;
+                                padding: 2px 4px;
-                        padding-left: 24px;
+                                background-color: light-dark(@dark-blue, @golden);
+                                border-radius: 6px;
+                                position: relative;
+                                display: flex;
+                                align-items: center;
 
-                        .pack-container {
+                                &.locked {
-                            display: flex;
+                                    opacity: 0.4;
-                            align-items: center;
+
+                                    .source-enable-label {
+                                        left: 74px;
+                                    }
+                                }
+
+                                .source-enable-label {
+                                    width: 70px;
+                                    border-radius: 6px;
+                                    border: 1px solid light-dark(@dark-blue, @beige-50);
+                                    text-align: center;
+                                    background-color: light-dark(@golden, @beige);
+                                    color: black;
+                                    position: absolute;
+                                    left: 4px;
+                                    transition: left ease-in 0.4s;
+                                }
+                            }
                         }
                     }
                 }
@@ -84,6 +93,27 @@
         }
     }
 
+    .checks-container {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: 4px;
+        transition: height 0.4s ease-in-out;
+        overflow: hidden;
+
+        &.collapsed {
+            height: 0px;
+        }
+
+        &.inner {
+            padding-left: 24px;
+        }
+
+        .check-container {
+            display: flex;
+            align-items: center;
+        }
+    }
+
     footer {
         margin-top: 8px;
         display: flex;

styles/less/ui/chat/chat.less

@@ -233,7 +233,7 @@
                 font-family: @font-subtitle;
                 font-size: var(--font-size-18);
                 font-weight: bold;
-                color: var(--text-color);
+                color: light-dark(@dark-blue, var(--text-color));
                 margin-bottom: -2px;
             }
 

templates/dialogs/compendiumBrowserSettingsDialog.hbs

@@ -1,35 +0,0 @@
-<div>
-    <label class="compendium-settings-label">{{localize "Enable Compendiums"}}</label>
-    <div class="pack-options-container">
-        {{#each packOptions as |option sourceKey|}}
-            <div class="pack-option-container">
-                <label>{{option.label}}</label>
-                <div class="sources-container">
-                    {{#each option.types as |type typeKey|}}
-                        <div class="source-container">
-                            <div class="source-inner-container">
-                                <div class="source-inner-label-container">
-                                    <input type="checkbox" class="source-input" data-source="{{@../key}}" data-type="{{typeKey}}" {{checked type.checked}} />
-                                    <label>{{type.label}}</label>
-                                </div>
-                                <a><i class="fa-solid fa-angle-down"></i></a>
-                            </div>
-
-                            <div class="packs-container">
-                                {{#each type.packs as |pack key|}}
-                                    <div class="pack-container {{#unless pack.included}}excluded{{/unless}}">
-                                        <input type="checkbox" name="{{concat "excludedCompendiumPacks." @../../key "." key}}" {{checked pack.checked}} />
-                                        <label>{{pack.label}}</label>
-                                    </div>
-                                {{/each}}
-                            </div>
-                        </div>
-                    {{/each}}
-                </div>
-            </div>
-        {{/each}}
-    </div>
-    <footer>
-        <button data-action="finish">{{localize "Save Settings"}}</button>
-    </footer>
-</div>

templates/dialogs/compendiumBrowserSettingsDialog/footer.hbs

@@ -0,0 +1,3 @@
+<footer>
+    <button data-action="finish">{{localize "Save Settings"}}</button>
+</footer>

templates/dialogs/compendiumBrowserSettingsDialog/packs.hbs

@@ -0,0 +1,34 @@
+<div>
+    <div class="types-container">
+        {{#each typePackCollections as |type|}}
+            <div class="type-container">
+                <label>{{type.label}}</label>
+
+                <div class="sources-container">
+                    {{#each type.sources as |source|}}
+                        <div class="source-container">
+                            <div class="source-inner-container">
+                                <div class="source-inner-label-container">
+                                    {{!-- <input type="checkbox" class="source-input" data-source="{{@key}}" data-type="{{@../key}}" {{checked source.checked}} /> --}}
+                                    <label>{{source.label}}</label>
+                                    <a class="source-enable-container {{#unless source.checked}}locked{{/unless}}" data-action="toggleSource" data-source="{{@key}}" data-type="{{@../key}}">
+                                        <div class="source-enable-label">{{localize "Active"}}</div>
+                                    </a>
+                                </div>
+                            </div>
+
+                            <div class="checks-container inner {{#unless source.checked}}collapsed{{/unless}}">
+                                {{#each source.packs as |pack|}}
+                                    <div class="check-container">
+                                        <input type="checkbox" class="pack-checkbox" data-type="{{pack.type}}" data-pack="{{pack.pack}}" {{checked pack.checked}} />
+                                        <label>{{pack.label}}</label>
+                                    </div>
+                                {{/each}}
+                            </div>
+                        </div>
+                    {{/each}}
+                </div>
+            </div>
+        {{/each}}
+    </div>
+</div>