github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-01-23 04:43:00 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Add latest-topic-list-item-class value transformer (#30718)

Browse Source 
Add transformer to enable adding classes to the component `LatestTopicListItem`
This commit is contained in:
Sérgio Saquetim 2025-01-13 15:39:00 -03:00 committed by GitHub
parent d2ee0609a6
commit 828c646aab
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 48 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,12 +13,19 @@ import discourseTags from "discourse/helpers/discourse-tags";
import formatDate from "discourse/helpers/format-date";
import topicFeaturedLink from "discourse/helpers/topic-featured-link";
import topicLink from "discourse/helpers/topic-link";
import { applyValueTransformer } from "discourse/lib/transformer";
export default class LatestTopicListItem extends Component {
get tagClassNames() {
return this.args.topic.tags?.map((tagName) => `tag-${tagName}`);
}
get additionalClasses() {
return applyValueTransformer("latest-topic-list-item-class", [], {
topic: this.args.topic,
});
}
<template>
<div
data-topic-id={{@topic.id}}
@ -32,6 +39,7 @@ export default class LatestTopicListItem extends Component {
(if @topic.pinned "pinned")
(if @topic.closed "closed")
(if @topic.visited "visited")
this.additionalClasses
}}
>
<PluginOutlet

7
app/assets/javascripts/discourse/app/lib/transformer/registry.js
View File

@ -12,19 +12,20 @@ export const VALUE_TRANSFORMERS = Object.freeze([
"home-logo-href",
"home-logo-image-url",
"invite-simple-mode-topic",
"latest-topic-list-item-class",
"mentions-class",
"more-topics-tabs",
"move-to-topic-merge-options",
"move-to-topic-move-options",
"navigation-bar-dropdown-mode",
"navigation-bar-dropdown-icon",
"parent-category-row-class-mobile",
"navigation-bar-dropdown-mode",
"parent-category-row-class",
"parent-category-row-class-mobile",
"post-menu-buttons",
"small-user-attrs",
"topic-list-class",
"topic-list-columns",
"topic-list-header-sortable-column",
"topic-list-class",
"topic-list-item-class",
"topic-list-item-expand-pinned",
"topic-list-item-mobile-layout",

36
app/assets/javascripts/discourse/tests/integration/components/latest-topic-list-item-test.gjs Normal file
View File

@ -0,0 +1,36 @@
import { render } from "@ember/test-helpers";
import { module, test } from "qunit";
import LatestTopicListItem from "discourse/components/topic-list/latest-topic-list-item";
import { withPluginApi } from "discourse/lib/plugin-api";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
module("Integration | Component | latest-topic-list-item", function (hooks) {
setupRenderingTest(hooks);
test("latest-topic-list-item-class value transformer", async function (assert) {
withPluginApi("1.39.0", (api) => {
api.registerValueTransformer(
"latest-topic-list-item-class",
({ value, context }) => {
if (context.topic.get("foo")) {
value.push("bar");
}
return value;
}
);
});
const store = this.owner.lookup("service:store");
const topic = store.createRecord("topic", { id: 1234, foo: true });
const topic2 = store.createRecord("topic", { id: 1235, foo: false });
await render(<template>
<LatestTopicListItem @topic={{topic}} />
<LatestTopicListItem @topic={{topic2}} />
</template>);
assert.dom(".latest-topic-list-item[data-topic-id='1234']").hasClass("bar");
assert
.dom(".latest-topic-list-item[data-topic-id='1235']")
.doesNotHaveClass("bar");
});
});