mirror of
https://github.com/openziti/zrok.git
synced 2024-11-21 23:53:19 +01:00
Merge pull request #718 from openziti/terms_ack
Checkbox to Acknowledge Terms and Conditions (#669)
This commit is contained in:
commit
bf7b8ecb99
@ -6,6 +6,10 @@ FEATURE: Conditionally enable interstitial page based on `User-Agent` prefix lis
|
||||
|
||||
CHANGE: The interstitial configuration has been modified from a simple `interstitial: <bool>` to a richer structure, but the config version has not been incremented; this feature has not been widely adopted yet. See the [frontend configuration template](etc/frontend.yml) for details on the new structure.
|
||||
|
||||
CHANGE: The registration page where a new user's password is set now includes a required checkbox, asking them to acknowledge the terms and conditions presented above the checkbox (https://github.com/openziti/zrok/issues/669)
|
||||
|
||||
FIX: The registration page where a new user's password is set now includes better styling of the error message `<div/>` to prevent the entire page from jumping when the message changes.
|
||||
|
||||
## v0.4.37
|
||||
|
||||
FIX: Fix for setting the `zrok_interstitial` cookie on Chrome-based browsers.
|
||||
|
@ -119,8 +119,13 @@ code, pre {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
#zrok-tou {
|
||||
margin-top: 15px;
|
||||
.zrok-tou {
|
||||
margin: 15px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.zrok-type {
|
||||
font-family: 'Russo One', sans-serif;
|
||||
}
|
||||
|
||||
#controls-row {
|
||||
@ -131,3 +136,8 @@ code, pre {
|
||||
#navbar {
|
||||
background: linear-gradient(180deg, #0E0238 0%, #231069 100%);
|
||||
}
|
||||
|
||||
#zrok-message-row {
|
||||
padding: 10px;
|
||||
height: 50px;
|
||||
}
|
@ -4,13 +4,14 @@ import * as metadata from "../api/metadata"
|
||||
import Success from "./Success";
|
||||
import {Button, Container, Form, Row} from "react-bootstrap";
|
||||
import PasswordForm from "../components/password";
|
||||
import {Checkbox, FormControlLabel} from "@mui/material";
|
||||
|
||||
const SetPasswordForm = (props) => {
|
||||
const [password, setPassword] = useState('');
|
||||
const [message, setMessage] = useState();
|
||||
const [authToken, setAuthToken] = useState('');
|
||||
const [complete, setComplete] = useState(false);
|
||||
const [tou, setTou] = useState();
|
||||
const [tou, setTou] = useState(<span/>);
|
||||
const [passwordLength, setPasswordLength] = useState(10);
|
||||
const [passwordRequireCapital, setPasswordRequireCapital] = useState(true);
|
||||
const [passwordRequireNumeric, setPasswordRequireNumeric] = useState(true);
|
||||
@ -23,7 +24,7 @@ const SetPasswordForm = (props) => {
|
||||
metadata.configuration().then(resp => {
|
||||
if(!resp.error) {
|
||||
if (resp.data.touLink !== undefined && resp.data.touLink.trim() !== "") {
|
||||
setTou(resp.data.touLink)
|
||||
setTou(<span dangerouslySetInnerHTML={{__html: resp.data.touLink}}/>)
|
||||
}
|
||||
setPasswordLength(resp.data.passwordRequirements.length)
|
||||
setPasswordRequireCapital(resp.data.passwordRequirements.requireCapital)
|
||||
@ -73,6 +74,7 @@ const SetPasswordForm = (props) => {
|
||||
<Container className={"fullscreen-form"}>
|
||||
<Row>
|
||||
<Form onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<PasswordForm
|
||||
setMessage={setMessage}
|
||||
passwordLength={passwordLength}
|
||||
@ -81,15 +83,19 @@ const SetPasswordForm = (props) => {
|
||||
passwordRequireSpecial={passwordRequireSpecial}
|
||||
passwordValidSpecialCharacters={passwordValidSpecialCharacters}
|
||||
setParentPassword={setPassword}/>
|
||||
</div>
|
||||
<div class={"zrok-tou"}>
|
||||
<p>{tou}</p>
|
||||
</div>
|
||||
<div class={"zrok-tou"}>
|
||||
<FormControlLabel control={<Checkbox style={{color: 'white'}} required/>} label={<span class={"zrok-type"}>I have read and agree to the above</span>}/>
|
||||
</div>
|
||||
<Button variant={"light"} type={"submit"}>Register Account</Button>
|
||||
</Form>
|
||||
</Row>
|
||||
<Row>
|
||||
<Row id={"zrok-message-row"}>
|
||||
{message}
|
||||
</Row>
|
||||
<Row>
|
||||
<div id={"zrok-tou"} dangerouslySetInnerHTML={{__html: tou}}></div>
|
||||
</Row>
|
||||
</Container>
|
||||
</Row>
|
||||
</Container>
|
||||
|
Loading…
Reference in New Issue
Block a user