From a0dbd1eca8797401ff124f7163917a9044090217 Mon Sep 17 00:00:00 2001
From: Dm1tr1y147 <me@dmitriy.icu>
Date: Sun, 29 Nov 2020 09:12:02 +0500
Subject: [PATCH] Added authorization

---
 front/components/Login.tsx          |  2 +-
 front/components/User/RouteCard.tsx |  7 ++-----
 front/components/User/RouteView.tsx |  2 +-
 front/pages/activate.tsx            | 22 ++++++++++++++++++++++
 front/pages/index.tsx               |  8 +++-----
 front/pages/user.tsx                |  2 ++
 front/styles/RouteCard.module.css   |  0
 front/styles/RouteView.module.css   |  2 --
 front/types/main.ts                 |  1 +
 front/utils/index.ts                | 20 ++++++++++++--------
 10 files changed, 44 insertions(+), 22 deletions(-)
 create mode 100644 front/pages/activate.tsx
 create mode 100644 front/styles/RouteCard.module.css

diff --git a/front/components/Login.tsx b/front/components/Login.tsx
index 286dfa4..eaf50d9 100644
--- a/front/components/Login.tsx
+++ b/front/components/Login.tsx
@@ -54,7 +54,7 @@ const Login: React.FC = () => {
 
   return (
     <form onSubmit={handleSubmit(resetError, setUserState, gotError, router)}>
-      <input type="email" name="email" id="email" />
+      <input type="username" name="username" id="username" />
       <input type="password" name="password" id="password" autoComplete="on" />
       <input type="submit" />
       {error.has ? <ErrorMessage message={error.message} /> : ""}
diff --git a/front/components/User/RouteCard.tsx b/front/components/User/RouteCard.tsx
index 4539da0..596c82a 100644
--- a/front/components/User/RouteCard.tsx
+++ b/front/components/User/RouteCard.tsx
@@ -1,15 +1,12 @@
 import React from "react";
 
 import { IRouteCard } from "types/user";
-import { formatTimeLength } from "utils";
 
 const RouteCard: React.FC<IRouteCard> = ({ route }) => {
   return (
     <div>
-      <h2>{route.name}</h2>
-      <p>
-        Данный квесты вы сможете пройти за {formatTimeLength(route.averageTime)}
-      </p>
+      <h3>{route.name}</h3>
+      <p>{route.description}</p>
       <p>Длинна маршрута: {route.length} м</p>
       <p>Примерное время прохождения: {route.averageTime}</p>
       <p>Точка старта:</p>
diff --git a/front/components/User/RouteView.tsx b/front/components/User/RouteView.tsx
index ed69bba..55ee38a 100644
--- a/front/components/User/RouteView.tsx
+++ b/front/components/User/RouteView.tsx
@@ -7,7 +7,7 @@ import styles from "styles/RouteView.module.css";
 const RouteView: React.FC<IRouteView> = ({ header, routes }) => {
   return (
     <>
-      <h1 className={styles.header}>{header}</h1>
+      <h2 className={styles.header}>{header}</h2>
       {routes.map((route) => (
         <RouteCard key={route.id} route={route} />
       ))}
diff --git a/front/pages/activate.tsx b/front/pages/activate.tsx
new file mode 100644
index 0000000..4901dc8
--- /dev/null
+++ b/front/pages/activate.tsx
@@ -0,0 +1,22 @@
+import { request } from "utils/index";
+import React, { useEffect } from "react";
+import { useRouter } from "next/router";
+import { redirect } from "next/dist/next-server/server/api-utils";
+
+const Activate: React.FC = () => {
+  const router = useRouter();
+
+  useEffect(() => {
+    (async () => {
+      const res = await request(
+        `activate/${router.query.uidb}/${router.query.token}`,
+        "POST"
+      );
+
+      router.push("/");
+    })();
+  });
+  return null;
+};
+
+export default Activate;
diff --git a/front/pages/index.tsx b/front/pages/index.tsx
index d85783a..bb68314 100644
--- a/front/pages/index.tsx
+++ b/front/pages/index.tsx
@@ -1,6 +1,5 @@
 import React, { useContext, useEffect, useState } from "react";
 
-import HomeLayout from "layouts/HomeLayout";
 import styles from "styles/home.module.css";
 import { HomeRefContext } from "context/ref";
 import Register from "components/Register";
@@ -28,7 +27,7 @@ const advantagesList = [
   },
 ];
 
-const Home: React.FC & { Layout: React.ReactNode } = () => {
+const Home: React.FC = () => {
   const { setLoading } = useContext(LoadingContext);
   const { userState } = useContext(UserContext);
   const router = useRouter();
@@ -37,7 +36,8 @@ const Home: React.FC & { Layout: React.ReactNode } = () => {
     if (userState) {
       router.push("/user");
       return null;
-    } else setLoading(false);
+    } 
+    else setLoading(false);
   }, []);
 
   const scrollRef = useContext(HomeRefContext);
@@ -80,6 +80,4 @@ const Home: React.FC & { Layout: React.ReactNode } = () => {
   );
 };
 
-Home.Layout = HomeLayout;
-
 export default Home;
diff --git a/front/pages/user.tsx b/front/pages/user.tsx
index 99710ce..8298fc9 100644
--- a/front/pages/user.tsx
+++ b/front/pages/user.tsx
@@ -10,6 +10,8 @@ const routes: RouteT[] = [
     name: "Пешком",
     length: 100,
     averageTime: 100,
+    description:
+      "Ipsum do irure ut excepteur reprehenderit nulla proident cupidatat ullamco officia pariatur enim consequat.",
     startCoordinates: {
       latitude: 60.977313,
       longitude: 69.039326,
diff --git a/front/styles/RouteCard.module.css b/front/styles/RouteCard.module.css
new file mode 100644
index 0000000..e69de29
diff --git a/front/styles/RouteView.module.css b/front/styles/RouteView.module.css
index cd5ea95..3a3194f 100644
--- a/front/styles/RouteView.module.css
+++ b/front/styles/RouteView.module.css
@@ -1,5 +1,3 @@
 .header {
-  border-radius: 30px;
-  background: #cff9ec;
   text-align: center;
 }
diff --git a/front/types/main.ts b/front/types/main.ts
index 76b9ab5..3084358 100644
--- a/front/types/main.ts
+++ b/front/types/main.ts
@@ -3,6 +3,7 @@ type FCL = React.FC & { Layout: React.ReactNode };
 type RouteT = {
   id: number;
   name: string;
+  description: string;
   length: number;
   averageTime?: number;
   userTime?: number;
diff --git a/front/utils/index.ts b/front/utils/index.ts
index 038f48f..d66af0f 100644
--- a/front/utils/index.ts
+++ b/front/utils/index.ts
@@ -2,24 +2,28 @@ const formatTimeLength = (minutes: number) =>
   (Math.floor(minutes / 60) > 0 ? `${Math.floor(minutes / 60)} ч. ` : "") +
   (minutes % 60 > 0 ? `${minutes % 60} мин.` : "");
 
-const request = async (uri: string, method: "POST" | "GET", body = null) => {
-  const url = "http://localhost:4000/api/" + uri;
+const request = async (uri: string, method: "POST" | "GET", body?) => {
+  const token = localStorage.getItem("token");
+
+  const url = "http://80.240.25.179/api/" + uri;
 
   const headers = {
     "Content-Type": "application/json",
-    method,
-    body: method == "POST" ? body : undefined,
+    Authorization: token != "" ? `Token ${token}` : undefined,
   };
 
   const options = {
     headers,
-    body: method == "GET" ? body : undefined,
+    method,
+    body: JSON.stringify(body),
   };
 
+  console.log(uri);
+
   try {
-    if (process.env.NODE_ENV == "development") {
-      return JSON.parse(`{ "token": "fhjighdfjgjdfigbvhbsdfuyt47" }`);
-    }
+    // if (process.env.NODE_ENV == "development") {
+    //   return JSON.parse(`{ "token": "fhjighdfjgjdfigbvhbsdfuyt47" }`);
+    // }
     const res = await fetch(url, options);
     return await res.json();
   } catch (err) {