DEV: migrate ignore duration to Glimmer and DModal (#22687)
This PR migrates the ignore modal to a Glimmer component and DModal. Most of the code is lift-and-shift.
This commit is contained in:
parent
117f6d92a8
commit
9a6bbac5bd
|
@ -1,9 +1,11 @@
|
|||
import Component from "@ember/component";
|
||||
import { inject as service } from "@ember/service";
|
||||
import User from "discourse/models/user";
|
||||
import { popupAjaxError } from "discourse/lib/ajax-error";
|
||||
import showModal from "discourse/lib/show-modal";
|
||||
import IgnoreDurationModal from "./modal/ignore-duration-with-username";
|
||||
|
||||
export default Component.extend({
|
||||
modal: service(),
|
||||
item: null,
|
||||
actions: {
|
||||
removeIgnoredUser(item) {
|
||||
|
@ -20,13 +22,13 @@ export default Component.extend({
|
|||
});
|
||||
},
|
||||
newIgnoredUser() {
|
||||
const modal = showModal("ignore-duration-with-username", {
|
||||
model: this.model,
|
||||
});
|
||||
modal.setProperties({
|
||||
ignoredUsername: null,
|
||||
onUserIgnored: (username) => {
|
||||
this.items.addObject(username);
|
||||
this.modal.show(IgnoreDurationModal, {
|
||||
model: {
|
||||
actingUser: this.model,
|
||||
ignoredUsername: null,
|
||||
onUserIgnored: (username) => {
|
||||
this.items.addObject(username);
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
|
|
|
@ -0,0 +1,36 @@
|
|||
<DModal
|
||||
@closeModal={{@closeModal}}
|
||||
@title={{i18n "user.user_notifications.ignore_duration_title"}}
|
||||
@flash={{this.flash}}
|
||||
@autoFocus="false"
|
||||
class="ignore-duration-with-username-modal"
|
||||
>
|
||||
<:body>
|
||||
<div class="controls tracking-controls">
|
||||
<label>{{d-icon "far-eye-slash" class="icon"}}
|
||||
{{i18n "user.user_notifications.ignore_duration_username"}}</label>
|
||||
<EmailGroupUserChooser
|
||||
@value={{this.ignoredUsername}}
|
||||
@onChange={{this.updateIgnoredUsername}}
|
||||
@options={{hash excludeCurrentUser=true maximum=1}}
|
||||
/>
|
||||
</div>
|
||||
<FutureDateInput
|
||||
@label="user.user_notifications.ignore_duration_when"
|
||||
@input={{readonly this.ignoredUntil}}
|
||||
@customShortcuts={{this.timeShortcuts}}
|
||||
@includeDateTime={{false}}
|
||||
@onChangeInput={{action (mut this.ignoredUntil)}}
|
||||
/>
|
||||
<p>{{i18n "user.user_notifications.ignore_duration_note"}}</p>
|
||||
</:body>
|
||||
<:footer>
|
||||
<DButton
|
||||
@class="btn-primary"
|
||||
@disabled={{this.saveDisabled}}
|
||||
@label="user.user_notifications.ignore_duration_save"
|
||||
@action={{this.ignore}}
|
||||
/>
|
||||
<ConditionalLoadingSpinner @size="small" @condition={{this.loading}} />
|
||||
</:footer>
|
||||
</DModal>
|
|
@ -0,0 +1,68 @@
|
|||
import Component from "@glimmer/component";
|
||||
import { tracked } from "@glimmer/tracking";
|
||||
import { action } from "@ember/object";
|
||||
import { inject as service } from "@ember/service";
|
||||
import I18n from "I18n";
|
||||
import User from "discourse/models/user";
|
||||
import { popupAjaxError } from "discourse/lib/ajax-error";
|
||||
import { timeShortcuts } from "discourse/lib/time-shortcut";
|
||||
|
||||
export default class IgnoreDurationModal extends Component {
|
||||
@service currentUser;
|
||||
|
||||
@tracked flash;
|
||||
|
||||
@tracked loading = false;
|
||||
@tracked ignoredUntil = null;
|
||||
@tracked ignoredUsername = null;
|
||||
|
||||
get timeShortcuts() {
|
||||
const timezone = this.currentUser.user_option.timezone;
|
||||
const shortcuts = timeShortcuts(timezone);
|
||||
return [
|
||||
shortcuts.laterToday(),
|
||||
shortcuts.tomorrow(),
|
||||
shortcuts.laterThisWeek(),
|
||||
shortcuts.thisWeekend(),
|
||||
shortcuts.monday(),
|
||||
shortcuts.twoWeeks(),
|
||||
shortcuts.nextMonth(),
|
||||
shortcuts.twoMonths(),
|
||||
shortcuts.threeMonths(),
|
||||
shortcuts.fourMonths(),
|
||||
shortcuts.sixMonths(),
|
||||
shortcuts.oneYear(),
|
||||
shortcuts.forever(),
|
||||
];
|
||||
}
|
||||
|
||||
@action
|
||||
ignore() {
|
||||
if (!this.ignoredUntil || !this.ignoredUsername) {
|
||||
this.flash = I18n.t(
|
||||
"user.user_notifications.ignore_duration_time_frame_required"
|
||||
);
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
User.findByUsername(this.ignoredUsername).then((user) => {
|
||||
user
|
||||
.updateNotificationLevel({
|
||||
level: "ignore",
|
||||
expiringAt: this.ignoredUntil,
|
||||
actingUser: this.args.model.actingUser,
|
||||
})
|
||||
.then(() => {
|
||||
this.args.model.onUserIgnored(this.ignoredUsername);
|
||||
this.args.closeModal();
|
||||
})
|
||||
.catch(popupAjaxError)
|
||||
.finally(() => (this.loading = false));
|
||||
});
|
||||
}
|
||||
|
||||
@action
|
||||
updateIgnoredUsername(selected) {
|
||||
this.ignoredUsername = selected.firstObject;
|
||||
}
|
||||
}
|
|
@ -1,65 +0,0 @@
|
|||
import Controller from "@ember/controller";
|
||||
import I18n from "I18n";
|
||||
import ModalFunctionality from "discourse/mixins/modal-functionality";
|
||||
import User from "discourse/models/user";
|
||||
import { popupAjaxError } from "discourse/lib/ajax-error";
|
||||
import { timeShortcuts } from "discourse/lib/time-shortcut";
|
||||
import discourseComputed from "discourse-common/utils/decorators";
|
||||
|
||||
export default Controller.extend(ModalFunctionality, {
|
||||
loading: false,
|
||||
ignoredUntil: null,
|
||||
ignoredUsername: null,
|
||||
|
||||
@discourseComputed
|
||||
timeShortcuts() {
|
||||
const timezone = this.currentUser.user_option.timezone;
|
||||
const shortcuts = timeShortcuts(timezone);
|
||||
return [
|
||||
shortcuts.laterToday(),
|
||||
shortcuts.tomorrow(),
|
||||
shortcuts.laterThisWeek(),
|
||||
shortcuts.thisWeekend(),
|
||||
shortcuts.monday(),
|
||||
shortcuts.twoWeeks(),
|
||||
shortcuts.nextMonth(),
|
||||
shortcuts.twoMonths(),
|
||||
shortcuts.threeMonths(),
|
||||
shortcuts.fourMonths(),
|
||||
shortcuts.sixMonths(),
|
||||
shortcuts.oneYear(),
|
||||
shortcuts.forever(),
|
||||
];
|
||||
},
|
||||
|
||||
actions: {
|
||||
ignore() {
|
||||
if (!this.ignoredUntil || !this.ignoredUsername) {
|
||||
this.flash(
|
||||
I18n.t("user.user_notifications.ignore_duration_time_frame_required"),
|
||||
"error"
|
||||
);
|
||||
return;
|
||||
}
|
||||
this.set("loading", true);
|
||||
User.findByUsername(this.ignoredUsername).then((user) => {
|
||||
user
|
||||
.updateNotificationLevel({
|
||||
level: "ignore",
|
||||
expiringAt: this.ignoredUntil,
|
||||
actingUser: this.model,
|
||||
})
|
||||
.then(() => {
|
||||
this.onUserIgnored(this.ignoredUsername);
|
||||
this.send("closeModal");
|
||||
})
|
||||
.catch(popupAjaxError)
|
||||
.finally(() => this.set("loading", false));
|
||||
});
|
||||
},
|
||||
|
||||
updateIgnoredUsername(selected) {
|
||||
this.set("ignoredUsername", selected.firstObject);
|
||||
},
|
||||
},
|
||||
});
|
|
@ -1,32 +0,0 @@
|
|||
<DModalBody
|
||||
@title="user.user_notifications.ignore_duration_title"
|
||||
@autoFocus="false"
|
||||
>
|
||||
<div class="controls tracking-controls">
|
||||
<label>{{d-icon "far-eye-slash" class="icon"}}
|
||||
{{i18n "user.user_notifications.ignore_duration_username"}}</label>
|
||||
<EmailGroupUserChooser
|
||||
@value={{this.ignoredUsername}}
|
||||
@onChange={{action "updateIgnoredUsername"}}
|
||||
@options={{hash excludeCurrentUser=true maximum=1}}
|
||||
/>
|
||||
</div>
|
||||
<FutureDateInput
|
||||
@label="user.user_notifications.ignore_duration_when"
|
||||
@input={{readonly this.ignoredUntil}}
|
||||
@customShortcuts={{this.timeShortcuts}}
|
||||
@includeDateTime={{false}}
|
||||
@onChangeInput={{action (mut this.ignoredUntil)}}
|
||||
/>
|
||||
<p>{{i18n "user.user_notifications.ignore_duration_note"}}</p>
|
||||
</DModalBody>
|
||||
|
||||
<div class="modal-footer">
|
||||
<DButton
|
||||
@class="btn-primary"
|
||||
@disabled={{this.saveDisabled}}
|
||||
@label="user.user_notifications.ignore_duration_save"
|
||||
@action={{action "ignore"}}
|
||||
/>
|
||||
<ConditionalLoadingSpinner @size="small" @condition={{this.loading}} />
|
||||
</div>
|
Loading…
Reference in New Issue