loader hover and devlist fixes

src/components/Auth/AuthForDevelopers.module.css

@@ -156,6 +156,10 @@
   border: 2px solid #6aaf5c;
 }
 
+.form__btn:hover .loader * {
+  fill: #6aaf5c;
+}
+
 .form__btn:hover {
   background-image: none;
   background-color: #ffffff;

src/components/Auth/AuthForPartners.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { auth } from '../../redux/outstaffingSlice';
-import { loading } from '../../redux/loaderSlice'
+import { loading } from '../../redux/loaderSlice';
 import style from './AuthForPartners.module.css';
 import ellipse from '../../images/ellipse.png';
 import arrow from '../../images/arrow__login_page.png';
@@ -25,7 +25,7 @@ const AuthForPartners = () => {
   const dispatch = useDispatch()
   const isAuth = useSelector(selectAuth)
   const isLoading = useSelector(selectIsLoading)
-console.log('iL',isLoading);
+  
   const [username, setUsername] = useState('')
   const [password, setPassword] = useState('')
 
@@ -67,14 +67,14 @@ console.log('iL',isLoading);
                     onClick={!isLoading ? (e) => {
                       e.preventDefault();
                       dispatch(loading(true))
-                      fetchAuth({
-                        username,
-                        password,
-                        dispatch: ()=> {
-                          dispatch(auth(true))
-                          dispatch(loading(false))
-                        }
-                      })
+                      // fetchAuth({
+                      //   username,
+                      //   password,
+                      //   dispatch: ()=> {
+                      //     dispatch(auth(true))
+                      //     dispatch(loading(false))
+                      //   }
+                      // })
                     } : ()=>{}}
                   >
                   { isLoading ? <Loader /> : 'Войти' }

src/components/Description/Description.js

@@ -21,8 +21,10 @@ const Description = ({ onLoadMore }) => {
     <section className={style.description}>
       <div className="container">
         <div className={style.description__wrapper}>
-          {filteredListArr && filteredListArr.length > 0
-            ? filteredListArr.map((el) => (
+          {filteredListArr
+            ? (filteredListArr.length > 0 
+              ? <></> 
+              : filteredListArr.map((el) => (
                   <div className="row" key={el.id}>
                     <div className="col-2">
                       <img className={style.description__img} src={male} alt="" />
@@ -58,7 +60,7 @@ const Description = ({ onLoadMore }) => {
                     </div>
                     <div className="col-xl-4"></div>
                   </div>
-              ))
+                )))
             : candidatesListArr.map((el) => (
                 <div className="row" key={el.id}>
                   <div className="col-2">

src/components/Loader/Loader.js

@@ -1,4 +1,6 @@
 import SVGLoader from "react-loader-spinner";
+import './loader.css'
+
 export const Loader = () => {
     return (
         <div className='loader'>
@@ -7,7 +9,6 @@ export const Loader = () => {
                 color="#fff"
                 height={50}
                 width={50}
-                timeout={3000}
             />
         </div>
     );

src/components/Loader/loader.css

@@ -0,0 +1,11 @@
+.loader {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.loader:hover path {
+        fill: #6aaf5c;
+}

src/components/Select/TagSelect.js

@@ -1,12 +1,15 @@
 import React from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import Select from 'react-select';
+import { Loader } from '../Loader/Loader';
 import style from './TagSelect.module.css';
 import { selectedItems, selectItems, selectTags, filteredCandidates } from '../../redux/outstaffingSlice';
 import { fetchItemsForId } from '../../server/server';
+import { selectIsLoading } from '../../redux/loaderSlice';
 
 const TagSelect = () => {
   const dispatch = useDispatch();
+  const isLoading = useSelector(selectIsLoading)
 
   const itemsArr = useSelector(selectItems);
 
@@ -41,8 +44,8 @@ const TagSelect = () => {
                     return { id: item.id, value: item.value, label: item.value };
                   })}
                 />
-                <button onClick={handleSubmit} type="submit">
-                  Поиск
+                <button onClick={handleSubmit} type="submit" className={style.search__submit}>
+                { isLoading ? <Loader /> : 'Поиск' }
                 </button>
               </div>
             </div>

src/components/Select/TagSelect.module.css

@@ -70,3 +70,7 @@
   font-size: 1.6em !important;
   color: gray !important;
 }
+
+.search__submit:hover .loader path {
+    fill: #6aaf5c;
+}