Fixed copmonents

src/components/LogoutButton/LogoutButton.js

@@ -1,33 +0,0 @@
-import React, {useState} from 'react'
-import {useNavigate} from 'react-router-dom'
-import {useSelector} from 'react-redux'
-import {useLogout} from "../../hooks/useLogout";
-
-import {Loader} from '../Loader/Loader'
-
-import {getRole} from '../../redux/roleSlice'
-
-import './logoutButton.scss'
-
-
-export const LogoutButton = () => {
-  const [isLoggingOut, setIsLoggingOut] = useState(false);
-
-  const userRole = useSelector(getRole);
-  const navigate = useNavigate();
-  const {logout} = useLogout();
-
-  return (
-      <button
-          className='logout-button'
-          onClick={() => {
-            setIsLoggingOut(true);
-            logout();
-            setIsLoggingOut(false);
-            navigate(userRole === 'ROLE_DEV' ? '/authdev' : '/auth')
-          }}
-      >
-        {isLoggingOut ? <Loader/> : 'Выйти'}
-      </button>
-  )
-};

src/components/LogoutButton/LogoutButton.jsx

@@ -0,0 +1,31 @@
+import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { useSelector } from "react-redux";
+
+import { useLogout } from "../../hooks/useLogout";
+import { Loader } from "../Loader/Loader";
+import { getRole } from "../../redux/roleSlice";
+
+import "./logoutButton.scss";
+
+export const LogoutButton = () => {
+  const [isLoggingOut, setIsLoggingOut] = useState(false);
+
+  const userRole = useSelector(getRole);
+  const navigate = useNavigate();
+  const { logout } = useLogout();
+
+  return (
+    <button
+      className="logout-button"
+      onClick={() => {
+        setIsLoggingOut(true);
+        logout();
+        setIsLoggingOut(false);
+        navigate(userRole === "ROLE_DEV" ? "/authdev" : "/auth");
+      }}
+    >
+      {isLoggingOut ? <Loader /> : "Выйти"}
+    </button>
+  );
+};

src/components/LogoutButton/logoutButton.scss

@@ -1,5 +1,4 @@
 .logout-button {
-
   position: relative;
   z-index: 100;
   display: flex;
@@ -14,7 +13,7 @@
   background-color: #6aaf5c;
   color: #ffffff;
   border: 3px solid #6aaf5c;
-  font-family: 'Muller', sans-serif;
+  font-family: "Muller", sans-serif;
   text-align: center;
 
   &:hover {