mirror
/
remix-project
mirror of https://github.com/ethereum/remix-project.git
2
0
Fork 0
Code Issues Releases Wiki Activity

fixes

Browse Source
pull/5013/head
Your Name 4 months ago
parent f191c8fec5
commit 609c7a0ce1
2 changed files with 67 additions and 28 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 91
      apps/learneth/src/pages/StepDetail/index.tsx
  2. 4
      apps/learneth/src/redux/models/workshop.ts

91
apps/learneth/src/pages/StepDetail/index.tsx
Unescape View File

@ -1,21 +1,24 @@
import React, {useEffect} from 'react'
import {useLocation, useNavigate} from 'react-router-dom'
import React, { useEffect } from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import Markdown from 'react-markdown'
import rehypeRaw from 'rehype-raw'
import BackButton from '../../components/BackButton'
import {useAppSelector, useAppDispatch} from '../../redux/hooks'
import { useAppSelector, useAppDispatch } from '../../redux/hooks'
import './index.scss'
import remixClient from '../../remix-client'
function StepDetailPage() {
const navigate = useNavigate()
const location = useLocation()
const dispatch = useAppDispatch()
const [clonedStep, setClonedStep] = React.useState(null)
const [loading, setLoading] = React.useState(false)
const queryParams = new URLSearchParams(location.search)
const id = queryParams.get('id') as string
const stepId = Number(queryParams.get('stepId'))
const {
workshop: {detail, selectedId},
remixide: {errorLoadingFile, errors, success},
workshop: { detail, selectedId },
remixide: { errorLoadingFile, errors, success },
} = useAppSelector((state: any) => state)
const entity = detail[selectedId].entities[id]
const steps = entity.steps
@ -23,15 +26,47 @@ function StepDetailPage() {
console.log(step)
useEffect(() => {
dispatch({
type: 'remixide/displayFile',
payload: step,
})
dispatch({
type: 'remixide/save',
payload: {errors: [], success: false},
const clonedStep = JSON.parse(JSON.stringify(step))
const loadFiles = async () => {
if (step.markdown && step.markdown.file && !step.markdown.content) {
console.log('loading md file', step.markdown.file)
clonedStep.markdown.content = (await remixClient.call('contentImport', 'resolve', step.markdown.file)).content
}
if (step.solidity && step.solidity.file && !step.solidity.content) {
console.log('loading sol file', step.solidity.file)
clonedStep.solidity.content = (await remixClient.call('contentImport', 'resolve', step.solidity.file)).content
}
if (step.test && step.test.file && !step.test.content) {
console.log('loading test file', step.test.file)
clonedStep.test.content = (await remixClient.call('contentImport', 'resolve', step.test.file)).content
}
if (step.answer && step.answer.file && !step.answer.content) {
console.log('loading answer file', step.answer.file)
clonedStep.answer.content = (await remixClient.call('contentImport', 'resolve', step.answer.file)).content
}
if(step.js && step.js.file && !step.js.content) {
console.log('loading js file', step.js.file)
clonedStep.js.content = (await remixClient.call('contentImport', 'resolve', step.js.file)).content
}
if(step.vy && step.vy.file && !step.vy.content) {
console.log('loading vy file', step.vy.file)
clonedStep.vy.content = (await remixClient.call('contentImport', 'resolve', step.vy.file)).content
}
}
loadFiles().then(() => {
console.log('displayFile', clonedStep)
setClonedStep(clonedStep)
dispatch({
type: 'remixide/displayFile',
payload: clonedStep,
})
dispatch({
type: 'remixide/save',
payload: { errors: [], success: false },
})
window.scrollTo(0, 0)
})
window.scrollTo(0, 0)
}, [step])
useEffect(() => {
@ -40,6 +75,10 @@ function StepDetailPage() {
}
}, [errors, success])
if(!clonedStep) {
return null
}
return (
<div className='pb-4'>
<div className="fixed-top">
@ -51,13 +90,13 @@ function StepDetailPage() {
{errorLoadingFile ? (
<>
<div className="errorloadingspacer"></div>
<h1 className="pl-3 pr-3 pt-3 pb-1">{step.name}</h1>
<h1 className="pl-3 pr-3 pt-3 pb-1">{clonedStep.name}</h1>
<button
className="w-100nav-item rounded-0 nav-link btn btn-success test"
onClick={() => {
dispatch({
type: 'remixide/displayFile',
payload: step,
payload: clonedStep,
})
}}
>
@ -68,13 +107,13 @@ function StepDetailPage() {
) : (
<>
<div className="menuspacer"></div>
<h1 className="pr-3 pl-3 pt-3 pb-1">{step.name}</h1>
<h1 className="pr-3 pl-3 pt-3 pb-1">{clonedStep.name}</h1>
</>
)}
<div className="container-fluid">
<Markdown rehypePlugins={[rehypeRaw]}>{step.markdown?.content}</Markdown>
<Markdown rehypePlugins={[rehypeRaw]}>{clonedStep.markdown?.content}</Markdown>
</div>
{step.test?.content ? (
{clonedStep.test?.content ? (
<>
<nav className="nav nav-pills nav-fill">
{errorLoadingFile ? (
@ -83,7 +122,7 @@ function StepDetailPage() {
onClick={() => {
dispatch({
type: 'remixide/displayFile',
payload: step,
payload: clonedStep,
})
}}
>
@ -98,19 +137,19 @@ function StepDetailPage() {
onClick={() => {
dispatch({
type: 'remixide/testStep',
payload: step,
payload: clonedStep,
})
}}
>
Check Answer
</button>
{step.answer?.content && (
{clonedStep.answer?.content && (
<button
className="nav-item rounded-0 nav-link btn btn-warning test"
onClick={() => {
dispatch({
type: 'remixide/showAnswer',
payload: step,
payload: clonedStep,
})
}}
>
@ -130,13 +169,13 @@ function StepDetailPage() {
>
Next
</button>
{step.answer?.content && (
{clonedStep.answer?.content && (
<button
className="nav-item rounded-0 nav-link btn btn-warning test"
onClick={() => {
dispatch({
type: 'remixide/showAnswer',
payload: step,
payload: clonedStep,
})
}}
>
@ -185,13 +224,13 @@ function StepDetailPage() {
) : (
<>
<nav className="nav nav-pills nav-fill">
{!errorLoadingFile && step.answer?.content && (
{!errorLoadingFile && clonedStep.answer?.content && (
<button
className="nav-item rounded-0 nav-link btn btn-warning test"
onClick={() => {
dispatch({
type: 'remixide/showAnswer',
payload: step,
payload: clonedStep,
})
}}
>

4
apps/learneth/src/redux/models/workshop.ts
Unescape View File

@ -23,7 +23,7 @@ const Model: ModelType = {
},
effects: {
*init(_, { put }) {
const cache = localStorage.getItem('workshop.state')
const cache = null // localStorage.getItem('workshop.state')
if (cache) {
const workshopState = JSON.parse(cache)
@ -90,7 +90,7 @@ const Model: ModelType = {
const key = stepKeysWithFile[k]
if (step[key]) {
try {
step[key].content = (yield remixClient.call('contentImport', 'resolve', step[key].file)).content
step[key].content = null// (yield remixClient.call('contentImport', 'resolve', step[key].file)).content
} catch (error) {
console.error(error)
}

Write Preview
Loading…
Cancel
Save