diff --git a/README.md b/README.md index 5ba3861..8de88c8 100644 --- a/README.md +++ b/README.md @@ -2,4 +2,7 @@ [![Actions Status](https://github.com/Tatyana-js/frontend-project-12/actions/workflows/hexlet-check.yml/badge.svg)](https://github.com/Tatyana-js/frontend-project-12/actions) ### link to the site: -(https://github.com/Tatyana-js/frontend-project-12) \ No newline at end of file +(https://github.com/Tatyana-js/frontend-project-12) + +### demo +(https://frontend-chat-ru.hexlet.app/) \ No newline at end of file diff --git a/frontend/src/components/AddModal.jsx b/frontend/src/components/AddModal.jsx index b6a0405..109e047 100644 --- a/frontend/src/components/AddModal.jsx +++ b/frontend/src/components/AddModal.jsx @@ -1,8 +1,9 @@ import { useEffect, useRef } from 'react'; import { useFormik } from 'formik'; import { Modal, FormGroup, FormControl, Button, Form } from 'react-bootstrap'; -import { useSelector, useDispatch } from 'react-redux'; +import { useDispatch } from 'react-redux'; import { useTranslation } from 'react-i18next'; +import { channelSchema } from '../utils/validate.js'; import { useAddChannelMutation } from '../api/chatApi'; import { selectActiveTab } from '../slices/activeChannelSlice.js'; @@ -10,16 +11,17 @@ const AddChannel = ({ onHide }) => { const { t } = useTranslation(); const dispatch = useDispatch(); const [ addChannel ] = useAddChannelMutation(); - const modals = useSelector((state) => state.modals); const formControlEl = useRef(null); const formik = useFormik({ initialValues: { - channelName: '', + name: '', }, + validationSchema: channelSchema(t), + validateOnChange: false, onSubmit: async (values) => { try { - const response = await addChannel({name: values.channelName}); + const response = await addChannel({name: values.name}); dispatch(selectActiveTab(response.data)); onHide(); } catch (error) { @@ -29,10 +31,6 @@ const AddChannel = ({ onHide }) => { } }); - useEffect(() => { - formControlEl.current.focus(); - }, []); - return ( <>
@@ -45,14 +43,18 @@ return (
{t('modal.name')} - + {formik.errors.name && + {formik.errors.name} + }
diff --git a/frontend/src/components/RemoveModel.jsx b/frontend/src/components/RemoveModel.jsx index be7e56e..909ae72 100644 --- a/frontend/src/components/RemoveModel.jsx +++ b/frontend/src/components/RemoveModel.jsx @@ -1,22 +1,20 @@ import { Modal, Button } from 'react-bootstrap'; import { useTranslation } from 'react-i18next'; import { useRemoveChannelMutation } from '../api/chatApi'; -import { useSelector } from 'react-redux'; +import { useSelector, useDispatch } from 'react-redux'; import { selectActiveTab, defaultChannel } from '../slices/activeChannelSlice.js'; const RemoveChannel = ({ onHide }) => { const { t } = useTranslation(); const [ removeChannel ] = useRemoveChannelMutation(); + const dispatch = useDispatch(); const channel = useSelector((state) => state.modals.channel); - // const activeChannel = useSelector(activeChannelSelector); const handleRemove = async (id) => { try { await removeChannel(id); - onHide(); - selectActiveTab(defaultChannel); - console.log(defaultChannel); - + onHide(); + dispatch(selectActiveTab(defaultChannel)); } catch (err) { console.log(err); } diff --git "a/frontend/src/components/\320\241hannels.jsx" "b/frontend/src/components/\320\241hannels.jsx" index f106e10..3e5c874 100644 --- "a/frontend/src/components/\320\241hannels.jsx" +++ "b/frontend/src/components/\320\241hannels.jsx" @@ -40,7 +40,8 @@ return ( {channels.map((channel) => { return ( - {!channel.removable && ()} - {channel.removable && ( + } + {channel.removable &&