feat: init new editor design

This commit is contained in:
swve 2022-12-03 00:39:50 +01:00
parent d361e68dc0
commit f349378ff9
15 changed files with 264 additions and 136 deletions

View file

@ -4,7 +4,7 @@ import styled from "styled-components";
import learnhouseBigIcon from "public/learnhouse_bigicon.png";
import Image from "next/image";
import Link from "next/link";
import { PreAlphaLabel } from "../components/rename/UI/Layout";
import { PreAlphaLabel } from "../components//UI/Layout";
const Home: NextPage = () => {
return (

View file

@ -1,8 +1,8 @@
import Router from "next/router";
import React from "react";
import { Header } from "../components/rename/UI/Header";
import Layout from "../components/rename/UI/Layout";
import { Title } from "../components/rename/UI/Elements/Styles/Title";
import { Header } from "../components//UI/Header";
import Layout from "../components//UI/Layout";
import { Title } from "../components//UI/Elements/Styles/Title";
import { loginAndGetToken } from "../services/auth/auth";
const Login = () => {

View file

@ -1,9 +1,9 @@
import React from "react";
import { useState, useEffect } from "react";
import styled from "styled-components";
import { Header } from "../../../../../../components/rename/UI/Header";
import Layout from "../../../../../../components/rename/UI/Layout";
import { Title } from "../../../../../../components/rename/UI/Elements/Styles/Title";
import { Header } from "../../../../../../components//UI/Header";
import Layout from "../../../../../../components//UI/Layout";
import { Title } from "../../../../../../components//UI/Elements/Styles/Title";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
import { initialData, initialData2 } from "../../../../../../components/Drags/data";
import Chapter from "../../../../../../components/Drags/Chapter";

View file

@ -1,12 +1,13 @@
import { default as React, useEffect, useRef } from "react";
import Layout from "../../../../../../../components/rename/UI/Layout";
import { Title } from "../../../../../../../components/rename/UI/Elements/Styles/Title";
import Layout from "../../../../../../../components//UI/Layout";
import { Title } from "../../../../../../../components//UI/Elements/Styles/Title";
import dynamic from "next/dynamic";
import { useRouter } from "next/router";
import { getElement } from "../../../../../../../services/courses/elements";
import AuthProvider from "../../../../../../../components/security/AuthProvider";
import AuthProvider from "../../../../../../../components/Security/AuthProvider";
import EditorWrapper from "../../../../../../../components/Editor/EditorWrapper";
import { getCourseMetadata } from "../../../../../../../services/courses/courses";
// Workaround (Next.js SSR doesn't support tip tap editor)
const Editor: any = dynamic(() => import("../../../../../../../components/Editor/EditorWrapper") as any, {
@ -15,25 +16,40 @@ const Editor: any = dynamic(() => import("../../../../../../../components/Editor
function EditElement() {
const router = useRouter();
const { elementid } = router.query;
const { elementid, courseid } = router.query;
const [element, setElement] = React.useState<any>({});
const [courseInfo, setCourseInfo] = React.useState({}) as any;
const [isLoading, setIsLoading] = React.useState(true);
async function fetchElementData() {
const element = await getElement("element_" + elementid);
setElement(element);
}
async function fetchCourseInfo() {
const course = await getCourseMetadata("course_" + courseid);
setCourseInfo(course);
}
async function fetchAllData() {
await fetchElementData();
await fetchCourseInfo();
setIsLoading(false);
}
React.useEffect(() => {
if (router.isReady) {
fetchElementData();
fetchAllData();
}
return () => {};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [router.isReady]);
return <AuthProvider>{isLoading ? <div>Loading...</div> : <EditorWrapper element={element} content={element.content}></EditorWrapper>}</AuthProvider>;
return (
<AuthProvider>
{isLoading ? <div>Loading...</div> : <EditorWrapper course={courseInfo} element={element} content={element.content}></EditorWrapper>}
</AuthProvider>
);
}
export default EditElement;

View file

@ -6,7 +6,7 @@ import Text from "@tiptap/extension-text";
import { generateHTML } from "@tiptap/html";
import { useRouter } from "next/router";
import React, { useMemo } from "react";
import Layout from "../../../../../../../components/rename/UI/Layout";
import Layout from "../../../../../../../components//UI/Layout";
import { getElement } from "../../../../../../../services/courses/elements";
import { getBackendUrl } from "../../../../../../../services/config";

View file

@ -3,7 +3,7 @@ import Link from "next/link";
import { useRouter } from "next/router";
import React from "react";
import styled from "styled-components";
import Layout from "../../../../../components/rename/UI/Layout";
import Layout from "../../../../../components//UI/Layout";
import { getAPIUrl, getBackendUrl } from "../../../../../services/config";
import { getCourse, getCourseMetadata } from "../../../../../services/courses/courses";

View file

@ -2,9 +2,9 @@ import Link from "next/link";
import { useRouter } from "next/router";
import React from "react";
import styled from "styled-components";
import { Header } from "../../../../components/rename/UI/Header";
import Layout from "../../../../components/rename/UI/Layout";
import { Title } from "../../../../components/rename/UI/Elements/Styles/Title";
import { Header } from "../../../../components//UI/Header";
import Layout from "../../../../components//UI/Layout";
import { Title } from "../../../../components//UI/Elements/Styles/Title";
import { getBackendUrl } from "../../../../services/config";
import { deleteCourseFromBackend, getOrgCourses } from "../../../../services/courses/courses";
import { getOrganizationContextInfo } from "../../../../services/orgs";

View file

@ -1,8 +1,8 @@
import { useRouter } from "next/router";
import React from "react";
import { Header } from "../../../../../components/rename/UI/Header";
import Layout from "../../../../../components/rename/UI/Layout";
import { Title } from "../../../../../components/rename/UI/Elements/Styles/Title";
import { Header } from "../../../../../components//UI/Header";
import Layout from "../../../../../components//UI/Layout";
import { Title } from "../../../../../components//UI/Elements/Styles/Title";
import { createNewCourse } from "../../../../../services/courses/courses";
import { getOrganizationContextInfo } from "../../../../../services/orgs";

View file

@ -1,8 +1,8 @@
import React from "react";
import { useRouter } from "next/router";
import Layout from "../../../components/rename/UI/Layout";
import { Title } from "../../../components/rename/UI/Elements/Styles/Title";
import { Header } from "../../../components/rename/UI/Header";
import Layout from "../../../components//UI/Layout";
import { Title } from "../../../components//UI/Elements/Styles/Title";
import { Header } from "../../../components//UI/Header";
import Link from "next/link";
const OrgHomePage = () => {

View file

@ -1,7 +1,7 @@
import Link from "next/link";
import React from "react";
import Layout from "../../components/rename/UI/Layout";
import { Title } from "../../components/rename/UI/Elements/Styles/Title";
import Layout from "../../components//UI/Layout";
import { Title } from "../../components//UI/Elements/Styles/Title";
import { deleteOrganizationFromBackend, getUserOrganizations } from "../../services/orgs";
const Organizations = () => {

View file

@ -1,6 +1,6 @@
import React from "react";
import Layout from "../../components/rename/UI/Layout";
import { Title } from "../../components/rename/UI/Elements/Styles/Title";
import Layout from "../../components//UI/Layout";
import { Title } from "../../components//UI/Elements/Styles/Title";
import { createNewOrganization } from "../../services/orgs";
const Organizations = () => {

View file

@ -1,7 +1,7 @@
import React from "react";
import { Header } from "../components/rename/UI/Header";
import Layout from "../components/rename/UI/Layout";
import { Title } from "../components/rename/UI/Elements/Styles/Title";
import { Header } from "../components//UI/Header";
import Layout from "../components//UI/Layout";
import { Title } from "../components//UI/Elements/Styles/Title";
import { signup } from "../services/auth/auth";
const SignUp = () => {