DEV: Improve discovery components plugin-outlets compatibility with existing customizations

This commit changes some plugin outlets in `<Discovery::Layout>`, `<Discovery::Navigation>` and `Discovery::Topics` to improve compatibility with existing customization, simplifying the migration process to the new discovery routes.

In these components, the standard plugin outlets will receive by default at least the arguments: `category` and `tag`.

Furthermore, two new wrapping plugin outlets were added to enable the conversion of existing template overrides to the new pattern: `discovery-list-area` and `topic-list-bottom`. The new template overrides will receive a `model` argument containing the full model handled by the route.

---------

Co-authored-by: David Taylor <david@taylorhq.com>
This commit is contained in:
Sérgio Saquetim 2023-11-13 19:00:00 -03:00 committed by GitHub
parent fcf0373b13
commit 9919046c1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 92 additions and 56 deletions

View File

@ -1,28 +1,37 @@
<div class="container"> <div class="container">
<DiscourseBanner /> <DiscourseBanner />
{{#if @category}} {{#if @model.category}}
<CategoryReadOnlyBanner <CategoryReadOnlyBanner
@category={{@category}} @category={{@model.category}}
@readOnly={{@createTopicDisabled}} @readOnly={{@createTopicDisabled}}
/> />
{{/if}} {{/if}}
</div> </div>
<span> <span>
<PluginOutlet @name="discovery-list-controls-above" @connectorTagName="div" /> <PluginOutlet
@name="discovery-list-controls-above"
@connectorTagName="div"
@outletArgs={{hash category=@model.category tag=@model.tag}}
/>
</span> </span>
<div class="list-controls"> <div class="list-controls">
<PluginOutlet <PluginOutlet
@name="discovery-navigation-bar-above" @name="discovery-navigation-bar-above"
@connectorTagName="div" @connectorTagName="div"
@outletArgs={{hash category=@model.category tag=@model.tag}}
/> />
<div class="container"> <div class="container">
{{yield to="navigation"}} {{yield to="navigation"}}
</div> </div>
</div> </div>
<PluginOutlet @name="discovery-above" @connectorTagName="div" /> <PluginOutlet
@name="discovery-above"
@connectorTagName="div"
@outletArgs={{hash category=@model.category tag=@model.tag}}
/>
<div class="container list-container"> <div class="container list-container">
<div class="row"> <div class="row">
@ -31,26 +40,43 @@
{{yield to="header"}} {{yield to="header"}}
<PluginOutlet <PluginOutlet
@name="header-list-container-bottom" @name="header-list-container-bottom"
@outletArgs={{hash category=@category}} @outletArgs={{hash category=@model.category tag=@model.tag}}
/> />
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="full-width"> <div class="full-width">
<PluginOutlet @name="before-list-area" /> <PluginOutlet
@name="before-list-area"
@outletArgs={{hash category=@model.category tag=@model.tag}}
/>
<div id="list-area"> <div id="list-area">
<PluginOutlet
@name="discovery-list-area"
@outletArgs={{hash
category=@model.category
tag=@model.tag
model=@model
}}
@defaultGlimmer={{true}}
>
<PluginOutlet <PluginOutlet
@name="discovery-list-container-top" @name="discovery-list-container-top"
@connectorTagName="span" @connectorTagName="span"
@outletArgs={{hash category=@category}} @outletArgs={{hash category=@model.category tag=@model.tag}}
/> />
{{yield to="list"}} {{yield to="list"}}
</PluginOutlet>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<span> <span>
<PluginOutlet @name="discovery-below" @connectorTagName="div" /> <PluginOutlet
@name="discovery-below"
@connectorTagName="div"
@outletArgs={{hash category=@model.category tag=@model.tag}}
/>
</span> </span>

View File

@ -3,7 +3,7 @@
{{#if @category}} {{#if @category}}
<PluginOutlet <PluginOutlet
@name="above-category-heading" @name="above-category-heading"
@outletArgs={{hash category=@category}} @outletArgs={{hash category=@category tag=@tag}}
/> />
<section class="category-heading"> <section class="category-heading">
@ -18,7 +18,7 @@
<PluginOutlet <PluginOutlet
@name="category-heading" @name="category-heading"
@connectorTagName="div" @connectorTagName="div"
@outletArgs={{hash category=@category}} @outletArgs={{hash category=@category tag=@tag}}
/> />
</span> </span>
</section> </section>

View File

@ -114,6 +114,15 @@
<footer class="topic-list-bottom"> <footer class="topic-list-bottom">
<ConditionalLoadingSpinner @condition={{@model.loadingMore}} /> <ConditionalLoadingSpinner @condition={{@model.loadingMore}} />
{{#if this.allLoaded}} {{#if this.allLoaded}}
<PluginOutlet
@name="topic-list-bottom"
@outletArgs={{hash
category=@category
tag=@tag
allLoaded=this.allLoaded
model=@model
}}
>
<TopicDismissButtons <TopicDismissButtons
@position="bottom" @position="bottom"
@selectedTopics={{@bulkSelectHelper.selected}} @selectedTopics={{@bulkSelectHelper.selected}}
@ -155,5 +164,6 @@
}} }}
{{/if}} {{/if}}
</FooterMessage> </FooterMessage>
</PluginOutlet>
{{/if}} {{/if}}
</footer> </footer>

View File

@ -1,4 +1,4 @@
<Discovery::Layout> <Discovery::Layout @model={{this.model}}>
<:navigation> <:navigation>
<Discovery::Navigation <Discovery::Navigation
@showCategoryAdmin={{this.model.can_create_category}} @showCategoryAdmin={{this.model.can_create_category}}

View File

@ -1,4 +1,4 @@
<Discovery::Layout> <Discovery::Layout @model={{this.model}}>
<:navigation> <:navigation>
<Discovery::FilterNavigation <Discovery::FilterNavigation
@queryString={{this.q}} @queryString={{this.q}}

View File

@ -1,5 +1,5 @@
<Discovery::Layout <Discovery::Layout
@category={{this.model.category}} @model={{this.model}}
@createTopicDisabled={{this.createTopicDisabled}} @createTopicDisabled={{this.createTopicDisabled}}
> >
<:navigation> <:navigation>