mirror of
https://github.com/discourse/discourse.git
synced 2025-01-18 13:52:50 +08:00
FEATURE: Improve expired invites tab (#12392)
This commit extends functionality of the expired invites tab, making it more similar to the pending tab. It also implements a different layout for mobile.
This commit is contained in:
parent
6c57f6f49d
commit
790c4ad4a7
|
@ -128,8 +128,16 @@ export default Controller.extend(
|
|||
},
|
||||
|
||||
@discourseComputed("buffered.expires_at")
|
||||
expiresAtRelative(expires_at) {
|
||||
return moment.duration(moment(expires_at) - moment()).humanize();
|
||||
expiresAtLabel(expires_at) {
|
||||
const expiresAt = moment(expires_at);
|
||||
|
||||
return expiresAt.isBefore()
|
||||
? I18n.t("user.invited.invite.expired_at_time", {
|
||||
time: expiresAt.format("LLL"),
|
||||
})
|
||||
: I18n.t("user.invited.invite.expires_in_time", {
|
||||
time: moment.duration(expiresAt - moment()).humanize(),
|
||||
});
|
||||
},
|
||||
|
||||
@discourseComputed("type", "buffered.email")
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
{{copy-button selector="input.invite-link" copied=(action "copied")}}
|
||||
</div>
|
||||
|
||||
<p>{{i18n "user.invited.invite.expires_at_time" time=expiresAtRelative}}</p>
|
||||
<p>{{expiresAtLabel}}</p>
|
||||
|
||||
<div class="input-group invite-type">
|
||||
<div class="radio-group">
|
||||
|
|
|
@ -85,35 +85,6 @@
|
|||
{{/each}}
|
||||
</tbody>
|
||||
</table>
|
||||
{{else if inviteExpired}}
|
||||
<table class="table user-invite-list">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{{i18n "user.invited.invited_via"}}</th>
|
||||
<th>{{i18n "user.invited.sent"}}</th>
|
||||
<th>{{i18n "user.invited.expires_at"}}</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{#each model.invites as |invite|}}
|
||||
<tr>
|
||||
<td>
|
||||
{{#if invite.email}}
|
||||
{{invite.email}}
|
||||
{{else}}
|
||||
{{i18n "user.invited.invited_via_link" count=invite.redemption_count max=invite.max_redemptions_allowed}}
|
||||
{{/if}}
|
||||
</td>
|
||||
<td>{{raw-date invite.updated_at}}</td>
|
||||
<td>{{raw-date invite.expires_at}}</td>
|
||||
<td class="actions">
|
||||
{{d-button icon="trash-alt" class="cancel" action=(action "destroyInvite" invite) title=(if invite.destroyed "user.invited.removed" "user.invited.remove")}}
|
||||
</td>
|
||||
</tr>
|
||||
{{/each}}
|
||||
</tbody>
|
||||
</table>
|
||||
{{else}}
|
||||
<table class="table user-invite-list">
|
||||
<thead>
|
||||
|
@ -130,7 +101,8 @@
|
|||
<tbody>
|
||||
{{#each model.invites as |invite|}}
|
||||
<tr>
|
||||
<td>
|
||||
<td class="invite-type">
|
||||
<div class="label">{{i18n "user.invited.invited_via"}}</div>
|
||||
{{#if invite.email}}
|
||||
{{invite.email}}
|
||||
{{else}}
|
||||
|
@ -138,7 +110,8 @@
|
|||
{{/if}}
|
||||
</td>
|
||||
{{#if currentUser.staff}}
|
||||
<td>
|
||||
<td class="invite-groups">
|
||||
<div class="label">{{i18n "user.invited.groups"}}</div>
|
||||
{{#each invite.groups as |g|}}
|
||||
<a href="/g/{{g.name}}">{{g.name}}</a>
|
||||
{{else}}
|
||||
|
@ -146,15 +119,21 @@
|
|||
{{/each}}
|
||||
</td>
|
||||
{{/if}}
|
||||
<td>{{format-date invite.updated_at}}</td>
|
||||
<td>
|
||||
{{#if invite.expired}}
|
||||
<td class="invite-updated-at">
|
||||
<div class="label">{{i18n "user.invited.sent"}}</div>
|
||||
{{format-date invite.updated_at}}
|
||||
</td>
|
||||
<td class="invite-expires-at">
|
||||
<div class="label">{{i18n "user.invited.expires_at"}}</div>
|
||||
{{#if inviteExpired}}
|
||||
{{raw-date invite.expires_at}}
|
||||
{{else if invite.expired}}
|
||||
{{i18n "user.invited.expired"}}
|
||||
{{else}}
|
||||
{{raw-date invite.expires_at}}
|
||||
{{/if}}
|
||||
</td>
|
||||
<td class="actions">
|
||||
<td class="invite-actions">
|
||||
{{d-button icon="pencil-alt" action=(action "editInvite" invite) title="user.invited.edit"}}
|
||||
{{d-button icon="trash-alt" class="cancel" action=(action "destroyInvite" invite) title=(if invite.destroyed "user.invited.removed" "user.invited.remove")}}
|
||||
</td>
|
||||
|
|
|
@ -84,16 +84,22 @@
|
|||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.user-invite-list {
|
||||
table.user-invite-list {
|
||||
width: 100%;
|
||||
margin-top: 15px;
|
||||
|
||||
tr {
|
||||
td {
|
||||
padding: 0.667em;
|
||||
&.actions {
|
||||
|
||||
&.invite-actions {
|
||||
white-space: nowrap;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -315,24 +315,50 @@
|
|||
padding: 0;
|
||||
}
|
||||
}
|
||||
table {
|
||||
tr:first-of-type {
|
||||
|
||||
table.user-invite-list {
|
||||
thead {
|
||||
display: none;
|
||||
}
|
||||
|
||||
tr {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 1em;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
padding: 0.25em;
|
||||
}
|
||||
td:first-of-type {
|
||||
margin-right: 1em;
|
||||
}
|
||||
td:nth-of-type(n + 3) {
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
width: 50%;
|
||||
padding: 0.25em 0 1em 0;
|
||||
color: var(--primary-medium);
|
||||
font-size: $font-down-1;
|
||||
margin: 0.5em 0 0.15em 0;
|
||||
}
|
||||
|
||||
td.invite-type {
|
||||
grid-column-start: 1;
|
||||
grid-column-end: -2;
|
||||
order: 1;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td.invite-actions {
|
||||
order: 2;
|
||||
align-self: center;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
td.invite-groups {
|
||||
grid-column-start: 1;
|
||||
grid-column-end: -1;
|
||||
order: 3;
|
||||
}
|
||||
|
||||
td.invite-updated-at,
|
||||
td.invite-expires-at {
|
||||
order: 4;
|
||||
}
|
||||
}
|
||||
|
||||
.user-invite-none {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
|
|
@ -1498,7 +1498,8 @@ en:
|
|||
|
||||
instructions: "Share this link to instantly grant access to this site:"
|
||||
copy_link: "copy link"
|
||||
expires_at_time: "Expires in %{time}."
|
||||
expires_in_time: "Expires in %{time}."
|
||||
expired_at_time: "Expired at %{time}."
|
||||
|
||||
show_advanced: "Show Advanced Options"
|
||||
hide_advanced: "Hide Advanced Options"
|
||||
|
|
Loading…
Reference in New Issue
Block a user