osr-plastic/osr-discourse-src
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

WIP: Moving things around, rely only on chat-message-actions

Browse Source
This commit is contained in:
Martin Brennan 2023-02-16 14:51:57 +10:00
parent e6fb4345ff
commit dcf78439ac
8 changed files with 55 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
plugins/chat/assets/javascripts/discourse/components/chat-live-pane.hbs
View File

@ -73,10 +73,7 @@
@setReplyTo={{action "setReplyTo"}}
@replyMessageClicked={{action "replyMessageClicked"}}
@editButtonClicked={{action "editButtonClicked"}}
@selectingMessages={{this.livePaneReactor.selectingMessages}}
@onStartSelectingMessages={{this.onStartSelectingMessages}}
@onSelectMessage={{this.onSelectMessageOld}}
@bulkSelectMessages={{this.bulkSelectMessages}}
@selectingMessages={{this.livePanel.selectingMessages}}
@fullPage={{this.fullPage}}
@afterReactionAdded={{action "reStickScrollIfNeeded"}}
@isHovered={{eq message.id this.hoveredMessageId}}
@ -119,12 +116,12 @@
</div>
{{/if}}
{{#if this.livePaneReactor.selectingMessages}}
{{#if this.livePanel.selectingMessages}}
<ChatSelectionManager
@selectedMessageIds={{this.livePaneReactor.selectedMessageIds}}
@selectedMessageIds={{this.livePanel.selectedMessageIds}}
@chatChannel={{this.chatChannel}}
@canModerate={{this.details.can_moderate}}
@cancelSelecting={{action "cancelSelecting"}}
@cancelSelecting={{action this.livePanel.cancelSelecting}}
/>
{{else}}
{{#if (or this.chatChannel.isDraft this.chatChannel.isFollowing)}}

52
plugins/chat/assets/javascripts/discourse/components/chat-live-pane.js
View File

@ -2,7 +2,7 @@ import isElementInViewport from "discourse/lib/is-element-in-viewport";
import { cloneJSON } from "discourse-common/lib/object";
import ChatMessage from "discourse/plugins/chat/discourse/models/chat-message";
import ChatMessageActions from "discourse/plugins/chat/discourse/lib/chat-message-actions";
import ChatLivePaneReactor from "discourse/plugins/chat/discourse/lib/chat-live-pane-reactor";
import ChatLivePanel from "discourse/plugins/chat/discourse/lib/chat-live-panel";
import Component from "@ember/component";
import discourseComputed, {
afterRender,
@ -50,7 +50,6 @@ export default Component.extend({
allPastMessagesLoaded: false,
sendingLoading: false,
selectingMessages: false,
stickyScroll: true,
stickyScrollTimer: null,
showChatQuoteSuccess: false,
@ -68,6 +67,9 @@ export default Component.extend({
targetMessageId: null,
hasNewMessages: null,
livePanel: null,
messageActionsHandler: null,
chat: service(),
chatChannelsManager: service(),
router: service(),
@ -111,8 +113,8 @@ export default Component.extend({
// works the same in threads + live pane, however
// reactions could be different? replies will be different
// for sure...
this.livePaneReactor = new ChatLivePaneReactor();
this.messageActionsHandler = new ChatMessageActions(this.livePaneReactor);
this.livePanel = new ChatLivePanel();
this.messageActionsHandler = new ChatMessageActions(this.livePanel);
},
didInsertElement() {
@ -207,7 +209,7 @@ export default Component.extend({
// too or ideally just move messages onto the channel
@observes("messages")
onMessagesChange() {
this.livePaneReactor.messages = this.messages;
this.livePanel.messages = this.messages;
},
@discourseComputed("chatChannel.isDirectMessageChannel")
@ -1174,8 +1176,7 @@ export default Component.extend({
this.messageLookup = {};
this.set("allPastMessagesLoaded", false);
this.set("registeredChatChannelId", null);
this.set("selectingMessages", false);
this.livePaneReactor.selectingMessages = false;
this.livePanel.cancelSelecting();
},
_resetAfterSend() {
@ -1260,48 +1261,11 @@ export default Component.extend({
return document.querySelector("#chat-progress-bar-container");
},
@action
onStartSelectingMessages(message) {
this.lastSelectedMessage = message;
this.set("selectingMessages", true);
},
@action
cancelSelecting() {
this.livePaneReactor.selectingMessages = false;
this.set("selectingMessages", false);
this.messages.setEach("selected", false);
},
@action
onSelectMessageOld(message) {
this.lastSelectedMessage = message;
},
@action
navigateToIndex() {
this.router.transitionTo("chat.index");
},
@action
bulkSelectMessages(message, checked) {
const lastSelectedIndex = this._findIndexOfMessage(
this.lastSelectedMessage
);
const newlySelectedIndex = this._findIndexOfMessage(message);
const sortedIndices = [lastSelectedIndex, newlySelectedIndex].sort(
(a, b) => a - b
);
for (let i = sortedIndices[0]; i <= sortedIndices[1]; i++) {
this.messages[i].set("selected", checked);
}
},
_findIndexOfMessage(message) {
return this.messages.findIndex((m) => m.id === message.id);
},
@action
onCloseFullScreen() {
this.chatStateManager.prefersDrawer();

10
plugins/chat/assets/javascripts/discourse/components/chat-message-actions-mobile.js
View File

@ -32,6 +32,16 @@ export default Component.extend({
@action
actAndCloseMenu(fnId) {
if (fnId === "copyLinkToMessage") {
this.messageActionsHandler.copyLink(this.message);
return this.onCloseMenu();
}
if (fnId === "selectMessage") {
this.messageActionsHandler.selectMessage(this.message, true);
return this.onCloseMenu();
}
this.messageActions[fnId]?.();
this.onCloseMenu();
},

27
plugins/chat/assets/javascripts/discourse/components/chat-message.js
View File

@ -3,13 +3,11 @@ import { openBookmarkModal } from "discourse/controllers/bookmark";
import { isTesting } from "discourse-common/config/environment";
import Component from "@glimmer/component";
import I18n from "I18n";
import getURL from "discourse-common/lib/get-url";
import optionalService from "discourse/lib/optional-service";
import { bind } from "discourse-common/utils/decorators";
import EmberObject, { action } from "@ember/object";
import { ajax } from "discourse/lib/ajax";
import { cancel, schedule } from "@ember/runloop";
import { clipboardCopy } from "discourse/lib/utilities";
import { inject as service } from "@ember/service";
import { popupAjaxError } from "discourse/lib/ajax-error";
import discourseLater from "discourse-common/lib/later";
@ -246,7 +244,6 @@ export default class ChatMessage extends Component {
return {
reply: this.reply,
react: this.react,
copyLinkToMessage: this.copyLinkToMessage,
edit: this.edit,
selectMessage: this.selectMessage,
flag: this.flag,
@ -764,30 +761,6 @@ export default class ChatMessage extends Component {
);
}
@action
copyLinkToMessage() {
if (!this.messageContainer) {
return;
}
this.messageContainer
.querySelector(".link-to-message-btn")
?.classList?.add("copied");
const { protocol, host } = window.location;
let url = getURL(
`/chat/c/-/${this.args.message.chat_channel_id}/${this.args.message.id}`
);
url = url.indexOf("/") === 0 ? protocol + "//" + host + url : url;
clipboardCopy(url);
discourseLater(() => {
this.messageContainer
?.querySelector(".link-to-message-btn")
?.classList?.remove("copied");
}, 250);
}
get emojiReactions() {
const favorites = this.cachedFavoritesReactions;

14
plugins/chat/assets/javascripts/discourse/components/chat-thread.js
View File

@ -1,13 +1,25 @@
import Component from "@glimmer/component";
import I18n from "I18n";
import { inject as service } from "@ember/service";
import ChatMessageActions from "discourse/plugins/chat/discourse/lib/chat-message-actions";
import ChatThreadLivePanel from "discourse/plugins/chat/discourse/lib/chat-thread-live-panel";
export default class ChatThreadPanel extends Component {
export default class ChatThread extends Component {
@service siteSettings;
@service currentUser;
@service chat;
@service router;
livePanel = null;
messageActionsHandler = null;
constructor() {
super(...arguments);
this.livePanel = new ChatThreadLivePanel();
this.messageActionsHandler = new ChatMessageActions(this.livePanel);
}
get thread() {
return this.chat.activeChannel.activeThread;
}

10
plugins/chat/assets/javascripts/discourse/lib/chat-live-pane-reactor.js → plugins/chat/assets/javascripts/discourse/lib/chat-live-panel.js
View File

@ -1,7 +1,8 @@
import { tracked } from "@glimmer/tracking";
import { action } from "@ember/object";
import { TrackedArray } from "@ember-compat/tracked-built-ins";
export default class ChatLivePaneReactor {
export default class ChatLivePanel {
@tracked messages = new TrackedArray();
@tracked selectingMessages;
@ -12,6 +13,13 @@ export default class ChatLivePaneReactor {
this.selectingMessages = true;
}
@action
cancelSelecting() {
this.selectingMessages = false;
this.lastSelectedMessage = null;
this.messages.setEach("selected", false);
}
get selectedMessageIds() {
return this.messages.filterBy("selected").mapBy("id");
}

16
plugins/chat/assets/javascripts/discourse/lib/chat-message-actions.js
View File

@ -2,16 +2,16 @@ import getURL from "discourse-common/lib/get-url";
import { clipboardCopy } from "discourse/lib/utilities";
export default class ChatMessageActions {
contextualPanel = null;
livePanel = null;
constructor(contextualPanel) {
constructor(livePanel) {
// now its parent "context" or "scope" needs to
// be put into the selection mode...we could probably
// just store a reference to this parent on init?
//
// so in live pane and thread panel we would do new
// ChatMessageActions(this) and call this.contextualPanel.XX
this.contextualPanel = contextualPanel;
// ChatMessageActions(this) and call this.livePanel.XX
this.livePanel = livePanel;
}
copyLink(message) {
@ -27,12 +27,12 @@ export default class ChatMessageActions {
// naming for all the parent panel stuff should be
// the same with on- prefix, e.g. onSelectMessage,
// onDeleteMessage etc.
this.contextualPanel.onSelectMessage(message);
this.livePanel.onSelectMessage(message);
}
bulkSelectMessages(message, checked) {
const lastSelectedIndex = this.#findIndexOfMessage(
this.contextualPanel.lastSelectedMessage
this.livePanel.lastSelectedMessage
);
const newlySelectedIndex = this.#findIndexOfMessage(message);
const sortedIndices = [lastSelectedIndex, newlySelectedIndex].sort(
@ -40,11 +40,11 @@ export default class ChatMessageActions {
);
for (let i = sortedIndices[0]; i <= sortedIndices[1]; i++) {
this.messages[i].set("selected", checked);
this.livePanel.messages[i].set("selected", checked);
}
}
#findIndexOfMessage(message) {
return this.messages.findIndex((m) => m.id === message.id);
return this.livePanel.messages.findIndex((m) => m.id === message.id);
}
}

3
plugins/chat/assets/javascripts/discourse/lib/chat-thread-live-panel.js Normal file
View File

@ -0,0 +1,3 @@
import ChatLivePanel from "./chat-live-panel";
export default class ChatThreadLivePanel extends ChatLivePanel {}