update

public/assets/menu/arrow_left.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path stroke="#84858D" d="M15.41 16.59 10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"></path>
-</svg>

public/assets/menu/arrow_right.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path stroke="#84858D" d="M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>
-</svg>

src/ts/components/LineChart/index.tsx

@@ -25,6 +25,7 @@ function LineChart({
 
   let width = Math.round((value || 100) * (100 / options.max));
   if (width < 1) return null;
+  if (width > 100) width = 100;
 
   if (!details) {
     return (

src/ts/components/LineChart/styles/index.module.scss

@@ -26,6 +26,7 @@
   overflow: hidden;
   line-height: var(--line_chart-height);
   text-align: left;
+
   color: var(--color-white);
   background-color: #D0D1D2;
   -webkit-print-color-adjust: exact;

src/ts/components/Table/components/cells/CellDetails.tsx

@@ -59,7 +59,7 @@ function DetailsCell({
       {hasIcon && (
         <img
           className={iconClassName}
-          src="./assets/menu/arrow_right.svg"
+          src="./assets/list/arrow.svg"
         />
       )}
     </div>

src/ts/components/Table/styles/index.module.scss

@@ -83,17 +83,6 @@
     line-height: var(--table-cell-height);
     background-color: var(--color-white);
   }
-  //&_cell:first-child,
-  //&_header_cell:first-child {
-  //  position: sticky;
-  //  top: 0;
-  //  left: 0;
-  //  z-index: 1;
-  //}
-  //
-  //&_cell:first-child {
-  //  background-color: rgba(255, 255, 255, 0.9);
-  //}
 
   &_cell_number {
     text-align: right;
@@ -108,10 +97,11 @@
       margin-top: 8px;
       cursor: pointer;
       transition: transform 0.5s;
+      transform: rotate(0);
     }
 
     &_open {
-      transform: rotate(90deg);
+      transform: rotate(-180deg);
     }
   }
 }

src/ts/pages/PageWrapper/components/sidebar/ScrollUp.tsx

@@ -0,0 +1,43 @@
+import React, { useEffect, useState } from 'react';
+
+import style from '../../styles/scrollUp.module.scss';
+
+function scrollTop() {
+  if (!window.scrollY) return;
+  const top = window.scrollY * 0.7;
+  window.scrollTo(0, top > 20 ? top : 0);
+  setTimeout(scrollTop, 30);
+}
+
+function SideBarScrollUp() {
+  const [isShow, setShow] = useState<boolean>(false);
+
+  useEffect(() => {
+    function updateScroll() {
+      setShow(window.scrollY > document.body.offsetHeight);
+    }
+
+    window.addEventListener('scroll', updateScroll);
+    return () => {
+      window.removeEventListener('scroll', updateScroll);
+    };
+  }, [window.scrollY]);
+
+  if (!isShow) return null;
+
+  return (
+    <div
+      className={style.scroll_up_button}
+      onClick={() => {
+        scrollTop();
+      }}
+    >
+      <img
+        className={style.scroll_up_button_icon}
+        src="./assets/list/arrow.svg"
+      />
+    </div>
+  );
+}
+
+export default SideBarScrollUp;

src/ts/pages/PageWrapper/components/sidebar/index.tsx

@@ -4,6 +4,7 @@ import { useNavigate, useParams } from 'react-router-dom';
 import Logo from './Logo';
 import Switch from './Switch';
 import SideBarButtons from './Buttons';
+import SideBarScrollUp from './ScrollUp';
 
 import style from '../../styles/sidebar.module.scss';
 import { TYPES } from '../../helpers/menu';
@@ -29,6 +30,7 @@ function SideBar() {
         }}
       />
       <SideBarButtons type={formattedType} />
+      <SideBarScrollUp />
     </aside>
   );
 }

src/ts/pages/PageWrapper/styles/scrollUp.module.scss

@@ -0,0 +1,64 @@
+@import 'src/styles/variables';
+
+.scroll_up_button {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 240px;
+
+  cursor: pointer;
+  text-align: center;
+  text-decoration: none;
+
+  opacity: 0;
+  transition: opacity 0.5s;
+  background-color: rgba(255, 255, 255, 0.02);
+
+  &:hover {
+    opacity: 1;
+  }
+
+  &_icon {
+    position: relative;
+    top: 50px;
+
+    display: block;
+    width: 32px;
+    height: 32px;
+    margin: 0 auto;
+
+    transform: rotate(180deg);
+    animation: scroll_up_button_icon linear 2s backwards infinite;
+  }
+}
+
+@keyframes scroll_up_button_icon {
+  from {
+    opacity: 0;
+    top: 50px;
+  }
+  50% {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+    top: -50px;
+  }
+}
+
+@media (max-width: 1000px) {
+  .scroll_up_button {
+    width: 60px;
+  }
+}
+
+@media (max-width: 700px) {
+  .scroll_up_button {
+    display: none;
+  }
+}

src/ts/pages/Team/components/PR/All.tsx

@@ -30,10 +30,7 @@ function AllPR({
 
   const workChart = getOptions({ max: getMax(response, 'workDays') });
   const delayChart = getOptions({ max: getMax(response, 'delayDays') });
-  const commitsChart = getOptions({
+  const commitsChart = getOptions({ order: dataGripStore.dataGrip.author.list });
-    max: getMax(response, 'commits'),
-    order: dataGripStore.dataGrip.author.list,
-  });
 
   return (
     <DataView