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

View File

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

View File

@ -114,46 +114,56 @@
<footer class="topic-list-bottom">
<ConditionalLoadingSpinner @condition={{@model.loadingMore}} />
{{#if this.allLoaded}}
<TopicDismissButtons
@position="bottom"
@selectedTopics={{@bulkSelectHelper.selected}}
@model={{@model}}
@showResetNew={{@showResetNew}}
@showDismissRead={{@showDismissRead}}
@resetNew={{this.resetNew}}
@dismissRead={{this.dismissRead}}
/>
<FooterMessage
@education={{this.footerEducation}}
@message={{this.footerMessage}}
<PluginOutlet
@name="topic-list-bottom"
@outletArgs={{hash
category=@category
tag=@tag
allLoaded=this.allLoaded
model=@model
}}
>
{{#if @tag}}
{{html-safe
(i18n "topic.browse_all_tags_or_latest" basePath=(base-path))
}}
{{else if this.latest}}
{{#if @category.canCreateTopic}}
<DiscourseLinkedText
@action={{fn
this.composer.openNewTopic
(hash category=@category preferDraft=true)
}}
@text="topic.suggest_create_topic"
/>
<TopicDismissButtons
@position="bottom"
@selectedTopics={{@bulkSelectHelper.selected}}
@model={{@model}}
@showResetNew={{@showResetNew}}
@showDismissRead={{@showDismissRead}}
@resetNew={{this.resetNew}}
@dismissRead={{this.dismissRead}}
/>
<FooterMessage
@education={{this.footerEducation}}
@message={{this.footerMessage}}
>
{{#if @tag}}
{{html-safe
(i18n "topic.browse_all_tags_or_latest" basePath=(base-path))
}}
{{else if this.latest}}
{{#if @category.canCreateTopic}}
<DiscourseLinkedText
@action={{fn
this.composer.openNewTopic
(hash category=@category preferDraft=true)
}}
@text="topic.suggest_create_topic"
/>
{{/if}}
{{else if this.top}}
{{html-safe
(i18n
"topic.browse_all_categories_latest_or_top" basePath=(base-path)
)
}}
<TopPeriodButtons @period={{@period}} @action={{@changePeriod}} />
{{else}}
{{html-safe
(i18n "topic.browse_all_categories_latest" basePath=(base-path))
}}
{{/if}}
{{else if this.top}}
{{html-safe
(i18n
"topic.browse_all_categories_latest_or_top" basePath=(base-path)
)
}}
<TopPeriodButtons @period={{@period}} @action={{@changePeriod}} />
{{else}}
{{html-safe
(i18n "topic.browse_all_categories_latest" basePath=(base-path))
}}
{{/if}}
</FooterMessage>
</FooterMessage>
</PluginOutlet>
{{/if}}
</footer>

View File

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

View File

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

View File

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