frontPanel/src/pages/createQuize/MyQuizzesFull.tsx

import {Typography, Box, Button, SxProps, Theme} from "@mui/material";
import ComplexNavText from "./ComplexNavText";
import QuizCard from "./QuizCard";
import SectionWrapper from "@ui_kit/SectionWrapper";
import React from "react";
import {quizStore} from "@root/quizes";
interface Props {
    outerContainerSx?: SxProps<Theme>;
    children?: React.ReactNode;
}

export default function MyQuizzesFull({outerContainerSx: sx, children}: Props) {
    const {listQuizes, updateQuizesList, removeQuiz} = quizStore()

    return (
        <SectionWrapper
            maxWidth="lg"
            sx={{
                mt: "25px",
                mb: "70px",
            }}
        >
            <Button onClick={() => {
                removeQuiz(2)
                console.log(Object.values(listQuizes))
            }}>УДАЛИ МЕНЯ</Button>
            <Button onClick={() => {
                console.log(Object.values(listQuizes))
            }}>Узнай МЕНЯ</Button>
            <Button onClick={() => {
                updateQuizesList({
                    "id": 2,
                    "qid": "string",
                    "deleted": false,
                    "archived": true,
                    "fingerprinting": true,
                    "repeatable": true,
                    "note_prevented": true,
                    "mail_notifications": true,
                    "unique_answers": true,
                    "name": "string",
                    "description": "string",
                    "config": "string",
                    "status": "string",
                    "limit": 0,
                    "due_to": 0,
                    "time_of_passing": 0,
                    "pausable": true,
                    "version": 0,
                    "version_comment": "string",
                    "created_at": "string",
                    "updated_at": "string",
                    "question_cnt": 0,
                    "passed_count": 0,
                    "average_time": 0,
                    "super": true,
                    "group_id": 0
                })
            }}>добавь МЕНЯ</Button>
            <ComplexNavText text1="Кабинет квизов"/>
            <Box
                sx={{
                    display: "flex",
                    justifyContent: "space-between",
                    alignItems: "center",
                    mt: "20px",
                    mb: "30px",
                }}
            >
                <Typography variant="h4">Мои квизы</Typography>
                <Button
                    variant="contained"
                >Создать +</Button>
            </Box>
            <Box
                sx={{
                    py: "10px",
                    display: "flex",
                    flexWrap: "wrap",
                    gap: "40px",
                    mb: "60px",
                }}
            >
                {Object.values(listQuizes).map((e, i) =>(
                    <QuizCard name={e.name} openCount={0} applicationCount={0} conversionPercent={0}/>
                    )
                )}

            </Box>
            {children}
        </SectionWrapper>
    )
}