Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: Change layout of invites page to match other user pages (#14520) 

* UX: Change layout of invites page to match other user pages
This commit is contained in:
Jordan Vidrine 2021-10-05 15:30:31 -05:00 committed by GitHub
parent e5c257e5b5
commit 6ab5f70090
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 75 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,49 +1,53 @@
{{#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")}}
<section>
{{#if model.can_see_invite_details}}
<div class="admin-controls invite-controls">
<nav>
<ul class="nav nav-pills">
{{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}}
</ul>
</nav>
<div class="pull-right">
{{d-button class="btn-default" icon="plus" action=(action "createInvite") label="user.invited.create"}}
{{#if canBulkInvite}}
{{d-button class="btn-default" icon="upload" action=(action "createInviteCsv") label="user.invited.bulk_invite.text"}}
{{/if}}
{{#if showBulkActionButtons}}
{{#if inviteExpired}}
{{#if removedAll}}
{{i18n "user.invited.removed_all"}}
{{else}}
{{d-button icon="times" action=(action "destroyAllExpired") label="user.invited.remove_all"}}
{{/if}}
{{/if}}
{{#if invitePending}}
{{#if reinvitedAll}}
{{i18n "user.invited.reinvited_all"}}
{{else}}
{{d-button class="btn-default" icon="sync" action=(action "reinviteAll") label="user.invited.reinvite_all"}}
{{/if}}
{{/if}}
{{/if}}
</div>
</div>
{{/if}}
{{#d-section class="user-additional-controls"}}
{{#if showSearch}}
<div class="user-invite-search">
<form>{{text-field value=searchTerm placeholderKey="user.invited.search"}}</form>
</div>
{{/if}}
{{#d-section class="user-invite-buttons"}}
{{d-button class="btn-default" icon="plus" action=(action "createInvite") label="user.invited.create"}}
{{#if canBulkInvite}}
{{#unless site.mobileView}}
{{d-button class="btn-default" icon="upload" action=(action "createInviteCsv") label="user.invited.bulk_invite.text"}}
{{/unless}}
{{/if}}
{{#if showBulkActionButtons}}
{{#if inviteExpired}}
{{#if removedAll}}
<li>
{{i18n "user.invited.removed_all"}}
</li>
{{else}}
{{d-button icon="times" action=(action "destroyAllExpired") label="user.invited.remove_all"}}
{{/if}}
{{/if}}
{{#if invitePending}}
{{#if reinvitedAll}}
<li>
{{i18n "user.invited.reinvited_all"}}
</li>
{{else}}
{{d-button class="btn-default" icon="sync" action=(action "reinviteAll") label="user.invited.reinvite_all"}}
{{/if}}
{{/if}}
{{/if}}
{{/d-section}}
{{/d-section}}
<section>
{{#if model.invites}}
{{#if inviteRedeemed}}
<table class="table user-invite-list">

14
app/assets/javascripts/discourse/tests/acceptance/create-invite-modal-test.js
View File

@ -51,7 +51,7 @@ acceptance("Invites - Create & Edit Invite Modal", function (needs) {
test("basic functionality", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
assert.equal(
find("input.invite-link")[0].value,
"http://example.com/invites/52641ae8878790bc7b79916247cfe6ba",
@ -69,7 +69,7 @@ acceptance("Invites - Create & Edit Invite Modal", function (needs) {
test("saving", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
assert.ok(!exists("tbody tr"), "does not show invite before saving");
@ -83,7 +83,7 @@ acceptance("Invites - Create & Edit Invite Modal", function (needs) {
test("copying saves invite", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
await click(".invite-link .btn");
@ -93,7 +93,7 @@ acceptance("Invites - Create & Edit Invite Modal", function (needs) {
test("copying an email invite without an email shows error message", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
await fillIn("#invite-email", "error");
await click(".invite-link .btn");
@ -128,7 +128,7 @@ acceptance("Invites - Link Invites", function (needs) {
test("invite links", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
assert.ok(exists("#invite-max-redemptions"), "shows max redemptions field");
});
@ -167,7 +167,7 @@ acceptance("Invites - Email Invites", function (needs) {
test("invite email", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
assert.ok(exists("#invite-email"), "shows email field");
await fillIn("#invite-email", "test@example.com");
@ -226,7 +226,7 @@ acceptance(
test("shows correct timeframe options", async function (assert) {
await visit("/u/eviltrout/invited/pending");
await click(".invite-controls .btn:first-child");
await click(".user-invite-buttons .btn:first-child");
await click(".modal-footer .show-advanced");
await click(".future-date-input-selector-header");

5
app/assets/stylesheets/common/base/user.scss
View File

@ -798,11 +798,6 @@
}
.user-invites-page {
.user-invite-search {
clear: both;
margin: 15px 0px -15px 0px;
}
.invite-error {
grid-column: 1 / span 2;
}

4
app/assets/stylesheets/desktop/user.scss
View File

@ -73,11 +73,15 @@
.user-additional-controls {
display: flex;
flex-wrap: wrap;
padding-top: 15px;
.single-select-header,
button {
margin-bottom: 1em;
margin-right: 0.75em;
}
.user-invite-buttons {
margin-left: auto;
}
}
.user-content {

28
app/assets/stylesheets/mobile/user.scss
View File

@ -22,6 +22,7 @@
}
.user-additional-controls {
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 2;
}
.user-content,
@ -354,12 +355,25 @@
width: 100%;
}
.admin-controls {
.user-additional-controls {
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
.pull-right {
flex: 1 1 100%;
font-size: $font-down-1;
padding: 5px 0;
.user-invite-search {
width: 100%;
}
.user-invite-buttons {
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
.btn {
margin-bottom: 0.5em;
}
.btn:not(:last-of-type) {
margin-right: 0.5em;
}
}
}
@ -409,6 +423,10 @@
grid-column-end: -1;
order: 4;
}
td.invite-actions {
display: flex;
}
}
.user-invite-none {