mirror of
https://github.com/discourse/discourse.git
synced 2024-11-22 09:12:45 +08:00
DEV: Use helperFn
in d-presence (#29461)
This commit is contained in:
parent
7af728048c
commit
a236e368e4
|
@ -1,10 +1,10 @@
|
||||||
import Component from "@glimmer/component";
|
import Component from "@glimmer/component";
|
||||||
import { cached, tracked } from "@glimmer/tracking";
|
import { cached, tracked } from "@glimmer/tracking";
|
||||||
import { service } from "@ember/service";
|
import { service } from "@ember/service";
|
||||||
import { modifier } from "ember-modifier";
|
|
||||||
import { gt } from "truth-helpers";
|
import { gt } from "truth-helpers";
|
||||||
import UserLink from "discourse/components/user-link";
|
import UserLink from "discourse/components/user-link";
|
||||||
import avatar from "discourse/helpers/avatar";
|
import avatar from "discourse/helpers/avatar";
|
||||||
|
import helperFn from "discourse/helpers/helper-fn";
|
||||||
import i18n from "discourse-common/helpers/i18n";
|
import i18n from "discourse-common/helpers/i18n";
|
||||||
|
|
||||||
export default class ComposerPresenceDisplay extends Component {
|
export default class ComposerPresenceDisplay extends Component {
|
||||||
|
@ -17,7 +17,7 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
@tracked whisperChannel;
|
@tracked whisperChannel;
|
||||||
@tracked editChannel;
|
@tracked editChannel;
|
||||||
|
|
||||||
setupReplyChannel = modifier(() => {
|
setupReplyChannel = helperFn((_, on) => {
|
||||||
const topic = this.args.model.topic;
|
const topic = this.args.model.topic;
|
||||||
if (!topic || !this.isReply) {
|
if (!topic || !this.isReply) {
|
||||||
return;
|
return;
|
||||||
|
@ -29,10 +29,10 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
replyChannel.subscribe();
|
replyChannel.subscribe();
|
||||||
this.replyChannel = replyChannel;
|
this.replyChannel = replyChannel;
|
||||||
|
|
||||||
return () => replyChannel.unsubscribe();
|
on.cleanup(() => replyChannel.unsubscribe());
|
||||||
});
|
});
|
||||||
|
|
||||||
setupWhisperChannel = modifier(() => {
|
setupWhisperChannel = helperFn((_, on) => {
|
||||||
if (
|
if (
|
||||||
!this.args.model.topic ||
|
!this.args.model.topic ||
|
||||||
!this.isReply ||
|
!this.isReply ||
|
||||||
|
@ -48,10 +48,10 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
whisperChannel.subscribe();
|
whisperChannel.subscribe();
|
||||||
this.whisperChannel = whisperChannel;
|
this.whisperChannel = whisperChannel;
|
||||||
|
|
||||||
return () => whisperChannel.unsubscribe();
|
on.cleanup(() => whisperChannel.unsubscribe());
|
||||||
});
|
});
|
||||||
|
|
||||||
setupEditChannel = modifier(() => {
|
setupEditChannel = helperFn((_, on) => {
|
||||||
if (!this.args.model.post || !this.isEdit) {
|
if (!this.args.model.post || !this.isEdit) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -62,10 +62,10 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
editChannel.subscribe();
|
editChannel.subscribe();
|
||||||
this.editChannel = editChannel;
|
this.editChannel = editChannel;
|
||||||
|
|
||||||
return () => editChannel.unsubscribe();
|
on.cleanup(() => editChannel.unsubscribe());
|
||||||
});
|
});
|
||||||
|
|
||||||
notifyState = modifier(() => {
|
notifyState = helperFn((_, on) => {
|
||||||
const { topic, post, reply } = this.args.model;
|
const { topic, post, reply } = this.args.model;
|
||||||
const raw = this.isEdit ? post?.raw || "" : "";
|
const raw = this.isEdit ? post?.raw || "" : "";
|
||||||
const entity = this.isEdit ? post : topic;
|
const entity = this.isEdit ? post : topic;
|
||||||
|
@ -74,7 +74,7 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
this.composerPresenceManager.notifyState(this.state, entity?.id);
|
this.composerPresenceManager.notifyState(this.state, entity?.id);
|
||||||
}
|
}
|
||||||
|
|
||||||
return () => this.composerPresenceManager.leave();
|
on.cleanup(() => this.composerPresenceManager.leave());
|
||||||
});
|
});
|
||||||
|
|
||||||
get isReply() {
|
get isReply() {
|
||||||
|
@ -112,38 +112,36 @@ export default class ComposerPresenceDisplay extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div
|
{{this.setupReplyChannel}}
|
||||||
{{this.setupReplyChannel}}
|
{{this.setupWhisperChannel}}
|
||||||
{{this.setupWhisperChannel}}
|
{{this.setupEditChannel}}
|
||||||
{{this.setupEditChannel}}
|
{{this.notifyState}}
|
||||||
{{this.notifyState}}
|
|
||||||
>
|
|
||||||
{{#if (gt this.users.length 0)}}
|
|
||||||
<div class="presence-users">
|
|
||||||
<div class="presence-avatars">
|
|
||||||
{{#each this.users as |user|}}
|
|
||||||
<UserLink @user={{user}}>
|
|
||||||
{{avatar user imageSize="small"}}
|
|
||||||
</UserLink>
|
|
||||||
{{/each}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span class="presence-text">
|
{{#if (gt this.users.length 0)}}
|
||||||
<span class="description">
|
<div class="presence-users">
|
||||||
{{~#if this.isReply~}}
|
<div class="presence-avatars">
|
||||||
{{i18n "presence.replying" count=this.users.length}}
|
{{#each this.users as |user|}}
|
||||||
{{~else~}}
|
<UserLink @user={{user}}>
|
||||||
{{i18n "presence.editing" count=this.users.length}}
|
{{avatar user imageSize="small"}}
|
||||||
{{~/if~}}
|
</UserLink>
|
||||||
</span>
|
{{/each}}
|
||||||
<span class="wave">
|
|
||||||
<span class="dot">.</span>
|
|
||||||
<span class="dot">.</span>
|
|
||||||
<span class="dot">.</span>
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{/if}}
|
|
||||||
</div>
|
<span class="presence-text">
|
||||||
|
<span class="description">
|
||||||
|
{{~#if this.isReply~}}
|
||||||
|
{{i18n "presence.replying" count=this.users.length}}
|
||||||
|
{{~else~}}
|
||||||
|
{{i18n "presence.editing" count=this.users.length}}
|
||||||
|
{{~/if~}}
|
||||||
|
</span>
|
||||||
|
<span class="wave">
|
||||||
|
<span class="dot">.</span>
|
||||||
|
<span class="dot">.</span>
|
||||||
|
<span class="dot">.</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
||||||
</template>
|
</template>
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
import Component from "@glimmer/component";
|
import Component from "@glimmer/component";
|
||||||
import { cached, tracked } from "@glimmer/tracking";
|
import { cached, tracked } from "@glimmer/tracking";
|
||||||
import { service } from "@ember/service";
|
import { service } from "@ember/service";
|
||||||
import { modifier } from "ember-modifier";
|
|
||||||
import { gt } from "truth-helpers";
|
import { gt } from "truth-helpers";
|
||||||
import UserLink from "discourse/components/user-link";
|
import UserLink from "discourse/components/user-link";
|
||||||
import avatar from "discourse/helpers/avatar";
|
import avatar from "discourse/helpers/avatar";
|
||||||
|
import helperFn from "discourse/helpers/helper-fn";
|
||||||
import i18n from "discourse-common/helpers/i18n";
|
import i18n from "discourse-common/helpers/i18n";
|
||||||
|
|
||||||
export default class TopicPresenceDisplay extends Component {
|
export default class TopicPresenceDisplay extends Component {
|
||||||
|
@ -14,17 +14,17 @@ export default class TopicPresenceDisplay extends Component {
|
||||||
@tracked replyChannel;
|
@tracked replyChannel;
|
||||||
@tracked whisperChannel;
|
@tracked whisperChannel;
|
||||||
|
|
||||||
setupReplyChannel = modifier(() => {
|
setupReplyChannel = helperFn((_, on) => {
|
||||||
const replyChannel = this.presence.getChannel(
|
const replyChannel = this.presence.getChannel(
|
||||||
`/discourse-presence/reply/${this.args.topic.id}`
|
`/discourse-presence/reply/${this.args.topic.id}`
|
||||||
);
|
);
|
||||||
replyChannel.subscribe();
|
replyChannel.subscribe();
|
||||||
this.replyChannel = replyChannel;
|
this.replyChannel = replyChannel;
|
||||||
|
|
||||||
return () => replyChannel.unsubscribe();
|
on.cleanup(() => replyChannel.unsubscribe());
|
||||||
});
|
});
|
||||||
|
|
||||||
setupWhisperChannels = modifier(() => {
|
setupWhisperChannels = helperFn((_, on) => {
|
||||||
if (!this.currentUser.staff) {
|
if (!this.currentUser.staff) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -35,7 +35,7 @@ export default class TopicPresenceDisplay extends Component {
|
||||||
whisperChannel.subscribe();
|
whisperChannel.subscribe();
|
||||||
this.whisperChannel = whisperChannel;
|
this.whisperChannel = whisperChannel;
|
||||||
|
|
||||||
return () => whisperChannel.unsubscribe();
|
on.cleanup(() => whisperChannel.unsubscribe());
|
||||||
});
|
});
|
||||||
|
|
||||||
@cached
|
@cached
|
||||||
|
@ -49,29 +49,30 @@ export default class TopicPresenceDisplay extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div {{this.setupReplyChannel}} {{this.setupWhisperChannels}}>
|
{{this.setupReplyChannel}}
|
||||||
{{#if (gt this.users.length 0)}}
|
{{this.setupWhisperChannels}}
|
||||||
<div class="presence-users">
|
|
||||||
<div class="presence-avatars">
|
|
||||||
{{#each this.users as |user|}}
|
|
||||||
<UserLink @user={{user}}>
|
|
||||||
{{avatar user imageSize="small"}}
|
|
||||||
</UserLink>
|
|
||||||
{{/each}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span class="presence-text">
|
{{#if (gt this.users.length 0)}}
|
||||||
<span class="description">
|
<div class="presence-users">
|
||||||
{{i18n "presence.replying_to_topic" count=this.users.length}}
|
<div class="presence-avatars">
|
||||||
</span>
|
{{#each this.users as |user|}}
|
||||||
<span class="wave">
|
<UserLink @user={{user}}>
|
||||||
<span class="dot">.</span>
|
{{avatar user imageSize="small"}}
|
||||||
<span class="dot">.</span>
|
</UserLink>
|
||||||
<span class="dot">.</span>
|
{{/each}}
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{/if}}
|
|
||||||
</div>
|
<span class="presence-text">
|
||||||
|
<span class="description">
|
||||||
|
{{i18n "presence.replying_to_topic" count=this.users.length}}
|
||||||
|
</span>
|
||||||
|
<span class="wave">
|
||||||
|
<span class="dot">.</span>
|
||||||
|
<span class="dot">.</span>
|
||||||
|
<span class="dot">.</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
||||||
</template>
|
</template>
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user