github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-02 18:55:17 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Add outlets around the topic item and latest topic item poster (#30776)

Browse Source
This commit is contained in:
Sérgio Saquetim 2025-01-15 13:38:06 -03:00 committed by GitHub
parent a647031171
commit 34acc9fe54
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 147 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

255
app/assets/javascripts/discourse/app/components/topic-list/item.gjs
View File

@ -220,131 +220,148 @@ export default class Item extends Component {
@name="above-topic-list-item" @name="above-topic-list-item"
@outletArgs={{hash topic=@topic}} @outletArgs={{hash topic=@topic}}
/> />
{{#if this.useMobileLayout}} {{! Do not include @columns as argument to the wrapper outlet below ~}}
<td class="topic-list-data"> {{! We don't want it to be able to override core behavior just copy/pasting the code ~}}
<div class="pull-left"> <PluginOutlet
{{#if @bulkSelectEnabled}} @name="topic-list-item"
<label for="bulk-select-{{@topic.id}}"> @outletArgs={{hash
<input topic=@topic
{{on "click" this.onBulkSelectToggle}} bulkSelectEnabled=@bulkSelectEnabled
checked={{this.isSelected}} onBulkSelectToggle=this.onBulkSelectToggle
type="checkbox" isSelected=this.isSelected
id="bulk-select-{{@topic.id}}" }}
class="bulk-select" >
/> {{#if this.useMobileLayout}}
</label> <td
{{else}} class={{concatClass
<PluginOutlet "topic-list-data"
@name="topic-list-item-mobile-avatar" (if @bulkSelectEnabled "bulk-select-enabled")
@outletArgs={{hash topic=@topic}} }}
> >
<a <div class="pull-left">
href={{@topic.lastPostUrl}} {{#if @bulkSelectEnabled}}
aria-label={{i18n <label for="bulk-select-{{@topic.id}}">
"latest_poster_link" <input
username=@topic.lastPosterUser.username {{on "click" this.onBulkSelectToggle}}
}} checked={{this.isSelected}}
data-user-card={{@topic.lastPosterUser.username}} type="checkbox"
>{{avatar @topic.lastPosterUser imageSize="large"}}</a> id="bulk-select-{{@topic.id}}"
</PluginOutlet> class="bulk-select"
{{/if}}
</div>
<div class="topic-item-metadata right">
{{~! no whitespace ~}}
<PluginOutlet
@name="topic-list-before-link"
@outletArgs={{hash topic=@topic}}
/>
<div class="main-link">
{{~! no whitespace ~}}
<PluginOutlet
@name="topic-list-before-status"
@outletArgs={{hash topic=@topic}}
/>
{{~! no whitespace ~}}
<TopicStatus @topic={{@topic}} />
{{~! no whitespace ~}}
<TopicLink
{{on "focus" this.onTitleFocus}}
{{on "blur" this.onTitleBlur}}
@topic={{@topic}}
class="raw-link raw-topic-link"
/>
{{~#if @topic.featured_link~}}
&nbsp;
{{~topicFeaturedLink @topic}}
{{~/if~}}
<PluginOutlet
@name="topic-list-after-title"
@outletArgs={{hash topic=@topic}}
/>
{{~#if @topic.unseen~}}
<span class="topic-post-badges">&nbsp;<span
class="badge-notification new-topic"
></span></span>
{{~/if~}}
{{~#if this.expandPinned~}}
<TopicExcerpt @topic={{@topic}} />
{{~/if~}}
<PluginOutlet
@name="topic-list-main-link-bottom"
@outletArgs={{hash topic=@topic}}
/>
</div>
{{~! no whitespace ~}}
<PluginOutlet
@name="topic-list-after-main-link"
@outletArgs={{hash topic=@topic}}
/>
<div class="pull-right">
<PostCountOrBadges
@topic={{@topic}}
@postBadgesEnabled={{@showTopicPostBadges}}
/>
</div>
<div class="topic-item-stats clearfix">
<span class="topic-item-stats__category-tags">
{{#unless @hideCategory}}
<PluginOutlet
@name="topic-list-before-category"
@outletArgs={{hash topic=@topic}}
/> />
{{categoryLink @topic.category}} </label>
{{/unless}} {{else}}
<PluginOutlet
@name="topic-list-item-mobile-avatar"
@outletArgs={{hash topic=@topic}}
>
<a
href={{@topic.lastPostUrl}}
aria-label={{i18n
"latest_poster_link"
username=@topic.lastPosterUser.username
}}
data-user-card={{@topic.lastPosterUser.username}}
>{{avatar @topic.lastPosterUser imageSize="large"}}</a>
</PluginOutlet>
{{/if}}
</div>
{{discourseTags @topic mode="list"}} <div class="topic-item-metadata right">
</span> {{~! no whitespace ~}}
<PluginOutlet
@name="topic-list-before-link"
@outletArgs={{hash topic=@topic}}
/>
<div class="num activity last"> <div class="main-link">
<span title={{@topic.bumpedAtTitle}} class="age activity"> {{~! no whitespace ~}}
<a href={{@topic.lastPostUrl}}>{{formatDate <PluginOutlet
@topic.bumpedAt @name="topic-list-before-status"
format="tiny" @outletArgs={{hash topic=@topic}}
noTitle="true" />
}}</a> {{~! no whitespace ~}}
<TopicStatus @topic={{@topic}} />
{{~! no whitespace ~}}
<TopicLink
{{on "focus" this.onTitleFocus}}
{{on "blur" this.onTitleBlur}}
@topic={{@topic}}
class="raw-link raw-topic-link"
/>
{{~#if @topic.featured_link~}}
&nbsp;
{{~topicFeaturedLink @topic}}
{{~/if~}}
<PluginOutlet
@name="topic-list-after-title"
@outletArgs={{hash topic=@topic}}
/>
{{~#if @topic.unseen~}}
<span class="topic-post-badges">&nbsp;<span
class="badge-notification new-topic"
></span></span>
{{~/if~}}
{{~#if this.expandPinned~}}
<TopicExcerpt @topic={{@topic}} />
{{~/if~}}
<PluginOutlet
@name="topic-list-main-link-bottom"
@outletArgs={{hash topic=@topic}}
/>
</div>
{{~! no whitespace ~}}
<PluginOutlet
@name="topic-list-after-main-link"
@outletArgs={{hash topic=@topic}}
/>
<div class="pull-right">
<PostCountOrBadges
@topic={{@topic}}
@postBadgesEnabled={{@showTopicPostBadges}}
/>
</div>
<div class="topic-item-stats clearfix">
<span class="topic-item-stats__category-tags">
{{#unless @hideCategory}}
<PluginOutlet
@name="topic-list-before-category"
@outletArgs={{hash topic=@topic}}
/>
{{categoryLink @topic.category}}
{{/unless}}
{{discourseTags @topic mode="list"}}
</span> </span>
<div class="num activity last">
<span title={{@topic.bumpedAtTitle}} class="age activity">
<a href={{@topic.lastPostUrl}}>{{formatDate
@topic.bumpedAt
format="tiny"
noTitle="true"
}}</a>
</span>
</div>
</div> </div>
</div> </div>
</div> </td>
</td> {{else}}
{{else}} {{#each @columns as |entry|}}
{{#each @columns as |entry|}} <entry.value.item
<entry.value.item @topic={{@topic}}
@topic={{@topic}} @bulkSelectEnabled={{@bulkSelectEnabled}}
@bulkSelectEnabled={{@bulkSelectEnabled}} @onBulkSelectToggle={{this.onBulkSelectToggle}}
@onBulkSelectToggle={{this.onBulkSelectToggle}} @isSelected={{this.isSelected}}
@isSelected={{this.isSelected}} @showTopicPostBadges={{@showTopicPostBadges}}
@showTopicPostBadges={{@showTopicPostBadges}} @hideCategory={{@hideCategory}}
@hideCategory={{@hideCategory}} @tagsForUser={{@tagsForUser}}
@tagsForUser={{@tagsForUser}} @expandPinned={{this.expandPinned}}
@expandPinned={{this.expandPinned}} />
/> {{/each}}
{{/each}} {{/if}}
{{/if}} </PluginOutlet>
</tr> </tr>
</template> </template>
} }

17
app/assets/javascripts/discourse/app/components/topic-list/latest-topic-list-item.gjs
View File

@ -48,12 +48,17 @@ export default class LatestTopicListItem extends Component {
@outletArgs={{hash topic=@topic}} @outletArgs={{hash topic=@topic}}
/> />
<div class="topic-poster"> <PluginOutlet
<UserLink @user={{@topic.lastPosterUser}}> @name="latest-topic-list-item-topic-poster"
{{avatar @topic.lastPosterUser imageSize="large"}} @outletArgs={{hash topic=@topic}}
</UserLink> >
<UserAvatarFlair @user={{@topic.lastPosterUser}} /> <div class="topic-poster">
</div> <UserLink @user={{@topic.lastPosterUser}}>
{{avatar @topic.lastPosterUser imageSize="large"}}
</UserLink>
<UserAvatarFlair @user={{@topic.lastPosterUser}} />
</div>
</PluginOutlet>
<div class="main-link"> <div class="main-link">
<div class="top-row"> <div class="top-row">