Develop

src/assets/index.tsx

@@ -127,141 +127,6 @@ const sortIcon = (
   </svg>
 );
 
-const simpleSmileIcon = (
-  <svg
-    width="25"
-    height="24"
-    viewBox="0 0 25 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_1424_63896)">
-      <path
-        d="M12.5996 0C5.98281 0 0.599609 5.3832 0.599609 12C0.599609 18.6168 5.98281 24 12.5996 24C19.2164 24 24.5996 18.6168 24.5996 12C24.5996 5.3832 19.2164 0 12.5996 0ZM12.5996 22.3824C6.87561 22.3824 2.21721 17.724 2.21721 12C2.21721 6.276 6.87561 1.6176 12.5996 1.6176C18.3236 1.6176 22.982 6.276 22.982 12C22.982 17.724 18.3236 22.3824 12.5996 22.3824ZM18.6212 11.1912C18.1748 11.1912 17.8124 11.5536 17.8124 12C17.8124 14.8752 15.4748 17.2128 12.5996 17.2128C9.72441 17.2128 7.38681 14.8752 7.38681 12C7.38681 11.5536 7.02441 11.1912 6.57801 11.1912C6.13161 11.1912 5.76921 11.5536 5.76921 12C5.76921 15.768 8.83161 18.8304 12.5996 18.8304C16.3676 18.8304 19.43 15.768 19.43 12C19.43 11.5536 19.07 11.1912 18.6212 11.1912ZM11.3468 8.3136C11.3468 8.964 10.8212 9.4896 10.1732 9.4896C9.52521 9.4896 8.99961 8.964 8.99961 8.3136C8.99961 7.6656 9.52521 7.14 10.1732 7.14C10.8212 7.14 11.3468 7.6656 11.3468 8.3136ZM15.6044 7.2912C16.1684 7.608 16.3676 8.3256 16.0508 8.8896C15.734 9.4536 15.0164 9.6552 14.4524 9.3384C13.886 9.0192 13.6868 8.304 14.0036 7.7376C14.3204 7.1712 15.038 6.972 15.6044 7.2912Z"
-        fill="#00B750"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_1424_63896">
-        <rect
-          width="24"
-          height="24"
-          fill="white"
-          transform="translate(0.599609)"
-        />
-      </clipPath>
-    </defs>
-  </svg>
-);
-
-const slightlySmileIcon = (
-  <svg
-    width="25"
-    height="24"
-    viewBox="0 0 25 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_1424_63890)">
-      <path
-        d="M12.4004 0C5.78359 0 0.400391 5.3832 0.400391 12C0.400391 18.6168 5.78359 24 12.4004 24C19.0172 24 24.4004 18.6168 24.4004 12C24.4004 5.3832 19.0172 0 12.4004 0ZM12.4004 22.3824C6.67639 22.3824 2.01799 17.724 2.01799 12C2.01799 6.276 6.67639 1.6176 12.4004 1.6176C18.1244 1.6176 22.7828 6.276 22.7828 12C22.7828 17.724 18.1244 22.3824 12.4004 22.3824ZM15.8132 15.672C13.9004 17.3304 10.9004 17.3304 8.98759 15.672C8.64919 15.3792 8.13799 15.4152 7.84519 15.7536C7.55479 16.0896 7.59079 16.6008 7.92679 16.8936C9.20359 18 10.802 18.552 12.4004 18.552C13.9988 18.552 15.5972 18 16.874 16.8936C17.21 16.6008 17.246 16.0896 16.9556 15.7536C16.6652 15.4176 16.1516 15.3792 15.8132 15.672ZM11.1476 9.3936C11.1476 10.0416 10.622 10.5672 9.97399 10.5672C9.32599 10.5672 8.79799 10.0416 8.79799 9.3936C8.79799 8.7456 9.32599 8.22 9.97399 8.22C10.622 8.22 11.1476 8.7456 11.1476 9.3936ZM15.4028 8.3712C15.9692 8.688 16.1684 9.4056 15.8492 9.9696C15.53 10.5336 14.8172 10.7352 14.2508 10.4184C13.6868 10.0992 13.4852 9.384 13.8044 8.8176C14.1236 8.2512 14.8388 8.052 15.4028 8.3712Z"
-        fill="#99CA65"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_1424_63890">
-        <rect
-          width="24"
-          height="24"
-          fill="white"
-          transform="translate(0.400391)"
-        />
-      </clipPath>
-    </defs>
-  </svg>
-);
-
-const expressionlessIcon = (
-  <svg
-    width="25"
-    height="24"
-    viewBox="0 0 25 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_1424_63884)">
-      <path
-        d="M7.6878 15.24C7.6878 14.7893 8.05314 14.424 8.5038 14.424H16.8318C17.2825 14.424 17.6478 14.7893 17.6478 15.24C17.6478 15.6907 17.2825 16.056 16.8318 16.056H8.50381C8.05314 16.056 7.6878 15.6907 7.6878 15.24ZM12.7998 0C6.183 0 0.799805 5.3832 0.799805 12C0.799805 18.6168 6.183 24 12.7998 24C19.4166 24 24.7998 18.6168 24.7998 12C24.7998 5.3832 19.4166 0 12.7998 0ZM12.7998 22.3824C7.0758 22.3824 2.4174 17.724 2.4174 12C2.4174 6.276 7.0758 1.6176 12.7998 1.6176C18.5238 1.6176 23.1822 6.276 23.1822 12C23.1822 17.724 18.5238 22.3824 12.7998 22.3824ZM9.56221 12.1848C9.63901 12.1848 9.7182 12.18 9.7974 12.1704C10.8846 12.0432 11.6622 11.0544 11.5326 9.9672C11.403 8.8824 10.4166 8.1024 9.3294 8.232C8.8038 8.2944 8.33341 8.5584 8.0046 8.976C7.6758 9.3936 7.53181 9.9096 7.5942 10.4376C7.7142 11.4432 8.57341 12.1848 9.56221 12.1848ZM16.7382 8.4744C16.2774 8.2152 15.7422 8.1504 15.231 8.292C14.7222 8.436 14.2974 8.7672 14.0382 9.2304C13.7766 9.6912 13.7142 10.224 13.8558 10.7352C13.9998 11.2464 14.331 11.664 14.7942 11.928C15.099 12.096 15.4326 12.1848 15.7614 12.1848C16.455 12.1848 17.1294 11.82 17.4942 11.1744C18.0294 10.2216 17.691 9.0096 16.7382 8.4744Z"
-        fill="#FEAB23"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_1424_63884">
-        <rect
-          width="24"
-          height="24"
-          fill="white"
-          transform="translate(0.799805)"
-        />
-      </clipPath>
-    </defs>
-  </svg>
-);
-
-const confusedIcon = (
-  <svg
-    width="25"
-    height="24"
-    viewBox="0 0 25 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_1424_63878)">
-      <path
-        d="M9.97399 10.2984C11.066 10.2984 11.9564 9.408 11.9564 8.3136C11.9564 8.1888 11.9396 8.1264 11.9276 8.0544C11.8667 7.68612 11.5482 7.416 11.1749 7.416H8.77067C8.39738 7.416 8.07891 7.68612 8.01799 8.0544C8.00599 8.1264 7.98919 8.2104 7.98919 8.3376C7.98919 9.4296 8.87959 10.2984 9.97399 10.2984ZM13.8548 10.044C14.162 10.2144 14.4956 10.2984 14.8244 10.2984C15.518 10.2984 16.1924 9.9336 16.5548 9.288C16.7732 8.8992 16.8524 8.5032 16.7828 8.0544C16.7204 7.68579 16.4012 7.416 16.0273 7.416H13.6258C13.2512 7.416 12.9317 7.68719 12.8708 8.0568C12.746 8.8704 13.1396 9.6408 13.8548 10.044ZM11.4092 13.7424C9.93918 13.9977 8.61498 14.4834 7.83171 14.8103C7.41904 14.9825 7.25639 15.4659 7.45663 15.8657C7.65669 16.2651 8.14261 16.4328 8.55615 16.2638C10.239 15.5761 14.3676 14.2041 16.3441 16.3252C16.6489 16.6523 17.1351 16.8025 17.5249 16.5837C17.9144 16.3651 18.0585 15.867 17.7825 15.516C16.7813 14.243 14.9065 13.1353 11.4092 13.7424ZM12.4004 0C5.78359 0 0.400391 5.3832 0.400391 12C0.400391 18.6168 5.78359 24 12.4004 24C19.0172 24 24.4004 18.6168 24.4004 12C24.4004 5.3832 19.0172 0 12.4004 0ZM12.4004 22.3824C6.67639 22.3824 2.01799 17.724 2.01799 12C2.01799 6.276 6.67639 1.6176 12.4004 1.6176C18.1244 1.6176 22.7828 6.276 22.7828 12C22.7828 17.724 18.1244 22.3824 12.4004 22.3824Z"
-        fill="#FF6941"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_1424_63878">
-        <rect
-          width="24"
-          height="24"
-          fill="white"
-          transform="translate(0.400391)"
-        />
-      </clipPath>
-    </defs>
-  </svg>
-);
-
-const worriedIcon = (
-  <svg
-    width="25"
-    height="24"
-    viewBox="0 0 25 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_1424_63872)">
-      <path
-        d="M12.7002 0C6.0834 0 0.700195 5.3832 0.700195 12C0.700195 18.6168 6.0834 24 12.7002 24C19.317 24 24.7002 18.6168 24.7002 12C24.7002 5.3832 19.317 0 12.7002 0ZM12.7002 22.3824C6.9762 22.3824 2.3178 17.724 2.3178 12C2.3178 6.276 6.9762 1.6176 12.7002 1.6176C18.4242 1.6176 23.0826 6.276 23.0826 12C23.0826 17.724 18.4242 22.3824 12.7002 22.3824ZM12.7002 11.532C9.9642 11.532 7.581 13.0416 6.477 15.4704C6.2922 15.8784 6.4722 16.356 6.8802 16.5408C7.2882 16.7256 7.7658 16.5456 7.9506 16.1376C8.7882 14.2968 10.6074 13.152 12.7002 13.152C14.793 13.152 16.6122 14.2968 17.4498 16.14C17.5842 16.4376 17.8794 16.6152 18.1866 16.6152C18.2994 16.6152 18.4122 16.5912 18.5202 16.5432C18.9282 16.3584 19.1082 15.8784 18.9234 15.4728C17.8194 13.0416 15.4362 11.532 12.7002 11.532ZM10.2738 9.4896C10.9218 9.4896 11.4474 8.964 11.4474 8.316C11.4474 7.668 10.9218 7.1424 10.2738 7.1424C9.6258 7.1424 9.10019 7.668 9.10019 8.316C9.0978 8.964 9.62339 9.4896 10.2738 9.4896ZM14.5506 9.3384C15.1146 9.6576 15.8322 9.456 16.149 8.892C16.4682 8.3256 16.2666 7.6104 15.7026 7.2936C15.1386 6.9768 14.421 7.176 14.1042 7.74C13.785 8.304 13.9866 9.0192 14.5506 9.3384Z"
-        fill="#FA3D33"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_1424_63872">
-        <rect
-          width="24"
-          height="24"
-          fill="white"
-          transform="translate(0.700195)"
-        />
-      </clipPath>
-    </defs>
-  </svg>
-);
-
 const closeBtn = <svg width="33" height="32" viewBox="0 0 33 32" xmlns="http://www.w3.org/2000/svg">
   <path d="M12.0364 10.2636C11.6849 9.91213 11.1151 9.91213 10.7636 10.2636C10.4121 10.6151 10.4121 11.1849 10.7636 11.5364L15.2272 16L10.7636 20.4636C10.4121 20.8151 10.4121 21.3849 10.7636 21.7364C11.1151 22.0879 11.6849 22.0879 12.0364 21.7364L16.5 17.2728L20.9636 21.7364C21.3151 22.0879 21.8849 22.0879 22.2364 21.7364C22.5879 21.3849 22.5879 20.8151 22.2364 20.4636L17.7728 16L22.2364 11.5364C22.5879 11.1849 22.5879 10.6151 22.2364 10.2636C21.8849 9.91213 21.3151 9.91213 20.9636 10.2636L16.5 14.7272L12.0364 10.2636Z" fill="currentColor"/>
 </svg>
@@ -296,11 +161,6 @@ export {
   questionIcon,
   myTeamIcon,
   sortIcon,
-  simpleSmileIcon,
-  slightlySmileIcon,
-  expressionlessIcon,
-  confusedIcon,
-  worriedIcon,
   closeBtn,
   greenIcon,
   orangeIcon,

src/components/MoodGraph/MoodGraph.tsx

@@ -3,14 +3,11 @@ import { useState, useEffect } from "react";
 import { selectConditions, selectButtonConditions } from "@/store/reducers/conditionsBurnout/conditionsBurnoutReducer.ts";
 import { useAppSelector } from "@/store/hooks.ts";
 import { arrowLeft, arrowRight } from "@/assets";
-
-import {
-  simpleSmileIcon,
-  slightlySmileIcon,
-  expressionlessIcon,
-  confusedIcon,
-  worriedIcon,
-} from "@/assets";
+import confusedIcon from '../../../public/confused.svg';
+import simpleSmileIcon from '../../../public/simple-smile.svg';
+import slightlySmileIcon from '../../../public/slightly-smile.svg';
+import expressionlessIcon from '../../../public/expressionless.svg';
+import worriedIcon from '../../../public/worried.svg';
 
 import styles from "./MoodGraph.module.css";
 import {UserConditionRecieved} from "@/types.ts";
@@ -147,11 +144,11 @@ export const MoodGraph = ({conditionsData}: Props) => {
       </div>
 
       <div className={styles.stackedSmiles}>
-        <div>{simpleSmileIcon}</div>
-        <div>{slightlySmileIcon}</div>
-        <div>{expressionlessIcon}</div>
-        <div>{confusedIcon}</div>
-        <div>{worriedIcon}</div>
+        <img src={simpleSmileIcon} alt="смайлик отличного настроения"/>
+        <img src={slightlySmileIcon} alt="смайлик хорошего настроения"/>
+        <img src={expressionlessIcon} alt="смайлик нормального настроения"/>
+        <img src={confusedIcon} alt="смайлик так себе настроения"/>
+        <img src={worriedIcon} alt="смайлик плохого настроения"/>
       </div>
 
       <ResponsiveLine

src/pages/main/Main.helpers.ts

@@ -0,0 +1,6 @@
+export function isTenHoursPassed(dateString: string): boolean {
+  const originalDate = new Date(dateString);
+  const tenHoursLater = new Date(originalDate.getTime() + 10 * 60 * 60 * 1000);
+  const currentDate = new Date();
+  return currentDate >= tenHoursLater;
+}