try service approach

This commit is contained in:
David Taylor 2024-04-11 19:39:13 +01:00
parent 623923ef69
commit d6b0a581de
No known key found for this signature in database
GPG Key ID: 46904C18B1D3F434
3 changed files with 44 additions and 5 deletions

View File

@ -0,0 +1,6 @@
import { hash } from "@ember/helper";
import PluginOutlet from "./plugin-outlet";
<template>
<PluginOutlet @name="after-post" @outletArgs={{hash post=@data.post}} />
</template>

View File

@ -6,7 +6,7 @@ export default class RenderGlimmerContainer extends Component {
<template>
{{#each this.renderGlimmer._registrations as |info|}}
{{#in-element info.element insertBefore=null}}
{{#in-element info.element insertBefore=info.insertBefore}}
<info.component
@data={{info.data}}
@setWrapperElementAttrs={{info.setWrapperElementAttrs}}

View File

@ -1,7 +1,9 @@
import { getOwner } from "@ember/application";
import { TrackedObject } from "@ember-compat/tracked-built-ins";
import { hbs } from "ember-cli-htmlbars";
import { Promise } from "rsvp";
import { h } from "virtual-dom";
import AfterPostOutlet from "discourse/components/after-post-outlet";
import ShareTopicModal from "discourse/components/modal/share-topic";
import { dateNode } from "discourse/helpers/node";
import autoGroupFlairForUser from "discourse/lib/avatar-flair";
@ -936,13 +938,17 @@ export function addPostClassesCallback(callback) {
export default createWidget("post", {
buildKey: (attrs) => `post-${attrs.id}`,
services: ["dialog", "user-tips"],
services: ["dialog", "user-tips", "render-glimmer"],
shadowTree: true,
buildAttributes(attrs) {
return attrs.height
? { style: `min-height: ${attrs.height}px` }
: undefined;
const attributes = {
"data-render-glimmer-ref": attrs.renderGlimmerRef,
};
if (attrs.height) {
attributes["style"] = `min-height: ${attrs.height}px`;
}
},
buildId(attrs) {
@ -1012,6 +1018,33 @@ export default createWidget("post", {
return [this.attach("post-article", attrs)];
},
didRenderWidget() {
let info = this.state.renderGlimmerInfo;
if (info) {
info.data = { post: this.model };
} else {
const insertAfter = document
.getElementById(`post_${this.attrs.post_number}`)
.closest(".topic-post");
this.state.renderGlimmerInfo = info = new TrackedObject({
element: insertAfter.parentElement,
insertBefore: insertAfter.nextElementSibling,
component: AfterPostOutlet,
data: { post: this.model },
});
this.renderGlimmer.add(info);
}
},
destroy() {
const info = this.state.renderGlimmerInfo;
if (info) {
this.renderGlimmer.remove(info);
}
},
toggleLike() {
const post = this.model;
const likeAction = post.get("likeAction");