Merge pull request 'fixes' (#8) from fixes into main

Reviewed-on: #8

src/components/AllTaskTableTracker/AllTaskTableItem/AllTaskTableItem.jsx

@@ -44,12 +44,11 @@ const AllTaskTableItem = ({ task, projects }) => {
         </div>
       </td>
       <td>
-        {task.timers.map((item) => {
+        {new Date(
-          let time = new Date(item.deltaSeconds * 1000)
+          task.timers.reduce((acc, cur) => acc + cur.deltaSeconds, 0) * 1000
+        )
           .toISOString()
-            .slice(11, 19);
+          .slice(11, 19)}
-          return `${time}`;
-        })}
       </td>
       <td>{new Date(task.created_at).toLocaleDateString()}</td>
       <td>{new Date(task.dead_line).toLocaleDateString()}</td>

src/components/ArchiveTableTracker/ArchiveTasksItem/ArchiveTasksItem.jsx

@@ -9,23 +9,20 @@ const ArchiveTasksItem = ({ task, index }) => {
     <tr key={index}>
       <td className="archive__completeTask__description">
         <p className="completeTask__title">{task.title}</p>
-        <p
+        {/*<p*/}
-          className="date"
+        {/*  className="date"*/}
-          dangerouslySetInnerHTML={{
+        {/*  dangerouslySetInnerHTML={{*/}
-            __html: task.description
+        {/*    __html: task.description*/}
-          }}
+        {/*  }}*/}
-        />
+        {/*/>*/}
       </td>
       <td className="archive__completeTask__time">
         <p>
-          {task.timers.length == 0
+          {new Date(
-            ? "-"
+            task.timers.reduce((acc, cur) => acc + cur.deltaSeconds, 0) * 1000
-            : task.timers.map((item) => {
+          )
-                let time = new Date(item.deltaSeconds * 1000)
             .toISOString()
-                  .slice(11, 19);
+            .slice(11, 19)}
-                return `${time}`;
-              })}
         </p>
       </td>
       <td className="archive__completeTask__info">

src/components/ArchiveTableTracker/ArchiveTasksItem/archiveTasksItem.scss

@@ -0,0 +1,10 @@
+.completeTask__title {
+  white-space: nowrap;
+  max-width: 250px;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.archive__completeTask__time {
+  text-align: center;
+}

src/components/ArchiveTableTracker/archiveTableTracker.scss

@@ -1,20 +1,33 @@
 .archive {
   &__table {
     margin: 29px 0 0 0;
-    height: 67px;
+    display: flex;
+    flex-direction: column;
     width: 100%;
     font-size: 14px;
     font-weight: 400;
 
     thead {
+      display: flex;
       background: #f1f1f1;
       color: #5b6871;
       border-radius: 12px;
-      height: 65px;
       background: #f1f1f1;
       color: #5b6871;
 
+      tr {
+        display: grid;
+        padding: 20px 10px 11px;
+        grid-template-columns: 40% 20% 40%;
+        width: 100%;
+      }
+
       th {
+        display: flex;
+        text-align: center;
+        color: #5B6871;
+        line-height: 32px;
+        font-size: 14px;
         &:first-child {
           padding-left: 10px;
           border-top-left-radius: 12px;
@@ -28,9 +41,28 @@
     }
 
     tbody {
+      display: grid;
+      max-height: 600px;
+      overflow-y: auto;
       color: #000;
+
+      &::-webkit-scrollbar {
+        width: 5px;
+        border-radius: 10px;
+      }
+
+      &::-webkit-scrollbar-thumb {
+        background: #cbd9f9;
+        border-radius: 5px;
+      }
+
       tr {
+        display: grid;
+        height: 65px;
+        align-items: center;
         background-color: white;
+        grid-template-columns: 40% 20% 40%;
+        border-bottom: 1px solid rgba(241, 241, 241, 1);
 
         &:nth-child(2n) {
           background-color: rgba(241, 241, 241, 0.23);
@@ -38,8 +70,7 @@
       }
 
       td {
-        height: 65px;
+        display: flex;
-        border-bottom: 1px solid rgba(241, 241, 241, 1);
 
         &:first-child {
           max-width: 275px;

src/components/Modal/ModalRegistration/modalRegistration.scss

@@ -22,7 +22,6 @@
     &__main {
       display: flex;
       flex-direction: column;
-      align-items: center;
       width: 65%;
 
       @media (max-width: 1106px) {
@@ -35,7 +34,7 @@
         font-size: 35px;
         line-height: 32px;
         display: flex;
-        justify-content: space-between;
+        justify-content: center;
         margin: 0;
 
         @media (max-width: 960px) {
@@ -162,7 +161,7 @@
 
     &__about {
       border-left: 1px solid #cdcdcd;
-      padding: 0 20px 0 10px;
+      padding: 0 20px 0 25px;
       margin: 0 0 0 10px;
       display: flex;
       flex-direction: column;

src/components/Modal/ModalTrackerRegistration/ModalTrackerRegistration.js

@@ -4,7 +4,7 @@ import close from "assets/icons/closeProjectPersons.svg";
 
 import "./modalTrackerRegistration.scss";
 
-export const ModalTrackerRegistration = ({ setModalReset }) => {
+export const ModalTrackerRegistration = ({ setModalReset, email }) => {
   return (
     <div className="modalConfirmTracker">
       <h3 className="modalConfirmTracker__title">
@@ -14,9 +14,14 @@ export const ModalTrackerRegistration = ({ setModalReset }) => {
         Мы отправили ссылку
         <br />
         для активации вашего аккаунта на почту
-        <br /> <span>nhw44308@mail.com</span>
+        <br /> <span>{email}</span>
       </p>
-      <button className="modalConfirmTracker__btn">Перейти в почту</button>
+      <button
+        onClick={() => setModalReset(false)}
+        className="modalConfirmTracker__btn"
+      >
+        Понятно
+      </button>
       <img
         onClick={() => setModalReset(false)}
         src={close}

src/pages/Tracker/tracker.scss

@@ -131,6 +131,7 @@
       width: 100%;
       background: #ffffff;
       padding: 27px 0 29px;
+      margin-bottom: 50px;
 
       &__wrapper {
         max-width: 1160px;

src/pages/TrackerRegistration/TrackerRegistration.js

@@ -14,6 +14,9 @@ import "./trackerRegistration.scss";
 
 export const TrackerRegistration = () => {
   const [modalConfirmOpen, setModalConfirm] = useState(false);
+  const [inputs, setInputs] = useState({
+    email: ""
+  });
 
   return (
     <div className="trackerRegistration">
@@ -36,7 +39,16 @@ export const TrackerRegistration = () => {
               </div>
               <div className="trackerRegistration__inputContainer">
                 <span>Ваш e-mail</span>
-                <input placeholder="E-mail" type="email" />
+                <input
+                  placeholder="E-mail"
+                  onChange={(e) =>
+                    setInputs((prevState) => ({
+                      ...prevState,
+                      email: e.target.value
+                    }))
+                  }
+                  type="email"
+                />
               </div>
               <div className="trackerRegistration__inputContainer">
                 <span>Придумайте пароль</span>
@@ -66,7 +78,10 @@ export const TrackerRegistration = () => {
         </div>
         {modalConfirmOpen && (
           <ModalLayout active={modalConfirmOpen} setActive={setModalConfirm}>
-            <ModalTrackerRegistration setModalReset={setModalConfirm} />
+            <ModalTrackerRegistration
+              setModalReset={setModalConfirm}
+              email={inputs.email}
+            />
           </ModalLayout>
         )}
         <Footer />