From 41d62b8c8250097b47bd7023a3ec5dba82b3a9b1 Mon Sep 17 00:00:00 2001
From: Davide Iadeluca <146922689+DavideIadeluca@users.noreply.github.com>
Date: Tue, 11 Feb 2025 20:23:02 +0100
Subject: [PATCH] feat: improve extensibility of `IndexPage` (#4182)

---
 .../js/src/forum/components/IndexPage.tsx     | 24 +++++++++++++++----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/framework/core/js/src/forum/components/IndexPage.tsx b/framework/core/js/src/forum/components/IndexPage.tsx
index 992207779..8cc0bd4b2 100644
--- a/framework/core/js/src/forum/components/IndexPage.tsx
+++ b/framework/core/js/src/forum/components/IndexPage.tsx
@@ -63,15 +63,29 @@ export default class IndexPage<CustomAttrs extends IIndexPageAttrs = IIndexPageA
   view() {
     return (
       <PageStructure className="IndexPage" hero={this.hero.bind(this)} sidebar={this.sidebar.bind(this)}>
-        <div className="IndexPage-toolbar">
-          <ul className="IndexPage-toolbar-view">{listItems(this.viewItems().toArray())}</ul>
-          <ul className="IndexPage-toolbar-action">{listItems(this.actionItems().toArray())}</ul>
-        </div>
-        <DiscussionList state={app.discussions} />
+        {this.contentItems().toArray()}
       </PageStructure>
     );
   }
 
+  contentItems(): ItemList<Mithril.Children> {
+    const items = new ItemList<Mithril.Children>();
+
+    items.add('toolbar', <div className="IndexPage-toolbar">{this.toolbarItems().toArray()}</div>, 100);
+    items.add('discussionList', <DiscussionList state={app.discussions} />, 90);
+
+    return items;
+  }
+
+  toolbarItems(): ItemList<Mithril.Children> {
+    const items = new ItemList<Mithril.Children>();
+
+    items.add('view', <ul className="IndexPage-toolbar-view">{listItems(this.viewItems().toArray())}</ul>, 100);
+    items.add('action', <ul className="IndexPage-toolbar-action">{listItems(this.actionItems().toArray())}</ul>, 90);
+
+    return items;
+  }
+
   setTitle() {
     app.setTitle(extractText(app.translator.trans('core.forum.index.meta_title_text')));
     app.setTitleCount(0);