From f338f958817caddf90a1f562dedd69fade7c2b52 Mon Sep 17 00:00:00 2001
From: DVorortnoy <dimchik505@gmail.com>
Date: Mon, 3 Jul 2023 09:45:15 +0300
Subject: [PATCH] bugs

---
 .../DefaultBoard/Default.module.scss          |  8 ++++++
 src/components/DefaultBoard/DefaultBoard.jsx  | 28 +++++++++++++++----
 src/components/Sidebar/Sidebar.jsx            |  3 ++
 src/components/TaskCard/TaskCard.jsx          |  1 -
 src/components/TaskColumn/TaskColumn.jsx      |  2 ++
 src/components/UserInfo/UserInfo.module.scss  |  2 ++
 6 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/src/components/DefaultBoard/Default.module.scss b/src/components/DefaultBoard/Default.module.scss
index 1ea8465..dee6785 100644
--- a/src/components/DefaultBoard/Default.module.scss
+++ b/src/components/DefaultBoard/Default.module.scss
@@ -51,11 +51,19 @@
 }
 
 .defaultLink {
+  cursor: pointer;
   &.dark,
   &.light {
     color: #bedbb0;
+    &:hover{
+      color: #5255bc;
+    }
   }
   &.colorful {
     color: #5255bc;
+
+  &:hover{
+    color: #bedbb0;
   }
 }
+}
diff --git a/src/components/DefaultBoard/DefaultBoard.jsx b/src/components/DefaultBoard/DefaultBoard.jsx
index 54a43db..5115af0 100644
--- a/src/components/DefaultBoard/DefaultBoard.jsx
+++ b/src/components/DefaultBoard/DefaultBoard.jsx
@@ -1,12 +1,22 @@
 import { selectorTheme } from 'redux/Auth/authSelectors';
-import { useSelector } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import clsx from 'clsx';
-import React from 'react';
+import React, { useState } from 'react';
 import { HeaderDashBoard } from 'components/HeaderDashBoard/HeaderDashBoard';
 import s from './Default.module.scss';
+import { BoardModalWindow } from '../BoardModalWindow/BoardModalWindow';
 
-export const DefaultDashBoard = () => {
+import { addNewBoard } from 'redux/Boards/boardsOperations';
+export const DefaultDashBoard = () => {  
+  const dispatch = useDispatch();
   const theme = useSelector(selectorTheme);
+  const [showModalWindow, setShowModalWindow] = useState(false);
+  const handleModalWindowOpen = () => setShowModalWindow(true);
+  const handleModalWindowClose = () => setShowModalWindow(false);
+
+  const handleAddBoard = async newBoard => {
+    await dispatch(addNewBoard(newBoard));
+  };
   return (
     <>
       <div className={clsx(s.backGround, s[theme])}>
@@ -14,15 +24,21 @@ export const DefaultDashBoard = () => {
 
         <p className={clsx(s.defaultTitle, s[theme])}>
           Before starting your project, it is essential
-          <span className={clsx(s.defaultLink, s[theme])}>
-            {' '}
-            to create a board{' '}
+          <span className={clsx(s.defaultLink, s[theme])} onClick={handleModalWindowOpen}> to create a board
           </span>
           to visualize and track all the necessary tasks and milestones. This
           board serves as a powerful tool to organize the workflow and ensure
           effective collaboration among team members.
         </p>
       </div>
+      {showModalWindow && (
+        <BoardModalWindow
+          titleModalButton="Create"
+          modalTitle="New board"
+          handleToggleModal={handleModalWindowClose}
+          onSubmit={handleAddBoard}
+        />
+      )}
     </>
   );
 };
diff --git a/src/components/Sidebar/Sidebar.jsx b/src/components/Sidebar/Sidebar.jsx
index f6f9fb0..30fa934 100644
--- a/src/components/Sidebar/Sidebar.jsx
+++ b/src/components/Sidebar/Sidebar.jsx
@@ -38,10 +38,13 @@ export const Sidebar = () => {
       <Logout theme={theme} />
       {showModalWindow && (
         <BoardModalWindow
+        inputTitle=''
           titleModalButton="Create"
           modalTitle="New board"
           handleToggleModal={handleModalWindowClose}
           onSubmit={handleAddBoard}
+          activeIcon=''
+          activeBackground=''
         />
       )}
     </div>
diff --git a/src/components/TaskCard/TaskCard.jsx b/src/components/TaskCard/TaskCard.jsx
index a332ec3..1afdddc 100644
--- a/src/components/TaskCard/TaskCard.jsx
+++ b/src/components/TaskCard/TaskCard.jsx
@@ -31,7 +31,6 @@ export const TaskCard = ({
   const currentDate = new Date().toLocaleDateString('en-GB');
   const endDate = new Date(deadline).toLocaleDateString('en-GB');
   const isDeadline = endDate === currentDate;
-
   let labelCapitalizeFirstLetter =
     label.charAt(0).toUpperCase() + label.slice(1);
 
diff --git a/src/components/TaskColumn/TaskColumn.jsx b/src/components/TaskColumn/TaskColumn.jsx
index 6553fd1..40d6eed 100644
--- a/src/components/TaskColumn/TaskColumn.jsx
+++ b/src/components/TaskColumn/TaskColumn.jsx
@@ -59,6 +59,8 @@ export const TaskColumn = ({ columnId }) => {
       }),
     );
   };
+
+  console.log(cards);
   return (
     <>
       <ul
diff --git a/src/components/UserInfo/UserInfo.module.scss b/src/components/UserInfo/UserInfo.module.scss
index 5a6d3d3..63c5322 100644
--- a/src/components/UserInfo/UserInfo.module.scss
+++ b/src/components/UserInfo/UserInfo.module.scss
@@ -5,6 +5,8 @@
   align-items: center;
   column-gap: 8px;
 
+  cursor: pointer;
+
   .name {
     font-family: 'Poppins-SemiBold';
     font-size: 14px;