From 209db40660786057afc2eb87fbabe1e251f2eb79 Mon Sep 17 00:00:00 2001 From: Stephen Zweibel Date: Mon, 30 Oct 2023 12:53:10 -0400 Subject: [PATCH] feature --- components/Editor/DrawerEditor.js | 1 - components/Editor/JupyterLoad.js | 14 -------- components/WorkshopPieces/ConvertMarkdown.js | 28 +++++++-------- components/WorkshopPieces/Frontmatter.js | 1 + .../WorkshopPieces/FrontmatterFeature.js | 7 ++-- components/WorkshopPieces/JupyterLoad.js | 35 +++++++++++++++++++ pages/dynamic/index.js | 5 ++- 7 files changed, 56 insertions(+), 35 deletions(-) delete mode 100644 components/Editor/JupyterLoad.js create mode 100644 components/WorkshopPieces/JupyterLoad.js diff --git a/components/Editor/DrawerEditor.js b/components/Editor/DrawerEditor.js index 5baa9390..94d228f9 100644 --- a/components/Editor/DrawerEditor.js +++ b/components/Editor/DrawerEditor.js @@ -7,7 +7,6 @@ import CodeIcon from '@mui/icons-material/Code'; import Button from '@mui/material/Button'; import Drawer from '@mui/material/Drawer'; import Webvm from '../Wasm/Webvm'; -import JupyterLoad from './JupyterLoad'; import { useState, useEffect, useRef, Fragment } from 'react'; export default function DrawerEditor(props) { diff --git a/components/Editor/JupyterLoad.js b/components/Editor/JupyterLoad.js deleted file mode 100644 index 66993e93..00000000 --- a/components/Editor/JupyterLoad.js +++ /dev/null @@ -1,14 +0,0 @@ -import { useEffect } from 'react'; - - -export default function JupyterLoad(props) { - const jupyterSrc = props.jupyterSrc; - const setJupyterSrc = props.setJupyterSrc; - - const uploads = props.allUploads; - const fromURLString = uploads.map((upload) => { - return `&fromURL=${upload.download_url}` - } - ).join(''); - setJupyterSrc(`https://melodic-moonbeam-e29b67.netlify.app/lab/index.html?${fromURLString}`); -} diff --git a/components/WorkshopPieces/ConvertMarkdown.js b/components/WorkshopPieces/ConvertMarkdown.js index b17fe50c..04932821 100644 --- a/components/WorkshopPieces/ConvertMarkdown.js +++ b/components/WorkshopPieces/ConvertMarkdown.js @@ -7,19 +7,18 @@ import Image from 'next/image' import Zoom from 'react-medium-image-zoom' import 'react-medium-image-zoom/dist/styles.css' import PythonREPLComponent from '../Editor/PythonREPLComponent'; -import EditorWithTabsComponent from '../Editor/EditorWithTabs'; import CodeRunBox from '../Editor/CodeRunBox'; import Download from './Download'; import JSTerminal from '../Editor/JSTerminal'; import Info from './Info'; +import JupyterLoad from './JupyterLoad'; import SecretComponent from './SecretComponent'; // import HTMLEditorComponent from './Editor/HTMLEditorComponent'; // import { renderToStaticMarkup } from 'react-dom/server'; // import he from 'he'; -export default function ConvertMarkdown(markdown, uploads, workshopTitle, language, setCode, setEditorOpen, setAskToRun, gitUser, gitRepo, gitFile) { - +export default function ConvertMarkdown(markdown, uploads, workshopTitle, language, setCode, setEditorOpen, setAskToRun, gitUser, gitRepo, gitFile, setJupyterSrc) { const Imager = ({ className, ...props }) => { let newProps = { ...props }; @@ -149,16 +148,6 @@ export default function ConvertMarkdown(markdown, uploads, workshopTitle, langua // ) // } - - const EditorWithTabs = ({ className, children }) => { - const codeText = children.join(''); - return ( -
- -
- ) - } - const PythonREPL = ({ className, children }) => { return (
@@ -229,6 +218,16 @@ export default function ConvertMarkdown(markdown, uploads, workshopTitle, langua ) } + const Jupyter = ({ className, children }) => { + return ( +
+ +
+ ) + } + const Secret = ({ className, children }) => { return (
@@ -284,11 +283,10 @@ export default function ConvertMarkdown(markdown, uploads, workshopTitle, langua className: 'info-alert', } }, - + Jupyter, Quiz, PythonREPL, Terminal, - EditorWithTabs, JSTerminal, Secret // HTMLEditor, diff --git a/components/WorkshopPieces/Frontmatter.js b/components/WorkshopPieces/Frontmatter.js index 16e2d26b..b8428985 100644 --- a/components/WorkshopPieces/Frontmatter.js +++ b/components/WorkshopPieces/Frontmatter.js @@ -194,6 +194,7 @@ export default function Frontmatter(currentFile, setCurrentPage, setCurrentConte instructors={currentFile.data.instructors} editors={currentFile.data.editors} title={workshopTitle} + coverTitle={currentFile.data['cover title']} />
) diff --git a/components/WorkshopPieces/FrontmatterFeature.js b/components/WorkshopPieces/FrontmatterFeature.js index 05941985..0d08f26d 100644 --- a/components/WorkshopPieces/FrontmatterFeature.js +++ b/components/WorkshopPieces/FrontmatterFeature.js @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; -export default function FrontmatterFeature({ authors, instructors, editors, coverImage, title }) { +export default function FrontmatterFeature({ authors, instructors, editors, coverImage, title, coverTitle }) { const [src, setSrc] = useState(null); const randomNumberBetween1and7 = Math.floor(Math.random() * 7) + 1; @@ -14,6 +14,9 @@ export default function FrontmatterFeature({ authors, instructors, editors, cove } }, [coverImage]) + console.log(coverTitle) + const frontTitle = coverTitle ? coverTitle : title; + return (
@@ -27,7 +30,7 @@ export default function FrontmatterFeature({ authors, instructors, editors, cove style={{ top: '30%' }} - >{title}

+ >{frontTitle}

{authors && authors.length > 0 &&
diff --git a/components/WorkshopPieces/JupyterLoad.js b/components/WorkshopPieces/JupyterLoad.js new file mode 100644 index 00000000..89dc7a5c --- /dev/null +++ b/components/WorkshopPieces/JupyterLoad.js @@ -0,0 +1,35 @@ +import { useEffect } from 'react'; +import { Button } from '@mui/material'; + + +export default function JupyterLoad(props) { + console.log('props', props); + const jupyterSrc = props.jupyterSrc; + const setJupyterSrc = props.setJupyterSrc; + + const uploads = props.allUploads; + // const fromURLString = uploads.map((upload) => { + // return `&fromURL=${upload.download_url}` + // } + // ).join(''); + const fromURLString = `&fromURL='https://raw.githubusercontent.com/${props.gitUser}/${props.gitRepo}/main/notebooks/${props.gitFile}.ipynb` + + + return ( +
+ +
+ ) +} diff --git a/pages/dynamic/index.js b/pages/dynamic/index.js index 7a16960b..aed1a8e8 100644 --- a/pages/dynamic/index.js +++ b/pages/dynamic/index.js @@ -76,7 +76,7 @@ export default function WorkshopPage({ // convert markdown to html and split into pages const convertContenttoHTML = function (content) { - const htmlifiedContent = ConvertMarkdown(content, uploads, workshopTitle, language, setCode, setEditorOpen, setAskToRun, gitUser, gitRepo, gitFile); + const htmlifiedContent = ConvertMarkdown(content, uploads, workshopTitle, language, setCode, setEditorOpen, setAskToRun, gitUser, gitRepo, gitFile, setJupyterSrc); // split react element array into pages const allPages = []; const pages = htmlifiedContent?.props.children.reduce((acc, curr) => { @@ -164,8 +164,7 @@ export default function WorkshopPage({ useEffect(() => { if (currentFile != null && content != '') { - const frontMatterContent = Frontmatter(currentFile, setCurrentPage, setCurrentContent, - pages, instUser, instRepo, workshopTitle, pageTitles, currentPage); + const frontMatterContent = Frontmatter(currentFile, setCurrentPage, setCurrentContent, pages, instUser, instRepo, workshopTitle, pageTitles, currentPage); setPages([frontMatterContent, ...convertContenttoHTML(content)]); } }, [currentFile, content])