31.07.2020

index.js

@@ -1,220 +0,0 @@
-const express = require("express");
-const bodyParser = require("body-parser");
-const Sequelize = require("sequelize");
-const jwt = require("jsonwebtoken");
-const { Op } = Sequelize;
-const { graphqlHTTP } = require("express-graphql");
-const { buildSchema } = require("graphql");
-const cors = require("cors");
-const expressJwt = require("express-jwt");
-// const mailer = require("./smtpGmail");
-const app = express();
-
-app.use(bodyParser.json());
-app.use(express.static("myproject"));
-// app.use(errorHandler);
-app.use(bodyParser.urlencoded({ extended: false }));
-app.use(cors());
-
-const sequelize = new Sequelize("emrada2", "root", "Emmanuil2228125%", {
-  timezone: "+03:00",
-  host: "localhost",
-  dialect: "mysql",
-});
-
-class User extends Sequelize.Model {}
-
-User.init(
-  {
-    email: Sequelize.STRING,
-    password: Sequelize.STRING,
-    login: Sequelize.STRING,
-  },
-  { sequelize, modelName: "user" }
-);
-
-class Message extends Sequelize.Model {}
-
-Message.init(
-  { message: Sequelize.STRING },
-  { sequelize, modelName: "message" }
-);
-
-// class Transaction extends Sequelize.Model {}
-// Transaction.init(
-//   { amount: Sequelize.DECIMAL },
-//   {
-//     sequelize,
-//     modelName: "transaction",
-//     scopes: {
-//       before(date) {
-//         return {
-//           where: {
-//             createdAt: {
-//               [Op.lte]: date,
-//             },
-//           },
-//         };
-//       },
-//     },
-//   }
-// );
-
-User.hasMany(Message, {});
-Message.belongsTo(User, {});
-// Money.hasMany(Transaction, { as: "ins", foreignKey: "inId" });
-// Money.hasMany(Transaction, { as: "outs", foreignKey: "outId" });
-// Transaction.belongsTo(Money, { as: "in", sourceKey: "inId" });
-// Transaction.belongsTo(Money, { as: "out", sourceKey: "outId" });
-
-const secret = `7.!BMB?Y+Bc2vZE-Hb5YuCT6QvE^FN,JWN6M?_VtFXeC5dLtB!`;
-const secretPass = "JcFWhuLkpaK9aB3Gtbvo2Y0BApdw5q1tUyAyJeD8fJXs78d7zR";
-
-const authenticate = async ({ email, password }) => {
-  const user = await User.findOne({ where: { email, password } });
-  if (user) {
-    const token = jwt.sign({ sub: { id: user.id, email: user.email } }, secret);
-    return token;
-  }
-};
-
-var schema = buildSchema(`
-  type Query {
-    getLogin(login: String, password: String): String
-    getUser(id: ID!): User
-    getMessage(id: ID!): Message
-  } 
-  type Mutation {
-    createUser(email: String, password: String, login: String): User
-  } 
-  type User {
-    id: Int
-    createdAt: String
-    email: String
-    login: String
-  }
-  type Message {
-    id: Int
-    createdAt: String
-    message: String
-    userId: User
-  }
-`);
-
-const getUser = async ({ id }) => await User.findByPk(id);
-
-const getMessage = async ({ id }) => {
-  return await Message.findByPk(id) || getUser()
-};
-
-const getLogin = async ({ login, password }) => {
-  const userFind = await User.findOne({ where: { login, password } });
-  return authenticate(userFind);
-};
-
-const createUser = async ({ email, password, login }) => {
-  const wasUserCreated = await User.findOne({ where: { email } });
-  if (!wasUserCreated) {
-    // const passwordModification = jwt.sign(password + secretPass, secret);
-    const user = { email, password, login };
-    const newUser = new User(user);
-    await newUser.save();
-    return await User.findOne({ where: { login } });
-  } else console.error("error");
-};
-
-var root = { getUser, getLogin, createUser, getMessage };
-
-app.use(
-  "/graphql",
-  graphqlHTTP({
-    schema: schema,
-    rootValue: root,
-    graphiql: true,
-  })
-);
-
-app.get("/users", async (req, res) => res.send(await User.findAll()));
-app.get("/message", async (req, res) => res.send(await Message.findAll()));
-
-// app.post("/users", async (req, res) => {
-//   // const twoUsers = async () => {
-//   //   const userEmail = await User.findOne({ where: { email: req.body.email } });
-//   //   if (userEmail !== null) console.log(err);
-//   //   else {
-//   //     console.log("hi");
-//   var newUser = new User(req.body);
-//   // const message = {
-//   //   to: req.body.email,
-//   //   subject: "Registered",
-//   //   text: `Отлично. Вот ваши данные:
-//   //   login: ${req.body.email}
-//   //   password: ${req.body.password}
-
-//   //   Перейдите по ссылке, чтобы войти в свой аккаунт
-//   //   url: http://localhost:3335/sign_in`,
-//   // };
-//   // mailer(message);
-//   await newUser.save();
-//   res.status(201).send(newUser);
-//   // }
-//   // };
-//   // twoUsers();
-// });
-
-app.get("/login", async (req, res) => {
-  res.send(await User.findAll());
-});
-
-// function errorHandler(err, req, res, next) {
-//   if (typeof err === "string") {
-//     return res.status(400).json({ message: err });
-//   }
-
-//   if (err.name === "UnauthorizedError") {
-//     return res.status(401).json({ message: "Invalid Token" });
-//   }
-
-//   return res.status(500).json({ message: err.message });
-// }
-
-app.post("/users/authenticate", async (req, res, next) => {
-  authenticate(req.body)
-    .then((user) => {
-      user
-        ? res.json(user)
-        : res
-            .status(400)
-            .json({ message: "Username or password is incorrect" });
-    })
-    .catch((err) => next(err));
-});
-
-// app.use(jwtWare());
-
-app.get("/a", (req, res, next) => {
-  console.log(req.headers.authorization);
-  const token1 = req.headers.authorization;
-  console.log(token1);
-  // if (token) {
-  const data = jwt.verify(token1, secret);
-  console.log(data);
-  // if (data) {
-  console.log(data.sub.login);
-  res.send(`<h1>Hello ${data.sub.login}</h1>`);
-  // } else {
-  //   res.send(`<h1>Hello haker</h1>`);
-  // }
-  // }
-});
-
-// (async () => {
-//   let persone =
-//     // User.findOne({ where: { login: "David" } }) ||
-//     (await User.create({ email: "gfd@gfd.gfd", password: "1", login: "A" }))
-//    persone.createMessage({message: "Hello"})
-// })();
-
-sequelize.sync();
-
-app.listen(3330, () => console.log("The server started on port 3330"));

myproject/package-lock.json

@@ -30,6 +30,54 @@
       "resolved": "https://registry.npmjs.org/@ant-design/icons-svg/-/icons-svg-4.1.0.tgz",
       "integrity": "sha512-Fi03PfuUqRs76aI3UWYpP864lkrfPo0hluwGqh7NJdLhvH4iRDc3jbJqZIvRDLHKbXrvAfPPV3+zjUccfFvWOQ=="
     },
+    "@apollo/client": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.0.2.tgz",
+      "integrity": "sha512-4ighan5Anlj4tK/tdUHs4Mi1njqXZ7AxRCVolz/H702DjPphAJfm+FRkIadPTmwz+OLO+d+tX+6V1VBshf02rg==",
+      "requires": {
+        "@types/zen-observable": "^0.8.0",
+        "@wry/context": "^0.5.2",
+        "@wry/equality": "^0.1.9",
+        "fast-json-stable-stringify": "^2.0.0",
+        "graphql-tag": "^2.10.4",
+        "hoist-non-react-statics": "^3.3.2",
+        "optimism": "^0.12.1",
+        "prop-types": "^15.7.2",
+        "symbol-observable": "^1.2.0",
+        "ts-invariant": "^0.4.4",
+        "tslib": "^1.10.0",
+        "zen-observable": "^0.8.14"
+      }
+    },
+    "@apollo/react-hooks": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@apollo/react-hooks/-/react-hooks-4.0.0.tgz",
+      "integrity": "sha512-fCu0cbne3gbUl0QbA8X4L33iuuFVQbC5Jo2MIKRK8CyawR6PoxDpFdFA1kc6033ODZuZZ9Eo4RdeJFlFIIYcLA==",
+      "requires": {
+        "@apollo/client": "^3.0.2"
+      },
+      "dependencies": {
+        "@apollo/client": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.0.2.tgz",
+          "integrity": "sha512-4ighan5Anlj4tK/tdUHs4Mi1njqXZ7AxRCVolz/H702DjPphAJfm+FRkIadPTmwz+OLO+d+tX+6V1VBshf02rg==",
+          "requires": {
+            "@types/zen-observable": "^0.8.0",
+            "@wry/context": "^0.5.2",
+            "@wry/equality": "^0.1.9",
+            "fast-json-stable-stringify": "^2.0.0",
+            "graphql-tag": "^2.10.4",
+            "hoist-non-react-statics": "^3.3.2",
+            "optimism": "^0.12.1",
+            "prop-types": "^15.7.2",
+            "symbol-observable": "^1.2.0",
+            "ts-invariant": "^0.4.4",
+            "tslib": "^1.10.0",
+            "zen-observable": "^0.8.14"
+          }
+        }
+      }
+    },
     "@babel/code-frame": {
       "version": "7.10.4",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.10.4.tgz",
@@ -1863,6 +1911,11 @@
       "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-15.0.0.tgz",
       "integrity": "sha512-FA/BWv8t8ZWJ+gEOnLLd8ygxH/2UFbAvgEonyfN6yWGLKc7zVjbpl2Y4CTjid9h2RfgPP6SEt6uHwEOply00yw=="
     },
+    "@types/zen-observable": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/@types/zen-observable/-/zen-observable-0.8.0.tgz",
+      "integrity": "sha512-te5lMAWii1uEJ4FwLjzdlbw3+n0FZNOvFXHxQDKeT0dilh7HOzdMzV2TrJVUzq8ep7J4Na8OUYPRLSQkJHAlrg=="
+    },
     "@typescript-eslint/eslint-plugin": {
       "version": "2.34.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.34.0.tgz",
@@ -2075,6 +2128,22 @@
         "@xtuc/long": "4.2.2"
       }
     },
+    "@wry/context": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@wry/context/-/context-0.5.2.tgz",
+      "integrity": "sha512-B/JLuRZ/vbEKHRUiGj6xiMojST1kHhu4WcreLfNN7q9DqQFrb97cWgf/kiYsPSUCAMVN0HzfFc8XjJdzgZzfjw==",
+      "requires": {
+        "tslib": "^1.9.3"
+      }
+    },
+    "@wry/equality": {
+      "version": "0.1.11",
+      "resolved": "https://registry.npmjs.org/@wry/equality/-/equality-0.1.11.tgz",
+      "integrity": "sha512-mwEVBDUVODlsQQ5dfuLUS5/Tf7jqUKyhKYHmVi4fPB6bDMOfWvUPJmKgS1Z7Za/sOI3vzWt4+O7yCiL/70MogA==",
+      "requires": {
+        "tslib": "^1.9.3"
+      }
+    },
     "@xtuc/ieee754": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@@ -2259,6 +2328,129 @@
         "normalize-path": "^2.1.1"
       }
     },
+    "apollo-boost": {
+      "version": "0.4.9",
+      "resolved": "https://registry.npmjs.org/apollo-boost/-/apollo-boost-0.4.9.tgz",
+      "integrity": "sha512-05y5BKcDaa8w47f8d81UVwKqrAjn8uKLv6QM9fNdldoNzQ+rnOHgFlnrySUZRz9QIT3vPftQkEz2UEASp1Mi5g==",
+      "requires": {
+        "apollo-cache": "^1.3.5",
+        "apollo-cache-inmemory": "^1.6.6",
+        "apollo-client": "^2.6.10",
+        "apollo-link": "^1.0.6",
+        "apollo-link-error": "^1.0.3",
+        "apollo-link-http": "^1.3.1",
+        "graphql-tag": "^2.4.2",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.10.0"
+      }
+    },
+    "apollo-cache": {
+      "version": "1.3.5",
+      "resolved": "https://registry.npmjs.org/apollo-cache/-/apollo-cache-1.3.5.tgz",
+      "integrity": "sha512-1XoDy8kJnyWY/i/+gLTEbYLnoiVtS8y7ikBr/IfmML4Qb+CM7dEEbIUOjnY716WqmZ/UpXIxTfJsY7rMcqiCXA==",
+      "requires": {
+        "apollo-utilities": "^1.3.4",
+        "tslib": "^1.10.0"
+      }
+    },
+    "apollo-cache-inmemory": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/apollo-cache-inmemory/-/apollo-cache-inmemory-1.6.6.tgz",
+      "integrity": "sha512-L8pToTW/+Xru2FFAhkZ1OA9q4V4nuvfoPecBM34DecAugUZEBhI2Hmpgnzq2hTKZ60LAMrlqiASm0aqAY6F8/A==",
+      "requires": {
+        "apollo-cache": "^1.3.5",
+        "apollo-utilities": "^1.3.4",
+        "optimism": "^0.10.0",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.10.0"
+      },
+      "dependencies": {
+        "@wry/context": {
+          "version": "0.4.4",
+          "resolved": "https://registry.npmjs.org/@wry/context/-/context-0.4.4.tgz",
+          "integrity": "sha512-LrKVLove/zw6h2Md/KZyWxIkFM6AoyKp71OqpH9Hiip1csjPVoD3tPxlbQUNxEnHENks3UGgNpSBCAfq9KWuag==",
+          "requires": {
+            "@types/node": ">=6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "optimism": {
+          "version": "0.10.3",
+          "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.10.3.tgz",
+          "integrity": "sha512-9A5pqGoQk49H6Vhjb9kPgAeeECfUDF6aIICbMDL23kDLStBn1MWk3YvcZ4xWF9CsSf6XEgvRLkXy4xof/56vVw==",
+          "requires": {
+            "@wry/context": "^0.4.0"
+          }
+        }
+      }
+    },
+    "apollo-client": {
+      "version": "2.6.10",
+      "resolved": "https://registry.npmjs.org/apollo-client/-/apollo-client-2.6.10.tgz",
+      "integrity": "sha512-jiPlMTN6/5CjZpJOkGeUV0mb4zxx33uXWdj/xQCfAMkuNAC3HN7CvYDyMHHEzmcQ5GV12LszWoQ/VlxET24CtA==",
+      "requires": {
+        "@types/zen-observable": "^0.8.0",
+        "apollo-cache": "1.3.5",
+        "apollo-link": "^1.0.0",
+        "apollo-utilities": "1.3.4",
+        "symbol-observable": "^1.0.2",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.10.0",
+        "zen-observable": "^0.8.0"
+      }
+    },
+    "apollo-link": {
+      "version": "1.2.14",
+      "resolved": "https://registry.npmjs.org/apollo-link/-/apollo-link-1.2.14.tgz",
+      "integrity": "sha512-p67CMEFP7kOG1JZ0ZkYZwRDa369w5PIjtMjvrQd/HnIV8FRsHRqLqK+oAZQnFa1DDdZtOtHTi+aMIW6EatC2jg==",
+      "requires": {
+        "apollo-utilities": "^1.3.0",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.9.3",
+        "zen-observable-ts": "^0.8.21"
+      }
+    },
+    "apollo-link-error": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/apollo-link-error/-/apollo-link-error-1.1.13.tgz",
+      "integrity": "sha512-jAZOOahJU6bwSqb2ZyskEK1XdgUY9nkmeclCrW7Gddh1uasHVqmoYc4CKdb0/H0Y1J9lvaXKle2Wsw/Zx1AyUg==",
+      "requires": {
+        "apollo-link": "^1.2.14",
+        "apollo-link-http-common": "^0.2.16",
+        "tslib": "^1.9.3"
+      }
+    },
+    "apollo-link-http": {
+      "version": "1.5.17",
+      "resolved": "https://registry.npmjs.org/apollo-link-http/-/apollo-link-http-1.5.17.tgz",
+      "integrity": "sha512-uWcqAotbwDEU/9+Dm9e1/clO7hTB2kQ/94JYcGouBVLjoKmTeJTUPQKcJGpPwUjZcSqgYicbFqQSoJIW0yrFvg==",
+      "requires": {
+        "apollo-link": "^1.2.14",
+        "apollo-link-http-common": "^0.2.16",
+        "tslib": "^1.9.3"
+      }
+    },
+    "apollo-link-http-common": {
+      "version": "0.2.16",
+      "resolved": "https://registry.npmjs.org/apollo-link-http-common/-/apollo-link-http-common-0.2.16.tgz",
+      "integrity": "sha512-2tIhOIrnaF4UbQHf7kjeQA/EmSorB7+HyJIIrUjJOKBgnXwuexi8aMecRlqTIDWcyVXCeqLhUnztMa6bOH/jTg==",
+      "requires": {
+        "apollo-link": "^1.2.14",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.9.3"
+      }
+    },
+    "apollo-utilities": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/apollo-utilities/-/apollo-utilities-1.3.4.tgz",
+      "integrity": "sha512-pk2hiWrCXMAy2fRPwEyhvka+mqwzeP60Jr1tRYi5xru+3ko94HI9o6lK0CT33/w4RDlxWchmdhDCrvdr+pHCig==",
+      "requires": {
+        "@wry/equality": "^0.1.2",
+        "fast-json-stable-stringify": "^2.0.0",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.10.0"
+      }
+    },
     "aproba": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
@@ -6147,6 +6339,16 @@
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
       "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw=="
     },
+    "graphql": {
+      "version": "15.3.0",
+      "resolved": "https://registry.npmjs.org/graphql/-/graphql-15.3.0.tgz",
+      "integrity": "sha512-GTCJtzJmkFLWRfFJuoo9RWWa/FfamUHgiFosxi/X1Ani4AVWbeyBenZTNX6dM+7WSbbFfTo/25eh0LLkwHMw2w=="
+    },
+    "graphql-tag": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.11.0.tgz",
+      "integrity": "sha512-VmsD5pJqWJnQZMUeRwrDhfgoyqcfwEkvtpANqcoUG8/tOLkwNgU9mzub/Mc78OJMhHjx7gfAMTxzdG43VGg3bA=="
+    },
     "growly": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
@@ -8848,6 +9050,14 @@
         "is-wsl": "^1.1.0"
       }
     },
+    "optimism": {
+      "version": "0.12.1",
+      "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.12.1.tgz",
+      "integrity": "sha512-t8I7HM1dw0SECitBYAqFOVHoBAHEQBTeKjIL9y9ImHzAVkdyPK4ifTgM4VJRDtTUY4r/u5Eqxs4XcGPHaoPkeQ==",
+      "requires": {
+        "@wry/context": "^0.5.2"
+      }
+    },
     "optimize-css-assets-webpack-plugin": {
       "version": "5.0.3",
       "resolved": "https://registry.npmjs.org/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.3.tgz",
@@ -12622,6 +12832,14 @@
         "punycode": "^2.1.0"
       }
     },
+    "ts-invariant": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/ts-invariant/-/ts-invariant-0.4.4.tgz",
+      "integrity": "sha512-uEtWkFM/sdZvRNNDL3Ehu4WVpwaulhwQszV8mrtcdeE8nN00BV9mAmQ88RkrBhFgl9gMgvjJLAQcZbnPXI9mlA==",
+      "requires": {
+        "tslib": "^1.9.3"
+      }
+    },
     "ts-pnp": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/ts-pnp/-/ts-pnp-1.1.6.tgz",
@@ -13981,6 +14199,20 @@
         "camelcase": "^5.0.0",
         "decamelize": "^1.2.0"
       }
+    },
+    "zen-observable": {
+      "version": "0.8.15",
+      "resolved": "https://registry.npmjs.org/zen-observable/-/zen-observable-0.8.15.tgz",
+      "integrity": "sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ=="
+    },
+    "zen-observable-ts": {
+      "version": "0.8.21",
+      "resolved": "https://registry.npmjs.org/zen-observable-ts/-/zen-observable-ts-0.8.21.tgz",
+      "integrity": "sha512-Yj3yXweRc8LdRMrCC8nIc4kkjWecPAUVh0TI0OUrWXx6aX790vLcDlWca6I4vsyCGH3LpWxq0dJRcMOFoVqmeg==",
+      "requires": {
+        "tslib": "^1.9.3",
+        "zen-observable": "^0.8.0"
+      }
     }
   }
 }

myproject/package.json

@@ -4,9 +4,14 @@
   "private": true,
   "dependencies": {
     "@ant-design/icons": "^4.2.1",
+    "@apollo/client": "^3.0.2",
+    "@apollo/react-hooks": "^4.0.0",
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.2.1",
+    "apollo-boost": "^0.4.9",
+    "graphql": "^15.3.0",
+    "graphql-tag": "^2.11.0",
     "jwt-decode": "^2.2.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",

myproject/src/App.js

@@ -1,33 +1,37 @@
 import React from "react";
-import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
-import { createBrowserHistory as createHistory } from "history";
+import { Router, Route, Switch } from "react-router-dom";
 import { Provider } from "react-redux";
 import "reset-css";
 
+import history from "./history";
 import { store } from "./store/store";
 import Login from "./signIn/signIn";
 import Register from "./signUp/signUp";
+import putPassword from "./putPassword/putPassword";
 import MyProfile from "./myProfile/myProfile";
 
 const App = (props) => {
   return (
-    <Router history={createHistory}>
-      <Provider store={store}>
+    <Provider store={store}>
+      <Router history={history}>
         <Switch>
           <div className="wrapper">
             <Route exact path={["/", "/sign_in"]} component={Login} />
             <Route exact path="/sign_up" component={Register} />
+            <Route exact path="/put_password" component={putPassword} />
             <Route
               exact
               path="/my_profile"
               render={() => (
-                <MyProfile message={props.message} users={props.users} />
+                <MyProfile 
+                // message={props.message} users={props.users}
+                 />
               )}
             />
           </div>
         </Switch>
-      </Provider>
-    </Router>
+      </Router>
+     </Provider>
   );
 };
 

myproject/src/history.js

@@ -0,0 +1,3 @@
+import { createBrowserHistory } from "history";
+
+export default createBrowserHistory()

myproject/src/index.js

@@ -1,99 +1,39 @@
 import React from "react";
 import ReactDOM from "react-dom";
+import ApolloClient from "apollo-boost";
+import { ApolloProvider } from "@apollo/react-hooks";
 import "./index.css";
+
 import App from "./App";
 
-const state = {
-  users: [
-    { id: 1, email: "1", password: "1", login: "1" },
-    { id: 2, email: "2", password: "2", login: "2" },
-    { id: 3, email: "3", password: "3", login: "3" },
-  ],
-  message: [
-    {
-      id: 1,
-      message: "Hello",
-      idSendUser: "2",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 2,
-      message: "Привет",
-      idSendUser: "3",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 1,
-      message: "Hello",
-      idSendUser: "2",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 2,
-      message: "Привет",
-      idSendUser: "3",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 1,
-      message: "Hello",
-      idSendUser: "2",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 2,
-      message: "Привет",
-      idSendUser: "3",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 1,
-      message: "Hello",
-      idSendUser: "2",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 2,
-      message: "Привет",
-      idSendUser: "3",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 1,
-      message: "Hello",
-      idSendUser: "2",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-    {
-      id: 2,
-      message: "Привет",
-      idSendUser: "3",
-      idGotUser: "1",
-      image:
-        "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
-    },
-  ],
-};
+const client = new ApolloClient({
+  uri: "http://localhost:3330/graphql",
+});
+
+// const state = {
+//   users: [
+//     { id: 1, email: "1", password: "1", login: "1" },
+//     { id: 2, email: "2", password: "2", login: "2" },
+//     { id: 3, email: "3", password: "3", login: "3" },
+//   ],
+//   message: [
+//     {
+//       id: 1,
+//       message: "Hello",
+//       idSendUser: "2",
+//       idGotUser: "1",
+//       image:
+//         "https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg",
+//     },
+//   ],
+// };
 
 ReactDOM.render(
-  <App users={state.users} message={state.message} />,
+  // <ApolloProvider client={client}>
+    <App 
+    // users={state.users} message={state.message} 
+    />
+  // </ApolloProvider>
+  ,
   document.getElementById("root")
 );

myproject/src/myProfile/chatGroups/actionChatGroup/actionChatGroup.js

@@ -0,0 +1,92 @@
+import { actionPromise, store } from "../../../store/store";
+// import history from '../../history';
+
+// store.dispatch({
+//   type: "PROMISE",
+//   name: "login",
+//   status: "RESOLVED",
+//   payload: "hi",
+// });
+
+// store.dispatch({
+//   type: "PROMISE",
+//   name: "chatList",
+//   status: "REJECTED",
+//   error: "bye",
+// });
+
+// function actionToken(token) {
+//   return {
+//     type: "TOKEN",
+//     token,
+//   };
+// }
+
+// function actionError(error) {
+//   return {
+//     type: "ERROR",
+//     error,
+//   };
+// }
+
+// const handleClick = () => history.push("/my_profile")
+
+const getGQL = (url, headers = {}) => (query = "") =>
+  fetch(url, {
+    method: "POST",
+    headers: {
+      Accept: "application/json",
+      "Content-Type": "application/json",
+      ...headers,
+    },
+    body: JSON.stringify({ query }),
+  })
+  // .then((res) => console.log(res))
+    .then((res) => res.json())
+    // .then((a) => console.log(a));
+
+const actionChatGroupPromise = () => {
+  var promise = getGQL("http://localhost:3330/graphql")(
+    `query allChatGroup{
+      getAllChatGroups {
+        id, inId {
+          id, login
+        }, outId {
+          id, login
+        }
+      }
+    }`
+  );
+  return actionPromise("chatGroup", promise);
+};
+
+const actionChatGroup = () => {
+  return async (dispatch) => {
+    var token = await dispatch(actionChatGroupPromise());
+    // console.log(token);
+    // if (token === undefined) await dispatch(actionLoginPromise1(login, password))
+    // if(token) history.push("/my_profile")
+  };
+};
+
+const actionMessagePromise = () => {
+  var promise = getGQL("http://localhost:3330/graphql")(
+    `query allMessage{
+      getAllMessages {
+        id, message, inId {
+          id, login
+        }
+      }
+    }`
+  );
+  return actionPromise("message", promise);
+};
+
+const actionMessage = () => {
+  return async (dispatch) => {
+    var token = await dispatch(actionMessagePromise());
+    // console.log(token);
+  };
+};
+
+export { actionChatGroup, actionMessage };

myproject/src/myProfile/chatGroups/chatGroups.js

@@ -1,26 +1,78 @@
-import React from "react";
+import React, { Component } from "react";
+import { connect } from "react-redux";
+
+import {
+  actionChatGroup,
+  actionMessage,
+} from "./actionChatGroup/actionChatGroup";
 import "./chatGroups.css";
 
-const ChatGroups = (props) => {
+const ChatGroupMessage = ({message}) => {
+  return (
+    <div className="last-message">
+      <span>{message}</span>
+      <div className="unread-messages">5</div>
+    </div>
+  );
+};
+
+const ChatGroups = ({ id, login, state }) => {
+  const way = (obj, resolverName, a) => {
+    const stateObj = state[obj];
+    for (var keys in stateObj) {
+      for (var keyData in stateObj[keys]) {
+        if (keyData === "data") {
+          const allObj = stateObj[keys][keyData][resolverName];
+          return allObj.map(a);
+        }
+      }
+    }
+  };
+
   return (
     <>
-      <div className="groups">
+      <div className="groups" onClick={() => console.log(id)}>
         <div className="avatar">
-          <img src={props.src} />
+          {/* <img src={props.src} /> */}
+          <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg" />
         </div>
+
         <div className="data">
           <div className="userName">
-            <span>{props.login}</span>
+            <span>{login}</span>
             <span className="date">00:00</span>
           </div>
-          <div className="last-message">
-            <span>{props.message}</span>
-            <div className="unread-messages">5</div>
-          </div>
+
+          {/* {way("message", "getAllMessages", (el) => (
+            <ChatGroupMessage
+              key={el.id}
+              message={el.message}
+            />
+          ))} */}
+          {/* <ChatGroupMessage /> */}
+
+          {/* <div className="last-message"> */}
+          {/* <span>{props.message}</span> */}
+          {/* <div className="unread-messages">5</div>
+          </div> */}
         </div>
       </div>
     </>
   );
 };
 
-export default ChatGroups;
+const ChatGroupsBar = ({ id, login }) => (
+  <ConnectedChatGroups id={id} login={login} />
+);
+
+const ConnectedChatGroups = connect(
+  (state) => {
+    return { state };
+  },
+  {
+    chatGroup: actionChatGroup,
+    message: actionMessage,
+  }
+)(ChatGroups);
+
+export default ChatGroupsBar;

myproject/src/myProfile/chatMessages/chatMessages.js

@@ -5,7 +5,9 @@ const ChatMessage = (props) => {
   // debugger
   return (
     <>
-      <div className="loginPartner">{props.message[0].idSendUser}</div>
+      <div className="loginPartner">
+        {/* {props.message[0].idSendUser} */}
+        </div>
       <div className="messagePartner">
         <div className="message">jkdflgdfl/gkdf;</div>
         <div className="sendMessage">
@@ -17,4 +19,4 @@ const ChatMessage = (props) => {
   );
 };
 
-export default ChatMessage;
+export default ChatMessage

myproject/src/myProfile/myProfile.js

@@ -1,52 +1,126 @@
-import React, { useState } from "react";
+import React, { Component, useState, useEffect } from "react";
 import { TeamOutlined, FormOutlined, SearchOutlined } from "@ant-design/icons";
+import { connect } from "react-redux";
 import "./myProfile.css";
 
-import ChatGroups from "./chatGroups/chatGroups";
+import ChatGroupsBar from "./chatGroups/chatGroups";
 import ChatMessages from "./chatMessages/chatMessages";
+import {
+  actionChatGroup,
+  actionMessage,
+} from "./chatGroups/actionChatGroup/actionChatGroup";
 
-const MyProfile = (props) => {
-  const [text, setText] = useState("");
-
-  const chatGroups = props.message.map((el) => (
-    <ChatGroups
-      key={el.id}
-      src={el.image}
-      login={el.idSendUser}
-      message={el.message}
-    />
-  ));
-
-  return (
-    <div className="container">
-      <div className="my-profile">
-        <div className="chat-sidebar">
-          <div className="create-chat">
-            <div>
+class MyProfile1 extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { text: "" };
+  }
+
+  // chatGroups() {
+  //   const stateChatGroup = this.props.state.chatGroup;
+  //   for (var keys in stateChatGroup) {
+  //     for (var keyData in stateChatGroup[keys]) {
+  //       if (keyData === "data") {
+  //         const allChatGroups = stateChatGroup[keys][keyData].getAllChatGroups;
+  //         return allChatGroups.map((el) => (
+  //           <ChatGroupsBar key={el.id} id={el.id} login={el.inId.login} />
+  //         ));
+  //       }
+  //     }
+  //   }
+  // }
+
+  // chatGroupsMessage() {
+  //   const stateMessages = this.props.state.message;
+  //   for (var keys in stateMessages) {
+  //     for (var keyData in stateMessages[keys]) {
+  //       if (keyData === "data") {
+  //         const allMessages = stateMessages[keys][keyData].getAllMessages;
+  //         return allMessages.map((el) => (
+  //           <ChatMessages
+  //             key={el.id}
+  //             id={el.id}
+  //             login={el.inId.login}
+  //             message={el.message}
+  //           />
+  //         ));
+  //       }
+  //     }
+  //   }
+  // }
+
+  way(obj, resolverName, a) {
+    const stateObj = this.props.state[obj];
+    for (var keys in stateObj) {
+      for (var keyData in stateObj[keys]) {
+        if (keyData === "data") {
+          const allObj = stateObj[keys][keyData][resolverName];
+          console.log(allObj);
+          return allObj.map(a);
+        }
+      }
+    }
+  }
+
+  componentDidMount() {
+    this.props.chatGroup();
+    this.props.message();
+  }
+
+  render() {
+    return (
+      <div className="container">
+        <div className="my-profile">
+          <div className="chat-sidebar">
+            <div className="create-chat">
               <div>
-                <TeamOutlined />
-                <span className="span">Список чатов</span>
+                <div>
+                  <TeamOutlined />
+                  <span className="span">Список чатов</span>
+                </div>
+                <FormOutlined />
+              </div>
+
+              <div className="search-input">
+                <input
+                  value={this.state.text}
+                  onChange={(e) => this.setState({ text: e.target.value })}
+                  placeholder="Поиск..."
+                />
+                <SearchOutlined />
               </div>
-              <FormOutlined />
             </div>
-            <div className="search-input">
-              <input
-                value={text}
-                onChange={(e) => setText(e.target.value)}
-                placeholder="Поиск..."
-              />
-              <SearchOutlined />
+
+            <div className="chat-groups">
+              {this.way("chatGroup", "getAllChatGroups", (el) => (
+                <ChatGroupsBar key={el.id} id={el.id} login={el.outId.login} />
+              ))}
             </div>
           </div>
-          <div className="chat-groups">{chatGroups}</div>
-        </div>
 
-        <div className="chat-messages">
-          <ChatMessages message={props.message} />
+          <div className="chat-messages">
+            {this.way("message", "getAllMessages", (el) => (
+              <ChatMessages
+                key={el.id}
+                id={el.id}
+                login={el.inId.login}
+                message={el.message}
+              />
+            ))}
+          </div>
         </div>
       </div>
-    </div>
-  );
-};
+    );
+  }
+}
+
+const MyProfile = (props) => <ConnectedChatGroups />;
+
+const ConnectedChatGroups = connect(
+  (state) => {
+    return { state };
+  },
+  { chatGroup: actionChatGroup, message: actionMessage }
+)(MyProfile1);
 
 export default MyProfile;

myproject/src/putPassword/actionPutPassword/actionPutPassword.js

@@ -0,0 +1,67 @@
+import { actionPromise, store } from "../../store/store";
+
+// store.dispatch({
+//   type: "PROMISE",
+//   name: "login",
+//   status: "RESOLVED",
+//   payload: "hi",
+// });
+
+// store.dispatch({
+//   type: "PROMISE",
+//   name: "chatList",
+//   status: "REJECTED",
+//   error: "bye",
+// });
+
+// function actionToken(token) {
+//   return {
+//     type: "TOKEN",
+//     token,
+//   };
+// }
+
+// function actionError(error) {
+//   return {
+//     type: "ERROR",
+//     error,
+//   };
+// }
+
+const getGQL = (url, headers = {}) => (query = "", variables = {}) =>
+  fetch(url, {
+    method: "POST",
+    headers: {
+      Accept: "application/json",
+      "Content-Type": "application/json",
+      ...headers,
+    },
+    body: JSON.stringify({ query, variables }),
+  }).then((res) => res.json());
+
+const actionPutPasswordPromise = (email, password) => {
+  let promise = getGQL("http://localhost:3330/graphql")(
+    `mutation chanPass($email: String, $password:String){
+      changePassword(email:$email, password:$password){id, email, login}
+    }`,
+    { email, password }
+  );
+    return actionPromise("putPassword", promise);
+  // return actionPromise("login", promise);
+};
+
+const actionPutPassword = (email, password) => {
+  return async (dispatch) => {
+    let token = await dispatch(actionPutPasswordPromise(email, password));
+    console.log(token);
+    // if (!token.errors) {
+    //   const a = dispatch(actionToken(token));
+    //   console.log(a);
+    // } else {
+    //   const b = dispatch(actionError(token));
+    //   console.log(b);
+    // }
+  };
+};
+
+export { actionPutPassword };

myproject/src/putPassword/putPassword.css

@@ -0,0 +1,50 @@
+.put-password {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  flex-direction: column;
+  height: 100%;
+}
+
+.form-put {
+  max-width: 350px;
+  width: 100%;
+  padding: 30px;
+  border-radius: 5px;
+  background: white;
+  box-shadow: 1px 1px 10px 1px #e1e1e1;
+}
+
+.form-put input,
+.form-put button {
+  width: 100%;
+  font-size: 20px;
+  padding: 10px 0;
+}
+
+#email,
+#newPassword,
+#confirmNewPassword {
+  margin-left: -5px;
+  border: none;
+  outline: none;
+}
+
+.put-title {
+  padding-bottom: 5px;
+  font-size: 30px;
+  color: #1a1a1a;
+}
+
+.put-title p {
+  margin-top: 30px;
+  line-height: 1.3;
+  font-size: 20px;
+  color: #818181;
+}
+
+.email-icon .anticon {
+  padding: 0 15px 0 10px;
+  color: #6b6b6b;
+}

myproject/src/putPassword/putPassword.js

@@ -0,0 +1,120 @@
+import React, { Schema, useState } from "react";
+import { connect } from "react-redux";
+import {
+  UserOutlined,
+  LockOutlined,
+  EyeOutlined,
+  EyeInvisibleOutlined,
+} from "@ant-design/icons";
+
+import { actionPutPassword } from "./actionPutPassword/actionPutPassword";
+import "./putPassword.css";
+
+const newPasswordEye = () => {
+  const password = document.getElementById("newPassword");
+  const notSee = document.querySelector(".not-see");
+  const see = document.querySelector(".see");
+
+  if (password.type === "password") {
+    password.type = "text";
+    see.style.display = "inline-block";
+    notSee.style.display = "none";
+  } else {
+    password.type = "password";
+    notSee.style.display = "inline-block";
+    see.style.display = "none";
+  }
+};
+
+const confirmNewPasswordEye = () => {
+  const password = document.getElementById("confirmNewPassword");
+  const notSee = document.querySelector(".not-see-confirm");
+  const see = document.querySelector(".see-confirm");
+
+  if (password.type === "password") {
+    password.type = "text";
+    see.style.display = "inline-block";
+    notSee.style.display = "none";
+  } else {
+    password.type = "password";
+    notSee.style.display = "inline-block";
+    see.style.display = "none";
+  }
+};
+
+const PutPasswordForm = ({putPassword}) => {
+  const [email, setEmail] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmNewPassword, setConfirmNewPassword] = useState("");
+
+  return (
+    <div className="put-password">
+      <div className="form-put">
+        <div className="put-title">
+          <h2>Забыли пароль?</h2>
+          <p>Пожалуйста, введите ваш E-mail и новый пароль</p>
+        </div>
+
+        <div className="email-icon icon">
+          <UserOutlined />
+          <input
+            id="email"
+            value={email}
+            placeholder="E-mail"
+            type="text"
+            onChange={(e) => setEmail(e.target.value)}
+          />
+        </div>
+
+        <div className="password-icon icon">
+          <LockOutlined />
+          <input
+            id="newPassword"
+            value={newPassword}
+            placeholder="Новый пароль"
+            type="password"
+            onChange={(e) => setNewPassword(e.target.value)}
+          />
+          <div className="not-see" onClick={newPasswordEye}>
+            <EyeInvisibleOutlined />
+          </div>
+          <div className="see" onClick={newPasswordEye}>
+            <EyeOutlined />
+          </div>
+        </div>
+
+        <div className="password-icon icon">
+          <LockOutlined />
+          <input
+            id="confirmNewPassword"
+            value={confirmNewPassword}
+            placeholder="Повторите пароль"
+            type="password"
+            onChange={(e) => setConfirmNewPassword(e.target.value)}
+          />
+          <div className="not-see-confirm" onClick={confirmNewPasswordEye}>
+            <EyeInvisibleOutlined />
+          </div>
+          <div className="see-confirm" onClick={confirmNewPasswordEye}>
+            <EyeOutlined />
+          </div>
+        </div>
+
+        <button
+          className="login-button"
+          onClick={() => putPassword(email, newPassword)}
+          disabled={!email || !newPassword || !confirmNewPassword}
+        >
+          Проверка
+        </button>
+      </div>
+    </div>
+  );
+};
+
+const PutPassword = () => <ConnectedPutPasswordForm />;
+const ConnectedPutPasswordForm = connect(state => {console.log([state.putPassword])}, {
+  putPassword: actionPutPassword,
+})(PutPasswordForm);
+
+export default PutPassword;

myproject/src/signIn/actionLogin/actionLogin.js

@@ -1,4 +1,5 @@
-import { actionPromise } from "../../store/store";
+import { actionPromise, store } from "../../store/store";
+import history from '../../history';
 
 // store.dispatch({
 //   type: "PROMISE",
@@ -14,12 +15,22 @@ import { actionPromise } from "../../store/store";
 //   error: "bye",
 // });
 
-function actionToken(token) {
-  return {
-    type: "TOKEN",
-    token,
-  };
-}
+// function actionToken(token) {
+//   return {
+//     type: "TOKEN",
+//     token,
+//   };
+// }
+
+// function actionError(error) {
+//   return {
+//     type: "ERROR",
+//     error,
+//   };
+// }
+
+// const handleClick = () => history.push("/my_profile")
+
 
 const getGQL = (url, headers = {}) => (query = "", variables = {}) =>
   fetch(url, {
@@ -30,31 +41,54 @@ const getGQL = (url, headers = {}) => (query = "", variables = {}) =>
       ...headers,
     },
     body: JSON.stringify({ query, variables }),
-  })
-    .then((res) => res.json())
-    .then((a) => {
-      if (a.data.getLogin) window.location.assign("/my_profile");
-      else {
-        const error = document.querySelector(".error");
-        error.style.display = "block";
-      }
-    });
-
-const actionLoginPromise = (login, password) => {
-  let promise = getGQL("http://localhost:3330/graphql")(
+  }).then((res) => res.json())
+// .then((a) => {
+//   if (a.data.getLogin !== null) {
+//     history.push("/my_profile")
+//     // handleClick()
+//     // window.location.assign("/my_profile")
+//   };
+// });
+
+const actionLoginPromise =  (login, password) => {
+  var promise =  getGQL("http://localhost:3330/graphql")(
     `query l($login:String, $password:String){
         getLogin(login:$login, password:$password)
         }`,
     { login, password }
-  );
+  )
   return actionPromise("login", promise);
 };
 
+// const actionLoginPromise1 =  (login, password) => {
+//   var promise =  getGQL("http://localhost:3330/graphql")(
+//     `query l($login:String, $password:String){
+//         getLogin(login:$login, password:$password)
+//         }`,
+//     { login, password }
+//   )
+//   return actionPromise("error", promise);
+// };
+
 const actionLogin = (login, password) => {
   return async (dispatch) => {
-    let token = await dispatch(actionLoginPromise(login, password));
-    if (token) dispatch(actionToken(token));
+    var token = await dispatch(actionLoginPromise(login, password));
+    console.log(token);
+    // if (token === undefined) await dispatch(actionLoginPromise1(login, password))
+    // if(token) history.push("/my_profile")
   };
 };
 
+// const mapStateToProps = (comp) => {
+//   switch (comp) {
+//     case "1":
+//       return function (state) {
+//         return { a: state.login };
+//       };
+
+//     default:
+//       return undefined;
+//   }
+// };
+
 export { actionLogin };

myproject/src/signIn/signIn.css

@@ -125,7 +125,7 @@
   color: red;
   line-height: 1.3;
   font-size: 18px;
-  display: none;
+  /* display: none; */
   margin-top: -10px;
   margin-bottom: 15px;
 }

myproject/src/signIn/signIn.js

@@ -7,8 +7,11 @@ import {
   EyeOutlined,
   EyeInvisibleOutlined,
 } from "@ant-design/icons";
+import jwtDecode from "jwt-decode";
 
 import { actionLogin } from "./actionLogin/actionLogin";
+import history from "../history";
+import { actionChatGroup } from "../myProfile/chatGroups/actionChatGroup/actionChatGroup";
 import "./signIn.css";
 
 const loginEye = () => {
@@ -27,13 +30,40 @@ const loginEye = () => {
   }
 };
 
-const LoginForm = (props) => {
+const LoginForm = ({ onLogin, backError, state }) => {
   const [login, setLogin] = useState("");
   const [password, setPassword] = useState("");
 
+  const way = (obj, resolverName, a) => {
+    const stateObj = state[obj];
+    for (var keys in stateObj) {
+      for (var keyData in stateObj[keys]) {
+        if (keyData === "data") {
+          const allObj = stateObj[keys][keyData][resolverName];
+          if (allObj) {
+            const x = jwtDecode(allObj);
+            // return x.sub.email;
+          } else {
+            return (
+              <div className="error">
+                <p>Неверный логин или пароль, попробуйте заново.</p>
+              </div>
+            );
+          }
+        }
+      }
+    }
+  };
+
+  const buttonEnter = (e) => {
+    if (e.key === "Enter") onLogin(login, password);
+  };
+
+  const handleClick = () => history.push("/my_profile");
+
   return (
     <div className="login">
-      <div className="login-form">
+      <div className="login-form" onKeyPress={buttonEnter}>
         <div className="login-title">
           <h2>Войти в аккаунт</h2>
           <p>Пожалуйста, войдите в свой аккаунт</p>
@@ -66,15 +96,12 @@ const LoginForm = (props) => {
             <EyeOutlined />
           </div>
         </div>
-
-        <div className="error">
-          <p>Неверный логин или пароль, попробуйте заново.</p>
-        </div>
+        
+        {way("login", "getLogin")}
 
         <button
-          id="btn"
           className="login-button"
-          onClick={() => props.onLogin(login, password)}
+          onClick={() => onLogin(login, password)}
           disabled={!login || !password}
         >
           Войти
@@ -91,6 +118,11 @@ const LoginForm = (props) => {
 
 const Login = (props) => <ConnectedLoginForm />;
 
-const ConnectedLoginForm = connect(null, { onLogin: actionLogin })(LoginForm);
+const ConnectedLoginForm = connect(
+  (state) => {
+    return { state };
+  },
+  { onLogin: actionLogin }
+)(LoginForm);
 
 export default Login;

myproject/src/signUp/signUp.js

@@ -50,6 +50,29 @@ const Register1 = (props) => {
   const [confirmPassword, setConfirmPassword] = useState("");
   const [login, setLogin] = useState("");
 
+  const a = () => {
+    const w = document.getElementsByTagName("button")
+    console.log(w);
+    // const v = w.hasAttribute("disabled")
+    // console.log(w.hasAttribute("disabled"));
+    if(w === "disabled") console.log("bye");
+  };
+  // const buttonEnter = (e) => {
+  // const btn = document.getElementById("btn1");
+  // const registerEmail1 = document.querySelector(".register");
+  // console.log(registerEmail1);
+  // if ("disabled") console.log("bye");
+  // else console.log("hi");
+  // if (e.key === "Enter")
+  //   signUpValidate(
+  //     registerEmail,
+  //     registerPassword,
+  //     confirmPassword,
+  //     login,
+  //     props
+  //   );
+  // };
+
   return (
     <div className="register">
       <div className="register-form">
@@ -66,11 +89,14 @@ const Register1 = (props) => {
             id="registerEmail"
             name="email"
             pattern={validateEmail(registerEmail)}
-            onClick={() => borderEmailDischarge()}
+            onClick={() => {
+              a();
+              borderEmailDischarge();
+            }}
             onChange={(e) => setEmail(e.target.value)}
           />
         </div>
-
+        {a()}
         <div className="pattern-email">
           <p></p>
           <div>
@@ -146,6 +172,7 @@ const Register1 = (props) => {
         <div className="block-input-btn">
           <p></p>
           <button
+            id="btn1"
             onClick={() =>
               signUpValidate(
                 registerEmail,

myproject/src/store/store.js

@@ -12,6 +12,7 @@ const promiseReducer = (state = {}, { type, name, status, payload, error }) => {
       },
     };
   }
+
   return state;
 };
 
@@ -39,6 +40,8 @@ const actionPromise = (name, promise) => {
   });
   return async (dispatch) => {
     dispatch(actionPending());
+    // let payload = await promise;
+
     try {
       let payload = await promise;
       dispatch(actionResolved(payload));
@@ -46,6 +49,13 @@ const actionPromise = (name, promise) => {
     } catch (error) {
       dispatch(actionRejected(error));
     }
+
+    // if (payload.data.getLogin !== null) {
+    //   dispatch(actionResolved(payload));
+    //   return payload;
+    // } else {
+    //   dispatch(actionRejected("error"));
+    // }
   };
 };
 
@@ -56,6 +66,9 @@ const store = createStore(
   promiseReducer,
   composeEnhancers(applyMiddleware(...middleware))
 );
+
+// const store = createStore(promiseReducer, applyMiddleware(thunk));
+
 store.subscribe(() => console.log(store.getState()));
 
-export {store, actionPromise}
+export { store, actionPromise };

server/index.js

@@ -0,0 +1,386 @@
+const express = require("express");
+const bodyParser = require("body-parser");
+const Sequelize = require("sequelize");
+const jwt = require("jsonwebtoken");
+const { Op } = Sequelize;
+const { graphqlHTTP } = require("express-graphql");
+const { buildSchema } = require("graphql");
+const cors = require("cors");
+const expressJwt = require("express-jwt");
+// const mailer = require("./smtpGmail");
+const app = express();
+
+app.use(bodyParser.json());
+app.use(express.static("myproject"));
+// app.use(errorHandler);
+app.use(bodyParser.urlencoded({ extended: false }));
+app.use(cors());
+
+const sequelize = new Sequelize("emrada2", "root", "Emmanuil2228125%", {
+  timezone: "+03:00",
+  host: "localhost",
+  dialect: "mysql",
+});
+
+class User extends Sequelize.Model {
+  get messages() {
+    return (async () => {
+      let autorForMessage = await this.getAutor();
+      let partnerForMessage = await this.getPartner();
+      return [...autorForMessage, ...partnerForMessage];
+    })();
+  }
+  get chat_groups() {
+    return (async () => {
+      let autorForChatGroup = await this.getAutor();
+      let partnerForChatGroup = await this.getPartner();
+      return [...autorForChatGroup, ...partnerForChatGroup];
+    })();
+  }
+}
+
+User.init(
+  {
+    email: Sequelize.STRING,
+    password: Sequelize.STRING,
+    login: Sequelize.STRING,
+  },
+  { sequelize, modelName: "user" }
+);
+
+class Message extends Sequelize.Model {
+  get user() {
+    return this.User();
+  }
+}
+
+Message.init(
+  { message: Sequelize.STRING },
+  { sequelize, modelName: "message" }
+);
+
+class ChatGroup extends Sequelize.Model {}
+
+ChatGroup.init({}, { sequelize, modelName: "chat_group" });
+
+User.hasMany(Message, { as: "autorForMessage", foreignKey: "autorId" });
+User.hasMany(Message, { as: "partnerForMessage", foreignKey: "partnerId" });
+
+Message.belongsTo(User, { as: "autor", sourceKey: "autorId" });
+Message.belongsTo(User, { as: "partner", sourceKey: "partnerId" });
+
+User.hasMany(ChatGroup, { as: "autorForChatGroup", foreignKey: "autorId" });
+User.hasMany(ChatGroup, { as: "partnerForChatGroup", foreignKey: "partnerId" });
+
+ChatGroup.belongsTo(User, { as: "autor", sourceKey: "autorId" });
+ChatGroup.belongsTo(User, { as: "partner", sourceKey: "partnerId" });
+
+const secret = `7.!BMB?Y+Bc2vZE-Hb5YuCT6QvE^FN,JWN6M?_VtFXeC5dLtB!`;
+const secretPass = "JcFWhuLkpaK9aB3Gtbvo2Y0BApdw5q1tUyAyJeD8fJXs78d7zR";
+
+const authenticate = async ({ login, password }) => {
+  const user = await User.findOne({ where: { login, password } });
+  if (user) {
+    const token = jwt.sign(
+      { sub: { id: user.id, email: user.email, login: user.login } },
+      secret
+    );
+    return token;
+  }
+};
+
+var schema = buildSchema(`
+  type Query {
+    getLogin(login: String, password: String): String
+    getUser(id: ID!): User
+    getAllUsers: [User]
+    getMessage(id: ID!): Message
+    getAllMessages: [Message]
+    getAllChatGroups: [ChatGroup]
+    getAllChatGroupsOneUser(id: ID!): [ChatGroup]
+  }
+  type Mutation {
+    createUser(email: String, password: String, login: String): User
+    changePassword(email: String, password: String): User
+    createMessage(message: String, autorId: String, partnerId: String): Message
+    changeMessage(id: ID!, message: String): Message
+    deleteMessage(id: ID!): String
+    createChatGroup(autorId: String, partnerId: String): Message
+    deleteChatGroup(id: ID!): String
+  }
+  type User {
+    id: Int
+    createdAt: String
+    email: String
+    login: String
+  }
+  type Message {
+    id: Int
+    createdAt: String
+    message: String
+    autorId: User
+    partnerId: User
+  }
+  type ChatGroup {
+    id: Int
+    createdAt: String
+    autorId: User
+    partnerId: User
+  }
+`);
+
+const getUser = async ({ id }) => await User.findByPk(id);
+
+const getLogin = async ({ login, password }) => {
+  const userFind = await User.findOne({ where: { login, password } });
+  return authenticate(userFind);
+};
+
+const createUser = async ({ email, password, login }) => {
+  const wasUserCreated = await User.findOne({ where: { email } });
+  if (!wasUserCreated) {
+    // const passwordModification = jwt.sign(password + secretPass, secret);
+    const user = { email, password, login };
+    const newUser = new User(user);
+    await newUser.save();
+    return await User.findOne({ where: { login } });
+  } else console.error("error");
+};
+
+const changePassword = async ({ email, password }) => {
+  var userFind = await User.findOne({ where: { email } });
+  if (userFind) {
+    await User.update({ password }, { where: { email } });
+    userFind.email = "The password has been change";
+    return userFind;
+  } else {
+    userFind = { email: "Email not found" };
+    return userFind;
+  }
+};
+
+const getAllUsers = async () => await User.findAll();
+
+const getAllMessages = async () => {
+  const foundAllMessages = await Message.findAll();
+  for (var allMessages of foundAllMessages) {
+    const autor = await User.findAll({ where: { id: allMessages.autorId } });
+    const partner = await User.findAll({
+      where: { id: allMessages.partnerId },
+    });
+    allMessages.autorId = autor[0];
+    allMessages.partnerId = partner[0];
+  }
+  return foundAllMessages;
+};
+
+const getMessage = async ({ id }) => {
+  const message = await Message.findOne({ where: { id } });
+  const autor = await User.findOne({ where: { id: message.autorId } });
+  const partner = await User.findOne({ where: { id: message.partnerId } });
+  message.autorId = autor;
+  message.partnerId = partner;
+  return message;
+};
+
+const createMessage = async (obj) => {
+  try {
+    return await Message.create({ ...obj });
+  } catch (e) {
+    console.log(e);
+  }
+};
+
+const changeMessage = async ({ id, message }) => {
+  const putMess = await Message.findByPk(id);
+  if (putMess) {
+    await Message.update({ message }, { where: { id } });
+    return await Message.findByPk(id);
+  } else return { id: "Message not find" };
+};
+
+const deleteMessage = async ({ id }) => {
+  const messFind = await Message.findByPk(id);
+  if (messFind) {
+    await Message.destroy({ where: { id } });
+    return "Message deleted";
+  } else return "Message not find";
+};
+
+const getAllChatGroups = async () => {
+  const foundAllChatGroups = await ChatGroup.findAll();
+  for (var allUsers of foundAllChatGroups) {
+    const autor = await User.findAll({ where: { id: allUsers.autorId } });
+    const partner = await User.findAll({ where: { id: allUsers.partnerId } });
+    allUsers.autorId = autor[0];
+    allUsers.partnerId = partner[0];
+  }
+  return foundAllChatGroups;
+};
+
+const getAllChatGroupsOneUser = async ({ id }) => {
+  const foundAllChatGroups = await ChatGroup.findAll();
+  for (var allUsers of foundAllChatGroups) {
+    const autor = await User.findAll({ where: { id: allUsers.autorId } });
+    const partner = await User.findAll({ where: { id: allUsers.partnerId } });
+    const m =
+      allUsers.autorId === autor[0].id || allUsers.autorId === partner[0].id;
+    const ma = autor[0].id === +id || partner[0].id === +id;
+
+    if ((m === ma) === true) {
+      const y = await ChatGroup.findAll({ where: { autorId: id } });
+      const u = await ChatGroup.findAll({ where: { partnerId: id } });
+
+      if (y && u) {
+        const p = [...y, ...u];
+        for (var key of p) {
+          key.autorId = autor[0];
+          key.partnerId = partner[0];
+        }
+        return p;
+      } else if (y) return y;
+      else return u;
+    } else console.log("bye");
+  }
+};
+
+const createChatGroup = async (obj) => {
+  try {
+    const oneUserId = await ChatGroup.findOne({
+      where: { autorId: obj.autorId, partnerId: obj.partnerId },
+    });
+    const twoUserId = await ChatGroup.findOne({
+      where: { autorId: obj.partnerId, partnerId: obj.autorId },
+    });
+    if (!oneUserId && !twoUserId) {
+      var newChatGroup = await ChatGroup.create({ ...obj });
+      const autor = await User.findAll({ where: { id: newChatGroup.autorId } });
+      const partner = await User.findAll({
+        where: { id: newChatGroup.partnerId },
+      });
+      newChatGroup.autorId = autor[0];
+      newChatGroup.partnerId = partner[0];
+      return newChatGroup;
+    }
+  } catch (e) {
+    return;
+  }
+};
+
+const deleteChatGroup = async ({ id }) => {
+  const messFind = await ChatGroup.findByPk(id);
+  if (messFind) {
+    await ChatGroup.destroy({ where: { id } });
+    return "ChatGroup deleted";
+  } else return "ChatGroup not find";
+};
+
+var root = {
+  getUser,
+  getLogin,
+  createUser,
+  getAllUsers,
+  getMessage,
+  changePassword,
+  createMessage,
+  changeMessage,
+  deleteMessage,
+  getAllMessages,
+  getAllChatGroups,
+  getAllChatGroupsOneUser,
+  createChatGroup,
+  deleteChatGroup,
+};
+
+app.use(
+  "/graphql",
+  graphqlHTTP({
+    schema: schema,
+    rootValue: root,
+    graphiql: true,
+  })
+);
+
+app.get("/users", async (req, res) => res.send(await User.findAll()));
+app.get("/message", async (req, res) => res.send(await Message.findAll()));
+app.get("/chat-group", async (req, res) => res.send(await ChatGroup.findAll()));
+
+// app.post("/users", async (req, res) => {
+//   // const twoUsers = async () => {
+//   //   const userEmail = await User.findOne({ where: { email: req.body.email } });
+//   //   if (userEmail !== null) console.log(err);
+//   //   else {
+//   //     console.log("hi");
+//   var newUser = new User(req.body);
+//   // const message = {
+//   //   to: req.body.email,
+//   //   subject: "Registered",
+//   //   text: `Отлично. Вот ваши данные:
+//   //   login: ${req.body.email}
+//   //   password: ${req.body.password}
+
+//   //   Перейдите по ссылке, чтобы войти в свой аккаунт
+//   //   url: http://localhost:3335/sign_in`,
+//   // };
+//   // mailer(message);
+//   await newUser.save();
+//   res.status(201).send(newUser);
+//   // }
+//   // };
+//   // twoUsers();
+// });
+
+// function errorHandler(err, req, res, next) {
+//   if (typeof err === "string") {
+//     return res.status(400).json({ message: err });
+//   }
+
+//   if (err.name === "UnauthorizedError") {
+//     return res.status(401).json({ message: "Invalid Token" });
+//   }
+
+//   return res.status(500).json({ message: err.message });
+// }
+
+app.post("/users/authenticate", async (req, res, next) => {
+  authenticate(req.body)
+    .then((user) => {
+      user
+        ? res.json(user)
+        : res
+            .status(400)
+            .json({ message: "Username or password is incorrect" });
+    })
+    .catch((err) => next(err));
+});
+
+// app.use(jwtWare());
+
+app.get("/a", (req, res, next) => {
+  console.log(req.headers.authorization);
+  const token1 = req.headers.authorization;
+  console.log(token1);
+  // if (token) {
+  const data = jwt.verify(token1, secret);
+  console.log(data);
+  // if (data) {
+  console.log(data.sub.login);
+  res.send(`<h1>Hello ${data.sub.login}</h1>`);
+  // } else {
+  //   res.send(`<h1>Hello haker</h1>`);
+  // }
+  // }
+});
+
+// (async () => {
+//   let persone =
+// //   await User.findOne({ where: { login: "B" } }) ||
+//     (await User.create({ email: "ljkd@gfd.gfd", password: "1", login: "A" }))
+// })()
+
+//   createMessage({message: "Hello 1", autorId: 1, partnerId: 2})
+//  createChatGroup({ autorId: 1, partnerId: 2})
+
+sequelize.sync();
+
+app.listen(3330, () => console.log("The server started on port 3330"));