changing fields in account is done and upd chats retrieval

src/backend/api.js

@@ -5,7 +5,7 @@ const LOCAL = "http://localhost:8099";
 const DEV = "https://dev.bro-js.ru";
 const SERVER = "";
 
-export const BASE_API_URL = DEV + getConfigValue("enterfront.api") + "/enterfront";
+export const BASE_API_URL = LOCAL + getConfigValue("enterfront.api") + "/enterfront";
 
 // fetch(`${BASE_API_URL}/books/list`)
 

src/components/account/AccountButtons.jsx

@@ -1,15 +1,46 @@
-import React from 'react';
+import React, {useState} from 'react';
 import { URLs } from "../../__data__/urls";
 import ActionButton from "./ActionButton.jsx";
+import InputField from "../reg/InputField.jsx";
 
 const AccountButtons = (props) => {
+    const [chName, setChName] = useState(false);
+    const [chPassword, setChPassword] = useState(false);
+
+    const [nickname, setNickname] = useState("");
+    const [password, setPassword] = useState("");
+
   return (
       <div className="account-buttons">
           {props.registered ? (
               <>
                   <ActionButton title={"Exit"} action={props.exitHandler}/>
-                  <ActionButton title={"Change Name"} action={props.changeNameHandler}/>
+                  <ActionButton title={"Change Name"} action={() => setChName(true)}/>
-                  <ActionButton title={"Change Pass"} action={props.changePassHandler}/>
+                  {chName ? (
+                      <InputField
+                          title={""}
+                          value={nickname}
+                          setValue={setNickname}
+                          placeholder='Enter your new nickname'
+
+                          submit={nickname}
+                          enter={props.changeNameHandler}
+                      />
+                  ) : null}
+                  <ActionButton title={"Change Pass"} action={() => setChPassword(true)}/>
+                  {chPassword ? (
+                      <div>
+                          <InputField
+                              title={""}
+                              value={password}
+                              setValue={setPassword}
+                              placeholder='Enter your new password'
+
+                              submit={password}
+                              enter={props.changePassHandler}
+                          />
+                      </div>
+                  ) : null}
               </>
           ) : null}
           <a className="MyButton mclaren-regular" href={URLs.home.url}>Back</a>

src/components/home/css/homeTitle.css

@@ -20,6 +20,13 @@
     align-items: center;
 }
 
+.search-input div input {
+    background-color: white;
+    color: black;
+
+    border: 3px solid black;
+}
+
 
 @media only screen and (max-width: 800px) {
     .homeTitle {

src/components/reg/InputField.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
 const InputField = (props) => {
+    console.log('class:', props.className)
   return (
       <div>
           <p>{props.title}</p>
@@ -9,6 +10,13 @@ const InputField = (props) => {
               value={props.value}
               className="Input"
               placeholder={(props.placeholder) ? props.placeholder : ''}
+              onKeyDown={(e) => {
+                  if (e.key === 'Enter') {
+                      if (props.submit) {
+                          props.enter(props.submit);
+                      }
+                  }
+              }}
           />
       </div>
   );

src/pages/Account.jsx

@@ -19,10 +19,10 @@ const Account = () => {
     const [nickname, setNickname] = useState("");
     const [id, setId] = useState("");
 
-    async function changeNameHandler () {
+    async function changeNameHandler (newNickname) {
-        // ...
+        if (!newNickname) return;
 
-        const {ok, data} = await post('/change/nickname', {id: id, newNickname: "New Name"});
+        const {ok, data} = await post('/change/nickname', {id: id, newNickname: newNickname});
 
         if (!ok) {
             displayMessage(data.message, MessageType.ERROR);
@@ -32,8 +32,17 @@ const Account = () => {
         }
     }
 
-    async function changePassHandler (){
+    async function changePassHandler (newPass){
-        // ...
+        if (!newPass) return;
+
+        const {ok, data} = await post('/change/password', {id: id, newPassword: newPass});
+
+        if (!ok) {
+            displayMessage(data.message, MessageType.ERROR);
+        } else {
+            localStorage.setItem("message", "Password was changed");
+            window.location.href = URLs.account.url;
+        }
     }
 
     async function getUser() {

src/pages/Home.jsx

@@ -35,6 +35,8 @@ const Home = () => {
             return;
         }
 
+        displayMessage("Sent", MessageType.INFO);
+
         const {ok, data} = await post('/chat/item/' + username + '/' + alias);
         if (!ok) {
             displayMessage(data.message, MessageType.ERROR);
@@ -55,12 +57,15 @@ const Home = () => {
 
           <HomeTitle/>
 
-          <InputField
+          <div className="search-input">
-              title="Create new chat"
+              <InputField
-              value={interlocutor}
+                  title="Create new chat"
-              setValue={setInterlocutor}
+                  value={interlocutor}
-              placeholder="Enter the username (id)"
+                  setValue={setInterlocutor}
-          />
+                  placeholder="Enter the username (id)"
+              />
+          </div>
+
           <Search search={createChat} item={interlocutor}/>
 
           <p>Your chats</p>

stubs/api/auth/index.js

@@ -34,11 +34,13 @@ authRouter.post('/login', (req, res) => {
     // Invalid identification
     if (!user) {
         res.status(401).send({message: 'Invalid credentials (id)'});
+        return;
     }
 
     // Invalid authentication
     if (!password || password !== user.password) {
         res.status(401).send({message: 'Invalid credentials (password)'});
+        return;
     }
 
     // Now, authorization
@@ -59,10 +61,12 @@ authRouter.post('/reg', (req, res) => {
     // Invalid identification
     if (user) {
         res.status(409).send({message: 'Such id already exists'});
+        return;
     }
 
     if (!name || !password || !nickname) {
         res.status(401).send({message: 'Empty or invalid fields'});
+        return;
     }
 
     // Add to 'DB'

stubs/api/change/index.js

@@ -16,6 +16,7 @@ changeRouter.post('/nickname', (req, res) => {
     // Invalid identification
     if (!user) {
         res.status(401).send({message: 'Invalid credentials (id)'});
+        return;
     }
 
     const updatedUser = {
@@ -42,6 +43,7 @@ changeRouter.post('/password', (req, res) => {
     // Invalid identification
     if (!user) {
         res.status(401).send({message: 'Invalid credentials (id)'});
+        return;
     }
 
     // Delete the old one