Skip to content

Commit

Permalink
[E] Update user verification BE messaging
Browse files Browse the repository at this point in the history
  • Loading branch information
@1aurend @zdavis
1aurend authored and zdavis committed Feb 27, 2024
1 parent 5eacdce commit c0e7fc3
Show file tree
Hide file tree
Showing 5 changed files with 101 additions and 16 deletions.
21 changes: 19 additions & 2 deletions client/src/backend/components/layout/DrawerHeader/styles.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@ import styled from "@emotion/styled";
import {
fluidScale,
headingQuaternary,
subtitlePrimary
subtitlePrimary,
respond
} from "theme/styles/mixins";
import Utility from "global/components/utility";

Expand Down Expand Up @@ -41,5 +42,21 @@ export const ButtonGroup = styled.div`
${({ $grid }) =>
$grid &&
`display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px;`}
`
> *:not(:last-child) {
margin-right: 1em;
}
${respond(
`
display: grid;
grid-template-columns: 1.25fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 12px;
> *:not(:last-child) {
margin-right: 0;
}
`,
40
)}`}
`;
59 changes: 49 additions & 10 deletions client/src/backend/containers/users/Edit.js → ...rc/backend/containers/users/Edit/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import FormContainer from "global/containers/form";
import get from "lodash/get";
import lh from "helpers/linkHandler";
import Layout from "backend/components/layout";
import * as Styled from "./styles";

const { request, flush } = entityStoreActions;

Expand Down Expand Up @@ -145,20 +146,55 @@ export class UsersEditContainer extends PureComponent {
);
};

humanReadableDate = date => {
return this.props.t("dates.date", {
val: new Date(date),
formatParams: {
val: { year: "numeric", month: "long", day: "numeric" }
}
});
};

get noPublicEngagement() {
const attr = this.user.attributes;
return !(attr.trusted || attr.established);
}

get userVerificationList() {
const t = this.props.t;
const attr = this.user.attributes;

const emailMessage = attr.emailConfirmed
? t("records.users.email_verified_at", {
date: this.humanReadableDate(attr.emailConfirmedAt)
})
: t("records.users.email_not_verified");

return (
<>
<li>
<span>{emailMessage}</span>
</li>
{attr.trusted && (
<li>
<span>{t("records.users.trusted")}</span>
</li>
)}
{this.noPublicEngagement && (
<li>
<span>{t("records.users.no_public_engagement")}</span>
</li>
)}
</>
);
}

render() {
if (!this.user) return null;
const attr = this.user.attributes;
const user = this.user;
const t = this.props.t;

const establishedWarningProps =
!user.attributes.established && !user.attributes.trusted
? {
instructions: t("records.users.not_established_warning"),
instructionsAreWarning: true
}
: {};

return (
<div>
{this.state.resetPassword ? (
Expand Down Expand Up @@ -196,9 +232,12 @@ export class UsersEditContainer extends PureComponent {
}
]}
buttonLayout="grid"
{...establishedWarningProps}
/>

<Styled.UserVerification
$warn={this.noPublicEngagement || !attr.emailConfirmed}
>
{this.userVerificationList}
</Styled.UserVerification>
<section>
<FormContainer.Form
model={this.user}
Expand Down
25 changes: 25 additions & 0 deletions client/src/backend/containers/users/Edit/styles.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import styled from "@emotion/styled";
import { respond } from "theme/styles/mixins";

export const UserVerification = styled.ul`
list-style-type: square;
list-style-position: inside;
margin-block-start: 10px;
margin-block-end: 40px;
padding-block: 15px;
padding-inline: 20px;
font-family: var(--font-family-sans);
border: 1px solid
${({ $warn }) =>
$warn ? `var(--error-color)` : `var(--color-accent-primary)`};
> li + li {
margin-block-start: 3px;
}
> li > span {
margin-inline-start: -8px;
}
${respond(`margin-block-start: -20px;`, 65)}
`;
2 changes: 1 addition & 1 deletion client/src/backend/containers/users/__tests__/__snapshots__/Edit-test.js.snap
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`backend/containers/users/Edit matches the snapshot when rendered 1`] = `"<header class=\\"css-ibt74g-Header ewz6knw5\\"><h2 class=\\" css-4532mb-TitleWrapper ewz6knw4\\"><span class=\\"css-183oh9-Title ewz6knw2\\">Rowan Ida</span></h2><span class=\\"css-ic2dd4-Instructions ewz6knw1\\">records.users.not_established_warning</span><div class=\\"utility-button-group css-1nbh5c3-ButtonGroup ewz6knw0\\"><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--privacy24\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path fill-rule=\\"evenodd\\" clip-rule=\\"evenodd\\" d=\\"m12 1.899.277.185c2.175 1.45 5.602 2.556 7.805 2.923l.418.07V12c0 3.596-2.136 6.1-4.196 7.678a16.687 16.687 0 0 1-3.773 2.154c-.175.071-.352.136-.531.197a10.655 10.655 0 0 1-.531-.197 16.686 16.686 0 0 1-3.773-2.154C5.636 18.101 3.5 15.596 3.5 12V5.076l.418-.07c2.203-.366 5.63-1.473 7.805-2.922L12 1.899Zm0 19.068.156-.062a15.679 15.679 0 0 0 3.54-2.02c1.94-1.486 3.804-3.73 3.804-6.885V5.918c-2.2-.425-5.317-1.453-7.5-2.823-2.183 1.37-5.3 2.398-7.5 2.823V12c0 3.154 1.865 5.4 3.804 6.884A15.679 15.679 0 0 0 12 20.967Z\\" fill=\\"currentColor\\"></path><path fill-rule=\\"evenodd\\" clip-rule=\\"evenodd\\" d=\\"m16.206 9.958-4.685 5.27L8.293 12 9 11.293l2.479 2.479 3.98-4.478.747.664Z\\" fill=\\"currentColor\\"></path></svg><span class=\\"utility-button__text\\">records.users.verify</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--mail32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path fill-rule=\\"evenodd\\" d=\\"M5,23 L27,23 L27,9 L5,9 L5,23 Z M6.818,10 L25.182,10 L16,18.135 L6.818,10 Z M26,10.611 L26,22 L6,22 L6,10.611 L16,19.472 L26,10.611 Z\\"></path></svg><span class=\\"utility-button__text\\">records.users.unsubscribe</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--key32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M7.89239997,19.4438 C5.25098769,19.4438 3.10969996,17.3025123 3.10969996,14.6611 C3.10969996,12.0196877 5.25098769,9.87839998 7.89239997,9.87839998 C10.5338123,9.87839998 12.6751,12.0196877 12.6751,14.6611 C12.6751,17.3025123 10.5338123,19.4438 7.89239997,19.4438 Z M7.89239997,18.4438 C9.9815275,18.4438 11.6751,16.7502275 11.6751,14.6611 C11.6751,12.5719725 9.9815275,10.8784 7.89239997,10.8784 C5.80327244,10.8784 4.10969996,12.5719725 4.10969996,14.6611 C4.10969996,16.7502275 5.80327244,18.4438 7.89239997,18.4438 Z M12.1751,15.1611 L12.1751,14.1611 L28.8902,14.1611 L28.8902,15.1611 L12.1751,15.1611 Z M25.0494,14.6611 L26.0494,14.6611 L26.0494,22.1216 L25.0494,22.1216 L25.0494,14.6611 Z M20.718,14.6611 L21.718,14.6611 L21.718,22.1216 L20.718,22.1216 L20.718,14.6611 Z\\"></path></svg><span class=\\"utility-button__text\\">records.users.reset_password</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon--notice utility-button__icon svg-icon--delete32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M22.5006476,10.9603607 L23.4993524,11.0112392 L22.8010808,24.6917831 C22.8222428,25.6607758 22.05432,26.4636781 21.074,26.4858 L10.9146542,26.4856713 C9.94567997,26.4636781 9.17775722,25.6607758 9.19944755,24.7281393 L8.50064755,11.0112392 L9.49935241,10.9603607 L10.1986808,24.713617 C10.1895701,25.1307915 10.5201792,25.4764602 10.926,25.4858 L21.0626542,25.4859288 C21.4798208,25.4764602 21.8104299,25.1307915 21.8018476,24.6772608 L22.5006476,10.9603607 Z M5.99999997,11.4266 L5.99999997,10.4266 L26,10.4266 L26,11.4266 L5.99999997,11.4266 Z M12.75,10.9266 L11.75,10.9266 L11.7501673,6.81953297 C11.732004,6.11756111 12.2857775,5.53349733 13.0014,5.51409997 L19.0122785,5.5142871 C19.7142225,5.53349733 20.267996,6.11756111 20.25,6.80659997 L20.25,10.9266 L19.25,10.9266 L19.2501673,6.79366698 C19.2540602,6.64321292 19.1353696,6.51803017 18.9986,6.51409997 L13.0150785,6.51391283 C12.8646304,6.51803017 12.7459398,6.64321292 12.75,6.80659997 L12.75,10.9266 Z M13.5,14.7217 L14.5,14.7217 L14.5,22.25 L13.5,22.25 L13.5,14.7217 Z M17.5,14.7217 L18.5,14.7217 L18.5,22.25 L17.5,22.25 L17.5,14.7217 Z\\"></path></svg><span class=\\"utility-button__text\\">actions.delete</span></button></div></header><section></section>"`;
exports[`backend/containers/users/Edit matches the snapshot when rendered 1`] = `"<header class=\\"css-ibt74g-Header ewz6knw5\\"><h2 class=\\" css-4532mb-TitleWrapper ewz6knw4\\"><span class=\\"css-183oh9-Title ewz6knw2\\">Rowan Ida</span></h2><div class=\\"utility-button-group css-1c7ifa5-ButtonGroup ewz6knw0\\"><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--privacy24\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path fill-rule=\\"evenodd\\" clip-rule=\\"evenodd\\" d=\\"m12 1.899.277.185c2.175 1.45 5.602 2.556 7.805 2.923l.418.07V12c0 3.596-2.136 6.1-4.196 7.678a16.687 16.687 0 0 1-3.773 2.154c-.175.071-.352.136-.531.197a10.655 10.655 0 0 1-.531-.197 16.686 16.686 0 0 1-3.773-2.154C5.636 18.101 3.5 15.596 3.5 12V5.076l.418-.07c2.203-.366 5.63-1.473 7.805-2.922L12 1.899Zm0 19.068.156-.062a15.679 15.679 0 0 0 3.54-2.02c1.94-1.486 3.804-3.73 3.804-6.885V5.918c-2.2-.425-5.317-1.453-7.5-2.823-2.183 1.37-5.3 2.398-7.5 2.823V12c0 3.154 1.865 5.4 3.804 6.884A15.679 15.679 0 0 0 12 20.967Z\\" fill=\\"currentColor\\"></path><path fill-rule=\\"evenodd\\" clip-rule=\\"evenodd\\" d=\\"m16.206 9.958-4.685 5.27L8.293 12 9 11.293l2.479 2.479 3.98-4.478.747.664Z\\" fill=\\"currentColor\\"></path></svg><span class=\\"utility-button__text\\">records.users.verify</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--mail32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path fill-rule=\\"evenodd\\" d=\\"M5,23 L27,23 L27,9 L5,9 L5,23 Z M6.818,10 L25.182,10 L16,18.135 L6.818,10 Z M26,10.611 L26,22 L6,22 L6,10.611 L16,19.472 L26,10.611 Z\\"></path></svg><span class=\\"utility-button__text\\">records.users.unsubscribe</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon svg-icon--key32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M7.89239997,19.4438 C5.25098769,19.4438 3.10969996,17.3025123 3.10969996,14.6611 C3.10969996,12.0196877 5.25098769,9.87839998 7.89239997,9.87839998 C10.5338123,9.87839998 12.6751,12.0196877 12.6751,14.6611 C12.6751,17.3025123 10.5338123,19.4438 7.89239997,19.4438 Z M7.89239997,18.4438 C9.9815275,18.4438 11.6751,16.7502275 11.6751,14.6611 C11.6751,12.5719725 9.9815275,10.8784 7.89239997,10.8784 C5.80327244,10.8784 4.10969996,12.5719725 4.10969996,14.6611 C4.10969996,16.7502275 5.80327244,18.4438 7.89239997,18.4438 Z M12.1751,15.1611 L12.1751,14.1611 L28.8902,14.1611 L28.8902,15.1611 L12.1751,15.1611 Z M25.0494,14.6611 L26.0494,14.6611 L26.0494,22.1216 L25.0494,22.1216 L25.0494,14.6611 Z M20.718,14.6611 L21.718,14.6611 L21.718,22.1216 L20.718,22.1216 L20.718,14.6611 Z\\"></path></svg><span class=\\"utility-button__text\\">records.users.reset_password</span></button><button class=\\"utility-button\\" type=\\"button\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"manicon-svg utility-button__icon--notice utility-button__icon svg-icon--delete32\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 32 32\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M22.5006476,10.9603607 L23.4993524,11.0112392 L22.8010808,24.6917831 C22.8222428,25.6607758 22.05432,26.4636781 21.074,26.4858 L10.9146542,26.4856713 C9.94567997,26.4636781 9.17775722,25.6607758 9.19944755,24.7281393 L8.50064755,11.0112392 L9.49935241,10.9603607 L10.1986808,24.713617 C10.1895701,25.1307915 10.5201792,25.4764602 10.926,25.4858 L21.0626542,25.4859288 C21.4798208,25.4764602 21.8104299,25.1307915 21.8018476,24.6772608 L22.5006476,10.9603607 Z M5.99999997,11.4266 L5.99999997,10.4266 L26,10.4266 L26,11.4266 L5.99999997,11.4266 Z M12.75,10.9266 L11.75,10.9266 L11.7501673,6.81953297 C11.732004,6.11756111 12.2857775,5.53349733 13.0014,5.51409997 L19.0122785,5.5142871 C19.7142225,5.53349733 20.267996,6.11756111 20.25,6.80659997 L20.25,10.9266 L19.25,10.9266 L19.2501673,6.79366698 C19.2540602,6.64321292 19.1353696,6.51803017 18.9986,6.51409997 L13.0150785,6.51391283 C12.8646304,6.51803017 12.7459398,6.64321292 12.75,6.80659997 L12.75,10.9266 Z M13.5,14.7217 L14.5,14.7217 L14.5,22.25 L13.5,22.25 L13.5,14.7217 Z M17.5,14.7217 L18.5,14.7217 L18.5,22.25 L17.5,22.25 L17.5,14.7217 Z\\"></path></svg><span class=\\"utility-button__text\\">actions.delete</span></button></div></header><ul class=\\"css-8rjd3p-UserVerification enm8sus0\\"><li><span>records.users.email_not_verified</span></li><li><span>records.users.no_public_engagement</span></li></ul><section></section>"`;
10 changes: 7 additions & 3 deletions client/src/config/app/locale/en-US/json/backend/records.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,13 @@
"submit_label": "Save User",
"unsubscribe": "Unsubscribe",
"reset_password": "Reset Password",
"verify": "Verify",
"block": "Revoke Verification",
"not_established_warning": "This user has not yet verified their email and will not be able to engage with public projects and reading groups."
"verify": "Admin Verify",
"block": "Revoke Admin Verification",
"not_established_warning": "This user has not yet verified their email and will not be able to engage with public projects and reading groups.",
"email_verified_at": "Email confirmed {{date}}",
"email_not_verified": "Email not confirmed",
"trusted": "Trusted account",
"no_public_engagement": "Public engagement disabled"
},
"pages": {
"header": "Manage Pages",
Expand Down

0 comments on commit c0e7fc3

Please sign in to comment.