From f9774f130e51446e56646ee8e72e1e0b2cda8411 Mon Sep 17 00:00:00 2001
From: Dapoulp <74197441+Dapoulp@users.noreply.github.com>
Date: Mon, 11 Aug 2025 00:18:31 +0200
Subject: [PATCH] Compendium Browser (#821)

---
 lang/en.json                                  |  3 ++-
 .../characterCreation/characterCreation.mjs   | 17 ++++++++----
 module/applications/ui/itemBrowser.mjs        | 21 +++++++++++++++
 module/config/itemBrowserConfig.mjs           |  2 +-
 styles/less/ui/item-browser/item-browser.less | 25 ++++++++++++++++--
 templates/ui/itemBrowser/sidebar.hbs          | 26 +++++++++++--------
 6 files changed, 74 insertions(+), 20 deletions(-)

diff --git a/lang/en.json b/lang/en.json
index d182a77c..8bb0580f 100755
--- a/lang/en.json
+++ b/lang/en.json
@@ -2368,7 +2368,8 @@
                 "compendiumBrowser": "Compendium Browser",
                 "rulesOn": "Rules On",
                 "rulesOff": "Rules Off",
-                "remainingUses": "Uses refresh on {type}"
+                "remainingUses": "Uses refresh on {type}",
+                "rightClickExtand": "Right-Click to extand"
             }
         }
     }
diff --git a/module/applications/characterCreation/characterCreation.mjs b/module/applications/characterCreation/characterCreation.mjs
index c160b2fd..1cadd6d4 100644
--- a/module/applications/characterCreation/characterCreation.mjs
+++ b/module/applications/characterCreation/characterCreation.mjs
@@ -383,7 +383,7 @@ export default class DhCharacterCreation extends HandlebarsApplicationMixin(Appl
                         uuid: suggestions.armor?.uuid,
                         taken: suggestions.armor?.uuid === this.equipment.armor?.uuid
                     },
-                    compendium: 'armors'
+                    compendium: 'armor'
                 };
                 context.primaryWeapon = {
                     ...this.equipment.primaryWeapon,
@@ -392,7 +392,7 @@ export default class DhCharacterCreation extends HandlebarsApplicationMixin(Appl
                         uuid: suggestions.primaryWeapon?.uuid,
                         taken: suggestions.primaryWeapon?.uuid === this.equipment.primaryWeapon?.uuid
                     },
-                    compendium: 'weapons'
+                    compendium: 'weapon'
                 };
                 context.secondaryWeapon = {
                     ...this.equipment.secondaryWeapon,
@@ -402,7 +402,7 @@ export default class DhCharacterCreation extends HandlebarsApplicationMixin(Appl
                         taken: suggestions.secondaryWeapon?.uuid === this.equipment.secondaryWeapon?.uuid
                     },
                     disabled: this.equipment.primaryWeapon?.system?.burden === burden.twoHanded.value,
-                    compendium: 'weapons'
+                    compendium: 'weapon'
                 };
                 context.inventory = {
                     take: suggestions.inventory.take,
@@ -500,11 +500,12 @@ export default class DhCharacterCreation extends HandlebarsApplicationMixin(Appl
     }
 
     static async viewCompendium(event, target) {
-        const type = target.dataset.compendium ?? target.dataset.type;
+        const type = target.dataset.compendium ?? target.dataset.type,
+            equipment = ['armor', 'weapon'];
 
         const presets = {
             compendium: 'daggerheart',
-            folder: type,
+            folder: equipment.includes(type) ? "equipments" : type,
             render: {
                 noFolder: true
             }
@@ -516,6 +517,12 @@ export default class DhCharacterCreation extends HandlebarsApplicationMixin(Appl
                 'system.domain': { key: 'system.domain', value: this.setup.class?.system.domains ?? null }
             };
 
+        if (equipment.includes(type))
+            presets.filter = {
+                'system.tier': { key: 'system.tier', value: 1 },
+                'type': { key: 'type', value: type }
+            };
+
         return (this.itemBrowser = await new ItemBrowser({ presets }).render({ force: true }));
     }
 
diff --git a/module/applications/ui/itemBrowser.mjs b/module/applications/ui/itemBrowser.mjs
index 3763bd36..f0ad98db 100644
--- a/module/applications/ui/itemBrowser.mjs
+++ b/module/applications/ui/itemBrowser.mjs
@@ -121,6 +121,16 @@ export class ItemBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
         }
     }
 
+    _attachPartListeners(partId, htmlElement, options) {
+        super._attachPartListeners(partId, htmlElement, options);
+
+        htmlElement
+            .querySelectorAll('[data-action="selectFolder"]')
+            .forEach(element => element.addEventListener("contextmenu", (event) => {
+                event.target.classList.toggle('expanded');
+            }))
+    }
+
     /* -------------------------------------------- */
     /*  Rendering                                   */
     /* -------------------------------------------- */
@@ -179,9 +189,20 @@ export class ItemBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
         }
 
         this.items = ItemBrowser.sortBy(items, 'name');
+
+        if(target) {
+            target.closest('.compendium-sidebar').querySelectorAll('[data-action="selectFolder"]').forEach(element => element.classList.remove("is-selected"))
+            target.classList.add('is-selected');
+        }
+
         this.render({ force: true });
     }
 
+    _replaceHTML(result, content, options) {
+        if(!options.isFirstRender) delete result.sidebar;
+        super._replaceHTML(result, content, options);
+    }
+
     static expandContent(_, target) {
         const parent = target.parentElement;
         parent.classList.toggle('expanded');
diff --git a/module/config/itemBrowserConfig.mjs b/module/config/itemBrowserConfig.mjs
index 5d20ae7d..6e3c0dea 100644
--- a/module/config/itemBrowserConfig.mjs
+++ b/module/config/itemBrowserConfig.mjs
@@ -325,7 +325,7 @@ export const compendiumConfig = {
             "equipments": {
                 id: "equipments",
                 keys: ["armors", "weapons", "consumables", "loot"],
-                label: "Equipments",
+                label: "Equipment",
                 type: ["armor", "weapon", "consumable", "loot"],
                 listType: "items"
             },
diff --git a/styles/less/ui/item-browser/item-browser.less b/styles/less/ui/item-browser/item-browser.less
index e7ff3b12..df35d60b 100644
--- a/styles/less/ui/item-browser/item-browser.less
+++ b/styles/less/ui/item-browser/item-browser.less
@@ -175,12 +175,23 @@
             display: flex;
             flex-direction: column;
             [data-folder-id] {
-                padding: 5px 10px;
+                display: flex;
+                justify-content: space-between;
+                padding: 10px;
                 border: 1px solid transparent;
                 font-family: @font-body;
                 transition: all 0.1s ease;
+
+                &.expanded + .subfolder-list {
+                    grid-template-rows: 1fr;
+                }
+
+                &:has(+ .subfolder-list):after {
+                    content: "+";
+                }
             }
 
+            [data-folder-id]:has(+ .subfolder-list .is-selected),
             .is-selected,
             [data-folder-id]:hover {
                 font-weight: bold;
@@ -190,9 +201,15 @@
             }
 
             .subfolder-list {
-                margin: 5px 0;
+                display: grid;
+                grid-template-rows: 0fr;
+                transition: grid-template-rows 0.3s ease-in-out;
                 gap: 0;
 
+                [data-folder-id] {
+                    padding: 5px 10px;
+                }
+
                 .is-selected,
                 [data-folder-id]:hover {
                     font-weight: bold;
@@ -200,6 +217,10 @@
                     background-color: light-dark(@dark-blue-10, @golden-10);
                     color: light-dark(@dark-blue, @golden);
                 }
+
+                .wrapper {
+                    overflow: hidden;
+                }
             }
         }
 
diff --git a/templates/ui/itemBrowser/sidebar.hbs b/templates/ui/itemBrowser/sidebar.hbs
index 6c395a4b..56d9db6d 100644
--- a/templates/ui/itemBrowser/sidebar.hbs
+++ b/templates/ui/itemBrowser/sidebar.hbs
@@ -7,19 +7,23 @@
             </summary>
             <div class="folder-list">
                 {{#each folders}}
-                    <div class="{{#if selected}} is-selected{{/if}}" data-action="selectFolder" data-folder-id="{{id}}">{{label}}</div>
+                    <div class="{{#if selected}} is-selected{{/if}}" data-action="selectFolder" data-folder-id="{{id}}" {{#if folders.length}}data-tooltip="DAGGERHEART.UI.Tooltip.rightClickExtand" data-tooltip-direction="RIGHT"{{/if}}>{{label}}</div>
                     {{!-- <div data-action="selectFolder" data-folder-id="{{id}}">{{label}}</div> --}}
-                    <div class="subfolder-list">
-                        {{#each folders}}
-                            <div
-                                class="subfolder-item {{#if selected}} is-selected{{/if}}"
-                                data-action="selectFolder"
-                                data-folder-id="{{../id}}.folders.{{id}}"
-                            >
-                                • {{label}}
+                    {{#if folders.length}}
+                        <div class="subfolder-list">
+                            <div class="wrapper">
+                                {{#each folders}}
+                                    <div
+                                        class="subfolder-item {{#if selected}} is-selected{{/if}}"
+                                        data-action="selectFolder"
+                                        data-folder-id="{{../id}}.folders.{{id}}"
+                                    >
+                                        • {{label}}
+                                    </div>
+                                {{/each}}
                             </div>
-                        {{/each}}
-                    </div>
+                        </div>
+                    {{/if}}
                 {{/each}}
             </div>
         <line-div></line-div>