убрала удвоение шапки и сайдбара(нужна доработка)

This commit is contained in:
Tamara 2024-01-04 01:55:01 +03:00
parent ea4c238813
commit f1abade62b
7 changed files with 496 additions and 304 deletions

@ -101,20 +101,41 @@ export function useUserAccountFetcher({
dayjs.locale("ru"); dayjs.locale("ru");
const routeslink = [ const routeslink = [
{ path: "/list", page: <MyQuizzesFull />, header: false, sidebar: false },
{ {
path: "/questions/:quizId", path: "/list",
page: <QuestionsPage />, page: <MyQuizzesFull />,
header: false,
sidebar: false,
footer: false,
},
{
path: "/tariffs",
page: <Tariffs />,
header: true,
sidebar: false,
footer: false,
},
{
path: "/edit",
page: <EditPage />,
header: true, header: true,
sidebar: true, sidebar: true,
footer: true,
},
{
path: "/view",
page: <ViewPage />,
header: false,
sidebar: false,
footer: false,
},
{
path: "/design",
page: <DesignPage />,
header: true,
sidebar: true,
footer: true,
}, },
{ path: "/contacts", page: <ContactFormPage />, header: true, sidebar: true },
{ path: "/result", page: <Result />, header: true, sidebar: true },
{ path: "/settings", page: <ResultSettings />, header: true, sidebar: true },
{ path: "/tariffs", page: <Tariffs />, header: true, sidebar: false },
{ path: "/edit", page: <EditPage />, header: true, sidebar: true },
{ path: "/view", page: <ViewPage />, header: false, sidebar: false },
{ path: "/design", page: <DesignPage />, header: true, sidebar: true },
] as const; ] as const;
export default function App() { export default function App() {

@ -82,13 +82,13 @@ export const DesignPage = () => {
); );
return ( return (
<> <>
<Header setMobileSidebar={setMobileSidebar} /> {/*<Header setMobileSidebar={setMobileSidebar} />*/}
<Box sx={{ display: "flex", flexDirection: isMobile ? "column" : "row" }}> <Box sx={{ display: "flex", flexDirection: isMobile ? "column" : "row" }}>
{isMobile ? ( {/*{isMobile ? (*/}
<SidebarMobile open={mobileSidebar} changePage={changePage} /> {/* <SidebarMobile open={mobileSidebar} changePage={changePage} />*/}
) : ( {/*) : (*/}
<Sidebar changePage={changePage} /> {/* <Sidebar changePage={changePage} />*/}
)} {/*)}*/}
<DesignFilling /> <DesignFilling />
{createPortal(<QuizPreview />, document.body)} {createPortal(<QuizPreview />, document.body)}
</Box> </Box>

@ -4,13 +4,13 @@ import { useEffect, useState } from "react";
import type { GetTariffsResponse } from "@model/tariff"; import type { GetTariffsResponse } from "@model/tariff";
import { import {
Box, Box,
Button, Button,
Modal, Modal,
Paper, Paper,
Typography, Typography,
useMediaQuery, useMediaQuery,
useTheme, useTheme,
} from "@mui/material"; } from "@mui/material";
import { enqueueSnackbar } from "notistack"; import { enqueueSnackbar } from "notistack";
import { Tariff, getMessageFromFetchError } from "@frontend/kitui"; import { Tariff, getMessageFromFetchError } from "@frontend/kitui";
@ -18,184 +18,191 @@ import { withErrorBoundary } from "react-error-boundary";
import { createTariffElements } from "./tariffsUtils/createTariffElements"; import { createTariffElements } from "./tariffsUtils/createTariffElements";
function TariffPage() { function TariffPage() {
const theme = useTheme(); const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.down(1000)); const isTablet = useMediaQuery(theme.breakpoints.down(1000));
const location = useLocation(); const location = useLocation();
const navigate = useNavigate(); const navigate = useNavigate();
const [tariffs, setTariffs] = useState(); const [tariffs, setTariffs] = useState();
const [user, setUser] = useState(); const [user, setUser] = useState();
const [discounts, setDiscounts] = useState(); const [discounts, setDiscounts] = useState();
const [cartTariffMap, setCartTariffMap] = useState(); const [cartTariffMap, setCartTariffMap] = useState();
const [openModal, setOpenModal] = useState({}); const [openModal, setOpenModal] = useState({});
useEffect(() => { useEffect(() => {
const get = async () => { const get = async () => {
const user = await makeRequest({ const user = await makeRequest({
method: "GET", method: "GET",
url: "https://squiz.pena.digital/customer/account", url: "https://squiz.pena.digital/customer/account",
}); });
const tariffs = await makeRequest<never, GetTariffsResponse>({ const tariffs = await makeRequest<never, GetTariffsResponse>({
method: "GET", method: "GET",
url: "https://squiz.pena.digital/strator/tariff?page=1&limit=100", url: "https://squiz.pena.digital/strator/tariff?page=1&limit=100",
}); });
const discounts = await makeRequest({ const discounts = await makeRequest({
method: "GET", method: "GET",
url: "https://squiz.pena.digital/price/discounts", url: "https://squiz.pena.digital/price/discounts",
}); });
setUser(user); setUser(user);
setTariffs(tariffs); setTariffs(tariffs);
setDiscounts(discounts.Discounts); setDiscounts(discounts.Discounts);
};
get();
}, []);
if (!user || !tariffs || !discounts) return <LoadingPage />;
console.log("user ", user);
console.log("tariffs ", tariffs);
console.log("discounts ", discounts);
const openModalHC = (tariffInfo: any) => setOpenModal(tariffInfo);
const tryBuy = async ({ id, price }: { id: string, price: number }) => {
openModalHC({})
//Если в корзине что-то было - выкладываем содержимое и запоминаем чо там лежало
if (user.cart.length > 0) {
outCart(user.cart)
}
//Если нам хватает денежек - покупаем тариф
if (price <= user.wallet.cash) {
try {
await makeRequest({
method: "POST",
url: "https://suiz.pena.digital/customer/cart/pay"
})
} catch (e) {
enqueueSnackbar("Произошла ошибка. Попробуйте позже")
}
//Развращаем товары в корзину
inCart()
} else {
//Деняк не хватило
navigate("https://hub.pena.digital/wallet?action=squizpay")
}
}; };
get();
}, []);
const purchasesAmount = user?.wallet.purchasesAmount ?? 0; if (!user || !tariffs || !discounts) return <LoadingPage />;
const isUserNko = user?.status === "nko";
const filteredTariffs = tariffs.tariffs.filter((tariff) => {
return (
tariff.privileges[0].serviceKey === "squiz" &&
!tariff.isDeleted &&
!tariff.isCustom
);
});
console.log("user ", user);
console.log("tariffs ", tariffs);
console.log("discounts ", discounts);
const openModalHC = (tariffInfo: any) => setOpenModal(tariffInfo);
const tryBuy = async ({ id, price }: { id: string; price: number }) => {
openModalHC({});
//Если в корзине что-то было - выкладываем содержимое и запоминаем чо там лежало
if (user.cart.length > 0) {
outCart(user.cart);
}
//Если нам хватает денежек - покупаем тариф
if (price <= user.wallet.cash) {
try {
await makeRequest({
method: "POST",
url: "https://suiz.pena.digital/customer/cart/pay",
});
} catch (e) {
enqueueSnackbar("Произошла ошибка. Попробуйте позже");
}
//Развращаем товары в корзину
inCart();
} else {
//Деняк не хватило
navigate("https://hub.pena.digital/wallet?action=squizpay");
}
};
const purchasesAmount = user?.wallet.purchasesAmount ?? 0;
const isUserNko = user?.status === "nko";
const filteredTariffs = tariffs.tariffs.filter((tariff) => {
return ( return (
<> tariff.privileges[0].serviceKey === "squiz" &&
<Box !tariff.isDeleted &&
sx={{ !tariff.isCustom
justifyContent: "left",
mt: "40px",
mb: "30px",
display: "grid",
gap: "40px",
gridTemplateColumns: `repeat(auto-fit, minmax(300px, ${isTablet ? "436px" : "360px"
}))`,
}}
>
{createTariffElements(
filteredTariffs,
true,
user,
discounts,
openModalHC,
)}
</Box>
<Modal
open={Object.values(openModal).length > 0}
onClose={() => setOpenModal({})}
>
<Paper
sx={{
position: "absolute" as "absolute",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
boxShadow: 24,
p: 4,
display: "flex",
justifyContent: "center",
flexDirection: "column"
}}>
<Typography id="modal-modal-title" variant="h6" component="h2" mb="20px">
Вы подтверждаете платёж в сумму {openModal.price}
</Typography>
<Button variant="contained" onClick={() => tryBuy(openModal)}>купить</Button>
</Paper>
</Modal>
</>
); );
});
return (
<>
<Box
sx={{
justifyContent: "left",
mt: "40px",
mb: "30px",
display: "grid",
gap: "40px",
gridTemplateColumns: `repeat(auto-fit, minmax(300px, ${
isTablet ? "436px" : "360px"
}))`,
}}
>
{createTariffElements(
filteredTariffs,
true,
user,
discounts,
openModalHC,
)}
</Box>
<Modal
open={Object.values(openModal).length > 0}
onClose={() => setOpenModal({})}
>
<Paper
sx={{
position: "absolute" as "absolute",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
boxShadow: 24,
p: 4,
display: "flex",
justifyContent: "center",
flexDirection: "column",
}}
>
<Typography
id="modal-modal-title"
variant="h6"
component="h2"
mb="20px"
>
Вы подтверждаете платёж в сумму {openModal.price}
</Typography>
<Button variant="contained" onClick={() => tryBuy(openModal)}>
купить
</Button>
</Paper>
</Modal>
</>
);
} }
export default withErrorBoundary(TariffPage, { export default withErrorBoundary(TariffPage, {
fallback: ( fallback: (
<Typography mt="8px" textAlign="center"> <Typography mt="8px" textAlign="center">
Ошибка загрузки тарифов Ошибка загрузки тарифов
</Typography> </Typography>
), ),
onError: () => { }, onError: () => {},
}); });
const LoadingPage = () => ( const LoadingPage = () => (
<Box <Box
sx={{ sx={{
height: "100%", height: "100%",
display: "flex", display: "flex",
alignItems: "center", alignItems: "center",
justifyContent: "center", justifyContent: "center",
}} }}
> >
<Typography sx={{ textAlign: "center" }}> <Typography sx={{ textAlign: "center" }}>
{"Подождите, пожалуйста, идёт загрузка :)"} {"Подождите, пожалуйста, идёт загрузка :)"}
</Typography> </Typography>
</Box> </Box>
); );
const inCart = () => { const inCart = () => {
let saveCart = JSON.parse(localStorage.getItem("saveCart") || "[]") let saveCart = JSON.parse(localStorage.getItem("saveCart") || "[]");
saveCart.forEach(async (id: string) => { saveCart.forEach(async (id: string) => {
try { try {
await makeRequest({ await makeRequest({
method: "PATCH", method: "PATCH",
url: `https://hub.pena.digital/customer/cart?id=${id}` url: `https://hub.pena.digital/customer/cart?id=${id}`,
}) });
let index = saveCart.indexOf('green'); let index = saveCart.indexOf("green");
if (index !== -1) { if (index !== -1) {
saveCart.splice(index, 1); saveCart.splice(index, 1);
} }
localStorage.setItem("saveCart", JSON.stringify(saveCart)) localStorage.setItem("saveCart", JSON.stringify(saveCart));
} catch (e) { } catch (e) {
console.log("Я не смог добавить тариф в корзину :( " + id) console.log("Я не смог добавить тариф в корзину :( " + id);
} }
}) });
} };
const outCart = (cart: string[]) => { const outCart = (cart: string[]) => {
//Сделаем муторно и подольше, зато при прерывании сессии данные потеряются минимально //Сделаем муторно и подольше, зато при прерывании сессии данные потеряются минимально
cart.forEach(async (id: string) => { cart.forEach(async (id: string) => {
try { try {
await makeRequest({ await makeRequest({
method: "DELETE", method: "DELETE",
url: `https://suiz.pena.digital/customer/cart?id=${id}` url: `https://suiz.pena.digital/customer/cart?id=${id}`,
}) });
let saveCart = JSON.parse(localStorage.getItem("saveCart") || "[]") let saveCart = JSON.parse(localStorage.getItem("saveCart") || "[]");
saveCart = saveCart.push(id) saveCart = saveCart.push(id);
localStorage.setItem("saveCart", JSON.stringify(saveCart)) localStorage.setItem("saveCart", JSON.stringify(saveCart));
} catch (e) { } catch (e) {
console.log("Я не смог удалить из корзины тариф :(") console.log("Я не смог удалить из корзины тариф :(");
} }
}) });
} };

@ -46,7 +46,8 @@ export const createTariffElements = (
} }
buttonProps={{ buttonProps={{
text: "Выбрать", text: "Выбрать",
onClick: () => onclick({id: tariff._id, price: priceBeforeDiscounts / 100}), onClick: () =>
onclick({ id: tariff._id, price: priceBeforeDiscounts / 100 }),
}} }}
headerText={tariff.name} headerText={tariff.name}
text={tariff.privileges.map((p) => `${p.name} - ${p.amount}`)} text={tariff.privileges.map((p) => `${p.name} - ${p.amount}`)}

@ -1,39 +1,202 @@
import Header from "@ui_kit/Header/Header"; import { Header } from "../../src/pages/startPage/Header";
import Sidebar from "@ui_kit/Sidebar"; import Sidebar from "@ui_kit/Sidebar";
import Box from "@mui/material/Box"; import Box from "@mui/material/Box";
import { useTheme, useMediaQuery } from "@mui/material"; import { useTheme, useMediaQuery } from "@mui/material";
import HeaderFull from "@ui_kit/Header/HeaderFull"; import HeaderFull from "@ui_kit/Header/HeaderFull";
import { useState } from "react";
import { SidebarMobile } from "./startPage/Sidebar/SidebarMobile";
import { setShowConfirmLeaveModal } from "@root/uiTools/actions";
import { setCurrentStep } from "@root/quizes/actions";
import { useQuizStore } from "@root/quizes/store";
import { SmallSwitchQuestionListGraph } from "@ui_kit/Toolbars/SmallSwitchQuestionListGraph";
import { PanelSwitchQuestionListGraph } from "@ui_kit/Toolbars/PanelSwitchQuestionListGraph";
import { ButtonTestPublication } from "@ui_kit/Toolbars/ButtonTestPublication";
import { ButtonRecallQuiz } from "@ui_kit/Toolbars/ButtonRecallQuiz";
import { Link } from "react-router-dom";
import { LinkSimple } from "@icons/LinkSimple";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { deleteTimeoutedQuestions } from "@utils/deleteTimeoutedQuestions";
import { useQuestionsStore } from "@root/questions/store";
interface Props { interface Props {
sidebar: boolean; sidebar: boolean;
header?: boolean; header?: boolean;
footer?: boolean;
page: JSX.Element; page: JSX.Element;
} }
export default function Main({ sidebar, header, page }: Props) { export default function Main({ sidebar, header, footer, page }: Props) {
const theme = useTheme(); const theme = useTheme();
const quiz = useCurrentQuiz();
const quizConfig = quiz?.config;
const { questions } = useQuestionsStore();
const currentStep = useQuizStore((state) => state.currentStep);
const isMobile = useMediaQuery(theme.breakpoints.down(600)); const isMobile = useMediaQuery(theme.breakpoints.down(600));
const isMobileSm = useMediaQuery(theme.breakpoints.down(370));
const isBranchingLogic = useMediaQuery(theme.breakpoints.down(1100));
const isLinkButton = useMediaQuery(theme.breakpoints.down(708));
const [mobileSidebar, setMobileSidebar] = useState<boolean>(false);
const [nextStep, setNextStep] = useState<number>(0);
const [openBranchingPage, setOpenBranchingPage] = useState<boolean>(false);
const openBranchingPageHC = () => {
if (!openBranchingPage) {
deleteTimeoutedQuestions(questions, quiz);
}
setOpenBranchingPage((old) => !old);
};
const isConditionMet =
[1].includes(currentStep) && quizConfig.type !== "form";
const changePage = (index: number) => {
if (currentStep === 2) {
setNextStep(index);
setShowConfirmLeaveModal(true);
return;
}
setCurrentStep(index);
};
return ( return (
<> <>
{header ? <Header /> : <HeaderFull />} {header ? <Header setMobileSidebar={setMobileSidebar} /> : <HeaderFull />}
<Box <Box
sx={{ sx={{
display: "flex", display: "flex",
flexDirection: isMobile ? "column" : "row",
}} }}
> >
{sidebar ? <Sidebar /> : <></>} {sidebar ? (
<>
{isMobile ? (
<SidebarMobile open={mobileSidebar} changePage={changePage} />
) : (
<Sidebar changePage={changePage} />
)}
</>
) : (
<></>
)}
<Box <Box
sx={{ sx={{
background: theme.palette.background.default,
width: "100%", width: "100%",
padding: isMobile ? "15px" : "25px",
height: "calc(100vh - 80px)", height: "calc(100vh - 80px)",
overflow: "auto", padding: isMobile ? "15px" : "25px",
boxSizing: "border-box",
}} }}
> >
{page} <Box
sx={{
background: theme.palette.background.default,
width: "100%",
// padding: isMobile ? "15px" : "25px",
// height: "calc(100vh - 80px)",
overflow: "auto",
boxSizing: "border-box",
}}
>
{page}
</Box>
{footer ? (
<Box
sx={{
width: "100%",
padding: isMobile ? "20px 16px" : "20px 20px",
display: "flex",
justifyContent: isMobile
? isMobileSm
? "center"
: "flex-end"
: "flex-start",
flexDirection: isMobile ? "row-reverse" : "-moz-initial",
alignItems: "center",
gap: "15px",
background: "#FFF",
borderTop: "#f2f3f7 2px solid",
}}
>
{isConditionMet &&
(isBranchingLogic ? (
<SmallSwitchQuestionListGraph
openBranchingPage={openBranchingPage}
setOpenBranchingPage={openBranchingPageHC}
/>
) : (
<PanelSwitchQuestionListGraph
openBranchingPage={openBranchingPage}
setOpenBranchingPage={openBranchingPageHC}
hideText
/>
))}
{/* Кнопка тестового просмотра */}
<ButtonTestPublication />
{/* Кнопка отозвать */}
<ButtonRecallQuiz />
{/* Ссылка */}
{quiz?.status === "start" &&
(!isLinkButton ? (
<Box
component={Link}
sx={{
whiteSpace: "nowrap",
textOverflow: "ellipsis",
overflow: "hidden",
display: isMobile ? "none" : "block",
color: "#7E2AEA",
fontSize: "14px",
}}
target="_blank"
to={"https://hbpn.link/" + quiz.qid}
>
https://hbpn.link/{quiz.qid}
</Box>
) : (
<Box
component={Link}
sx={{
cursor: "pointer",
minWidth: "34px",
height: "34px",
color: "#7E2AEA",
fontSize: "14px",
display: isMobile ? "none" : "flex",
justifyContent: "center",
alignItems: "Center",
background: "#EEE4FC",
borderRadius: "8px",
}}
target="_blank"
to={"https://hbpn.link/" + quiz.qid}
>
<LinkSimple />
</Box>
))}
{/* Маленькая кнопка ссылки */}
{isMobile && quiz?.status === "start" && (
<Box
component={Link}
sx={{
cursor: "pointer",
width: "34px",
height: "34px",
color: "#7E2AEA",
fontSize: "14px",
display: "flex",
justifyContent: "center",
alignItems: "Center",
background: "#EEE4FC",
borderRadius: "8px",
}}
target="_blank"
to={"https://hbpn.link/" + quiz.qid}
>
<LinkSimple />
</Box>
)}
</Box>
) : (
<></>
)}
</Box> </Box>
</Box> </Box>
</> </>

@ -157,7 +157,7 @@ export default function EditPage() {
return ( return (
<> <>
<Header setMobileSidebar={setMobileSidebar} /> {/*<Header setMobileSidebar={setMobileSidebar} />*/}
<Box <Box
sx={{ sx={{
@ -165,11 +165,11 @@ export default function EditPage() {
position: "relative", position: "relative",
}} }}
> >
{isMobile ? ( {/*{isMobile ? (*/}
<SidebarMobile open={mobileSidebar} changePage={changePage} /> {/* <SidebarMobile open={mobileSidebar} changePage={changePage} />*/}
) : ( {/*) : (*/}
<Sidebar changePage={changePage} /> {/* <Sidebar changePage={changePage} />*/}
)} {/*)}*/}
<Box <Box
sx={{ sx={{
@ -208,102 +208,102 @@ export default function EditPage() {
)} )}
</Box> </Box>
<Box {/*<Box*/}
sx={{ {/* sx={{*/}
width: "100%", {/* width: "100%",*/}
padding: isMobile ? "20px 16px" : "20px 20px", {/* padding: isMobile ? "20px 16px" : "20px 20px",*/}
display: "flex", {/* display: "flex",*/}
justifyContent: isMobile {/* justifyContent: isMobile*/}
? isMobileSm {/* ? isMobileSm*/}
? "center" {/* ? "center"*/}
: "flex-end" {/* : "flex-end"*/}
: "flex-start", {/* : "flex-start",*/}
flexDirection: isMobile ? "row-reverse" : "-moz-initial", {/* flexDirection: isMobile ? "row-reverse" : "-moz-initial",*/}
alignItems: "center", {/* alignItems: "center",*/}
gap: "15px", {/* gap: "15px",*/}
background: "#FFF", {/* background: "#FFF",*/}
borderTop: "#f2f3f7 2px solid", {/* borderTop: "#f2f3f7 2px solid",*/}
}} {/* }}*/}
> {/*>*/}
{isConditionMet && {/* {isConditionMet &&*/}
(isBranchingLogic ? ( {/* (isBranchingLogic ? (*/}
<SmallSwitchQuestionListGraph {/* <SmallSwitchQuestionListGraph*/}
openBranchingPage={openBranchingPage} {/* openBranchingPage={openBranchingPage}*/}
setOpenBranchingPage={openBranchingPageHC} {/* setOpenBranchingPage={openBranchingPageHC}*/}
/> {/* />*/}
) : ( {/* ) : (*/}
<PanelSwitchQuestionListGraph {/* <PanelSwitchQuestionListGraph*/}
openBranchingPage={openBranchingPage} {/* openBranchingPage={openBranchingPage}*/}
setOpenBranchingPage={openBranchingPageHC} {/* setOpenBranchingPage={openBranchingPageHC}*/}
hideText {/* hideText*/}
/> {/* />*/}
))} {/* ))}*/}
{/* Кнопка тестового просмотра */} {/* /!* Кнопка тестового просмотра *!/*/}
<ButtonTestPublication /> {/* <ButtonTestPublication />*/}
{/* Кнопка отозвать */} {/* /!* Кнопка отозвать *!/*/}
<ButtonRecallQuiz /> {/* <ButtonRecallQuiz />*/}
{/* Ссылка */} {/* /!* Ссылка *!/*/}
{quiz?.status === "start" && {/* {quiz?.status === "start" &&*/}
(!isLinkButton ? ( {/* (!isLinkButton ? (*/}
<Box {/* <Box*/}
component={Link} {/* component={Link}*/}
sx={{ {/* sx={{*/}
whiteSpace: "nowrap", {/* whiteSpace: "nowrap",*/}
textOverflow: "ellipsis", {/* textOverflow: "ellipsis",*/}
overflow: "hidden", {/* overflow: "hidden",*/}
display: isMobile ? "none" : "block", {/* display: isMobile ? "none" : "block",*/}
color: "#7E2AEA", {/* color: "#7E2AEA",*/}
fontSize: "14px", {/* fontSize: "14px",*/}
}} {/* }}*/}
target="_blank" {/* target="_blank"*/}
to={"https://hbpn.link/" + quiz.qid} {/* to={"https://hbpn.link/" + quiz.qid}*/}
> {/* >*/}
https://hbpn.link/{quiz.qid} {/* https://hbpn.link/{quiz.qid}*/}
</Box> {/* </Box>*/}
) : ( {/* ) : (*/}
<Box {/* <Box*/}
component={Link} {/* component={Link}*/}
sx={{ {/* sx={{*/}
cursor: "pointer", {/* cursor: "pointer",*/}
minWidth: "34px", {/* minWidth: "34px",*/}
height: "34px", {/* height: "34px",*/}
color: "#7E2AEA", {/* color: "#7E2AEA",*/}
fontSize: "14px", {/* fontSize: "14px",*/}
display: isMobile ? "none" : "flex", {/* display: isMobile ? "none" : "flex",*/}
justifyContent: "center", {/* justifyContent: "center",*/}
alignItems: "Center", {/* alignItems: "Center",*/}
background: "#EEE4FC", {/* background: "#EEE4FC",*/}
borderRadius: "8px", {/* borderRadius: "8px",*/}
}} {/* }}*/}
target="_blank" {/* target="_blank"*/}
to={"https://hbpn.link/" + quiz.qid} {/* to={"https://hbpn.link/" + quiz.qid}*/}
> {/* >*/}
<LinkSimple /> {/* <LinkSimple />*/}
</Box> {/* </Box>*/}
))} {/* ))}*/}
{/* Маленькая кнопка ссылки */} {/* /!* Маленькая кнопка ссылки *!/*/}
{isMobile && quiz?.status === "start" && ( {/* {isMobile && quiz?.status === "start" && (*/}
<Box {/* <Box*/}
component={Link} {/* component={Link}*/}
sx={{ {/* sx={{*/}
cursor: "pointer", {/* cursor: "pointer",*/}
width: "34px", {/* width: "34px",*/}
height: "34px", {/* height: "34px",*/}
color: "#7E2AEA", {/* color: "#7E2AEA",*/}
fontSize: "14px", {/* fontSize: "14px",*/}
display: "flex", {/* display: "flex",*/}
justifyContent: "center", {/* justifyContent: "center",*/}
alignItems: "Center", {/* alignItems: "Center",*/}
background: "#EEE4FC", {/* background: "#EEE4FC",*/}
borderRadius: "8px", {/* borderRadius: "8px",*/}
}} {/* }}*/}
target="_blank" {/* target="_blank"*/}
to={"https://hbpn.link/" + quiz.qid} {/* to={"https://hbpn.link/" + quiz.qid}*/}
> {/* >*/}
<LinkSimple /> {/* <LinkSimple />*/}
</Box> {/* </Box>*/}
)} {/* )}*/}
</Box> {/*</Box>*/}
</Box> </Box>
</Box> </Box>

@ -80,12 +80,12 @@ export const Header = ({ setMobileSidebar }: HeaderProps) => {
</Link> </Link>
<FormControl fullWidth variant="standard"> <FormControl fullWidth variant="standard">
<TextField <TextField
value={quiz.name} // value={quiz.name}
onChange={(e) => // onChange={(e) =>
updateQuiz(quiz.id, (quiz) => { // updateQuiz(quiz.id, (quiz) => {
quiz.name = e.target.value; // quiz.name = e.target.value;
}) // })
} // }
fullWidth fullWidth
id="project-name" id="project-name"
placeholder="Название проекта окно" placeholder="Название проекта окно"