DEV: Convert `raw-email` modal to component-based API (#23471)
This commit is contained in:
Isaac Janzen
GitHub
parent
daf8c32d0e
commit
198181b7f8
|
|
@ -0,0 +1,53 @@
|
|||
<DModal
|
||||
@title={{i18n "raw_email.title"}}
|
||||
class="incoming-email-modal"
|
||||
@closeModal={{@closeModal}}
|
||||
>
|
||||
<:body>
|
||||
<div class="incoming-email-tabs">
|
||||
<DButton
|
||||
@action={{this.displayRaw}}
|
||||
@label="post.raw_email.displays.raw.button"
|
||||
@title="post.raw_email.displays.raw.title"
|
||||
class={{if (eq this.tab "raw") "active"}}
|
||||
/>
|
||||
|
||||
{{#if this.textPart}}
|
||||
<DButton
|
||||
@action={{this.displayTextPart}}
|
||||
@label="post.raw_email.displays.text_part.button"
|
||||
@title="post.raw_email.displays.text_part.title"
|
||||
class={{if (eq this.tab "text_part") "active"}}
|
||||
/>
|
||||
{{/if}}
|
||||
|
||||
{{#if this.htmlPart}}
|
||||
<DButton
|
||||
@action={{this.displayHtmlPart}}
|
||||
@label="post.raw_email.displays.html_part.button"
|
||||
@title="post.raw_email.displays.html_part.title"
|
||||
class={{if (eq this.tab "html_part") "active"}}
|
||||
/>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="incoming-email-content">
|
||||
{{#if (eq this.tab "raw")}}
|
||||
{{#if this.rawEmail}}
|
||||
<Textarea @value={{this.rawEmail}} />
|
||||
{{else}}
|
||||
{{i18n "raw_email.not_available"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if (eq this.tab "text_part")}}
|
||||
<Textarea @value={{this.textPart}} />
|
||||
{{/if}}
|
||||
{{#if (eq this.tab "html_part")}}
|
||||
<IframedHtml
|
||||
@html={{this.htmlPart}}
|
||||
@className="incoming-email-html-part"
|
||||
/>
|
||||
{{/if}}
|
||||
</div>
|
||||
</:body>
|
||||
</DModal>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
import Component from "@glimmer/component";
|
||||
import { tracked } from "@glimmer/tracking";
|
||||
import { action } from "@ember/object";
|
||||
import Post from "discourse/models/post";
|
||||
|
||||
export default class RawEmailComponent extends Component {
|
||||
@tracked rawEmail = this.args.model.rawEmail || "";
|
||||
@tracked textPart = "";
|
||||
@tracked htmlPart = "";
|
||||
@tracked tab = "raw";
|
||||
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
if (this.args.model.id) {
|
||||
this.loadRawEmail(this.args.model.id);
|
||||
}
|
||||
}
|
||||
|
||||
@action
|
||||
async loadRawEmail(postId) {
|
||||
const result = await Post.loadRawEmail(postId);
|
||||
this.rawEmail = result.raw_email;
|
||||
this.textPart = result.text_part;
|
||||
this.htmlPart = result.html_part;
|
||||
}
|
||||
|
||||
@action
|
||||
displayRaw() {
|
||||
this.tab = "raw";
|
||||
}
|
||||
|
||||
@action
|
||||
displayTextPart() {
|
||||
this.tab = "text_part";
|
||||
}
|
||||
|
||||
@action
|
||||
displayHtmlPart() {
|
||||
this.tab = "html_part";
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +1,12 @@
|
|||
import Component from "@glimmer/component";
|
||||
import { tracked } from "@glimmer/tracking";
|
||||
import { action } from "@ember/object";
|
||||
import showModal from "discourse/lib/show-modal";
|
||||
import { inject as service } from "@ember/service";
|
||||
import RawEmailModal from "discourse/components/modal/raw-email";
|
||||
|
||||
export default class ReviewableQueuedPost extends Component {
|
||||
@service modal;
|
||||
|
||||
@tracked isCollapsed = false;
|
||||
@tracked isLongPost = false;
|
||||
@tracked postBodyHeight = 0;
|
||||
|
|
@ -12,10 +15,11 @@ export default class ReviewableQueuedPost extends Component {
|
|||
@action
|
||||
showRawEmail(event) {
|
||||
event?.preventDefault();
|
||||
showModal("raw-email").set(
|
||||
"rawEmail",
|
||||
this.args.reviewable.payload.raw_email
|
||||
);
|
||||
this.modal.show(RawEmailModal, {
|
||||
model: {
|
||||
rawEmail: this.args.reviewable.payload.raw_email,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@action
|
||||
|
|
|
|||
|
|
@ -1,43 +0,0 @@
|
|||
import Controller from "@ember/controller";
|
||||
import ModalFunctionality from "discourse/mixins/modal-functionality";
|
||||
import Post from "discourse/models/post";
|
||||
import { equal } from "@ember/object/computed";
|
||||
|
||||
// This controller handles displaying of raw email
|
||||
export default Controller.extend(ModalFunctionality, {
|
||||
rawEmail: "",
|
||||
textPart: "",
|
||||
htmlPart: "",
|
||||
|
||||
tab: "raw",
|
||||
|
||||
showRawEmail: equal("tab", "raw"),
|
||||
showTextPart: equal("tab", "text_part"),
|
||||
showHtmlPart: equal("tab", "html_part"),
|
||||
|
||||
onShow() {
|
||||
this.send("displayRaw");
|
||||
},
|
||||
|
||||
loadRawEmail(postId) {
|
||||
return Post.loadRawEmail(postId).then((result) =>
|
||||
this.setProperties({
|
||||
rawEmail: result.raw_email,
|
||||
textPart: result.text_part,
|
||||
htmlPart: result.html_part,
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
actions: {
|
||||
displayRaw() {
|
||||
this.set("tab", "raw");
|
||||
},
|
||||
displayTextPart() {
|
||||
this.set("tab", "text_part");
|
||||
},
|
||||
displayHtmlPart() {
|
||||
this.set("tab", "html_part");
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -18,6 +18,7 @@ import EditTopicTimerModal from "discourse/components/modal/edit-topic-timer";
|
|||
import FeatureTopicModal from "discourse/components/modal/feature-topic";
|
||||
import FlagModal from "discourse/components/modal/flag";
|
||||
import MoveToTopicModal from "discourse/components/modal/move-to-topic";
|
||||
import RawEmailModal from "discourse/components/modal/raw-email";
|
||||
|
||||
const SCROLL_DELAY = 500;
|
||||
|
||||
|
|
@ -207,8 +208,7 @@ const TopicRoute = DiscourseRoute.extend({
|
|||
|
||||
@action
|
||||
showRawEmail(model) {
|
||||
showModal("raw-email", { model });
|
||||
this.controllerFor("raw_email").loadRawEmail(model.get("id"));
|
||||
this.modal.show(RawEmailModal, { model });
|
||||
},
|
||||
|
||||
@action
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ const KNOWN_LEGACY_MODALS = [
|
|||
"create-invite",
|
||||
"grant-badge",
|
||||
"group-default-notifications",
|
||||
"raw-email",
|
||||
"reject-reason-reviewable",
|
||||
"reorder-categories",
|
||||
"request-group-membership-form",
|
||||
|
|
|
|||
|
|
@ -1,47 +0,0 @@
|
|||
<DModalBody @title="raw_email.title" @class="incoming-email-modal">
|
||||
<div class="incoming-email-tabs">
|
||||
<DButton
|
||||
@action={{action "displayRaw"}}
|
||||
@label="post.raw_email.displays.raw.button"
|
||||
@title="post.raw_email.displays.raw.title"
|
||||
class={{if this.showRawEmail "active"}}
|
||||
/>
|
||||
|
||||
{{#if this.textPart}}
|
||||
<DButton
|
||||
@action={{action "displayTextPart"}}
|
||||
@label="post.raw_email.displays.text_part.button"
|
||||
@title="post.raw_email.displays.text_part.title"
|
||||
class={{if this.showTextPart "active"}}
|
||||
/>
|
||||
{{/if}}
|
||||
|
||||
{{#if this.htmlPart}}
|
||||
<DButton
|
||||
@action={{action "displayHtmlPart"}}
|
||||
@label="post.raw_email.displays.html_part.button"
|
||||
@title="post.raw_email.displays.html_part.title"
|
||||
class={{if this.showHtmlPart "active"}}
|
||||
/>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="incoming-email-content">
|
||||
{{#if this.showRawEmail}}
|
||||
{{#if this.rawEmail}}
|
||||
<Textarea @value={{this.rawEmail}} />
|
||||
{{else}}
|
||||
{{i18n "raw_email.not_available"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if this.showTextPart}}
|
||||
<Textarea @value={{this.textPart}} />
|
||||
{{/if}}
|
||||
{{#if this.showHtmlPart}}
|
||||
<IframedHtml
|
||||
@html={{this.htmlPart}}
|
||||
@className="incoming-email-html-part"
|
||||
/>
|
||||
{{/if}}
|
||||
</div>
|
||||
</DModalBody>
|
||||
Loading…
Reference in New Issue