lab5

2024-01-12 11:26:04 +04:00
95 changed files with 2399 additions and 3 deletions
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@ -0,0 +1,24 @@
 module.exports = {
  root: true,
  env: { browser: true, es2020: true },
  extends: [
    'eslint:recommended',
    'plugin:react/recommended',
    'plugin:react/jsx-runtime',
    'plugin:react-hooks/recommended',
  ],
  ignorePatterns: ['dist', '.eslintrc.cjs'],
  parserOptions: { ecmaVersion: 12, sourceType: 'module' },
  settings: { react: { version: '18.2' } },
  plugins: ['react-refresh'],
  rules: {
    'react-refresh/only-export-components': [
      'warn',
      { allowConstantExport: true },
    ],
    'indent': 'off',
    'no-console': 'off',
    'arrow-body-style': 'off',
    'implicit-arrow-linebreak': 'off',
  },
 }
--- a/README.md
+++ b/README.md
@ -1,3 +1,6 @@
-# PIbd-22_Internet_programming
+Реализация
-
+- регистрация, вход, выход
-Интернет-программирование
+- отправка отзыва
 - поиск направления
 - поиск новости по тегу
 - редактирование новостей администратором
--- a/data.json
+++ b/data.json
--- a/list.txt
+++ b/list.txt
@ -0,0 +1,32 @@
 user {
    id,
    login,
    FIO,
    email,
    birthDate,
    password,
 }
 letter {
    id,
    email,
    theme,
    question
 }
 news {
    id,
    title,
    date,
    tage,
    text,
    image
 }
 direction {
    id,
    code,
    faculty,
    name,
    subjects
 }
--- a/index.html
+++ b/index.html
@ -0,0 +1,14 @@
 <html lang="ru">
 <head>
  <meta charset="UTF-8" />
  <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Тольяттинский государственный университет</title>
 </head>
 <body>
  <div id="root" class="h-100 d-flex flex-column"></div>
  <script type="module" src="./src/main.jsx"></script>
 </body>
 </html>
--- a/jsconfig.json
+++ b/jsconfig.json
@ -0,0 +1,15 @@
 {
    "compilerOptions": {
        "module": "ESNext",
        "moduleResolution": "Node",
        "target": "ES2020",
        "jsx": "react",
        "strictNullChecks": true,
        "strictFunctionTypes": true,
        "sourceMap": true
    },
    "exclude": [
        "node_modules",
        "**/node_modules/*"
    ]
 }
--- a/json-server.json
+++ b/json-server.json
@ -0,0 +1,5 @@
 {
    "static": "./node_modules/json-server/public",
    "port": 8081,
    "watch": "true"
 }
--- a/package.json
+++ b/package.json
@ -0,0 +1,45 @@
 {
  "name": "univercity",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "description": "internet-programming 2023",
  "scripts": {
    "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
    "rest": "json-server data.json",
    "vite": "vite",
    "dev": "npm-run-all --parallel rest vite",
    "prod": "npm-run-all lint 'vite build' --parallel rest 'vite preview'"
  },
  "dependencies": {
    "@fortawesome/fontawesome-free": "6.4.2",
    "axios": "^1.6.1",
    "bootstrap": "^5.3.2",
    "prop-types": "^15.8.1",
    "react": "^18.2.0",
    "react-bootstrap": "^2.9.1",
    "react-bootstrap-icons": "^1.10.3",
    "react-dom": "^18.2.0",
    "react-hook-form": "^7.49.2",
    "react-hot-toast": "^2.4.1",
    "react-redux": "^9.0.4",
    "react-router-dom": "^6.18.0",
    "redux": "^5.0.0"
  },
  "devDependencies": {
    "@types/react": "^18.2.15",
    "@types/react-dom": "^18.2.15",
    "@vitejs/plugin-react": "^4.0.3",
    "eslint": "8.50.0",
    "eslint-config-airbnb-base": "15.0.0",
    "eslint-plugin-import": "2.28.1",
    "eslint-plugin-react": "^7.32.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.3",
    "http-server": "14.1.1",
    "json-server": "0.17.4",
    "npm-run-all": "4.1.5",
    "react-hook-form": "^7.49.2",
    "vite": "4.4.9"
  }
 }
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/src/App.css
+++ b/src/App.css
@ -0,0 +1,53 @@
 html {
    width: 100%;
 }
 body {
    height: 100%;
    margin: 0px;
    padding: 0px;
    background-color: #e5e5e5;
    font-family: Arial;
    /* для закрепления подвала внизу страницы*/
    display: flex;
    flex-direction: column;
 }
@media (max-width: 800px) {
    body {
        font-size: small;
    }
 }
 .btn {
    background-color: #012362;
    border: 0px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
 }
 table {
    font-size: 13pt;
    border: 2px solid;
    border-left: 10px solid;
    border-right: 10px solid;
 }
@media (max-width: 800px) {
    table {
        font-size: 10pt;
    }
 }
@media (max-width: 500px) {
    table {
        font-size: 8pt;
    }
 }
 thead {
    font-style: italic;
 }
--- a/src/App.jsx
+++ b/src/App.jsx
@ -0,0 +1,26 @@
 import './App.css';
 import PropTypes from 'prop-types';
 import Content from './components/content/Content';
 import Header from './components/header/Header.jsx';
 import Navigation from './components/navigation/Navigation.jsx';
 import Footer from './components/footer/Footer.jsx';
 import { UserProvider } from './providers/UserProvider';
 const App = ({ routes }) => {
  return (
    <>
      <UserProvider>
          <Header />
          <Navigation routes={routes}></Navigation>
          <Content />
          <Footer />
      </UserProvider>
    </>
  )
 }
 App.propTypes = {
  routes: PropTypes.array,
 };
 export default App;
--- a/src/assets/logo.png
+++ b/src/assets/logo.png
--- a/src/components/api/ApiClient.js
+++ b/src/components/api/ApiClient.js
@ -0,0 +1,40 @@
 import axios from 'axios';
 import toast from 'react-hot-toast';
 export class HttpError extends Error {
  constructor(message = '') {
    super(message);
    this.name = 'HttpError';
    Object.setPrototypeOf(this, new.target.prototype);
    toast.error(message, { id: 'HttpError' });
  }
 }
 function responseHandler(response) {
  if (response.status === 200 || response.status === 201) {
    const data = response?.data;
    if (!data) {
      throw new HttpError('API Error. No data!');
    }
    return data;
  }
  throw new HttpError(`API Error! Invalid status code ${response.status}!`);
 }
 function responseErrorHandler(error) {
  if (error === null) {
    throw new Error('Unrecoverable error!! Error is null!');
  }
  toast.error(error.message, { id: 'AxiosError' });
  return Promise.reject(error.message);
 }
 export const ApiClient = axios.create({
  baseURL: 'http://localhost:8081/',
  timeout: '5000',
  headers: {
    Accept: 'application/json',
  },
 });
 ApiClient.interceptors.response.use(responseHandler, responseErrorHandler);
--- a/src/components/api/ApiDirection.js
+++ b/src/components/api/ApiDirection.js
@ -0,0 +1,29 @@
 import { ApiClient } from './ApiClient';
 class ApiDirection {
    constructor(url) {
        this.url = url;
    }
    async getAll(expand) {
        return ApiClient.get(`${this.url}${expand || ''}`);
    }
      async get(id, expand) {
        return ApiClient.get(`${this.url}/${id}${expand || ''}`);
    }
    async create(body) {
        return ApiClient.post(this.url, body);
    }
    async update(id, body) {
        return ApiClient.put(`${this.url}/${id}`, body);
    }
    async delete(id) {
        return ApiClient.delete(`${this.url}/${id}`);
    }
 }
 export default ApiDirection;
--- a/src/components/api/ApiNews.js
+++ b/src/components/api/ApiNews.js
@ -0,0 +1,29 @@
 import { ApiClient } from './ApiClient';
 class ApiNews {
    constructor(url) {
        this.url = url;
    }
    async getAll(expand) {
        return ApiClient.get(`${this.url}${expand || ''}`);
    }
      async get(id, expand) {
        return ApiClient.get(`${this.url}/${id}${expand || ''}`);
    }
    async create(body) {
        return ApiClient.post(this.url, body);
    }
    async update(id, body) {
        return ApiClient.put(`${this.url}/${id}`, body);
    }
    async delete(id) {
        return ApiClient.delete(`${this.url}/${id}`);
    }
 }
 export default ApiNews;
--- a/src/components/api/ApiService.js
+++ b/src/components/api/ApiService.js
@ -0,0 +1,41 @@
 import { ApiClient } from './ApiClient';
 class ApiService {
  constructor(url) {
    this.url = url;
  }
  async getAll(expand) {
    return ApiClient.get(`${this.url}${expand || ''}`);
  }
  async get(id, expand) {
    return ApiClient.get(`${this.url}/${id}${expand || ''}`);
  }
  async create(body) {
    return ApiClient.post(this.url, body);
  }
  async getByLogin(login) {
    return ApiClient.get(`${this.url}?login=${login}`);
  }
  async getByEmail(email) {
    return ApiClient.get(`${this.url}?email=${email}`);
  }
  async getAllForUser(userId) {
    return ApiClient.get(`${this.url}?userId=${userId}`);
  }
  async update(id, body) {
    return ApiClient.put(`${this.url}/${id}`, body);
  }
  async delete(id) {
    return ApiClient.delete(`${this.url}/${id}`);
  }
 }
 export default ApiService;
--- a/src/components/api/contactApiService.js
+++ b/src/components/api/contactApiService.js
@ -0,0 +1,34 @@
 import { ApiClient } from './ApiClient';
 // id,
 // email,
 // theme,
 // question
 class contactApiService {
  constructor(url) {
    this.url = url;
  }
  async getAll(expand) {
    return ApiClient.get(`${this.url}${expand || ''}`);
  }
  async get(id, expand) {
    return ApiClient.get(`${this.url}/${id}${expand || ''}`);
  }
  async create(body) {
    return ApiClient.post(this.url, body);
  }
  async update(id, body) {
    return ApiClient.put(`${this.url}/${id}`, body);
  }
  async delete(id) {
    return ApiClient.delete(`${this.url}/${id}`);
  }
 }
 export default contactApiService;
--- a/src/components/content/Content.css
+++ b/src/components/content/Content.css
@ -0,0 +1,37 @@
 #content {
    width: 80%;
    margin: 1.5% 10% 1.5% 10%;
    padding: 30px;
    padding-left: 5%;
    padding-right: 5%;
    background-color: white;
    color: #012362;
    font-size: 13pt;
    text-align: justify;
    line-height: 2em;
    /* для закрепления подвала внизу страницы*/
 	flex: 1 0 auto;
 }
@media (max-width: 800px) {
    #content {
        width: 100%;
        margin: 1.5% 0% 1.5% 0%;
    }
 }
 /* центр для изображений*/
 #content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
 }
 #content a{
    color: #06c;
 }
 #content a:hover{
    color: #f07c41;
    text-decoration: none;
 }
--- a/src/components/content/Content.jsx
+++ b/src/components/content/Content.jsx
@ -0,0 +1,12 @@
 import './Content.css'
 import { Outlet } from 'react-router-dom';
 const Content = () => {
    return (
    <div id="content">
        <Outlet />
    </div>
    );
 };
 export default Content;
--- a/src/components/footer/Footer.css
+++ b/src/components/footer/Footer.css
@ -0,0 +1,24 @@
 #footer { 
    width: 100%;
    background-color: #012362;
    text-align: center;
    font-family: Arial;
    font-size: 15px; /* в header'e 20px*/
    color: white;
    line-height: 1.5em;
    padding: 14px 0px 14px 0px;
    /* для закрепления подвала внизу страницы*/
 	flex: 0 0 auto;
 }
 #footer ul {
 	margin: 0px;
 } 
 #footer li {
    display: inline-flex;
 }
 #footer li:not(:last-of-type) {
 	margin-right: 3%;
 }
--- a/src/components/footer/Footer.jsx
+++ b/src/components/footer/Footer.jsx
@ -0,0 +1,18 @@
 import './Footer.css';
 const Footer = () => {
    const year = new Date().getFullYear();
    return (
        <div id="footer">
            <ul>
                <li>Адреса и контакты:</li>
                <li>432027, г. Тольятти, ул. Ларина, д.32</li>
                <li>+7 (8332) 43-06-55</li>
            </ul>
            dex_moth, {year}
        </div>
    );
 };
 export default Footer;
--- a/src/components/header/Header.css
+++ b/src/components/header/Header.css
@ -0,0 +1,29 @@
 #header { 
    width: 100%;
    background-color: #012362;
    text-align: center;
    font-family: Arial;
    font-size: 20px;
    color: white;
    padding: 10px 0px 10px 0px;
    /* для закрепления подвала внизу страницы*/
 	flex: 0 0 auto;
 }
 #header a {
    text-decoration: none;
    color: white;
 }
 #header a:hover {
    text-shadow: 1px 1px 8px #06c;
 }
 #logo {
    vertical-align: middle;
    margin-right: 10px;
 }
 #logo:hover {
    filter: drop-shadow(0px 2px 16px #06c);
 }
--- a/src/components/header/Header.jsx
+++ b/src/components/header/Header.jsx
@ -0,0 +1,14 @@
 import './Header.css'
 import universityLogo from '../../assets/logo.png';
 const Header = () => {
    return (
        <div id="header">
            <a href="/"><img id="logo" src={universityLogo} height="50px"/></a>
            <a href="/">Тольяттинский государственный политехнический университет</a>
        </div>
    );
 };
 export default Header;
--- a/src/components/modal/Modal.css
+++ b/src/components/modal/Modal.css
@ -0,0 +1,3 @@
 .modal-title {
    font-size: 1.2rem;
 }
--- a/src/components/modal/ModalConfirm.jsx
+++ b/src/components/modal/ModalConfirm.jsx
@ -0,0 +1,34 @@
 import PropTypes from 'prop-types';
 import { Button, Modal } from 'react-bootstrap';
 import { createPortal } from 'react-dom';
 import './Modal.css';
 const ModalConfirm = ({ show, title, message, onConfirm, onClose, }) => (
    createPortal(
        <Modal show={show} backdrop='static' onHide={() => onClose()}>
                <Modal.Header className='pt-2 pb-2 ps-3 pe-3' closeButton>
                    <Modal.Title>{title}</Modal.Title>
                </Modal.Header>
                <Modal.Body>
                    {message}
                </Modal.Body>
                <Modal.Footer className='m-0 pt-2 pb-2 ps-3 pe-3 row justify-content-center'>
                    <Button className='col-5 m-0 me-2' onClick={() => onClose()}>Нет</Button>
                    <Button className='col-5 m-0 ms-2' onClick={() => onConfirm()}>Да</Button>
                </Modal.Footer>
        </Modal>,
        document.body,
    )
 );
 ModalConfirm.propTypes = {
    show: PropTypes.bool,
    title: PropTypes.string,
    message: PropTypes.string,
    onConfirm: PropTypes.func,
    onClose: PropTypes.func,
  };
  export default ModalConfirm;
--- a/src/components/modal/ModalForm.jsx
+++ b/src/components/modal/ModalForm.jsx
@ -0,0 +1,40 @@
 import PropTypes from 'prop-types';
 import { Button, Form, Modal } from 'react-bootstrap';
 import { createPortal } from 'react-dom';
 import './Modal.css';
 const ModalForm = ({ show, title, validated, onSubmit, onClose, children, }) => (
  createPortal(
        <Modal show={show} backdrop='static' onHide={() => onClose()}>
            <Modal.Header className='pt-2 pb-2 ps-3 pe-3' closeButton>
                <Modal.Title>{title}</Modal.Title>
            </Modal.Header>
            <Form className='m-0' noValidate validated={validated} onSubmit={onSubmit}>
                <Modal.Body>
                    {children}
                </Modal.Body>
                <Modal.Footer className='m-0 pt-2 pb-2 ps-3 pe-3 row justify-content-center'>
                    <Button className='col-5 m-0 me-2'
                        onClick={() => onClose()}>
                        Отмена
                    </Button>
                    <Button className='col-5 m-0 ms-2' type='submit'>
                        Сохранить
                    </Button>
                </Modal.Footer>
            </Form>
        </Modal>,
        document.body,
  )
 );
 ModalForm.propTypes = {
  show: PropTypes.bool,
  title: PropTypes.string,
  validated: PropTypes.bool,
  onSubmit: PropTypes.func,
  onClose: PropTypes.func,
  children: PropTypes.node,
 };
 export default ModalForm;
--- a/src/components/modal/ModalHook.jsx
+++ b/src/components/modal/ModalHook.jsx
@ -0,0 +1,21 @@
 import { useState } from 'react';
 const useModal = () => {
  const [showModal, setShowModal] = useState(false);
  const showModalDialog = () => {
    setShowModal(true);
  };
  const hideModalDialog = () => {
    setShowModal(false);
  };
  return {
    isModalShow: showModal,
    showModal: showModalDialog,
    hideModal: hideModalDialog,
  };
 };
 export default useModal;
--- a/src/components/navigation/Navigation.css
+++ b/src/components/navigation/Navigation.css
@ -0,0 +1,53 @@
 .navbar {
    width: 100%;
    background-color: white;
    color: #012362;
    font-family: Arial;
    text-align: center;
 }
 .navbar-brand, .nav-item  {
    margin-left: 5em;
 }
@media (min-width: 800px) {
    .navbar-brand, .nav-item  {
        margin-left: 2em;
    }
 }
@media (min-width: 1280px) {
    .navbar-brand, .nav-item  {
        margin-left: 6em;
    }
 }
@media (min-width: 1600px) {
    .navbar-brand, .nav-item  {
        margin-left: 8em;
    }
 }
@media (min-width: 1920px) {
    .navbar-brand, .nav-item  {
        margin-left: 12em;
    }
 }
@media (min-width: 2100px) {
    .navbar-brand, .nav-item  {
        margin-left: 17em;
    }
 }
 .navbar-brand, .nav-link {
    font-size: 14pt;
    text-decoration: none;
    color: #012362;
 }
 .navbar-brand:hover, .nav-link:hover {
    color: #f07c41;
    text-decoration: underline;
 }
 .navbar-brand:focus, .navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: #06c;
 }
--- a/src/components/navigation/Navigation.jsx
+++ b/src/components/navigation/Navigation.jsx
@ -0,0 +1,68 @@
 import PropTypes from 'prop-types';
 import { useContext } from 'react';
 import { UserContext } from '../../providers/UserProvider';
 import useUser from '../../providers/hooks/UserHook';
 import { Container, Nav, Navbar } from 'react-bootstrap';
 import { Link, useLocation } from 'react-router-dom';
 import { Person } from 'react-bootstrap-icons';
 import './Navigation.css'
 const Navigation = ({ routes }) => {
    const location = useLocation();
    const indexPageLink = routes.filter((route) => route.index === false).shift();
    const pages = routes.filter((route) => Object.prototype.hasOwnProperty.call(route, 'title'));
    // зашёл ли пользователь
    const { user } = useContext(UserContext);
    // админ?
    const isAdmin = user && user.login === 'admin';
    // функция выхода из профиля
    const { userLogout } = useUser();
    console.log(user);
    return (
        <Navbar expand="md" bg="purple">
            <Container>
                <Navbar.Brand as={Link} to={indexPageLink?.path ?? '/news'}>
                    Новости
                </Navbar.Brand>
                <Navbar.Toggle aria-controls='main-navbar' />
                <Navbar.Collapse id='main-navbar'>
                    <Nav className='me-auto link' activeKey={location.pathname}>
                        {pages.map((page) => (
                            <Nav.Link as={Link} key={page.path} eventKey={page.path} to={page.path ?? '/'}>
                            {page.title}
                          </Nav.Link>
                        ))}
                    </Nav>
                    {user ? (
                        <Nav className='me-auto link'>
                            <Nav.Link as={Link} key="/profile" to='/profile'>
                                <Person className='me-2'/>{user.login}
                            </Nav.Link>
                            {isAdmin && (
                                <Nav.Link as={Link} key='/adminnews' to='/adminnews'>Админка</Nav.Link>
                            )}
                            <Nav.Link as={Link} onClick={userLogout} to='/'>Выйти</Nav.Link>
                        </Nav>
                    ) :
                    (
                        <Nav className='me-auto link'>
                            <Nav.Link as={Link} key='/login' eventKey='/login' to='/login'>Войти</Nav.Link>
                            <Nav.Link as={Link} key='/registration' eventKey='/registration' to='/registration'>Зарегистрироваться</Nav.Link>
                        </Nav>
                    )
                    }
                </Navbar.Collapse>
            </Container>
        </Navbar>
    );
 };
 Navigation.propTypes = {
    routes: PropTypes.array,
 };
 export default Navigation;
--- a/src/components/navigation/components/NavLogic.jsx
+++ b/src/components/navigation/components/NavLogic.jsx
@ -0,0 +1,44 @@
 // import { useContext } from 'react';
 // import AdminNav from './components/AdminNav.jsx';
 // import ExitNav from './components/ExitNav.jsx';
 // import LoginNav from './components/LoginNav.jsx';
 // import ProfileNav from './components/ProfileNav.jsx';
 // import RegistrationNav from './components/RegistrationNav.jsx';
 // import ContactsNav from './components/Contacts.jsx';
 // import UniversityNav from './components/UniversityNav.jsx';
 // import AbiturientNav from './components/AbiturientNav.jsx';
 // const NavLogic= () => {
 //     const user = useContext(UserContext);
 //     console.log("user=" + user);
 //     if (user != null) {
 //       return (
 //           <>
 //             <UniversityNav/>
 //             <AbiturientNav/>
 //             <ContactsNav/>
 //             <RegistrationNav/>
 //             <LoginNav/>
 //             <RegistrationNav/>
 //             <ProfileNav/>
 //             <AdminNav/>
 //             <ExitNav/>
 //           </>
 //       );
 //     }
 //     else {
 //       return (
 //          <>
 //           <UniversityNav/>
 //           <AbiturientNav/>
 //           <ContactsNav/>
 //           <RegistrationNav/>
 //           <LoginNav/>
 //           <RegistrationNav/>
 //          </>
 //     );
 //     }
 //   };
 // export default NavLogic;
--- a/src/components/navigation/components/components/AbiturientNav.jsx
+++ b/src/components/navigation/components/components/AbiturientNav.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const AbiturientNav = () => {
    <>
        <Nav.Link as={Link} to = {'/abiturient' ?? '/'}>
            Поступающему
        </Nav.Link>
    </>
 }
 export default AbiturientNav;
--- a/src/components/navigation/components/components/AdminNav.jsx
+++ b/src/components/navigation/components/components/AdminNav.jsx
@ -0,0 +1,18 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 // {
 //   pages.map((page) =>
 //   <Nav.Link as={Link} key={page.path} eventKey={page.path} to={page.path ?? '/'}>
 //       {page.title}
 //   </Nav.Link>)
 const AdminNav = () => {
    <>
    <Nav.Link as={Link} to = {'/admin' ?? '/'}>
        Страница администратора
    </Nav.Link>
    </>
 }
 export default AdminNav;
--- a/src/components/navigation/components/components/Contacts.jsx
+++ b/src/components/navigation/components/components/Contacts.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const ContactsNav = () => {
    <>
        <Nav.Link as={Link} to = {'/contacts' ?? '/'}>
            Контакты
        </Nav.Link>
    </>
 }
 export default ContactsNav;
--- a/src/components/navigation/components/components/ExitNav.jsx
+++ b/src/components/navigation/components/components/ExitNav.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const ExitNav = () => {
    <>
    <Nav.Link as={Link} to = {'/'}>
        Выйти
    </Nav.Link>
    </>
 }
 export default ExitNav;
--- a/src/components/navigation/components/components/LoginNav.jsx
+++ b/src/components/navigation/components/components/LoginNav.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const LoginNav = () => {
    <>
    <Nav.Link as={Link} to = {'/login' ?? '/'}>
        Войти
    </Nav.Link>
    </>
 }
 export default LoginNav;
--- a/src/components/navigation/components/components/NewsNav.jsx
+++ b/src/components/navigation/components/components/NewsNav.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const NewsNav = () => {
    <>
    <Nav.Link as={Link} to = {'/news' ?? '/'}>
        Новости
    </Nav.Link>
    </>
 }
 export default NewsNav;
--- a/src/components/navigation/components/components/ProfileNav.jsx
+++ b/src/components/navigation/components/components/ProfileNav.jsx
@ -0,0 +1,12 @@
 import { Link } from 'react-router-dom';
 import { Nav } from 'react-bootstrap';
 const ProfileNav = () => {
    <>
    <Nav.Link as={Link} to = {'/profile' ?? '/'}>
        Профиль
    </Nav.Link>
    </>
 }
 export default ProfileNav;
--- a/src/components/navigation/components/components/RegistrationNav.jsx
+++ b/src/components/navigation/components/components/RegistrationNav.jsx
@ -0,0 +1,12 @@
 import { Nav } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 const RegistrationNav = () => {
    <>
    <Nav.Link as={Link} to = {'/registration' ?? '/'}>
        Зарегистрироваться
    </Nav.Link>
    </>
 }
 export default RegistrationNav;
--- a/src/components/navigation/components/components/UniversityNav.jsx
+++ b/src/components/navigation/components/components/UniversityNav.jsx
@ -0,0 +1,12 @@
 import { Nav } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 const UniversityNav = () => {
    <>
        <Nav.Link as={Link} to = {'/university' ?? '/'}>
            Об университете
        </Nav.Link>
    </>
 }
 export default UniversityNav;
--- a/src/components/services/DirectionApiService.js
+++ b/src/components/services/DirectionApiService.js
@ -0,0 +1,5 @@
 import ApiDirection from "../api/ApiDirection";
 const DirectionApiService = new ApiDirection('directions');
 export default DirectionApiService;
--- a/src/components/services/NewsApiService.js
+++ b/src/components/services/NewsApiService.js
@ -0,0 +1,5 @@
 import ApiNews from '../api/ApiNews';
 const NewsApiService = new ApiNews('news');
 export default NewsApiService;
--- a/src/components/services/UsersApiService.js
+++ b/src/components/services/UsersApiService.js
@ -0,0 +1,5 @@
 import ApiService from '../api/ApiService';
 const UsersApiService = new ApiService('users');
 export default UsersApiService;
--- a/src/components/utils/Base64.js
+++ b/src/components/utils/Base64.js
@ -0,0 +1,15 @@
 const getBase64 = async (file) => {
    const reader = new FileReader();
    return new Promise((resolve, reject) => {
        reader.onloadend = () => {
            const fileContent = reader.result;
            resolve(fileContent);
        };
        reader.onerror = () => {
            reject(new Error('Oops, something went wrong with the file reader.'));
        };
        reader.readAsDataURL(file);
    });
 };
 export default getBase64;
--- a/src/index.css
+++ b/src/index.css
--- a/src/main.jsx
+++ b/src/main.jsx
@ -0,0 +1,84 @@
 import 'bootstrap/dist/css/bootstrap.min.css';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import { RouterProvider, createBrowserRouter } from 'react-router-dom';
 import App from './App.jsx';
 import './index.css';
 import Abiturient from './pages/Abiturient/Abiturient.jsx';
 import Admin from './pages/Admin/Admin.jsx';
 import AdminNews from './pages/AdminNews/AdminNews.jsx';
 import Contacts from './pages/Contacts/Contacts.jsx';
 import ErrorPage from './pages/Errorpage/ErrorPage.jsx';
 import Login from './pages/Login/Login.jsx';
 import Main from './pages/Main/Main.jsx';
 import News from './pages/News/News.jsx';
 import Profile from './pages/Profile/Profile.jsx';
 import Registration from './pages/Registration/Registration.jsx';
 import RegistrationSuccess from './pages/RegistrationSuccess/RegistrationSuccess.jsx';
 import University from './pages/University/University.jsx';
 const routes = [
  {
    path: '/university',
    element: <University />,
    title: 'Об университете',
  },
  {
    path: '/abiturient',
    element: <Abiturient />,
    title: 'Поступающему',
  },
  {
    path: '/admin',
    element: <Admin />
  },
  {
    path: '/adminnews',
    element: <AdminNews />
  },
  {
    path: '/registration',
    element: <Registration />,
  },
  {
    path: '/contacts',
    element: <Contacts />,
    title: 'Контакты',
  },
  {
    path: '/news',
    element: <News />,
  },
  {
    index: true,
    path: '/',
    element: <Main />
  },
  {
    path: '/login',
    element: <Login />,
  },
  {
    path: '/profile',
    element: <Profile />,
  },
  {
    path: '/registration_success',
    element: <RegistrationSuccess />
  },
 ];
 const router = createBrowserRouter([
  {
    path: '/',
    element: <App routes={routes} />,
    children: routes,
    errorElement: <ErrorPage />,
  },
 ]);
 ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>,
 );
--- a/src/pages/Abiturient/Abiturient.jsx
+++ b/src/pages/Abiturient/Abiturient.jsx
@ -0,0 +1,63 @@
 import SearchHook from './hooks/SearchHook';
 import { Form, Table, Container, Row, Col, InputGroup } from 'react-bootstrap';
 const Abiturient = () => {
    const { searchTerm, searchName, searchFaculty, handleChange, handleChange2, handleChange3, searchResults } = SearchHook();
    return (
        <>
            <div className="text-center">
                <h3>Список направлений</h3>
            </div>
            <Form id="directions" >
                <Container className='mb-4'>
                    <Row sm={2} className="justify-content-md-center">
                    <Col xl={3} className='mt-2'>
                            <InputGroup>
                                <InputGroup.Text>Факультет:</InputGroup.Text>
                                <Form.Control id="faculty" placeholder="ФИСТ" value={searchFaculty} onChange={handleChange3}/>
                            </InputGroup>
                        </Col>
                        <Col md={6} xl={4} className='mt-2'>
                            <InputGroup>
                                <InputGroup.Text>Направление:</InputGroup.Text>
                                <Form.Control id="direction" placeholder="Программная инженерия" value={searchName} onChange={handleChange2}/>
                            </InputGroup>
                        </Col>
                        <Col md={6} xl={5} className='mt-2'>
                            <InputGroup>
                                <InputGroup.Text>Предметы:</InputGroup.Text>
                                <Form.Control id="subjects" placeholder="Информатика" value={searchTerm} onChange={handleChange}/>
                            </InputGroup>
                        </Col>
                    </Row>
                </Container>
            </Form>
            <Table className="mt-2" bordered hover>
                <thead>
                    <tr>
                        <th scope="col">Код</th>
                        <th scope="col">Факультет</th>
                        <th scope="col">Наименование направления</th>
                        <th scope="col" className='w-50'>Требуемые баллы ЕГЭ</th>
                    </tr>
                </thead>
                <tbody>
                    {
                    searchResults.map((line) =>
                    <tr key={line.id}>
                        <td scope="col">{line.code}</td>
                        <td scope="col">{line.faculty}</td>
                        <td scope="col">{line.name}</td>
                        <td scope="col">{line.subjects}</td>
                    </tr>
                    )
                    }
                </tbody>
            </Table>
        </>
    );
 };
 export default Abiturient;
--- a/src/pages/Abiturient/hooks/SearchHook.jsx
+++ b/src/pages/Abiturient/hooks/SearchHook.jsx
@ -0,0 +1,56 @@
 import { useEffect, useState } from 'react';
 import DirectionApiService from '../../../components/services/DirectionApiService';
 const useDirection = () => {
    const [linesRefresh, setLinesRefresh] = useState(false);
    const [lines, setLines] = useState([]);
    const handleLinesChange = () => setLinesRefresh(!linesRefresh);
    const getLines = async () => {
        const data = await DirectionApiService.getAll();
        setLines(data ?? []);
    };
      // для поиска
      const [searchTerm, setSearchTerm] = useState("");
      const [searchName, setSearchName] = useState("");
      const [searchFaculty, setSearchFaculty] = useState("");
      const [searchResults, setSearchResults] = useState([]);
    const handleChange = ( event ) => {
          setSearchTerm(event.target.value);
      };
    const handleChange2 = ( event ) => {
        setSearchName(event.target.value);
    };
    const handleChange3 = ( event ) => {
        setSearchFaculty(event.target.value);
    };
      useEffect(() => {
          getLines();
          const results = lines.filter(line =>
              line.subjects.toLowerCase().includes(searchTerm)
          );
          const results2 = results.filter(line =>
            line.name.toLowerCase().includes(searchName)
          );
          const results3 = results2.filter(line =>
            line.faculty.toLowerCase().includes(searchFaculty)
          );
          setSearchResults(results3);
      }, [searchTerm, searchName, searchFaculty, linesRefresh]);
      return {
          searchResults,
          handleLinesChange,
          handleChange,
          handleChange2,
          handleChange3
    };
 }
 export default useDirection;
--- a/src/pages/Admin/Admin.jsx
+++ b/src/pages/Admin/Admin.jsx
@ -0,0 +1,28 @@
 import { Button, Container } from 'react-bootstrap';
 import { Navigate } from 'react-router-dom';
 import { useContext } from 'react';
 import { UserContext } from '../../providers/UserProvider';
 import { Link } from 'react-router-dom';
 const Admin = () => {
    const { user } = useContext(UserContext);
    const isAdmin = user && user.login === 'admin';
    if (!isAdmin) {
        return <Navigate to='/' replace />;
    }
    return (
        <>
            <div className="text-center">
                <h3>Кабинет администратора</h3>
            </div>
            <br/>
            <Container>
                <Link to='/adminnews'><Button>Таблица новостей</Button></Link>
            </Container>
        </>
    );
 };
 export default Admin;
--- a/src/pages/AdminNews/AdminNews.jsx
+++ b/src/pages/AdminNews/AdminNews.jsx
@ -0,0 +1,25 @@
 import { Navigate } from 'react-router-dom';
 import { useContext } from 'react';
 import { UserContext } from '../../providers/UserProvider';
 import News from './components/News';
 const AdminNews = () => {
    const { user } = useContext(UserContext);
    const isAdmin = user && user.login === 'admin';
    if (!isAdmin) {
        return <Navigate to='/' replace />;
    }
    return (
        <>
            <div className="text-center">
                <h3>Кабинет администратора</h3>
                <h4>Таблица новостей</h4>
            </div>
            <News/>
        </>
    );
 };
 export default AdminNews;
--- a/src/pages/AdminNews/components/News.jsx
+++ b/src/pages/AdminNews/components/News.jsx
@ -0,0 +1,38 @@
 import useLines from "../hooks/useLines";
 import NewsTable from "./NewsTable";
 import NewsTableRow from "./NewsTableRow";
 import ModalConfirm from '../../../components/modal/ModalConfirm';
 import ModalForm from '../../../components/modal/ModalForm';
 import NewsForm from "./NewsForm";
 import NewsDelete from '../hooks/NewsDeleteHook';
 import NewsFormModal from '../hooks/NewsFormHook';
 import { Button } from "react-bootstrap";
 const News = () =>
 {
    const { lines, handleLinesChange } = useLines();
    const { isDeleteModalShow, showDeleteModal, handleDeleteConfirm, handleDeleteCancel, } = NewsDelete(handleLinesChange);
    const {isFormModalShow, isFormValidated, showFormModal, currentItem, handleItemChange, handleFormSubmit, handleFormClose, } = NewsFormModal(handleLinesChange);
    return (
        <>
        <Button onClick={() => showFormModal(0)}>Добавить новость</Button>
        <NewsTable>
            {
                lines.map((line, index) =>
                <NewsTableRow key={line.id}
                    index={index} post={line}
                    onDelete={() => showDeleteModal(line.id)}
                    onEditInPage={() => showFormModal(line.id)}    
                />)
            }
        </NewsTable>
        <ModalConfirm show={isDeleteModalShow} onConfirm={handleDeleteConfirm} onClose={handleDeleteCancel} title='Удаление' message='Удалить элемент?' />
        <ModalForm show={isFormModalShow} validated={isFormValidated} onSubmit={handleFormSubmit} onClose={handleFormClose} title='Редактирование'>
            <NewsForm item={currentItem} handleChange={handleItemChange} />
        </ModalForm>
        </>
    );
 };
 export default News;
--- a/src/pages/AdminNews/components/NewsForm.jsx
+++ b/src/pages/AdminNews/components/NewsForm.jsx
@ -0,0 +1,46 @@
 import PropTypes from 'prop-types';
 import { Form, InputGroup } from 'react-bootstrap';
 const NewsForm = ({item, handleChange}) => {
    return (
        <>
            <div className='text-center'>
                <img src={item.image || "https://via.placeholder.com/200"} className="rounded" alt="placeholder" style={{ width: "100%", height: "330px" }}/>
            </div>
            <br/>
            <Form.Group controlId="title">
                <Form.Label>Заголовок:</Form.Label>
                <Form.Control name="title" value={item.title} type="text" placeholder="Заголовок" required onChange={handleChange} />
            </Form.Group>
            <br/>
            <Form.Group controlId="date">
                <Form.Label>Дата:</Form.Label>
                <Form.Control name="date" value={item.date} type="date" placeholder="01.01.2024" required onChange={handleChange}/>
            </Form.Group>
            <br/>
            <Form.Group controlId="text">
                <Form.Label>Текст новости:</Form.Label>
                <Form.Control name="text" value={item.text} type="text" as="textarea" placeholder="2-3 предложения" rows={4} required onChange={handleChange}/>
            </Form.Group>
            <br/>
            <Form.Group controlId="tage">
                <Form.Label>Тэги:</Form.Label>
                <Form.Control name="tage" value={item.tage} type="text" placeholder="праздник программирование" required onChange={handleChange}/>
            </Form.Group>
            <br/>
            <Form.Label>Изображение:</Form.Label>
            <InputGroup>
                <Form.Control id="image" type="file" onChange={handleChange}/>
            </InputGroup>
        </>
    );
 };
 NewsForm.propTypes = {
    item: PropTypes.object,
    handleChange: PropTypes.func,
  };
 export default NewsForm;
--- a/src/pages/AdminNews/components/NewsTable.jsx
+++ b/src/pages/AdminNews/components/NewsTable.jsx
@ -0,0 +1,29 @@
 import { Table } from "react-bootstrap";
 import PropTypes from 'prop-types';
 const NewsTable = ({ children }) => {
    return (
    <Table className="mt-4" hover bordered>
        <thead>
        <tr>
            <th scope = "col">№</th>
            <th scope = "col" className ="w-10">Название</th>
            <th scope = "col" className = "w-30">Дата</th>
            <th scope = "col" className = "w-50">Описание</th>
            <th scope = "col">Теги</th>
            <th scope = "col"></th>
            <th scope = "col"></th>
        </tr>
        </thead>
        <tbody>
            {children}
        </tbody>
    </Table>
    )
 }
 NewsTable.propTypes = {
    children : PropTypes.node,
 }
 export default NewsTable;
--- a/src/pages/AdminNews/components/NewsTableRow.jsx
+++ b/src/pages/AdminNews/components/NewsTableRow.jsx
@ -0,0 +1,30 @@
 import PropTypes from 'prop-types';
 import { PencilFill, Trash3 } from 'react-bootstrap-icons';
 const NewsTableRow = ({ index, post, onDelete, onEditInPage }) => {
    const handleAnchorClick = (event, action) => {
        event.preventDefault();
        action();
    };
    return (
        <tr>
            <th scope="row">{index}</th>
            <td>{post.title}</td>
            <td>{post.date}</td>
            <td>{post.text}</td>
            <td>{post.tage}</td>
            <td><a href="#" onClick={(event) => handleAnchorClick(event, onEditInPage)}><PencilFill /></a></td>
            <td><a href="#" onClick={(event) => handleAnchorClick(event, onDelete)}><Trash3 /></a></td>
        </tr>
    );
 };
 NewsTableRow.propTypes = {
    index: PropTypes.number,
    post: PropTypes.object,
    onDelete: PropTypes.func,
    onEditInPage: PropTypes.func,
 }
 export default NewsTableRow;
--- a/src/pages/AdminNews/hooks/NewsDeleteHook.jsx
+++ b/src/pages/AdminNews/hooks/NewsDeleteHook.jsx
@ -0,0 +1,34 @@
 import { useState } from 'react';
 import NewsApiService from '../../../components/services/NewsApiService';
 import useModal from '../../../components/modal/ModalHook';
 const NewsDelete = (usersChangeHandle) => {
    const { isModalShow, showModal, hideModal } = useModal();
    const [currentId, setCurrentId] = useState(0);
    const showModalDialog = (id) => {
        showModal();
        setCurrentId(id);
    };
    const onClose = () => {
        hideModal();
    };
    const onDelete = async () => {
        console.log('Новость удалена' + currentId);
        await NewsApiService.delete(currentId);
        usersChangeHandle();
        onClose();
    };
    return {
        isDeleteModalShow: isModalShow,
        showDeleteModal: showModalDialog,
        handleDeleteConfirm: onDelete,
        handleDeleteCancel: onClose,
    };
 };
 export default NewsDelete;
--- a/src/pages/AdminNews/hooks/NewsFormHook.jsx
+++ b/src/pages/AdminNews/hooks/NewsFormHook.jsx
@ -0,0 +1,38 @@
 import { useState } from 'react';
 import useModal from '../../../components/modal/ModalHook';
 import NewsItemForm from './NewsItemFormHook';
 const NewsFormModal = (handleLinesChange) => {
    const { isModalShow, showModal, hideModal } = useModal();
    const [currentId, setCurrentId] = useState(0);
    const { item, validated, handleSubmit, handleChange, resetValidity, } = NewsItemForm(currentId, handleLinesChange);
    const showModalDialog = (id) => {
        setCurrentId(id);
        resetValidity();
        showModal();
    };
    const onClose = () => {
        setCurrentId(-1);
        hideModal();
    };
      const onSubmit = async (event) => {
        if (await handleSubmit(event)) {
          onClose();
        }
    };
    return {
        isFormModalShow: isModalShow,
        isFormValidated: validated,
        showFormModal: showModalDialog,
        currentItem: item,
        handleItemChange: handleChange,
        handleFormSubmit: onSubmit,
        handleFormClose: onClose,
    };
 };
 export default NewsFormModal;
--- a/src/pages/AdminNews/hooks/NewsItemFormHook.jsx
+++ b/src/pages/AdminNews/hooks/NewsItemFormHook.jsx
@ -0,0 +1,84 @@
 import { useState } from 'react';
 import NewsItem from './NewsItemHook.jsx';
 import NewsApiService from '../../../components/services/NewsApiService';
 import getBase64 from '../../../components/utils/Base64.js';
 const NewsItemForm = (id, usersChangeHandle) => {
    const { item, setItem } = NewsItem(id);
    const [validated, setValidated] = useState(false);
    const resetValidity = () => {
        setValidated(false);
    };
    const getNewsObject = (formData) => {
        const title = formData.title;
        const date = formData.date;
        const tage = formData.tage;
        const text = formData.text;
        const image = formData.image.startsWith('data:image') ? formData.image : '';
        return {
            title: title.toString(),
            date: date.toString(),
            tage: tage.toString(),
            text: text.toString(),
            image,
        };
    };
    const handleChange = (event) => {
        if (event.target.type === 'file') {
            handleImageChange(event);
            return;
        }
        const inputName = event.target.name;
        const inputValue = event.target.value;
        setItem({
            ...item,
            [inputName]: inputValue,
        });
    };
    const handleImageChange = async (event) => {
        const { files } = event.target;
        const file = await getBase64(files.item(0));
        setItem({
            ...item,
            image: file,
        });
    };
    const handleSubmit = async (event) => {
        const form = event.currentTarget;
        event.preventDefault();
        event.stopPropagation();
        const body = getNewsObject(item);
        if (form.checkValidity()) {
            if (id === undefined || id === 0) {
                await NewsApiService.create(body);
            } else {
                await NewsApiService.update(id, body);
            }
            if (usersChangeHandle)
                usersChangeHandle();
            console.log('Новость сохранена');
            return true;
        }
        setValidated(true);
        return false;
    };
    return {
        item,
        validated,
        handleSubmit,
        handleChange,
        resetValidity,
    };
 };
 export default NewsItemForm;
--- a/src/pages/AdminNews/hooks/NewsItemHook.jsx
+++ b/src/pages/AdminNews/hooks/NewsItemHook.jsx
@ -0,0 +1,36 @@
 import { useEffect, useState } from 'react';
 import NewsApiService from '../../../components/services/NewsApiService';
 const NewsItem = (id) => {
    const emptyItem = {
        id: '',
        title: '',
        date: '',
        tage: '',
        text: '',
        image: '',
    };
    const [item, setItem] = useState({ ...emptyItem });
    const getItem = async (itemId = undefined) => {
        if (itemId && itemId > 0) {
            const data = await NewsApiService.get(itemId);
            setItem(data);
        } else {
            setItem({ ...emptyItem });
        }
    };
    console.log(item);
    useEffect(() => {
        getItem(id);
    }, [id]);
    return {
        item,
        setItem,
    };
 };
 export default NewsItem;
--- a/src/pages/AdminNews/hooks/useLines.jsx
+++ b/src/pages/AdminNews/hooks/useLines.jsx
@ -0,0 +1,23 @@
 import { useEffect, useState } from 'react';
 import NewsApiService from '../../../components/services/NewsApiService';
 const usePosts = () => {
    const [linesRefresh, setLinesRefresh] = useState(false);
    const [lines, setLines] = useState([]);
    const handleLinesChange = () => setLinesRefresh(!linesRefresh);
    const getLines = async () => {
        const data = await NewsApiService.getAll();
        data.reverse();
        setLines(data ?? []);
    };
    useEffect(() => { getLines(); }, [linesRefresh]);
    return {
        lines,
        handleLinesChange
    };
 }
 export default usePosts;
--- a/src/pages/Contacts/Contacts.jsx
+++ b/src/pages/Contacts/Contacts.jsx
@ -0,0 +1,30 @@
 import { Container, Row, Col } from "react-bootstrap";
 import imgLetter from "./assets/letter.jpg";
 import ContactsForm from './components/ContactsForm';
 const Contacts = () => {
    return (
        <>
            <Container >
                <Row className="justify-content-md-center" sm={1} lg={2}>
                    <Col>
                        <div className="text-center">
                            <h3>Обратная связь</h3>
                            Вы можете задать нам любой вопрос, обратиться с предложением или сообщить о проблеме. Для этого заполните приведённую форму.
                            <br/>
                            Мы с радостью вам ответим!
                            <br/><br/>
                            <img src={imgLetter} height="220px" alt="Здание университета"/>
                            <br/>
                        </div>
                    </Col>
                    <Col>
                        <ContactsForm/>
                    </Col>
                </Row>
            </Container>
        </>
    );
 };
 export default Contacts;
--- a/src/pages/Contacts/assets/letter.jpg
+++ b/src/pages/Contacts/assets/letter.jpg
--- a/src/pages/Contacts/components/ContactsForm.jsx
+++ b/src/pages/Contacts/components/ContactsForm.jsx
@ -0,0 +1,41 @@
 import { Form, FormLabel, Button } from "react-bootstrap";
 import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import useSubmit from './hooks/ContactsHook.jsx';
 const ContactsForm = () => {
    const { register, handleSubmit } = useForm();
    const navigate = useNavigate();
    const { onSubmit } = useSubmit();
    const makeSubmit = async (data) => {
        onSubmit(data);
        alert('Ваше письмо успешно отправлено!');
        navigate('/');
    };
    return (
        <Form id="contacts-form" onSubmit = {handleSubmit(async (data) => {await makeSubmit(data);})}>
            <Form.Group controlId="email">
                <FormLabel>Email:</FormLabel>
                <Form.Control {...register('email')} type="email" name="email" required />
            </Form.Group>
            <br/>
            <Form.Group controlId="theme">
                <FormLabel>Тема:</FormLabel>
                <Form.Control {...register('theme')} type="text" name="theme" required />
            </Form.Group>
            <br/>
            <Form.Group controlId="question">
                <FormLabel>Ваш вопрос:</FormLabel>
                <Form.Control {...register('question')} type="text" as="textarea" name="question" rows={4} required />
            </Form.Group>
            <br/>
            <div className="text-center">
                <Button variant="primary" type="submit">Отправить</Button>
            </div>
        </Form>
    )
 }
 export default ContactsForm;
--- a/src/pages/Contacts/components/hooks/ContactsHook.jsx
+++ b/src/pages/Contacts/components/hooks/ContactsHook.jsx
@ -0,0 +1,33 @@
 import contactApiService from '../services/contactAPIservice.js';
 const useSubmit = () => {
 // id,
 // email,
 // theme,
 // question
  const getNewLetter = (formData) => {
    const emailt = formData.email;
    const themet = formData.theme;
    const questiont = formData.question;
    return {
      email: emailt,
      theme: themet,
      question: questiont,
    };
  };
  const onSubmit = async (data) => {
    console.log(data);
    const newLetter = getNewLetter(data);
    const curLetter = await contactApiService.create(newLetter);
    return 3;
  };
  return { onSubmit };
 };
 export default useSubmit;
--- a/src/pages/Contacts/components/services/contactAPIservice.js
+++ b/src/pages/Contacts/components/services/contactAPIservice.js
@ -0,0 +1,5 @@
 import ApiService from '../../../../components/api/contactApiService';
 const contactsAPIservice = new ApiService('letters');
 export default contactsAPIservice;
--- a/src/pages/Errorpage/ErrorPage.jsx
+++ b/src/pages/Errorpage/ErrorPage.jsx
@ -0,0 +1,24 @@
 import imgError from './assets/cat2.png'
 import { useNavigate } from 'react-router-dom';
 import { Button } from 'react-bootstrap';
 const ErrorPage = () => {
    const navigate = useNavigate();
    return (
        <>
                <br/><br/>
                <div className="text-center">
                <h2>Ой!</h2>
                <h4>
                    Мы не нашли эту страницу :C
                </h4>
                <br/>
                <img src={imgError} height="80%"/>
                </div>
                <Button className="w-10 mt-5" onClick={() => navigate(-1)}>Вернуться назад</Button>
        </>
    );
 };
 export default ErrorPage;
--- a/src/pages/Errorpage/assets/cat2.png
+++ b/src/pages/Errorpage/assets/cat2.png
--- a/src/pages/Login/Login.css
+++ b/src/pages/Login/Login.css
@ -0,0 +1,9 @@
 #image {
    width: 100%;
 }
@media (max-width: 800px) {
    #image {
        display: none;
    }
 }
--- a/src/pages/Login/Login.jsx
+++ b/src/pages/Login/Login.jsx
@ -0,0 +1,31 @@
 import "./Login.css";
 import React from 'react';
 import { Container, Row, Col } from 'react-bootstrap';
 import imgLetter from "./assets/students.jpg";
 import LoginForm from "./components/LoginForm";
 const Login = () => {
    return (
    <>
        <Container >
            <Row>
                <Col sm={12} lg={4} className="me-3">
                    <h3>Вход</h3>
                    <h4>Личный кабинет</h4>
                    <LoginForm/>
                    <h5>Не получается войти?</h5>
                    <h6>Обратитесь к <a href="./contacts">администратору</a>.</h6>
                    <h6>Если у вас ещё нет учётной записи, <a href="./registration">зарегистрируйтесь</a>.</h6>
                </Col>
                <Col sm={0} lg={7}>
                    <div id="image" className="text-center">
                        <img src={imgLetter} className="w-100" alt="Здание университета"/>
                    </div>
                </Col>
            </Row>
        </Container>
    </>
    )
 };
 export default Login;
--- a/src/pages/Login/assets/students.jpg
+++ b/src/pages/Login/assets/students.jpg
--- a/src/pages/Login/components/LoginForm.jsx
+++ b/src/pages/Login/components/LoginForm.jsx
@ -0,0 +1,39 @@
 import { Form, FormLabel, Button } from 'react-bootstrap';
 import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import useSubmit from './hooks/LoginHook';
 const LoginForm = () => {
    const { register, handleSubmit} = useForm();
    const { onSubmit } = useSubmit();
    const navigate = useNavigate();
    const makeSubmit = async (data) => {
        const res1 = await onSubmit(data);
        if (res1 === 1) {
          alert('Пользователя с таким логином не существует');
          return;
        }
        if (res1 === 2) {
          alert('Введен неверный пароль');
          return;
        }
        navigate('/');
    };
    return (
    <Form className="mb-5" id="contacts-form" onSubmit={handleSubmit(async (data) => { await makeSubmit(data); })}>
        <Form.Group controlId="login" className="mb-3">
            <FormLabel>Логин:</FormLabel>
            <Form.Control {...register('login')} type="text" name="login" required />
        </Form.Group>
        <Form.Group controlId="password">
            <FormLabel>Пароль:</FormLabel>
            <Form.Control {...register('password')} type="password" name="password" required />
        </Form.Group>
        <Button type="submit" className="mt-4">Войти</Button>
    </Form>
    )
 }
 export default LoginForm;
--- a/src/pages/Login/components/hooks/LoginHook.jsx
+++ b/src/pages/Login/components/hooks/LoginHook.jsx
@ -0,0 +1,20 @@
 import loginApiService from "../service/loginApiService";
 import useUser from "../../../../providers/hooks/UserHook";
 const useSubmit = () => {
    const {userLogin} = useUser();
    const onSubmit = async (data) => {
        const res1 = await loginApiService.getByLogin(data.login);
        if (res1.length === 0) {
            return 1;
          }
        if (res1[0].password !== data.password) {
            return 2;
        }
        userLogin(res1[0]);
        return 3;
    };
    return { onSubmit};
 };
 export default useSubmit;
--- a/src/pages/Login/components/service/loginApiService.js
+++ b/src/pages/Login/components/service/loginApiService.js
@ -0,0 +1,5 @@
 import ApiService from "../../../../components/api/ApiService";
 const loginApiService = new ApiService('users');
 export default loginApiService;
--- a/src/pages/Main/Main.jsx
+++ b/src/pages/Main/Main.jsx
@ -0,0 +1,36 @@
 import { Link } from 'react-router-dom';
 import { Carousel } from 'react-bootstrap';
 import Students1 from './assets/Students1.jpg';
 import Students2 from './assets/Students2.jpg';
 import Students3 from './assets/Students3.jpg';
 const Main = () => {
    return (
        <>
            <div className="text-center">
                <h4>Добро пожаловать на сайт</h4>
                <h3><b>Государственного политехнического университета</b>!</h3>
            </div>
            <div className="text-justify">
                На нашем сайте вы можете просмотреть <a href="news">последние новости</a>, прочитать <a href="university">информацию о нас</a>, и многое другое....
                <br/><br/>
                <Carousel data-bs-theme="dark">
                    <Carousel.Item interval={1800}>
                        <img src={Students1} className="d-block w-80"/>
                    </Carousel.Item>
                    <Carousel.Item interval={1800}>
                        <img src={Students2} className="d-block w-80"/>
                    </Carousel.Item>
                    <Carousel.Item interval={1800}>
                        <img src={Students3} className="d-block w-80"/>
                    </Carousel.Item>
                </Carousel>
            </div>
        </>
    );
 };
 export default Main;
--- a/src/pages/Main/assets/Students1.jpg
+++ b/src/pages/Main/assets/Students1.jpg
--- a/src/pages/Main/assets/Students2.jpg
+++ b/src/pages/Main/assets/Students2.jpg
--- a/src/pages/Main/assets/Students3.jpg
+++ b/src/pages/Main/assets/Students3.jpg
--- a/src/pages/News/News.jsx
+++ b/src/pages/News/News.jsx
@ -0,0 +1,31 @@
 import usePosts from "./hooks/usePosts";
 import PostTemplate from "./components/PostTemplate";
 import { Form, InputGroup } from "react-bootstrap";
 const News = () => {
    const { searchTerm, handleChange, searchResults } = usePosts();
    return (
        <>
            <div className="text-center">
                <h3>Новости</h3>
            </div>
            <div className="col-5">
                <InputGroup className=" mb-3">
                    <InputGroup.Text id="basic-addon1">Поиск новости по тегу:</InputGroup.Text>
                    <Form.Control placeholder="праздник программирование" value={searchTerm} onChange={handleChange} />
                </InputGroup>
            </div>
            <br/>
            <div className="row row-cols-1 row-cols-md-3 g-4">
            {
                searchResults.map((line) =>
                <PostTemplate key={line.id} post={line}/>)
            }
            </div>
            <br/>
        </>
    );
 };
 export default News;
--- a/src/pages/News/assets/1september.jpg
+++ b/src/pages/News/assets/1september.jpg
--- a/src/pages/News/assets/Halloween.jpg
+++ b/src/pages/News/assets/Halloween.jpg
--- a/src/pages/News/assets/icpc.jpg
+++ b/src/pages/News/assets/icpc.jpg
--- a/src/pages/News/assets/robokross.jpg
+++ b/src/pages/News/assets/robokross.jpg
--- a/src/pages/News/components/PostTemplate.jsx
+++ b/src/pages/News/components/PostTemplate.jsx
@ -0,0 +1,31 @@
 import PropTypes from 'prop-types';
 import imgPlaceholder from './assets/200.png';
 import 'bootstrap/dist/css/bootstrap.min.css';
 const PostTemplate = ({ post }) => {
    return (
        <div className="col">
            <div className="card h-100">
                <img src={post.image || imgPlaceholder} style={{ width: "100%", height: "330px" }} className="card-img-top" alt={post.title}/>
                <div className="card-body">
                    <h5 className="card-title">{post.title}</h5>
                    <p className="card-text"><small className="text-body-secondary">{post.date}</small></p>
                    <p className="card-text">{post.text}</p>
                    <p className="card-text"><small className="text-body-secondary">
                        {
                            post.tage.split(" ").map((el) => (
                                <i key={el}>{el} </i>
                            ))
                        }
                    </small></p>
                </div>
            </div>
        </div>
    );
 };
 PostTemplate.propTypes = {
    post: PropTypes.object,
 }
 export default PostTemplate;
--- a/src/pages/News/components/assets/200.png
+++ b/src/pages/News/components/assets/200.png
--- a/src/pages/News/hooks/usePosts.jsx
+++ b/src/pages/News/hooks/usePosts.jsx
@ -0,0 +1,39 @@
 import { useEffect, useState } from 'react';
 import NewsApiService from '../../../components/services/NewsApiService';
 const usePosts = () => {
    const [linesRefresh, setLinesRefresh] = useState(false);
    const [lines, setLines] = useState([]);
    const handleLinesChange = () => setLinesRefresh(!linesRefresh);
    const getLines = async () => {
        const data = await NewsApiService.getAll();
        data.reverse();
        setLines(data ?? []);
    };
    // для поиска
    const [searchTerm, setSearchTerm] = useState("");
    const [searchResults, setSearchResults] = useState([]);
    const handleChange = ( event ) => {
        setSearchTerm(event.target.value);
    };
    useEffect(() => {
        getLines();
        const results = lines.filter(line =>
            line.tage.includes(searchTerm)
        );
        setSearchResults(results);
    }, [searchTerm, linesRefresh]);
    return {
        searchResults,
        handleLinesChange,
        handleChange
    };
 }
 export default usePosts;
--- a/src/pages/Profile/Profile.jsx
+++ b/src/pages/Profile/Profile.jsx
@ -0,0 +1,41 @@
 import { Container, Row } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 import { useContext } from 'react';
 import { UserContext } from '../../providers/UserProvider';
 const Profile = () => {
    // зашёл ли пользователь
    const { user } = useContext(UserContext);
    return (
    <>
        <div className="text-center">
            <h3>Профиль</h3>
        </div>
        Полная информация о вашем профиле представлена ниже.
        <br/>
        <Container>
            <Row>
                <div>
                    <b>ID: </b>{user ? user.id : null}
                    <br/>
                    <b>Логин:</b> {user ? user.login : null}
                    <br/>
                    <b>ФИО пользователя:</b> {user ? user.FIO : null}
                    <br/>
                    <b>Электронная почта:</b> {user ? user.email : null}
                    <br/>
                    <b>Дата рождения:</b> {user ? user.birthDate : null}
                </div>
                <nav>
                    <Link to = '/'>
                        Вернуться на главную
                    </Link>
                </nav>
            </Row>
        </Container>
    </>
    )
 };
 export default Profile;
--- a/src/pages/Registration/Registration.jsx
+++ b/src/pages/Registration/Registration.jsx
@ -0,0 +1,19 @@
 import RegistrationForm from './components/RegistrationForm.jsx';
 const Registration = () => {
    return (
        <>
        <div className="text-center">
            <h3>Регистрация</h3>
            Регистрация на нашем сайте позволит Вам стать его полноценным участником.
            <br/>
            Вы сможете просматривать расписание групп, свои оценки и учебный план.
            В случае возникновения проблем с регистрацией, обратитесь к <a href="./contacts">администратору</a>.
        </div>
       <br/><br/>
       <RegistrationForm/>
        </>
    );
 };
 export default Registration;
--- a/src/pages/Registration/components/RegistrationForm.jsx
+++ b/src/pages/Registration/components/RegistrationForm.jsx
@ -0,0 +1,88 @@
 import { Container, Form, Row, Col, Button } from "react-bootstrap";
 import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import useSubmit from './hooks/RegistrationHook.jsx';
 const RegistrationForm = () => {
    const { register, handleSubmit } = useForm();
    const navigate = useNavigate();
    const { onSubmit } = useSubmit();
    const makeSubmit = async (data) => {
        if (data.password !== data.checkPassword) {
            alert('Пароли не совпадают');
            return;
        }
        const res = onSubmit(data);
        if (res === 1) {
            alert('Пользователь с таким логином уже существует');
            return;
        }
        if (res === 2) {
            alert('Пользователь с таким email уже существует');
            return;
        }
        // if (res === 3) {
        //     alert('Повторно введённый пароль не совпадает!');
        //     return;
        // }
        navigate('/registration_success');
      };
    return (
        <Form onSubmit = {handleSubmit(async (data) => {await makeSubmit(data);})}>
        <Container >
            <Row xs={1} lg={3} className='mb-2'>
                <Col className='mb-2'>
                    <Form.Group controlId='login'>
                        <Form.Label>Логин: </Form.Label>
                        <Form.Control {...register('login')} type="text" name="login" required />
                    </Form.Group>
                </Col>
                <Col className='mb-2'>
                    <Form.Group controlId='FIO'>
                        <Form.Label>ФИО: </Form.Label>
                        <Form.Control {...register('FIO')} type="text" name="FIO" required />
                    </Form.Group>
                </Col>
                <Col className='mb-2'>
                    <Form.Group controlId='birthDate'>
                        <Form.Label>Дата рождения: </Form.Label>
                        <Form.Control {...register('birthDate')} type="date" name="birthDate" required />
                    </Form.Group>
                </Col>
            </Row>
            <Row xs={1} lg={3}>
                <Col className='mb-2'>
                    <Form.Group controlId='email'>
                        <Form.Label>Email: </Form.Label>
                        <Form.Control {...register('email')} type="email" name="email" required />
                    </Form.Group>
                </Col>
                <Col className='mb-2'>
                    <Form.Group controlId='password'>
                        <Form.Label>Пароль: </Form.Label>
                        <Form.Control {...register('password')} type="password" name="password" required />
                    </Form.Group>
                </Col>
                <Col className='mb-2'>
                    <Form.Group controlId='check-password'>
                        <Form.Label>Проверка пароля: </Form.Label>
                        <Form.Control {...register('checkPassword')} type="password" name="checkPassword" required />
                    </Form.Group>
                </Col>
            </Row>
            <br/>
        </Container>
        <div className="text-center">
            <Button variant="primary" type="submit">Зарегистрироваться</Button>
        </div>
        </Form>
    )
 }
 export default RegistrationForm;
--- a/src/pages/Registration/components/hooks/RegistrationHook.jsx
+++ b/src/pages/Registration/components/hooks/RegistrationHook.jsx
@ -0,0 +1,40 @@
 import useUser from '../../../../providers/hooks/UserHook.jsx';
 import RegApiService from '../services/regAPIservice.js';
 const useSubmit = () => {
  const { userLogin } = useUser();
  const getNewUser = (formData) => {
    const logint = formData.login;
    const FIOt = formData.FIO;
    const birthDatet = formData.birthDate;
    const emailt = formData.email;
    const passwordt = formData.password;
    return {
      login: logint,
      FIO: FIOt,
      birthDate: birthDatet,
      email: emailt,
      password: passwordt,
    };
  };
  const onSubmit = async (data) => {
    const res1 = await RegApiService.getByLogin(data.login);
    if (res1.length !== 0) {
      return 1;
    }
    const res2 = await RegApiService.getByEmail(data.email);
    if (res2.length !== 0) {
      return 2;
    }
    const newUser = getNewUser(data);
    const curUser = await RegApiService.create(newUser);
    userLogin(curUser);
    return 3;
  };
  return { onSubmit };
 };
 export default useSubmit;
--- a/src/pages/Registration/components/services/regAPIservice.js
+++ b/src/pages/Registration/components/services/regAPIservice.js
@ -0,0 +1,5 @@
 import ApiService from '../../../../components/api/ApiService';
 const regAPIservice = new ApiService('users');
 export default regAPIservice;
--- a/src/pages/RegistrationSuccess/RegistrationSuccess.jsx
+++ b/src/pages/RegistrationSuccess/RegistrationSuccess.jsx
@ -0,0 +1,10 @@
 import React from 'react';
 const RegistrationSuccess = () => (
    <>
        <div className="text-center">
            <h3>Регистрация прошла успешно!</h3>
        </div>
    </>
 );
 export default RegistrationSuccess;
--- a/src/pages/University/University.jsx
+++ b/src/pages/University/University.jsx
@ -0,0 +1,25 @@
 import imgUniversity from "./assets/University.jpg";
 const University = () => {
    return (
        <>
            <div className="text-center">
            <h3>История ГПУ✨</h3>
            </div>
            <p>29 мая 2001 года решением правительства РФ был создан Государственный политехнический университет. Новый ВУЗ был образован на базе Тольяттинского политехнического института и Тольяттинского филиала Самарского государственного педагогического университета.</p>
            <p>История Политехнического института начинается с вечернего отделения Куйбышевского индустриального института, созданного при Куйбышевгидросторе в 1951 году. Строительство ГЭС остро нуждалось в квалифицированных инженерах. Руководил факультетом Д.Е. Чуркин, а в 1953 году его сменил к.т.н. В.Н. Зубков.</p>
            <p>1 сентября 1951 года начались занятия 150 студентов. Первое время преподаватели приезжали из Куйбышева, лекции читали многие инженеры-практики со стройки, и сам начальник КГС И.В. Комзин. На отделении было всего два штатных сотрудника: В.Н. Зубков и А.Э. Лившиц. В 1962 году число сотрудников возросло до 90 человек, 8 из них имели ученую степень кандидатов наук.</p>
            <p>В 1956 году состоялся первый выпуск инженеров-гидростроителей и инженеров-электриков. Постепенно открывались новые специальности, в 1959 году получили дипломы первые инженеры-механики. В 1961 было открыто дневное обучение.</p>
            <p>В 1961 году были открыты механический факультет (декан В.Н. Зубков) и химико-электротехнический (декан Б.Н. Рачинский). В 1964 году был создан химико-технологический факультет.  В 1966 году были выпущены первые инженеры-технологи химического производства. В 1966 году на трех факультетах обучались 2800 студентов.</p>
            <p>В октябре 1966 года на базе филиала был образован Тольяттинский политехнический институт. Немалую роль в организации института сыграли потребности в кадрах строящегося ВАЗа, а также наличие материальной базы.</p>
            <p>Первым ректором нового ВУЗа был назначен профессор, доктор технических наук видный ученый из Куйбышева Арон Наумович Резников. Он сумел привлечь новые квалифицированные кадры и  создал современный институт с высоким учебным и научным потенциалом. Были созданы 13 новых кафедр, в том числе единственная в стране кафедра промышленной пайки. Благодаря А.Н. Резникову через 10 лет в ТПИ работали 7 докторов наук и 151 кандидат наук. За это время почти в 2 раза возрос набор студентов, и в 10 раз возросли объемы научных работ. Наиболее успешными были 80-е гг., когда учёные ТПИ осваивали в год  около 3 млн. руб.</p>
            <p>Ежегодно ученые института получали десятки свидетельств на изобретения, всего же со времени создания ТПИ было получено   1134 авторских свидетельства на изобретения.</p>
            <p>ТГУ – современный инновационный вуз. В 2010 году  университет стал победителем конкурса  Правительства РФ на Премию качества за 2009 год, дважды – в 2004 и 2011 году ТГУ стал лауреатом конкурса «Европейское качество» в группе «100  лучших вузов России». В 2011 году ТГУ завоевал  по итогам конкурса  СНГ за достижения в области качества  оказания услуг приз «Признание делового совершенства». Ректор ТГУ М.М. Криштал в 2011 г. удостоен звания «Российский лидер качества», награждён дипломом и медалью,  такую высокую оценку деятельности дала «Всероссийская организация качества».</p>
            <p>В 2014 году в составе ТГУ 11 институтов, включая институт военного обучения, 44 кафедры, институт дистанционного обучения.</p>
            <br/>
            <img src={imgUniversity} height="250px" alt="Здание университета"/>
        </>
    );
 };
 export default University;
--- a/src/pages/University/assets/University.jpg
+++ b/src/pages/University/assets/University.jpg
--- a/src/providers/UserProvider.jsx
+++ b/src/providers/UserProvider.jsx
@ -0,0 +1,17 @@
 import { createContext, useReducer, useEffect } from 'react';
 import { loadUser, saveUser, userReducer } from './reducer/UserReduser.jsx';
 export const UserContext = createContext(null);
 export const UserProvider = ({ children }) => {
  console.log('UserProvider');
  const [user, dispatch] = useReducer(userReducer, null, loadUser);
  useEffect(() => {
    saveUser(user || null);
  }, [user]);
  return <UserContext.Provider value = {{ user, dispatch }}>
    {children}
  </UserContext.Provider>;
 };
--- a/src/providers/hooks/UserHook.jsx
+++ b/src/providers/hooks/UserHook.jsx
@ -0,0 +1,14 @@
 import { useContext } from 'react';
 import { UserContext } from '../UserProvider.jsx';
 import { userLogout, userLogin } from '../reducer/UserReduser.jsx';
 const useUser = () => {
  const { dispatch } = useContext(UserContext);
  return {
    userLogout: () => dispatch(userLogout()),
    userLogin: (user) => dispatch(userLogin(user)),
  };
 };
 export default useUser;
--- a/src/providers/reducer/UserReduser.jsx
+++ b/src/providers/reducer/UserReduser.jsx
@ -0,0 +1,41 @@
 const USER_KEY = 'user';
 const USER_LOGIN = 'user/login';
 const USER_LOGOUT = 'user/logout';
 export const saveUser = (user) => {
  console.log('User save');
  localStorage.setItem('user', JSON.stringify(user));
 };
 export const loadUser = (initialValue = []) => {
  const userData = localStorage.getItem(USER_KEY);
  console.log('User load: ' + userData.login);
  if (userData) {
    return JSON.parse(userData);
  }
  return initialValue;
 };
 export const userReducer = (prevUser, action) => {
  console.log(action);
  const { user } = action;
  switch (action.type) {
    case USER_LOGOUT: {
      return null;
    }
    case USER_LOGIN: {
      return user;
    }
    default: {
      throw Error(`Unknown action: ${action.type}`);
    }
  }
 };
 export const userLogout = () => ({
  type: USER_LOGOUT,
 });
 export const userLogin = (user) => ({
  type: USER_LOGIN, user,
 });
--- a/vite.config.js
+++ b/vite.config.js
@ -0,0 +1,13 @@
 /* eslint-disable import/no-extraneous-dependencies */
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
 // https://vitejs.dev/config/
 export default defineConfig({
  plugins: [react()],
  build: {
    sourcemap: true,
    chunkSizeWarningLimit: 1024,
    emptyOutDir: true,
  },
 });