confirm reset password page done

smart-hut/src/App.js

@@ -9,6 +9,7 @@ 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";
 import Instruction from "./views/Instruction";
 import queryString from "query-string";
 
@@ -134,6 +135,9 @@ class App extends Component {
           <Route path="/password-reset">
             <ChangePass query={this.state.query} />
           </Route>
+          <Route path="/conf-reset-pass">
+            <ConfirmResetPassword />
+          </Route>
           <Route component={FourOhFour} />
         </Switch>
       </BrowserRouter>

smart-hut/src/views/ConfirmResetPassword.js

@@ -0,0 +1,82 @@
+import React, { Component } from "react";
+import HomeNavbar from "./../components/HomeNavbar";
+import { Image, 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="Congratulation!"
+            content="Your password has been succesffuly reset"
+          />
+        );
+      }
+  
+      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 ConfirmResetPassword extends Component {
+    render() {
+      return <MessageReg/>;
+    }
+  }