github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-26 23:06:19 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: Improve route hierarchy in for user-invites (#14583)

Browse Source 
Previously the sidebar was being rendered in the `-show` routes, which meant that it disappeared and re-appeared when each tab was loading. This commit creates a parent `user-invited` route with the sidebar, and then renders the `-show` view in an outlet.

To avoid an extra HTTP request, the invite counts for the sidebar are fetched by the `-show` routes, and then applied to the parent controller. This means that there can be a very slight delay before the counts are displayed, but it is almost unnoticeable in normal use.
This commit is contained in:
David Taylor 2021-10-12 17:39:47 +01:00 committed by GitHub
parent be7dcf694e
commit 100095af50
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 65 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
app/assets/javascripts/discourse/app/controllers/user-invited-show.js
View File

@ -62,39 +62,6 @@ export default Controller.extend({
return invitesCountTotal > 0;
},
@discourseComputed("invitesCount.total", "invitesCount.pending")
pendingLabel(invitesCountTotal, invitesCountPending) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.pending_tab_with_count", {
count: invitesCountPending,
});
} else {
return I18n.t("user.invited.pending_tab");
}
},
@discourseComputed("invitesCount.total", "invitesCount.expired")
expiredLabel(invitesCountTotal, invitesCountExpired) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.expired_tab_with_count", {
count: invitesCountExpired,
});
} else {
return I18n.t("user.invited.expired_tab");
}
},
@discourseComputed("invitesCount.total", "invitesCount.redeemed")
redeemedLabel(invitesCountTotal, invitesCountRedeemed) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.redeemed_tab_with_count", {
count: invitesCountRedeemed,
});
} else {
return I18n.t("user.invited.redeemed_tab");
}
},
@action
createInvite() {
const controller = showModal("create-invite");

38
app/assets/javascripts/discourse/app/controllers/user-invited.js Normal file
View File

@ -0,0 +1,38 @@
import Controller from "@ember/controller";
import discourseComputed from "discourse-common/utils/decorators";
import I18n from "I18n";
export default Controller.extend({
@discourseComputed("invitesCount.total", "invitesCount.pending")
pendingLabel(invitesCountTotal, invitesCountPending) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.pending_tab_with_count", {
count: invitesCountPending,
});
} else {
return I18n.t("user.invited.pending_tab");
}
},
@discourseComputed("invitesCount.total", "invitesCount.expired")
expiredLabel(invitesCountTotal, invitesCountExpired) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.expired_tab_with_count", {
count: invitesCountExpired,
});
} else {
return I18n.t("user.invited.expired_tab");
}
},
@discourseComputed("invitesCount.total", "invitesCount.redeemed")
redeemedLabel(invitesCountTotal, invitesCountRedeemed) {
if (invitesCountTotal > 0) {
return I18n.t("user.invited.redeemed_tab_with_count", {
count: invitesCountRedeemed,
});
} else {
return I18n.t("user.invited.redeemed_tab");
}
},
});

3
app/assets/javascripts/discourse/app/routes/user-invited-show.js
View File

@ -11,6 +11,9 @@ export default DiscourseRoute.extend({
if (!model.can_see_invite_details) {
this.replaceWith("userInvited.show", "redeemed");
}
this.controllerFor("user.invited").setProperties({
invitesCount: model.counts,
});
},
setupController(controller, model) {

13
app/assets/javascripts/discourse/app/routes/user-invited.js Normal file
View File

@ -0,0 +1,13 @@
import DiscourseRoute from "discourse/routes/discourse";
export default DiscourseRoute.extend({
setupController(controller) {
const can_see_invite_details =
this.currentUser.staff ||
this.controllerFor("user").id === this.currentUser?.id;
controller.setProperties({
can_see_invite_details,
});
},
});

10
app/assets/javascripts/discourse/app/templates/user-invited-show.hbs
View File

@ -1,13 +1,3 @@
{{#if model.can_see_invite_details}}
{{#d-section class="user-secondary-navigation" pageClass="user-invites"}}
{{#mobile-nav class="invites-nav" desktopClass="nav-stacked action-list"}}
{{nav-item route="userInvited.show" routeParam="pending" i18nLabel=pendingLabel}}
{{nav-item route="userInvited.show" routeParam="expired" i18nLabel=expiredLabel}}
{{nav-item route="userInvited.show" routeParam="redeemed" i18nLabel=redeemedLabel}}
{{/mobile-nav}}
{{/d-section}}
{{/if}}
{{#d-section pageClass="user-invites" tagName=""}}
{{#if canInviteToForum}}
{{#load-more class="user-content" selector=".user-invite-list tr" action=(action "loadMore")}}

11
app/assets/javascripts/discourse/app/templates/user-invited.hbs Normal file
View File

@ -0,0 +1,11 @@
{{#if can_see_invite_details}}
{{#d-section class="user-secondary-navigation" pageClass="user-invites"}}
{{#mobile-nav class="invites-nav" desktopClass="nav-stacked action-list"}}
{{nav-item route="userInvited.show" routeParam="pending" i18nLabel=pendingLabel}}
{{nav-item route="userInvited.show" routeParam="expired" i18nLabel=expiredLabel}}
{{nav-item route="userInvited.show" routeParam="redeemed" i18nLabel=redeemedLabel}}
{{/mobile-nav}}
{{/d-section}}
{{/if}}
{{outlet}}