Merge branch '114-remove-duplications' into 'dev'

Resolve "remove-duplications"

Closes #114

See merge request sa4-2020/the-sanmarinoes/frontend!146
This commit is contained in:
Andrea Brites Marto 2020-05-10 23:55:50 +02:00
commit a576632ef7
7 changed files with 82 additions and 343 deletions

View file

@ -6,7 +6,6 @@ import Signup from "./views/Signup";
import Login from "./views/Login";
import FourOhFour from "./views/FourOhFour";
import ForgotPass from "./views/Forgot-password";
import ChangePass from "./views/Forgot-pass-reset";
import ConfirmForgotPasswrod from "./views/ConfirmForgotPassword";
import ConfirmRegistration from "./views/ConfirmRegistration";
import ConfirmResetPassword from "./views/ConfirmResetPassword";
@ -49,7 +48,7 @@ class App extends Component {
{this.props.loggedIn ? <Dashboard /> : <Redirect to="/login" />}
</Route>
<Route path="/forgot-password">
<ForgotPass />
<ForgotPass type="FPassword1" />
</Route>
<Route path="/sent-email">
<ConfirmForgotPasswrod />
@ -60,9 +59,11 @@ class App extends Component {
<Route path="/instruction">
<Instruction />
</Route>
<Route path="/forgot-pass-reset"> </Route>
<Route path="/forgot-pass-reset">
<ForgotPass type="FPassword1" />
</Route>
<Route path="/password-reset">
<ChangePass query={this.state.query} />
<ForgotPass type="FPassword2" query={this.state.query} />
</Route>
<Route path="/conf-reset-pass">
<ConfirmResetPassword />

View file

@ -1,82 +0,0 @@
import { Dropdown } from "semantic-ui-react";
import React, { Component } from "react";
export default class FilterDevices extends Component {
render() {
const tagOptions = [
{
key: "regularLight",
text: "regularLight",
value: "regularLight",
label: { color: "red", empty: true, circular: true },
},
{
key: "dimmableLight",
text: "dimmableLight",
value: "dimmableLight",
label: { color: "blue", empty: true, circular: true },
},
{
key: "buttonDimmer",
text: "buttonDimmer",
value: "buttonDimmer",
label: { color: "black", empty: true, circular: true },
},
{
key: "knobDimmer",
text: "knobDimmer",
value: "knobDimmer",
label: { color: "purple", empty: true, circular: true },
},
{
key: "motionSensor",
text: "motionSensor",
value: "motionSensor",
label: { color: "orange", empty: true, circular: true },
},
{
key: "sensor",
text: "sensor",
value: "sensor",
label: { empty: true, circular: true },
},
{
key: "smartPlug",
text: "smartPlug",
value: "smartPlug",
label: { color: "pink", empty: true, circular: true },
},
{
key: "switch",
text: "switch",
value: "switch",
label: { color: "green", empty: true, circular: true },
},
];
return (
<Dropdown
text="Filter Devices"
icon="filter"
floating
labeled
button
className="icon"
>
<Dropdown.Menu>
<Dropdown.Divider />
<Dropdown.Header icon="tags" content="Tag Device" />
<Dropdown.Menu scrolling>
{tagOptions.map((option) => (
<Dropdown.Item
key={option.value}
{...option}
onClick={this.props.filterDevices}
/>
))}
</Dropdown.Menu>
</Dropdown.Menu>
</Dropdown>
);
}
}

View file

@ -431,7 +431,7 @@ class AutomationSaveModal extends Component {
automation.id = this.props.id;
automation.triggers = [];
automation.scenes = [];
automation.conditions = [];
for (let i = 0; i < this.state.order.length; i++) {
automation.scenes.push({
priority: i,

View file

@ -1,40 +1,10 @@
import React, { Component } from "react";
import {
Image,
Grid,
Button,
Icon,
Header,
Container,
} from "semantic-ui-react";
import Confirm from "./Confirm";
const msg =
"An E-mail has been sent to your address, confirm your registration by following the enclosed link. If you don't find the E-mail please check also the spam folder.";
export default class ConfirmForgotPasswrod extends Component {
render() {
return (
<React.Fragment>
<Button circular style={{ margin: "2em" }} href="/">
<Icon name="arrow alternate circle left" />
Go Home{" "}
</Button>
<Grid
textAlign="center"
style={{ height: "70vh" }}
verticalAlign="middle"
>
<Grid.Column style={{ maxWidth: 450 }}>
<Header as="h2" color="blue" textAlign="center">
<Image src="img/logo.png" /> Link has been sent!
</Header>
<Container textAlign="center">
<p>
An E-mail has been sent to your address, please follow the
instructions to create a new password. If you don't find the
E-mail please check also the spam folder.
</p>
</Container>
</Grid.Column>
</Grid>
</React.Fragment>
);
return <Confirm msg={msg} />;
}
}

View file

@ -1,114 +0,0 @@
import React, { Component } from "react";
import {
Button,
Form,
Grid,
Header,
Image,
Icon,
Message,
} from "semantic-ui-react";
import { Redirect } from "react-router-dom";
import { Forms } from "../remote";
export default class ChangePass extends Component {
constructor(props) {
super(props);
this.state = {
password: "",
error: {
state: false,
message: "",
},
success: false,
};
this.handleChangePassword = this.handleChangePassword.bind(this);
}
onChangeHandler = (event) => {
let nam = event.target.name;
let val = event.target.value;
this.setState({ [nam]: val });
};
handleChangePassword = (e) => {
if (this.state.confirmPassword !== this.state.password) {
this.setState({
error: {
state: true,
message: "Passwords do not match.",
},
});
}
Forms.submitResetPassword(this.props.query.token, this.state.password)
.then(() => this.setState({ success: true }))
.catch((err) =>
this.setState({
error: { state: true, message: err.messages.join(" - ") },
})
);
};
render() {
if (this.state.success) {
return <Redirect to="/login" />;
}
return (
<React.Fragment>
<Button circular style={{ margin: "2em" }} href="/">
<Icon name="arrow alternate circle left" />
Go Home{" "}
</Button>
<Grid
textAlign="center"
style={{ height: "70vh" }}
verticalAlign="middle"
>
<Grid.Column style={{ maxWidth: 450 }}>
<Header as="h2" color="blue" textAlign="center">
<Image src="img/logo.png" /> Reset Password
</Header>
<Form
size="large"
style={{ marginTop: "2em" }}
error={this.state.error.state}
>
<Message
error
header="Change Password Error"
content={this.state.error.message}
/>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Reset your password"
name="password"
type="password"
onChange={this.onChangeHandler}
required
/>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Confirm Password"
name="confirmPassword"
type="password"
onChange={this.onChangeHandler}
required
/>
<Button
color="blue"
fluid
size="large"
onClick={this.handleChangePassword}
>
Confirm password
</Button>
</Form>
</Grid.Column>
</Grid>
</React.Fragment>
);
}
}

View file

@ -22,6 +22,8 @@ export default class ForgotPass extends Component {
},
success: false,
};
this.handleChangePassword = this.handleChangePassword.bind(this);
}
onChangeHandler = (event) => {
@ -40,7 +42,27 @@ export default class ForgotPass extends Component {
);
};
handleChangePassword = (e) => {
if (this.state.confirmPassword !== this.state.password) {
this.setState({
error: {
state: true,
message: "Passwords do not match.",
},
});
}
Forms.submitResetPassword(this.props.query.token, this.state.password)
.then(() => this.setState({ success: true }))
.catch((err) =>
this.setState({
error: { state: true, message: err.messages.join(" - ") },
})
);
};
render() {
console.log(this.props);
if (this.state.success) {
return <Redirect to="sent-email" />;
}
@ -74,23 +96,56 @@ export default class ForgotPass extends Component {
</span>
))}
</Message>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Enter your E-mail"
name="user"
type="text"
onChange={this.onChangeHandler}
required
/>
<Button
color="blue"
fluid
size="large"
onClick={this.handleSendEmail}
>
Send E-mail
</Button>
{this.props.type === "FPassword1" ? (
<React.Fragment>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Enter your E-mail"
name="user"
type="text"
onChange={this.onChangeHandler}
required
/>
<Button
color="blue"
fluid
size="large"
onClick={this.handleSendEmail}
>
Send E-mail
</Button>
</React.Fragment>
) : (
<React.Fragment>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Reset your password"
name="password"
type="password"
onChange={this.onChangeHandler}
required
/>
<Form.Input
icon="address card outline"
iconPosition="left"
placeholder="Confirm Password"
name="confirmPassword"
type="password"
onChange={this.onChangeHandler}
required
/>
<Button
color="blue"
fluid
size="large"
onClick={this.handleChangePassword}
>
Confirm password
</Button>
</React.Fragment>
)}
</Form>
</Grid.Column>
</Grid>

View file

@ -1,91 +0,0 @@
import React, { Component } from "react";
import { render } from "react-dom";
import HomeNavbar from "./../components/HomeNavbar";
import {
Container,
Icon,
Image,
Menu,
Sidebar,
Responsive,
Header,
Divider,
Message,
Grid,
} from "semantic-ui-react";
class Paragraph extends Component {
state = { visible: true };
handleDismiss = () => {
this.setState({ visible: false });
setTimeout(() => {
this.setState({ visible: true });
}, 2000);
};
render() {
if (this.state.visible) {
return (
<Message
onDismiss={this.handleDismiss}
header="Link has been sent!"
content="An e-mail has been sent your address, please follow the
instruction to create a new password"
/>
);
}
return (
<p>
<br />
<i>The message will return in 2s</i>
<br />
<br />
</p>
);
}
}
const MessageReg = () => (
<Grid>
<HomeNavbar />
<Divider />
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}>
<Grid.Column width={6}></Grid.Column>
<Grid.Column width={10}>
<Image src="title5.png" />
</Grid.Column>
<Grid.Column width={3}></Grid.Column>
</Grid.Row>
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}></Grid.Row>
<Grid.Column width={3}></Grid.Column>
<Grid.Column width={4}>
<Image src="./img/logo.png" />
</Grid.Column>
<Grid.Column width={6}>
<Paragraph />
</Grid.Column>
<Grid.Column width={4}></Grid.Column>
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}></Grid.Row>
<Grid.Row height={3}>
<Grid.Column width={3}></Grid.Column>
<Grid.Column width={10}>
<Divider />
</Grid.Column>
<Grid.Column width={3}></Grid.Column>
</Grid.Row>
</Grid>
);
export default class ForgotPasswrod extends React.Component {
render() {
return <MessageReg />;
}
}