fixed conflicts

ita-social-projects · Oct 11, 2024 · 9fd0811 · 9fd0811
2 parents cfc3d2b + a1cacec
commit 9fd0811
Show file tree

Hide file tree

Showing 29 changed files with 678 additions and 191 deletions.
diff --git a/FrontEnd/src/components/BreadCrumbs/BreadCrumbs.jsx b/FrontEnd/src/components/BreadCrumbs/BreadCrumbs.jsx
@@ -1,25 +1,37 @@
-import css from './BreadCrumbs.module.css';
 import { Link, useNavigate } from 'react-router-dom';
 import { PropTypes } from 'prop-types';
 
+import { useAuth } from '../../hooks';
+
+import css from './BreadCrumbs.module.css';
+
 const BreadCrumbs = ({ currentPage }) => {
   const navigate = useNavigate();
-
+  const { isStaff } = useAuth();
   const goBackHandler = () => {
     navigate(-1);
   };
   return (
     <div className={css['content']}>
-      <button
-        className={css['goback__button']}
-        type="button"
-        onClick={goBackHandler}
-      >
-        <i className={css['left']}></i>Назад
-      </button>
-      <Link className={css['main-page__button']} to="/">
-        Головна
-      </Link>
+      { !isStaff ? (
+        <button
+          className={css['goback__button']}
+          type="button"
+          onClick={goBackHandler}
+        >
+          <i className={css['left']}></i>Назад
+        </button>
+      ) : null
+      }
+      {!isStaff ? (
+        <Link className={css['main-page__button']} to="/">
+          Головна
+        </Link>
+        ) : (
+        <Link className={css['main-page__button']} to="/customadmin">
+          Панель адміністратора
+        </Link>)
+      }
       <i className={css['right']}></i>
       <div className={css['current-page__button']}>{currentPage}</div>
     </div>

diff --git a/FrontEnd/src/components/Footer/Top/FooterNavigation.jsx b/FrontEnd/src/components/Footer/Top/FooterNavigation.jsx
@@ -66,14 +66,6 @@ function FooterNavigation() {
     fetchContacts();
   }, []);
 
-  if (error) {
-    return <p>{error}</p>;
-  }
-
-  if (!contacts) {
-    return <p>Loading...</p>;
-  }
-
   return (
     <div className={css['navigation-content']}>
       <div className={css['navigation-content-section']}>
@@ -100,11 +92,19 @@ function FooterNavigation() {
       </div>
       <div className={css['navigation-content-section']}>
         <p className={css['navigation-content-section-service__text']}>Контакти</p>
-        <p className={css['navigation-content-section-service__text']}>{contacts.email}</p>
-        <p className={css['navigation-content-section-service__text']}>{contacts.phone}</p>
-        <p className={css['navigation-content-section-service__text']}>{contacts.university}</p>
-        <p className={css['navigation-content-section-service__text']}>{contacts.address}</p>
-     </div>
+        {error ? (
+          <p className={css['navigation-content-section-service__text']} style={{ color: 'white' }}>
+            {error}
+          </p>
+        ) : contacts && (
+          <>
+            <p className={css['navigation-content-section-service__text']}>{contacts.email}</p>
+            <p className={css['navigation-content-section-service__text']}>{contacts.phone}</p>
+            <p className={css['navigation-content-section-service__text']}>{contacts.university}</p>
+            <p className={css['navigation-content-section-service__text']}>{contacts.address}</p>
+          </>
+        )}
+      </div>
     </div>
   );
 }

diff --git a/FrontEnd/src/components/Header/Header.jsx b/FrontEnd/src/components/Header/Header.jsx
@@ -1,16 +1,22 @@
-import css from './Header.module.css';
+import { useLocation } from 'react-router-dom';
+
 import HeaderMenu from './Menu/HeaderMenu';
 import Navbar from './Navbar/Navbar';
 
+import css from './Header.module.css';
+
 function Header(props) {
+  const { pathname } = useLocation();
+  const hideMenu = pathname === '/login' || pathname === '/sign-up' || pathname.includes('/customadmin');
+
   return (
     <header>
       <div className={css['header-content']}>
-        <Navbar isAuthorized={props.isAuthorized} page={props.page}></Navbar>
+        <Navbar isAuthorized={props.isAuthorized} page={pathname}></Navbar>
         <div className={css['header-divider']}></div>
-        {props.page === 'login' || props.page === 'registration' ? null : (
-          <HeaderMenu />
-        )}
+          {hideMenu ? null : (
+            <HeaderMenu />
+          )}
         <div className={css['header-divider']}></div>
       </div>
     </header>

diff --git a/FrontEnd/src/components/Header/Navbar/Buttons.jsx b/FrontEnd/src/components/Header/Navbar/Buttons.jsx
@@ -1,11 +1,11 @@
 import css from './Buttons.module.css';
 import { Link } from 'react-router-dom';
 
-function Buttons() {
+function Buttons({adminPage}) {
     return (
         <div className={css['header-buttons-section']}>
             <Link className={css['header-login__button']} to="/login">Увійти</Link>
-            <Link className={css['header-register__button']} to="/sign-up">Зареєструватися</Link>
+            {!adminPage && <Link className={css['header-register__button']} to="/sign-up">Зареєструватися</Link>}
         </div>
     );
 }

diff --git a/FrontEnd/src/components/Header/Navbar/Navbar.jsx b/FrontEnd/src/components/Header/Navbar/Navbar.jsx
@@ -1,15 +1,21 @@
-import css from './Navbar.module.css';
+import { Link } from 'react-router-dom';
+
+import { useAuth } from '../../../hooks';
+
 import Menu from './Menu';
 import SearchBox from './SearchBox';
 import Profile from './Profile';
 import Buttons from './Buttons';
-import { Link } from 'react-router-dom';
 
-function Navbar(props) {
+import css from './Navbar.module.css';
+
+function Navbar (props) {
+  const { isStaff} = useAuth();
+  const hideMenu = props.page === '/login' || props.page === '/sign-up' || props.page.includes('/customadmin');
   return (
     <div className={css['navbar-content']}>
       <div className={css['navbar-logo__text']}>
-        <Link to="/">
+        <Link to="/" target={isStaff ? '_blank' : null}>
           <img
             className={css['navbar-main-logo']}
             src={`${process.env.REACT_APP_PUBLIC_URL}/craftMerge-logo.svg`}
@@ -18,13 +24,13 @@ function Navbar(props) {
         </Link>
       </div>
       <div className={css['navbar-utility-bar']}>
-        {props.page === 'login' || props.page === 'registration' ? null : (
+        { hideMenu ? null : (
           <>
             <Menu />
             <SearchBox></SearchBox>
           </>
         )}
-        {props.isAuthorized === true ? <Profile /> : <Buttons />}
+        {props.isAuthorized === true ? <Profile /> : <Buttons adminPage={props.page.includes('/customadmin')} />}
       </div>
     </div>
   );

diff --git a/FrontEnd/src/components/Header/Navbar/Navbar.module.css b/FrontEnd/src/components/Header/Navbar/Navbar.module.css
@@ -1,16 +1,17 @@
 .navbar-content {
   display: flex;
+  width: 70%;
   padding: 8px 104px;
   align-items: center;
   justify-content: space-between;
   height: var(--navbar-content-height);
 }
 
-.navbar-logo__text{
+.navbar-logo__text {
   display: flex;
 }
 
-.navbar-main-logo{
+.navbar-main-logo {
   display: flex;
   width: 199px;
   height: 24px;

diff --git a/FrontEnd/src/components/Header/Navbar/Profile.jsx b/FrontEnd/src/components/Header/Navbar/Profile.jsx
@@ -7,7 +7,7 @@ import css from './Profile.module.css';
 
 
 function Profile() {
-  const { user, isAuth, logout } = useAuth();
+  const { user, isAuth, logout, isStaff } = useAuth();
   const navigate = useNavigate();
 
   const navigateToProfile = () => {
@@ -31,12 +31,12 @@ function Profile() {
         className={css['header-profile__avatar']}
         src={`${process.env.REACT_APP_PUBLIC_URL}/img/Avatar.png`}
         alt="Avatar"
-        onClick={navigateToProfile}
+        onClick={!isStaff ? navigateToProfile : null}
       />
-      <DropdownMenu toggleText="Профіль">
-        <Link to="/profile/user-info">Профіль</Link>
-        <button onClick={performLogout}>Вихід</button>
-      </DropdownMenu>
+        <DropdownMenu toggleText={isStaff ? 'Адміністратор' : 'Профіль'}>
+          <Link to={isStaff ? '/customadmin/admin-profile/admin-info' : '/profile/user-info'}>Профіль</Link>
+          <button onClick={performLogout}>Вихід</button>
+        </DropdownMenu>
     </div>
   );
 }

diff --git a/FrontEnd/src/components/Header/Navbar/SearchBox.jsx b/FrontEnd/src/components/Header/Navbar/SearchBox.jsx
@@ -19,6 +19,7 @@ function SearchBox() {
       <div className={css['header-search-form']}>
         <input
           className={css['header-search-form__input']}
+          id="search_box"
           value={searchTerm}
           type="text"
           placeholder="Пошук"

diff --git a/FrontEnd/src/components/MiniComponents/AdminSubmitButton.jsx b/FrontEnd/src/components/MiniComponents/AdminSubmitButton.jsx
@@ -0,0 +1,17 @@
+import classes from './AdminSubmitButton.module.css';
+
+const AdminSubmitButton = ({ disabled }) => {
+    return (
+        <div className={classes['admin-submit__container']}>
+            <button
+                className={classes['admin-submit__button']}
+                type="submit"
+                disabled={disabled}
+            >
+                Зберегти зміни
+            </button>
+          </div>
+    );
+};
+
+export default AdminSubmitButton;
diff --git a/FrontEnd/src/components/MiniComponents/AdminSubmitButton.module.css b/FrontEnd/src/components/MiniComponents/AdminSubmitButton.module.css
@@ -0,0 +1,27 @@
+.admin-submit__container {
+    margin-top: 16px;
+}
+
+.admin-submit__button {
+    display: block;
+    width: 100%;
+    border-radius: 4px;
+    border: 1px solid var(--main-button-color);
+    background: var(--main-button-color);
+    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.04);
+    color: var(--light-button-text-color);
+    font-feature-settings: 'calt' off;
+    font-style: normal;
+    padding: 5px 15px 5px 15px;
+    font-family: var(--font-main);
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 20px;
+    letter-spacing: -0.01em;
+    text-align: center;
+    cursor: pointer;
+}
+
+.admin-submit__button:active {
+    transform: translateY(2px);
+}
diff --git a/FrontEnd/src/pages/AdminPage/AdminGlobal.css b/FrontEnd/src/pages/AdminPage/AdminGlobal.css
@@ -1,10 +1,13 @@
 :root {
     --font__admin-panel: "Inter", sans-serif;
-    --block-size__admin-panel: 1500px;
-    --menu-size__admin-panel: 120px;
+    --block-size__admin-panel: 1512px;
+    --menu-size__admin-panel: 222px;
     --table-size__admin-panel: 1000px;
     --font-color__admin-panel: #292E32;
+    --notification-text-color__admin-panel: #ff4d4f;
     --background__admin-panel: #F1FFF7;
-    --background-butons__admin-panel: #0B6C61;
-    --button-color__admin-panel: #0B6C61;
-}
+    --background-input__admin-panel: #FFF;
+    --border-input__admin-panel: #d9d9d9;
+    --background-butons__admin-panel: #1F9A7C;
+    --button-color__admin-panel: #1F9A7C;
+}