rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: refactor files

Browse source 
feat: refactor more files

feat: uppercase component folder 1/2

feat: uppercase component folder 2/2
This commit is contained in:
swve 2022-12-02 22:23:52 +01:00
parent a371394670
commit d361e68dc0
31 changed files with 101 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

62
front/components/modals/CourseEdit/NewElement.tsx
View file

@ -1,62 +0,0 @@
import React, { useState } from "react";
import { ArrowLeftIcon, Cross1Icon } from "@radix-ui/react-icons";
import Modal from "../Modal";
import styled from "styled-components";
import dynamic from "next/dynamic";
import DynamicCanvaModal from "./NewElementModal/DynamicCanva";
import VideoModal from "./NewElementModal/Video";
function NewElementModal({ closeModal, submitElement, submitFileElement, chapterId }: any) {
const [selectedView, setSelectedView] = useState("home");
return (
<Modal>
<button onClick={ () => {setSelectedView("home")}}>
<ArrowLeftIcon />
</button>
<button onClick={closeModal}>
<Cross1Icon />
</button>
<h1>Add New Element</h1>
<br />
{selectedView === "home" && (
<ElementChooserWrapper>
<ElementButton onClick={() => {setSelectedView("dynamic")}}>✨📄</ElementButton>
<ElementButton onClick={() => {setSelectedView("video")}}>📹</ElementButton>
</ElementChooserWrapper>
)}
{selectedView === "dynamic" && (
<DynamicCanvaModal submitElement={submitElement} chapterId={chapterId} />
)}
{selectedView === "video" && (
<VideoModal submitFileElement={submitFileElement} chapterId={chapterId} />
)}
</Modal>
);
}
const ElementChooserWrapper = styled.div`
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 20px;
`;
const ElementButton = styled.button`
padding: 20px;
border-radius: 10px;
border: none;
font-size: 50px;
background-color: #8c949c33;
cursor: pointer;
&:hover {
background-color: #8c949c7b;
}
`;
export default NewElementModal;