diff --git a/frontend/src/components/modals/AddChannelModal/AddChannelModal.jsx b/frontend/src/components/modals/AddChannelModal/AddChannelModal.jsx
index 2fb12eb..880fa1b 100644
--- a/frontend/src/components/modals/AddChannelModal/AddChannelModal.jsx
+++ b/frontend/src/components/modals/AddChannelModal/AddChannelModal.jsx
@@ -1,6 +1,6 @@
import React, { useEffect, useRef } from 'react';
import {
- Form, FormGroup, FormControl, FormLabel, Button,
+ Modal as BootstrapModal, Form, FormGroup, FormControl, FormLabel, Button,
} from 'react-bootstrap';
import { toast } from 'react-toastify';
import { useDispatch } from 'react-redux';
@@ -50,49 +50,58 @@ const AddChannelModal = ({ handleClose }) => {
});
return (
-
+ <>
+
+
+ {t('modals.addTitle')}
+
+
+
+
+
+ >
);
};
diff --git a/frontend/src/components/modals/ModalComponent.jsx b/frontend/src/components/modals/ModalComponent.jsx
index 86ec48a..c08a4c9 100644
--- a/frontend/src/components/modals/ModalComponent.jsx
+++ b/frontend/src/components/modals/ModalComponent.jsx
@@ -1,33 +1,24 @@
import { useSelector, useDispatch } from 'react-redux';
import { Modal as BootstrapModal } from 'react-bootstrap';
-import { useTranslation } from 'react-i18next';
import { selectIsOpen, closeModal, selectType } from '../../store/slices/modalsSlice';
import { MODALS } from './constants';
-const Modal = () => {
+const ModalComponent = () => {
const dispatch = useDispatch();
const isOpen = useSelector(selectIsOpen);
const type = useSelector(selectType);
- const { t } = useTranslation();
const handleClose = () => {
dispatch(closeModal());
};
- const Component = MODALS[type];
+ const ModalContent = MODALS[type];
return (
-
-
- {t(`modals.${type}ChannelTitle`)}
-
-
-
- {Component && }
-
+ {ModalContent && }
);
};
-export default Modal;
+export default ModalComponent;
diff --git a/frontend/src/components/modals/RemoveChannelModal.jsx b/frontend/src/components/modals/RemoveChannelModal.jsx
index d786fe8..85ba440 100644
--- a/frontend/src/components/modals/RemoveChannelModal.jsx
+++ b/frontend/src/components/modals/RemoveChannelModal.jsx
@@ -1,6 +1,6 @@
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
-import { Button } from 'react-bootstrap';
+import { Modal as BootstrapModal, Button } from 'react-bootstrap';
import { toast } from 'react-toastify';
import { useRemoveChannelMutation } from '../../api/channelsApi';
import { setDefaultChannel, selectCurrentChannelId } from '../../store/slices/channelsSlice';
@@ -29,32 +29,39 @@ const RemoveChannelModal = ({ handleClose }) => {
return (
<>
- {t('modals.text')}
-
-
-
-
+
+
+ {t('modals.removeTitle')}
+
+
+
+ {t('modals.text')}
+
+
+
+
+
>
);
};
diff --git a/frontend/src/components/modals/RenameChannelModal/RenameChannelModal.jsx b/frontend/src/components/modals/RenameChannelModal/RenameChannelModal.jsx
index 7cadade..ff3a10e 100644
--- a/frontend/src/components/modals/RenameChannelModal/RenameChannelModal.jsx
+++ b/frontend/src/components/modals/RenameChannelModal/RenameChannelModal.jsx
@@ -1,7 +1,7 @@
import React, { useEffect, useRef } from 'react';
import { useFormik } from 'formik';
import {
- Form, FormGroup, FormControl, FormLabel, Button,
+ Modal as BootstrapModal, Form, FormGroup, FormControl, FormLabel, Button,
} from 'react-bootstrap';
import { toast } from 'react-toastify';
import filter from 'leo-profanity';
@@ -59,50 +59,59 @@ const RenameChannelModal = ({ handleClose }) => {
});
return (
-
+ <>
+
+
+ {t('modals.renameTitle')}
+
+
+
+
+
+ >
);
};
diff --git a/frontend/src/locales/ru.js b/frontend/src/locales/ru.js
index e4a29ff..671a459 100644
--- a/frontend/src/locales/ru.js
+++ b/frontend/src/locales/ru.js
@@ -50,9 +50,9 @@ const translation = {
connectionError: 'Ошибка соединения',
},
modals: {
- addingChannelTitle: 'Добавить канал',
- removingChannelTitle: 'Удалить канал',
- renamingChannelTitle: 'Переименовать канал',
+ addTitle: 'Добавить канал',
+ removeTitle: 'Удалить канал',
+ renameTitle: 'Переименовать канал',
channelName: 'Имя канала',
cancel: 'Отменить',
send: 'Отправить',