Use the proper tile view to display reply preview

This commit is contained in:
Danila Fedorin 2021-07-22 14:10:59 -07:00
parent 650389538d
commit b0c5b2f2ce
2 changed files with 16 additions and 14 deletions

View file

@ -18,6 +18,7 @@ import {TemplateView} from "../../general/TemplateView.js";
import {Popup} from "../../general/Popup.js"; import {Popup} from "../../general/Popup.js";
import {Menu} from "../../general/Menu.js"; import {Menu} from "../../general/Menu.js";
import {TextMessageView} from "./timeline/TextMessageView.js"; import {TextMessageView} from "./timeline/TextMessageView.js";
import {viewClassForEntry} from "./TimelineList.js"
export class MessageComposer extends TemplateView { export class MessageComposer extends TemplateView {
constructor(viewModel) { constructor(viewModel) {
@ -33,19 +34,20 @@ export class MessageComposer extends TemplateView {
onKeydown: e => this._onKeyDown(e), onKeydown: e => this._onKeyDown(e),
onInput: () => vm.setInput(this._input.value), onInput: () => vm.setInput(this._input.value),
}); });
const replyPreview = t.map(vm => vm.replyViewModel, (rvm, t) => !rvm ? null : const replyPreview = t.map(vm => vm.replyViewModel, (rvm, t) => {
t.div({ const View = rvm && viewClassForEntry(rvm);
className: "MessageComposer_replyPreview" if (!View) { return null; }
}, [ return t.div({
t.span({ className: "replying" }, "Replying"), className: "MessageComposer_replyPreview"
t.button({ }, [
className: "cancel", t.span({ className: "replying" }, "Replying"),
onClick: () => this._clearReplyingTo() t.button({
}, "Close"), className: "cancel",
// TODO need proper view, not just assumed TextMessageView onClick: () => this._clearReplyingTo()
t.view(new TextMessageView(vm.replyViewModel, true, "div")) }, "Close"),
]) t.view(new View(rvm, true, "div"))
); ])
});
const input = t.div({className: "MessageComposer_input"}, [ const input = t.div({className: "MessageComposer_input"}, [
this._input, this._input,
t.button({ t.button({

View file

@ -24,7 +24,7 @@ import {MissingAttachmentView} from "./timeline/MissingAttachmentView.js";
import {AnnouncementView} from "./timeline/AnnouncementView.js"; import {AnnouncementView} from "./timeline/AnnouncementView.js";
import {RedactedView} from "./timeline/RedactedView.js"; import {RedactedView} from "./timeline/RedactedView.js";
function viewClassForEntry(entry) { export function viewClassForEntry(entry) {
switch (entry.shape) { switch (entry.shape) {
case "gap": return GapView; case "gap": return GapView;
case "announcement": return AnnouncementView; case "announcement": return AnnouncementView;