beta version of live check for code text area
This commit is contained in:
parent
27bde5988d
commit
cc58c0e385
3 changed files with 31 additions and 24 deletions
|
|
@ -10,5 +10,6 @@ export async function sendAll(data:sendAllProps) {
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function checkCode(code:string){
|
export async function checkCode(code:string){
|
||||||
return []
|
|
||||||
|
return await axios.post('/validate',{code})
|
||||||
}
|
}
|
||||||
|
|
@ -6,10 +6,11 @@ import AceEditor from "react-ace";
|
||||||
import "ace-builds/src-noconflict/mode-python";
|
import "ace-builds/src-noconflict/mode-python";
|
||||||
import "ace-builds/src-noconflict/theme-github";
|
import "ace-builds/src-noconflict/theme-github";
|
||||||
import "ace-builds/src-noconflict/theme-twilight";
|
import "ace-builds/src-noconflict/theme-twilight";
|
||||||
import "ace-builds/src-noconflict/ext-language_tools"
|
import "ace-builds/src-noconflict/ext-language_tools";
|
||||||
import "ace-builds/webpack-resolver"
|
import "ace-builds/webpack-resolver";
|
||||||
import {darkContext} from "../../contexts/darkContext"
|
import { darkContext } from "../../contexts/darkContext";
|
||||||
import { checkCode } from "../../controllers/API";
|
import { checkCode } from "../../controllers/API";
|
||||||
|
import { alertContext } from "../../contexts/alertContext";
|
||||||
export default function CodeAreaModal({
|
export default function CodeAreaModal({
|
||||||
value,
|
value,
|
||||||
setValue,
|
setValue,
|
||||||
|
|
@ -19,7 +20,8 @@ export default function CodeAreaModal({
|
||||||
}) {
|
}) {
|
||||||
const [open, setOpen] = useState(true);
|
const [open, setOpen] = useState(true);
|
||||||
const [code, setCode] = useState(value);
|
const [code, setCode] = useState(value);
|
||||||
const {dark} = useContext(darkContext)
|
const { dark } = useContext(darkContext);
|
||||||
|
const { setErrorData, setSuccessData } = useContext(alertContext);
|
||||||
const { closePopUp } = useContext(PopUpContext);
|
const { closePopUp } = useContext(PopUpContext);
|
||||||
const ref = useRef();
|
const ref = useRef();
|
||||||
function setModalOpen(x: boolean) {
|
function setModalOpen(x: boolean) {
|
||||||
|
|
@ -103,9 +105,11 @@ export default function CodeAreaModal({
|
||||||
fontSize={14}
|
fontSize={14}
|
||||||
showGutter
|
showGutter
|
||||||
enableLiveAutocompletion
|
enableLiveAutocompletion
|
||||||
theme={dark?"twilight":"github"}
|
theme={dark ? "twilight" : "github"}
|
||||||
name="CodeEditor"
|
name="CodeEditor"
|
||||||
onChange={(value)=>{setCode(value)}}
|
onChange={(value) => {
|
||||||
|
setCode(value);
|
||||||
|
}}
|
||||||
className="h-full w-full rounded-lg"
|
className="h-full w-full rounded-lg"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -117,19 +121,21 @@ export default function CodeAreaModal({
|
||||||
className="inline-flex w-full justify-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 sm:ml-3 sm:w-auto sm:text-sm"
|
className="inline-flex w-full justify-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 sm:ml-3 sm:w-auto sm:text-sm"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setValue(code)
|
setValue(code)
|
||||||
setModalOpen(false);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Save code
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className="inline-flex w-full justify-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 sm:ml-3 sm:w-auto sm:text-sm"
|
|
||||||
onClick={() => {
|
|
||||||
checkCode(code)
|
checkCode(code)
|
||||||
|
.then((_) =>{
|
||||||
|
setSuccessData({ title: "Code is ready to run" })
|
||||||
|
setModalOpen(false)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.catch((_) =>
|
||||||
|
setErrorData({
|
||||||
|
title:
|
||||||
|
"There is something wrong with this code, please review it",
|
||||||
|
})
|
||||||
|
);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Check Code
|
Check & Save
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue