diff --git a/package-lock.json b/package-lock.json index fdd7385..71ef235 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "@types/react-redux": "^7.1.24", "@types/react-router": "^5.1.20", "@types/socket.io": "^3.0.2", + "axios": "^1.3.4", "framer-motion": "^7.4.0", "i18next": "^22.4.6", "i18next-browser-languagedetector": "^7.0.1", @@ -4938,6 +4939,29 @@ "node": ">=4" } }, + "node_modules/axios": { + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.4.tgz", + "integrity": "sha512-toYm+Bsyl6VC5wSkfkbbNB6ROv7KY93PEBBL6xyDczaIHasAiv4wPqQ/c4RjoQzipxRD2W5g21cOqQulZ7rHwQ==", + "dependencies": { + "follow-redirects": "^1.15.0", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, + "node_modules/axios/node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/axobject-query": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", @@ -14146,6 +14170,11 @@ "node": ">= 0.10" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", @@ -20942,6 +20971,28 @@ "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.4.3.tgz", "integrity": "sha512-32+ub6kkdhhWick/UjvEwRchgoetXqTK14INLqbGm5U2TzBkBNF3nQtLYm8ovxSkQWArjEQvftCKryjZaATu3w==" }, + "axios": { + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.4.tgz", + "integrity": "sha512-toYm+Bsyl6VC5wSkfkbbNB6ROv7KY93PEBBL6xyDczaIHasAiv4wPqQ/c4RjoQzipxRD2W5g21cOqQulZ7rHwQ==", + "requires": { + "follow-redirects": "^1.15.0", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + }, + "dependencies": { + "form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "requires": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + } + } + } + }, "axobject-query": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", @@ -27447,6 +27498,11 @@ } } }, + "proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", diff --git a/package.json b/package.json index b6136de..340d6d2 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "@types/react-redux": "^7.1.24", "@types/react-router": "^5.1.20", "@types/socket.io": "^3.0.2", + "axios": "^1.3.4", "framer-motion": "^7.4.0", "i18next": "^22.4.6", "i18next-browser-languagedetector": "^7.0.1", diff --git a/public/assets/locales/en/translation.json b/public/assets/locales/en/translation.json index 2e87a6a..6cc5227 100644 --- a/public/assets/locales/en/translation.json +++ b/public/assets/locales/en/translation.json @@ -20,7 +20,7 @@ "popup-control-link": "Link for connection", "popup-control-btn": "Copy", "popup-control-btn-active": "Link Copied", - "language-control-btn": "Language", + "language-control-btn": "English", "exit-control-btn": "Exit", "popup-control-exit-title": "Are you sure you want to end the demo?", "popup-control-yes": "Finish", diff --git a/public/assets/locales/ru/translation.json b/public/assets/locales/ru/translation.json index 5a969a7..11baeaa 100644 --- a/public/assets/locales/ru/translation.json +++ b/public/assets/locales/ru/translation.json @@ -20,7 +20,7 @@ "popup-control-link": "Ссылка для подключения", "popup-control-btn": "Скопировать", "popup-control-btn-active": "Ссылка скопирована", - "language-control-btn": "Язык", + "language-control-btn": "Русский язык", "exit-control-btn": "Выйти", "popup-control-exit-title": "Вы уверены, что хотите закончить демонстрацию??", "popup-control-yes": "Закончить", diff --git a/src/App.css b/src/App.css index afdf2e7..fc141e3 100644 --- a/src/App.css +++ b/src/App.css @@ -11,13 +11,9 @@ display: flex; justify-content: center; align-items: center; - position: absolute; - top: 50%; - left: 50%; border-width: 0px 2px; border-style: solid; border-color: #23242a; - transform: translate(-50%, -50%); } .popup { @@ -51,6 +47,11 @@ border-radius: 16px; } +.popup-container { + display: flex; + justify-content: center; +} + @media screen and (max-width: 1440px) { @@ -73,6 +74,12 @@ } } +@media screen and (max-width: 1024px) { + .card-container { + gap: 10px; + } +} + @media screen and (max-width: 920px) { .card-title { margin: 36px 0 32px 0; diff --git a/src/App.tsx b/src/App.tsx index 92cff59..cb3a381 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -25,12 +25,17 @@ const App: React.FC = () => { const { handleCurrentCard } = cardSlice.actions; const { handleChangeLanguage } = languageSlice.actions; const { cards, currentCard } = useAppSelector((state) => state.cardReducer); + const { currentLang } = useAppSelector((state) => state.languageReducer); + useEffect(() => { - dispatch(fetchCards()); - dispatch(handleChangeLanguage(cookies.get("i18next"))); + dispatch(fetchCards(cookies.get("i18next"))); }, []); + useEffect(() => { + dispatch(fetchCards(cookies.get("i18next"))); + }, [currentLang]) + const handleCards = (card: ICards) => { dispatch(handleCurrentCard(card)); history.push("/connect-page"); @@ -59,8 +64,10 @@ const App: React.FC = () => { {currentCard ? (
-
- +
+
+ +
) : ( @@ -72,7 +79,9 @@ const App: React.FC = () => {
- +
+ +
); diff --git a/src/components/pages/ConnectPage/LoadingPopup/LoadingPopup.tsx b/src/components/pages/ConnectPage/LoadingPopup/LoadingPopup.tsx index 5aa6e3d..bf1b331 100644 --- a/src/components/pages/ConnectPage/LoadingPopup/LoadingPopup.tsx +++ b/src/components/pages/ConnectPage/LoadingPopup/LoadingPopup.tsx @@ -5,9 +5,8 @@ import { useTranslation } from "react-i18next"; import { useAppDispatch, useAppSelector } from "hooks/redux"; -export const LoadingPopup: React.FC = ({ }) => { +export const LoadingPopup: React.FC = ({ logo }) => { - const { currentCard } = useAppSelector((state) => state.cardReducer); const history = useHistory(); const { t } = useTranslation(); @@ -16,7 +15,7 @@ export const LoadingPopup: React.FC = ({ }) => {
- лого + лого
Пожалуйста подождите
diff --git a/src/components/pages/ConnectPage/PopupComponent/PopupComponent.tsx b/src/components/pages/ConnectPage/PopupComponent/PopupComponent.tsx index 6fa1341..18a932a 100644 --- a/src/components/pages/ConnectPage/PopupComponent/PopupComponent.tsx +++ b/src/components/pages/ConnectPage/PopupComponent/PopupComponent.tsx @@ -52,7 +52,7 @@ export const PopupComponent: React.FC = () => { > dispatch(createSession(currentCard.title))} > @@ -65,7 +65,7 @@ export const PopupComponent: React.FC = () => { animate={"show"} exit={"hidden"} > - + )} diff --git a/src/components/pages/Main/Card/Card.tsx b/src/components/pages/Main/Card/Card.tsx index 605f298..708df8a 100644 --- a/src/components/pages/Main/Card/Card.tsx +++ b/src/components/pages/Main/Card/Card.tsx @@ -9,23 +9,21 @@ export const Card: React.FC = ({ item, onClick }) => { console.log(currentLang); return (
onClick()} className="card"> - building + building
- лого + лого
-

{currentLang === "ru" ? item.title_full.ru : item.title_full.en}

-

{currentLang === "ru" ? item.location.ru : item.location.en}

+

{item.app_title}

+

{item.location}

-

{currentLang === "ru" - ? item.description.ru - : item.description.en} +

+ {item.description}

- {item.description_second ?

{currentLang === "ru" - ? item.description_second.ru - : item.description_second.en} + {item.feature_description ?

+ {item.feature_description}

:

}
diff --git a/src/components/pages/Plan/CalendarComponent/CalendarComponent.css b/src/components/pages/Plan/CalendarComponent/CalendarComponent.css index 178d67b..51c393e 100644 --- a/src/components/pages/Plan/CalendarComponent/CalendarComponent.css +++ b/src/components/pages/Plan/CalendarComponent/CalendarComponent.css @@ -28,7 +28,7 @@ } .calendar { - height: 320px; + height: auto; } .calendar-header { @@ -42,6 +42,12 @@ cursor: pointer; } +.calendar-cell_active { + cursor: pointer; + background: rgba(86, 126, 206, 0.2); + +} + .calendar-nav:hover { background: rgba(86, 126, 206, 0.2); } diff --git a/src/components/pages/Plan/CalendarComponent/CalendarComponent.tsx b/src/components/pages/Plan/CalendarComponent/CalendarComponent.tsx index 59bcc6d..2afaa40 100644 --- a/src/components/pages/Plan/CalendarComponent/CalendarComponent.tsx +++ b/src/components/pages/Plan/CalendarComponent/CalendarComponent.tsx @@ -85,7 +85,7 @@ export const CalendarComponent: React.FC = ({ time, pickedTime }) => { return (
-

Выберите

дату.

+

Выберите дату.

= ({ time }) => { + const [error, showError] = useState(false) + const { values, handleChangeState, resetForm, errors, isValid } = + useFormWithValidation(); + const dispatch = useAppDispatch(); const { handleNavigation, handleTimeValue } = planSlice.actions; - const handleValue = (day: moment.Moment) => { - dispatch( - handleNavigation({ - isDone: false, - isCalendar: false, - isTimepicker: true, - isForm: false, - }) - ); - dispatch(handleTimeValue(day)); - }; + useEffect(() => { + resetForm(); + }, [resetForm]); + + + + function handleSubmit(e: React.SyntheticEvent) { + e.preventDefault(); + + } + + const handleReturn = () => { dispatch( @@ -34,8 +42,8 @@ export const Form: React.FC = ({ time }) => { return (
-

- Расскажите

о себе. +

+ Расскажите о себе.

diff --git a/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.css b/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.css index 520beac..562a44c 100644 --- a/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.css +++ b/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.css @@ -1,11 +1,4 @@ -.button-plan { - margin-top: 16px; - margin-bottom: 16px; -} -.plan-title-plan { - margin: 0; -} .timepicker-cell { padding: 9px 18px; diff --git a/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.tsx b/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.tsx index 6d47431..a728548 100644 --- a/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.tsx +++ b/src/components/pages/Plan/TimepickerComponent/TimepickerComponent.tsx @@ -51,7 +51,7 @@ export const TimepickerComponent: React.FC = ({ time }) => { }; return (
-

Выберите

время.

+

Выберите время.

+
+ {open && ( + + + diff --git a/src/components/pages/Stream/PlayerComponent/PlayerComponent.tsx b/src/components/pages/Stream/PlayerComponent/PlayerComponent.tsx index 93088d0..bb66b73 100644 --- a/src/components/pages/Stream/PlayerComponent/PlayerComponent.tsx +++ b/src/components/pages/Stream/PlayerComponent/PlayerComponent.tsx @@ -1,5 +1,5 @@ import "./PlayerStyles.css"; -import React, { useEffect } from "react"; +import React, { useEffect, useState } from "react"; import { useHistory, useParams } from "react-router-dom"; import { Sidebar } from "components/pages/Stream/Sidebar/Sidebar"; @@ -14,6 +14,7 @@ type link = { export const PlayerComponent: React.FC = ({ closeStream }) => { const { id } = useParams(); + const [click, setClick] = useState(false) const dispatch = useAppDispatch(); const { cleanErrors } = sessionSlice.actions; const history = useHistory(); @@ -31,18 +32,23 @@ export const PlayerComponent: React.FC = ({ closeStream }) => { const { url } = useAppSelector((state) => state.sessionReducer); + const exitPopup = () => { + setClick(prev => !prev) + } + return ( <> - + + ); }; diff --git a/src/components/pages/Stream/PopupExit/PopupExit.tsx b/src/components/pages/Stream/PopupExit/PopupExit.tsx index 4f5c0b3..4c8d322 100644 --- a/src/components/pages/Stream/PopupExit/PopupExit.tsx +++ b/src/components/pages/Stream/PopupExit/PopupExit.tsx @@ -1,5 +1,7 @@ import "../PopupShare/sharePopup.css"; import "./PopupExit.css"; +import close from 'images/icons/close.svg' + import { useTranslation } from "react-i18next"; @@ -10,15 +12,12 @@ export const PopupExit: React.FC = ({ setClose, onExit }) => { return (
-
-
-

- {t("popup-control-exit-title")} -

- +
+

+ {t("popup-control-exit-title")} +

+
setClose()} className="icon-close-container"> +
-
-
-

- {t("popup-control-link")} -

- -
-
- {!copy ? ( - - ) : ( - - )} + +
+
+ +
+
+

+ {t("popup-control-invite-title")} +

+
+
+

+ {t("popup-control-link")} +

+ +
+
+ {!copy ? ( + + ) : ( + + )} +
); diff --git a/src/components/pages/Stream/PopupShare/sharePopup.css b/src/components/pages/Stream/PopupShare/sharePopup.css index c2549d4..cbe2665 100644 --- a/src/components/pages/Stream/PopupShare/sharePopup.css +++ b/src/components/pages/Stream/PopupShare/sharePopup.css @@ -1,7 +1,5 @@ .share-popup-container { position: absolute; - display: flex; - flex-direction: column; top: 50%; left: 50%; background: #151619; @@ -10,7 +8,26 @@ width: 400px; color: #ffffff; padding: 40px; +} + +.icon-close-container { + cursor: pointer; + position: absolute; + padding: 8px; + height: 40px; + width: 40px; + box-sizing: border-box; + top: -40px; + right: -40px; + +} + +.popup-container-position { + position: relative; + display: flex; + flex-direction: column; gap: 32px; + } .share-header-popup { diff --git a/src/components/pages/Stream/Sidebar/Sidebar.css b/src/components/pages/Stream/Sidebar/Sidebar.css index 2206512..3182ee8 100644 --- a/src/components/pages/Stream/Sidebar/Sidebar.css +++ b/src/components/pages/Stream/Sidebar/Sidebar.css @@ -110,8 +110,8 @@ position: relative; display: flex; gap: 8px; - padding: 8px; background-color: transparent; + padding: 0; } .toolbar-button-area.hidden { @@ -152,8 +152,8 @@ .toolbar-button { background: transparent; position: relative; - width: 24px; - height: 24px; + width: 40px; + height: 40px; border: none; cursor: pointer; color: #ffffff; @@ -161,7 +161,8 @@ font-size: 14px; justify-content: center; line-height: 17px; - padding: 0px; + box-sizing: border-box; + padding: 8px; } .toolbar-button-active { @@ -575,8 +576,7 @@ } @media screen and (max-height: 700px) { - .toolbar-field { - } + .toolbar-field {} .toolbar-button:hover { @@ -643,4 +643,4 @@ opacity: 0; pointer-events: none; } -} +} \ No newline at end of file diff --git a/src/components/pages/Stream/Sidebar/Sidebar.tsx b/src/components/pages/Stream/Sidebar/Sidebar.tsx index 7526f17..b4df732 100644 --- a/src/components/pages/Stream/Sidebar/Sidebar.tsx +++ b/src/components/pages/Stream/Sidebar/Sidebar.tsx @@ -16,13 +16,18 @@ import { wideSidebarAdminVariants, } from "utils/animationProps"; -export const Sidebar: React.FC = ({ closeStream }) => { +export const Sidebar: React.FC = ({ closeStream, exitPopup }) => { const [open, setOpen] = useState(false); const [popup, setPopup] = useState({ popup1: false, popup2: false, }); + + useEffect(() => { + console.log('test') + }, [exitPopup]) + const isAdmin = true; const [selected, setSelected] = useState(false); @@ -63,6 +68,7 @@ export const Sidebar: React.FC = ({ closeStream }) => { useEffect(() => () => unmountComponent(), []); + function unmountComponent() { setOpen(false); setPopup({ @@ -81,6 +87,7 @@ export const Sidebar: React.FC = ({ closeStream }) => { return ( <> /// closeSideBar()} initial={false} animate={open ? "open" : "closed"} variants={wideSidebar ? setAnimation() : sidebarVariants} @@ -162,3 +169,7 @@ export const Sidebar: React.FC = ({ closeStream }) => { ); }; +function getElementById(arg0: string) { + throw new Error("Function not implemented."); +} + diff --git a/src/components/shared/Button/Button.tsx b/src/components/shared/Button/Button.tsx index a6a5dda..ad576cb 100644 --- a/src/components/shared/Button/Button.tsx +++ b/src/components/shared/Button/Button.tsx @@ -8,7 +8,7 @@ import { animationButton } from "utils/animationProps"; import { useAppSelector } from "hooks/redux"; export const Button: React.FC = ({ button, active, isSidebarWide }) => { - + const [hover, setHover] = useState(false); const { currentLang } = useAppSelector((state) => state.languageReducer); @@ -27,11 +27,7 @@ export const Button: React.FC = ({ button, active, isSidebarWide }) => { : "toolbar-button" } > - {button.type === "language" ? ( - {currentLang.toUpperCase()} - ) : ( - icon - )} + icon { - const [open, setOpen] = useState(false); - const [menuOpen, setMenuOpen] = useState(false); - const [opacity, setOpacity] = useState(false); + const buttons = [{ + icon: ru, value: "ru" + }, { icon: en, value: "en" }] const location = useLocation(); const { handleChangeLanguage } = languageSlice.actions; const { currentLang } = useAppSelector((state) => state.languageReducer); const dispatch = useAppDispatch(); - function handleUpdateLanguage(value: string) { - dispatch(handleChangeLanguage(value)); - setOpen((prev) => !prev); - } - - function handleOpen() { - setOpen((prev) => !prev); - } - - function handleOpacity() { - setOpacity(true); - } - - const style = { - background: "rgba(235, 235, 235, 0.2", - }; - - const iconTransform = { - transform: "rotate(-90deg)", - } as CSSProperties; - - const setBackground = opacity && (!open as boolean); - - function setOpacityAndMenu() { - setMenuOpen(true); - const targetElement = document.querySelector("body") as HTMLElement; - targetElement.style.overflow = "hidden"; - } - - function openMenu() { - setMenuOpen(false); - const targetElement = document.querySelector("body") as HTMLElement; - targetElement.style.overflow = "visible"; - } return ( -
-
- company-logo - -
-
- img -
-
setOpacity(false)} - onClick={handleOpen} - className=" header-lang-button-picked" - > - {currentLang.toLocaleUpperCase()} -
-
- {currentLang === "ru" ? ( - - ) : ( - - )} -
-
+
+ company-logo + +
+ {buttons.map((item, index) => ( + ))}
-
+ ); }; diff --git a/src/components/shared/Header/logoIcon.svg b/src/components/shared/Header/logoIcon.svg index a2e86e1..21b0f36 100644 --- a/src/components/shared/Header/logoIcon.svg +++ b/src/components/shared/Header/logoIcon.svg @@ -1,13 +1,13 @@ - - - - - - - - - - - - + + + + + + + + + + + + diff --git a/src/hooks/useFormWithValidation.tsx b/src/hooks/useFormWithValidation.tsx new file mode 100644 index 0000000..d5bde23 --- /dev/null +++ b/src/hooks/useFormWithValidation.tsx @@ -0,0 +1,38 @@ +import { useState, useCallback } from 'react'; + +interface IForm { + name: string; + email: string +} + +export default function useFormWithValidation() { + const [values, setValues] = useState({ + name: "", + email: "" + }); + const [errors, setErrors] = useState({ + name: "", + email: "" + }); + const [isValid, setIsValid] = useState(false); + + const handleChangeState = (event: React.ChangeEvent) => { + const target = event.target; + const name = target.name; + const value = target.value; + setValues({ ...values, [name]: value }); + setErrors({ ...errors, [name]: target.validationMessage }); + setIsValid(target.closest("form").checkValidity()); + }; + + const resetForm = useCallback( + (newValues = { name: "", email: "" }, newIsValid = false) => { + setValues(newValues); + setErrors(newValues); + setIsValid(newIsValid); + }, + [setValues, setErrors, setIsValid] + ); + + return { values, handleChangeState, errors, isValid, resetForm }; +} \ No newline at end of file diff --git a/src/images/icons/EN.svg b/src/images/icons/EN.svg new file mode 100644 index 0000000..e9e4b79 --- /dev/null +++ b/src/images/icons/EN.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/images/icons/RU.svg b/src/images/icons/RU.svg new file mode 100644 index 0000000..eee0b13 --- /dev/null +++ b/src/images/icons/RU.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/images/icons/close.svg b/src/images/icons/close.svg index b96243a..e5d0ae5 100644 --- a/src/images/icons/close.svg +++ b/src/images/icons/close.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/index.css b/src/index.css index ce98bf8..1784f20 100644 --- a/src/index.css +++ b/src/index.css @@ -48,16 +48,16 @@ button { @media screen and (max-width: 1024px) { .main { width: 100%; - margin: 0 auto; - gap: 0; + margin: 0 12px; } } @media screen and (max-width: 920px) { .main { - width: 100%; gap: 0; padding: 0 20px; + margin: 0 auto; + } } diff --git a/src/models/ICards.ts b/src/models/ICards.ts index 7ca94ec..16c9513 100644 --- a/src/models/ICards.ts +++ b/src/models/ICards.ts @@ -1,25 +1,11 @@ export interface ICards { - _id: string; - description: { - en: string; - ru: string; - }; - description_second?: { - en: string; - ru: string; - }; - image: { - logo: string; - perview: string; - }; - location: { - en: string; - ru: string; - }; + app_title: string; title: string; - - title_full: { - en: string; - ru: string; - }; + language: string; + location: string; + feature_description: string; + icon: string; + logo: string; + preview: string; + _id: string; } diff --git a/src/store/reducers/ActionCreator.ts b/src/store/reducers/ActionCreator.ts index 75f4248..665d1ea 100644 --- a/src/store/reducers/ActionCreator.ts +++ b/src/store/reducers/ActionCreator.ts @@ -1,29 +1,38 @@ import { createAsyncThunk } from "@reduxjs/toolkit"; -import MainApi from "../../utils/api"; -const api = new MainApi("https://a1.coord.graff.tech"); +import axios from 'axios'; + +const instance = axios.create({ + baseURL: 'https://a1.test.coord.graff.tech', +}); + +instance.defaults.headers.post['Content-Type'] = 'application/json'; + export const fetchCards = createAsyncThunk( "cards/FetchAll", - async (_, thunkAPI) => { + async (language: string, thunkAPI) => { try { - const response = await api.getRC(); - return response; - } catch (e) { - return thunkAPI.rejectWithValue("Нет доступных демонстраций"); + const { data } = await instance.get('/title/get_for_language/', { params: { start: 0, count: 100, language: language } }); + return data; + } catch (e: any) { + const { response } = e + return thunkAPI.rejectWithValue(response.data.message); } + } ); + export const createSession = createAsyncThunk( "session/Create", async (title: string, thunkApi) => { try { - const response = await api.createSession(title); - return response; + const { data } = await instance.post('/session/create', { title }); + return data; } catch (e: any) { - console.log(e) - return thunkApi.rejectWithValue(e); + const { response } = e + return thunkApi.rejectWithValue(response.data.message); } } ); @@ -32,10 +41,11 @@ export const connectSession = createAsyncThunk( "session/Connect", async (code: string, thunkApi) => { try { - const response = await api.connectSession(code); - return response; - } catch (e) { - return thunkApi.rejectWithValue('Error'); + const { data } = await instance.get('/session/connect', { params: { session_id: code } }); + return data; + } catch (e: any) { + const { response } = e + return thunkApi.rejectWithValue(response.data.message); } } ); diff --git a/src/store/reducers/languageSlice.ts b/src/store/reducers/languageSlice.ts index 979822e..d815c04 100644 --- a/src/store/reducers/languageSlice.ts +++ b/src/store/reducers/languageSlice.ts @@ -1,12 +1,14 @@ import { createSlice, PayloadAction } from "@reduxjs/toolkit"; import i18next from "i18next"; +import cookies from "js-cookie"; + interface LanguageState { currentLang: string; } const initialState: LanguageState = { - currentLang: '', + currentLang: cookies.get("i18next"), }; export const languageSlice = createSlice({ diff --git a/src/store/reducers/planSlice.ts b/src/store/reducers/planSlice.ts index abc56cd..1d106f0 100644 --- a/src/store/reducers/planSlice.ts +++ b/src/store/reducers/planSlice.ts @@ -10,6 +10,11 @@ interface IState { isDone: boolean; } +interface IForm { + name: string, + value: string | number +} + export interface planState { time: Moment; isCalendar: boolean; @@ -18,10 +23,12 @@ export interface planState { isDone: boolean; email: string; name: string; + currTime: Moment | null } const initialState: planState = { time: moment.default(), + currTime: null, isCalendar: true, isTimepicker: false, isForm: false, @@ -42,8 +49,9 @@ export const planSlice = createSlice({ }, handleTimeValue(state, action: PayloadAction) { - state.time = action.payload; + state.currTime = action.payload; }, + }, }); diff --git a/src/styles/styles.css b/src/styles/styles.css index 5e0a822..71eccbb 100644 --- a/src/styles/styles.css +++ b/src/styles/styles.css @@ -130,4 +130,10 @@ h3 { font-size: 38px; line-height: 100%; color: #F2F2F2; +} + +.button-primary:disabled { + cursor: default; + pointer-events: none; + opacity: 0.5; } \ No newline at end of file