Merge pull request #1593 from pateljannat/programming-exercises
feat: programming exercises
This commit is contained in:
Jannat Patel
@@ -22,14 +22,11 @@
|
||||
|
||||
<div class="md:w-3/4 md:mx-auto py-5 mx-5">
|
||||
<div class="flex items-center justify-between mb-5">
|
||||
<div
|
||||
v-if="assignmentCount"
|
||||
class="text-xl font-semibold text-ink-gray-7 mb-4"
|
||||
>
|
||||
<div v-if="assignmentCount" class="text-lg font-semibold text-ink-gray-9">
|
||||
{{ __('{0} Assignments').format(assignmentCount) }}
|
||||
</div>
|
||||
<div
|
||||
v-if="assignments.data?.length || assigmentCount > 0"
|
||||
v-if="assignments.data?.length || assignmentCount > 0"
|
||||
class="grid grid-cols-2 gap-5"
|
||||
>
|
||||
<FormControl
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
</div>
|
||||
<div
|
||||
v-if="courses.data?.length"
|
||||
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 gap-4"
|
||||
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 gap-5"
|
||||
>
|
||||
<router-link
|
||||
v-for="course in courses.data"
|
||||
|
||||
@@ -65,7 +65,7 @@
|
||||
<div
|
||||
class="border-r container pt-5 pb-10 px-5 h-full"
|
||||
:class="{
|
||||
'w-full md:w-3/4 mx-auto border-none !pt-10': zenModeEnabled,
|
||||
'w-full md:w-3/5 mx-auto border-none !pt-10': zenModeEnabled,
|
||||
}"
|
||||
>
|
||||
<div
|
||||
@@ -296,6 +296,7 @@ import {
|
||||
import Discussions from '@/components/Discussions.vue'
|
||||
import { getEditorTools, enablePlyr } from '@/utils'
|
||||
import { sessionStore } from '@/stores/session'
|
||||
import { useSidebar } from '@/stores/sidebar'
|
||||
import EditorJS from '@editorjs/editorjs'
|
||||
import LessonContent from '@/components/LessonContent.vue'
|
||||
import CourseInstructors from '@/components/CourseInstructors.vue'
|
||||
@@ -316,6 +317,7 @@ const hasQuiz = ref(false)
|
||||
const discussionsContainer = ref(null)
|
||||
const timer = ref(0)
|
||||
const { brand } = sessionStore()
|
||||
const sidebarStore = useSidebar()
|
||||
let timerInterval
|
||||
|
||||
const props = defineProps({
|
||||
@@ -335,6 +337,8 @@ const props = defineProps({
|
||||
|
||||
onMounted(() => {
|
||||
startTimer()
|
||||
console.log(sidebarStore.isSidebarCollapsed)
|
||||
sidebarStore.isSidebarCollapsed = true
|
||||
document.addEventListener('fullscreenchange', attachFullscreenEvent)
|
||||
socket.on('update_lesson_progress', (data) => {
|
||||
if (data.course === props.courseName) {
|
||||
@@ -357,6 +361,7 @@ const attachFullscreenEvent = () => {
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
document.removeEventListener('fullscreenchange', attachFullscreenEvent)
|
||||
sidebarStore.isSidebarCollapsed = false
|
||||
})
|
||||
|
||||
const lesson = createResource({
|
||||
@@ -554,7 +559,7 @@ const canGoZen = () => {
|
||||
user.data?.is_instructor ||
|
||||
user.data?.is_evaluator
|
||||
)
|
||||
return false
|
||||
return true
|
||||
if (lesson.data?.membership) return true
|
||||
return false
|
||||
}
|
||||
|
||||
@@ -210,7 +210,7 @@ const addInstructorNotes = (data) => {
|
||||
const enableAutoSave = () => {
|
||||
autoSaveInterval = setInterval(() => {
|
||||
saveLesson({ showSuccessMessage: false })
|
||||
}, 5000)
|
||||
}, 10000)
|
||||
}
|
||||
|
||||
const keyboardShortcut = (e) => {
|
||||
@@ -385,8 +385,10 @@ const saveLesson = (e) => {
|
||||
showSuccessMessage = true
|
||||
}
|
||||
editor.value.save().then((outputData) => {
|
||||
outputData = removeEmptyBlocks(outputData)
|
||||
lesson.content = JSON.stringify(outputData)
|
||||
instructorEditor.value.save().then((outputData) => {
|
||||
outputData = removeEmptyBlocks(outputData)
|
||||
lesson.instructor_content = JSON.stringify(outputData)
|
||||
if (lessonDetails.data?.lesson) {
|
||||
editCurrentLesson()
|
||||
@@ -397,6 +399,14 @@ const saveLesson = (e) => {
|
||||
})
|
||||
}
|
||||
|
||||
const removeEmptyBlocks = (outputData) => {
|
||||
let blocks = outputData.blocks.filter((block) => {
|
||||
return Object.keys(block.data).length > 0 || block.type == 'paragraph'
|
||||
})
|
||||
outputData.blocks = blocks
|
||||
return outputData
|
||||
}
|
||||
|
||||
const createNewLesson = () => {
|
||||
newLessonResource.submit(
|
||||
{},
|
||||
@@ -686,7 +696,7 @@ iframe {
|
||||
}
|
||||
|
||||
.ce-popover--opened > .ce-popover__container {
|
||||
max-height: 320px;
|
||||
max-height: unset;
|
||||
}
|
||||
|
||||
.cdx-search-field__icon svg {
|
||||
|
||||
@@ -0,0 +1,255 @@
|
||||
<template>
|
||||
<Dialog v-model="show" :options="{ size: '5xl' }">
|
||||
<template #body-title>
|
||||
<div class="text-xl font-semibold text-ink-gray-9">
|
||||
{{
|
||||
props.exerciseID === 'new'
|
||||
? __('Create Programming Exercise')
|
||||
: __('Edit Programming Exercise')
|
||||
}}
|
||||
</div>
|
||||
</template>
|
||||
<template #body-content>
|
||||
<div class="grid grid-cols-2 gap-10">
|
||||
<div class="space-y-4">
|
||||
<FormControl
|
||||
v-model="exercise.title"
|
||||
:label="__('Title')"
|
||||
:required="true"
|
||||
/>
|
||||
<FormControl
|
||||
v-model="exercise.language"
|
||||
:label="__('Language')"
|
||||
type="select"
|
||||
:options="languageOptions"
|
||||
:required="true"
|
||||
/>
|
||||
<ChildTable
|
||||
v-model="exercise.test_cases"
|
||||
:label="__('Test Cases')"
|
||||
:columns="testCaseColumns"
|
||||
:required="true"
|
||||
:addable="true"
|
||||
:deletable="true"
|
||||
:editable="true"
|
||||
:placeholder="__('Add Test Case')"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<div class="text-xs text-ink-gray-5 mb-2">
|
||||
{{ __('Problem Statement') }}
|
||||
<span class="text-ink-red-3">*</span>
|
||||
</div>
|
||||
<TextEditor
|
||||
:content="exercise.problem_statement"
|
||||
@change="(val: string) => (exercise.problem_statement = val)"
|
||||
:editable="true"
|
||||
:fixedMenu="true"
|
||||
editorClass="prose-sm max-w-none border-b border-x bg-surface-gray-2 rounded-b-md py-1 px-2 min-h-[7rem] max-h-[21rem] overflow-y-auto"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="{ close }">
|
||||
<div class="flex justify-end space-x-2 group">
|
||||
<Button
|
||||
v-if="exerciseID != 'new'"
|
||||
@click="deleteExercise(close)"
|
||||
variant="outline"
|
||||
theme="red"
|
||||
class="invisible group-hover:visible"
|
||||
>
|
||||
<template #prefix>
|
||||
<Trash2 class="size-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('Delete') }}
|
||||
</Button>
|
||||
<router-link
|
||||
:to="{
|
||||
name: 'ProgrammingExerciseSubmission',
|
||||
params: {
|
||||
exerciseID: props.exerciseID,
|
||||
submissionID: 'new',
|
||||
},
|
||||
}"
|
||||
>
|
||||
<Button>
|
||||
<template #prefix>
|
||||
<Play class="size-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('Test this Exercise') }}
|
||||
</Button>
|
||||
</router-link>
|
||||
<router-link
|
||||
:to="{
|
||||
name: 'ProgrammingExerciseSubmissions',
|
||||
query: {
|
||||
exercise: props.exerciseID,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<Button>
|
||||
<template #prefix>
|
||||
<ClipboardList class="size-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('Check Submission') }}
|
||||
</Button>
|
||||
</router-link>
|
||||
<Button variant="solid" @click="saveExercise(close)">
|
||||
{{ __('Save') }}
|
||||
</Button>
|
||||
</div>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
Button,
|
||||
createListResource,
|
||||
Dialog,
|
||||
FormControl,
|
||||
TextEditor,
|
||||
toast,
|
||||
} from 'frappe-ui'
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import {
|
||||
ProgrammingExercise,
|
||||
ProgrammingExercises,
|
||||
TestCase,
|
||||
} from '@/types/programming-exercise'
|
||||
import ChildTable from '@/components/Controls/ChildTable.vue'
|
||||
import { ClipboardList, Play, Trash2 } from 'lucide-vue-next'
|
||||
|
||||
const show = defineModel()
|
||||
const exercises = defineModel<ProgrammingExercises>('exercises')
|
||||
|
||||
const exercise = ref<ProgrammingExercise>({
|
||||
title: '',
|
||||
language: 'Python',
|
||||
problem_statement: '',
|
||||
test_cases: [],
|
||||
})
|
||||
|
||||
const languageOptions = [
|
||||
{ label: 'Python', value: 'Python' },
|
||||
{ label: 'JavaScript', value: 'JavaScript' },
|
||||
]
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
exerciseID: string
|
||||
}>(),
|
||||
{
|
||||
exerciseID: 'new',
|
||||
}
|
||||
)
|
||||
|
||||
watch(
|
||||
() => props.exerciseID,
|
||||
() => {
|
||||
setExerciseData()
|
||||
fetchTestCases()
|
||||
}
|
||||
)
|
||||
|
||||
const setExerciseData = () => {
|
||||
let isNew = true
|
||||
exercises.value?.data.forEach((ex: ProgrammingExercise) => {
|
||||
if (ex.name === props.exerciseID) {
|
||||
isNew = false
|
||||
exercise.value = { ...ex }
|
||||
}
|
||||
})
|
||||
|
||||
if (isNew) {
|
||||
exercise.value = {
|
||||
title: '',
|
||||
language: 'Python',
|
||||
problem_statement: '',
|
||||
test_cases: [],
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const testCases = createListResource({
|
||||
doctype: 'LMS Test Case',
|
||||
fields: ['input', 'expected_output', 'name'],
|
||||
cache: ['testCases', props.exerciseID],
|
||||
parent: 'LMS Programming Exercise',
|
||||
onSuccess(data: TestCase[]) {
|
||||
exercise.value.test_cases = data
|
||||
},
|
||||
})
|
||||
|
||||
const fetchTestCases = () => {
|
||||
testCases.update({
|
||||
filters: {
|
||||
parent: props.exerciseID,
|
||||
parenttype: 'LMS Programming Exercise',
|
||||
parentfield: 'test_cases',
|
||||
},
|
||||
})
|
||||
testCases.reload()
|
||||
}
|
||||
|
||||
const saveExercise = (close: () => void) => {
|
||||
if (props.exerciseID == 'new') createNewExercise(close)
|
||||
else updateExercise(close)
|
||||
}
|
||||
|
||||
const createNewExercise = (close: () => void) => {
|
||||
exercises.value?.insert.submit(
|
||||
{
|
||||
...exercise.value,
|
||||
},
|
||||
{
|
||||
onSuccess() {
|
||||
close()
|
||||
exercises.value?.reload()
|
||||
toast.success(__('Programming Exercise created successfully'))
|
||||
},
|
||||
onError(err: any) {
|
||||
toast.warning(__(err.messages?.[0] || err))
|
||||
},
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
const updateExercise = (close: () => void) => {
|
||||
exercises.value?.setValue.submit(
|
||||
{
|
||||
name: props.exerciseID,
|
||||
...exercise.value,
|
||||
},
|
||||
{
|
||||
onSuccess() {
|
||||
close()
|
||||
exercises.value?.reload()
|
||||
toast.success(__('Programming Exercise updated successfully'))
|
||||
},
|
||||
onError(err: any) {
|
||||
toast.warning(__(err.messages?.[0] || err))
|
||||
},
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
const testCaseColumns = computed(() => {
|
||||
return ['Input', 'Expected Output']
|
||||
})
|
||||
|
||||
const deleteExercise = (close: () => void) => {
|
||||
if (props.exerciseID == 'new') return
|
||||
exercises.value?.delete.submit(props.exerciseID, {
|
||||
onSuccess() {
|
||||
toast.success(__('Programming Exercise deleted successfully'))
|
||||
close()
|
||||
},
|
||||
onError(err: any) {
|
||||
toast.warning(__(err.messages?.[0] || err))
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<Dialog
|
||||
v-model="show"
|
||||
:options="{
|
||||
title: __('Add a programming exercise to your lesson'),
|
||||
size: 'xl',
|
||||
actions: [
|
||||
{
|
||||
label: __('Save'),
|
||||
variant: 'solid',
|
||||
onClick: () => {
|
||||
saveExercise()
|
||||
},
|
||||
},
|
||||
],
|
||||
}"
|
||||
>
|
||||
<template #body-content>
|
||||
<div class="text-base">
|
||||
<Link
|
||||
v-model="exercise"
|
||||
doctype="LMS Programming Exercise"
|
||||
:label="__('Select a Programming Exercise')"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { Dialog } from 'frappe-ui'
|
||||
import { onMounted, nextTick, ref } from 'vue'
|
||||
import Link from '@/components/Controls/Link.vue'
|
||||
|
||||
const show = ref(false)
|
||||
const exercise = ref(null)
|
||||
|
||||
const props = defineProps({
|
||||
onSave: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
})
|
||||
|
||||
onMounted(async () => {
|
||||
await nextTick()
|
||||
show.value = true
|
||||
})
|
||||
|
||||
const saveExercise = () => {
|
||||
props.onSave(exercise.value)
|
||||
show.value = false
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,439 @@
|
||||
<template>
|
||||
<header
|
||||
v-if="!fromLesson"
|
||||
class="sticky flex items-center justify-between top-0 z-10 border-b bg-surface-white px-3 py-2.5 sm:px-5"
|
||||
>
|
||||
<Breadcrumbs :items="breadcrumbs" />
|
||||
</header>
|
||||
<div
|
||||
v-if="falconError"
|
||||
class="flex items-center justify-between p-3 text-sm bg-surface-amber-1 text-ink-amber-3"
|
||||
>
|
||||
<span>
|
||||
{{ falconError }}
|
||||
</span>
|
||||
<Button v-if="user.data?.is_moderator" @click="openSettings('General')">
|
||||
<template #prefix>
|
||||
<Settings class="size-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('Settings') }}
|
||||
</Button>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 h-[calc(100vh_-_3rem)]">
|
||||
<div class="border-r py-5 px-8 h-full">
|
||||
<div class="font-semibold mb-2">
|
||||
{{ __('Problem Statement') }}
|
||||
</div>
|
||||
<div
|
||||
v-html="exercise.doc?.problem_statement"
|
||||
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-outline-gray-2 prose-th:border-outline-gray-2 prose-td:relative prose-th:relative prose-th:bg-surface-gray-2 prose-sm max-w-none !whitespace-normal"
|
||||
></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center justify-between p-2 bg-surface-gray-2">
|
||||
<div class="font-semibold">
|
||||
{{ exercise.doc?.language }}
|
||||
</div>
|
||||
<div class="space-x-2">
|
||||
<Badge
|
||||
v-if="submission.doc?.status"
|
||||
:theme="submission.doc.status == 'Passed' ? 'green' : 'red'"
|
||||
>
|
||||
{{ submission.doc.status }}
|
||||
</Badge>
|
||||
<Button
|
||||
v-if="
|
||||
!falconError &&
|
||||
(submissionID == 'new' ||
|
||||
user.data?.name == submission.doc?.owner)
|
||||
"
|
||||
variant="solid"
|
||||
@click="submitCode"
|
||||
>
|
||||
<template #prefix>
|
||||
<Play class="size-3" />
|
||||
</template>
|
||||
{{ __('Run') }}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col space-y-4 py-5 border-b">
|
||||
<Code
|
||||
v-model="code"
|
||||
:language="exercise.doc?.language.toLowerCase()"
|
||||
height="400px"
|
||||
maxHeight="1000px"
|
||||
/>
|
||||
<span v-if="error" class="text-xs text-ink-gray-5 px-2">
|
||||
{{ __('Compiler Message') }}:
|
||||
</span>
|
||||
<textarea
|
||||
v-if="error"
|
||||
v-model="errorMessage"
|
||||
class="bg-surface-gray-1 border-none text-sm h-32 leading-6"
|
||||
readonly
|
||||
/>
|
||||
<!-- <textarea v-else v-model="output" class="bg-surface-gray-1 border-none text-sm h-28 leading-6" readonly /> -->
|
||||
</div>
|
||||
|
||||
<div ref="testCaseSection" class="p-5">
|
||||
<span class="text-lg font-semibold text-ink-gray-9">
|
||||
{{ __('Test Cases') }}
|
||||
</span>
|
||||
<div v-if="testCases.length" class="divide-y mt-5">
|
||||
<div
|
||||
v-for="(testCase, index) in testCases"
|
||||
:key="testCase.input"
|
||||
class="py-3"
|
||||
>
|
||||
<div class="flex items-center mb-3">
|
||||
<span class=""> {{ __('Test {0}').format(index + 1) }} - </span>
|
||||
<span
|
||||
class="font-semibold ml-2 mr-1"
|
||||
:class="
|
||||
testCase.status === 'Passed'
|
||||
? 'text-ink-green-3'
|
||||
: 'text-ink-red-3'
|
||||
"
|
||||
>
|
||||
{{ testCase.status }}
|
||||
</span>
|
||||
<!-- <span v-if="testCase.status === 'Passed'">
|
||||
<Check class="size-4 text-ink-green-3" />
|
||||
</span>
|
||||
<span v-else>
|
||||
<X class="size-4 text-ink-red-3" />
|
||||
</span> -->
|
||||
</div>
|
||||
<div class="flex items-center justify-between w-[60%]">
|
||||
<div v-if="testCase.input" class="space-y-2">
|
||||
<div class="text-xs text-ink-gray-7">
|
||||
{{ __('Input') }}
|
||||
</div>
|
||||
<div>{{ testCase.input }}</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<div class="text-xs text-ink-gray-7">
|
||||
{{ __('Your Output') }}
|
||||
</div>
|
||||
<div>
|
||||
{{ testCase.output }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<div class="text-xs text-ink-gray-7">
|
||||
{{ __('Expected Output') }}
|
||||
</div>
|
||||
<div>{{ testCase.expected_output }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="text-sm text-ink-gray-6 mt-4">
|
||||
{{ __('Please run the code to execute the test cases.') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
Badge,
|
||||
Breadcrumbs,
|
||||
Button,
|
||||
call,
|
||||
createDocumentResource,
|
||||
toast,
|
||||
usePageMeta,
|
||||
} from 'frappe-ui'
|
||||
import { computed, inject, onMounted, ref, watch } from 'vue'
|
||||
import { Play, X, Check, Settings } from 'lucide-vue-next'
|
||||
import { sessionStore } from '@/stores/session'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { openSettings } from '@/utils'
|
||||
|
||||
const user = inject<any>('$user')
|
||||
const code = ref<string | null>('')
|
||||
const output = ref<string | null>(null)
|
||||
const error = ref<boolean | null>(null)
|
||||
const errorMessage = ref<string | null>(null)
|
||||
const testCaseSection = ref<HTMLElement | null>(null)
|
||||
const testCases = ref<TestCase[]>([])
|
||||
const boilerplate = ref<string>('')
|
||||
const { brand, livecodeURL } = sessionStore()
|
||||
const router = useRouter()
|
||||
const fromLesson = ref(false)
|
||||
const falconURL = ref<string>('https://falcon.frappe.io/')
|
||||
const falconError = ref<string | null>(null)
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
exerciseID: string
|
||||
submissionID?: string
|
||||
}>(),
|
||||
{
|
||||
submissionID: 'new',
|
||||
}
|
||||
)
|
||||
|
||||
onMounted(() => {
|
||||
loadFalcon()
|
||||
checkIfUserIsPermitted()
|
||||
checkIfInLesson()
|
||||
fetchSubmission()
|
||||
})
|
||||
|
||||
const checkIfInLesson = () => {
|
||||
if (new URLSearchParams(window.location.search).get('fromLesson')) {
|
||||
fromLesson.value = true
|
||||
}
|
||||
}
|
||||
|
||||
const fetchSubmission = (name: string = '') => {
|
||||
if (name) {
|
||||
submission.name = name
|
||||
submission.reload()
|
||||
} else if (props.submissionID != 'new') {
|
||||
submission.reload()
|
||||
}
|
||||
}
|
||||
|
||||
const exercise = createDocumentResource({
|
||||
doctype: 'LMS Programming Exercise',
|
||||
name: props.exerciseID,
|
||||
cache: ['programmingExercise', props.exerciseID],
|
||||
auto: true,
|
||||
})
|
||||
|
||||
const submission = createDocumentResource({
|
||||
doctype: 'LMS Programming Exercise Submission',
|
||||
name: props.submissionID,
|
||||
auto: false,
|
||||
onError(error: any) {
|
||||
if (error.messages?.[0].includes('not found')) {
|
||||
router.push({
|
||||
name: 'ProgrammingExerciseSubmission',
|
||||
params: { exerciseID: props.exerciseID, submissionID: 'new' },
|
||||
})
|
||||
} else {
|
||||
toast.error(__(error.messages?.[0] || error))
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
watch(exercise, () => {
|
||||
updateCode()
|
||||
})
|
||||
|
||||
const updateCode = (submissionCode = '') => {
|
||||
updateBoilerPlate()
|
||||
if (!code.value?.includes(boilerplate.value)) {
|
||||
code.value = `${boilerplate.value}${code.value}`
|
||||
}
|
||||
if (submissionCode && !code.value?.includes(submissionCode)) {
|
||||
code.value = `${code.value}${submissionCode}`
|
||||
} else if (!submissionCode && !code.value) {
|
||||
code.value = boilerplate.value
|
||||
}
|
||||
}
|
||||
|
||||
const updateBoilerPlate = () => {
|
||||
if (exercise.doc?.language == 'Python') {
|
||||
boilerplate.value = `with open("stdin", "r") as f:\n data = f.read()\n\ninputs = data.split() if len(data) else []\n\n# inputs is a list of strings\n# write your code below\n\n`
|
||||
} else if (exercise.doc?.language == 'JavaScript') {
|
||||
boilerplate.value = `const fs = require('fs');\n\nlet input = fs.readFileSync('/app/stdin', 'utf8').trim();\nconst inputs = input.split("\\n");\n// inputs is an array of strings\n// write your code below\n`
|
||||
}
|
||||
}
|
||||
|
||||
const checkIfUserIsPermitted = (doc: any = null) => {
|
||||
if (!user.data) {
|
||||
window.location.href = `/login?redirect-to=/lms/programming-exercises/${props.exerciseID}/submission/${props.submissionID}`
|
||||
}
|
||||
|
||||
if (!doc) return
|
||||
if (
|
||||
doc.owner != user.data?.name &&
|
||||
!user.data?.is_instructor &&
|
||||
!user.data?.is_moderator &&
|
||||
!user.data.is_evaluator
|
||||
) {
|
||||
router.push({
|
||||
name: 'ProgrammingExerciseSubmission',
|
||||
params: { exerciseID: props.exerciseID, submissionID: 'new' },
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
const updateTestCases = (doc: any) => {
|
||||
if (testCases.value.length === 0) {
|
||||
testCases.value = doc.test_cases || []
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => submission.doc,
|
||||
(doc) => {
|
||||
if (doc) {
|
||||
checkIfUserIsPermitted(doc)
|
||||
updateTestCases(doc)
|
||||
updateCode(doc.code)
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
const loadFalcon = () => {
|
||||
if (livecodeURL.data.includes('falcon.frappe.io') && !user.data?.is_fc_site) {
|
||||
falconError.value = __(
|
||||
'Only Frappe Cloud sites can use Falcon Live Code. Please migrate your site to Frappe Cloud or setup Falcon Live Code on your own server.'
|
||||
)
|
||||
return
|
||||
} else if (livecodeURL.data) {
|
||||
falconURL.value = livecodeURL.data
|
||||
} else if (!livecodeURL.data && !user.data?.is_fc_site) {
|
||||
falconError.value = __(
|
||||
'Live Code URL is not set. Please set it from the Settings.'
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script')
|
||||
script.src = `${falconURL.value}static/livecode.js`
|
||||
script.onload = resolve
|
||||
script.onerror = reject
|
||||
document.head.appendChild(script)
|
||||
})
|
||||
}
|
||||
|
||||
const submitCode = async () => {
|
||||
await runCode()
|
||||
createSubmission()
|
||||
}
|
||||
|
||||
const runCode = async () => {
|
||||
if (!exercise.doc?.test_cases?.length) return
|
||||
|
||||
testCases.value = []
|
||||
if (testCaseSection.value) {
|
||||
testCaseSection.value.scrollIntoView({ behavior: 'smooth' })
|
||||
}
|
||||
|
||||
for (const test_case of exercise.doc.test_cases) {
|
||||
let result = await execute(test_case.input)
|
||||
if (error.value) {
|
||||
errorMessage.value = result
|
||||
break
|
||||
} else {
|
||||
output.value = result
|
||||
}
|
||||
let status =
|
||||
result.trim() === test_case.expected_output.trim() ? 'Passed' : 'Failed'
|
||||
testCases.value.push({
|
||||
input: test_case.input,
|
||||
output: result,
|
||||
expected_output: test_case.expected_output,
|
||||
status: status,
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const createSubmission = () => {
|
||||
if (!testCases.value.length) return
|
||||
let codeToSave = code.value?.replace(boilerplate.value, '') || ''
|
||||
|
||||
call('lms.lms.api.create_programming_exercise_submission', {
|
||||
exercise: props.exerciseID,
|
||||
submission: props.submissionID,
|
||||
code: codeToSave,
|
||||
test_cases: testCases.value,
|
||||
})
|
||||
.then((data: any) => {
|
||||
if (props.submissionID == 'new') {
|
||||
router.push({
|
||||
name: 'ProgrammingExerciseSubmission',
|
||||
params: { exerciseID: props.exerciseID, submissionID: data },
|
||||
})
|
||||
fetchSubmission(data)
|
||||
} else {
|
||||
fetchSubmission(props.submissionID)
|
||||
}
|
||||
toast.success(__('Submission saved!'))
|
||||
})
|
||||
.catch((error: any) => {
|
||||
console.error('Error creating submission:', error)
|
||||
toast.error(
|
||||
__('Failed to submit. Please try again. {0}').format({ error })
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
const execute = (stdin = ''): Promise<string> => {
|
||||
return new Promise((resolve, reject) => {
|
||||
let outputChunks: string[] = []
|
||||
let hasExited = false
|
||||
let hasError = false
|
||||
|
||||
let session = new LiveCodeSession({
|
||||
base_url: falconURL.value,
|
||||
runtime: exercise.doc?.language.toLowerCase() || 'python',
|
||||
code: code.value,
|
||||
files: [{ filename: 'stdin', contents: stdin }],
|
||||
onMessage: (msg: any) => {
|
||||
console.log('msg', msg)
|
||||
|
||||
if (msg.msgtype === 'write' && msg.file === 'stdout') {
|
||||
outputChunks.push(msg.data)
|
||||
}
|
||||
|
||||
if (msg.msgtype === 'write' && msg.file === 'stderr') {
|
||||
hasError = true
|
||||
errorMessage.value = msg.data
|
||||
}
|
||||
|
||||
if (msg.msgtype === 'exitstatus') {
|
||||
hasExited = true
|
||||
if (msg.exitstatus !== 0) {
|
||||
error.value = true
|
||||
} else {
|
||||
error.value = false
|
||||
}
|
||||
resolve(outputChunks.join('').trim())
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
if (!hasExited) {
|
||||
error.value = true
|
||||
errorMessage.value = 'Execution timed out.'
|
||||
reject('Execution timed out.')
|
||||
}
|
||||
}, 20000)
|
||||
})
|
||||
}
|
||||
|
||||
const breadcrumbs = computed(() => {
|
||||
return [
|
||||
{
|
||||
label: __('Programming Exercise Submissions'),
|
||||
route: { name: 'ProgrammingExerciseSubmissions' },
|
||||
},
|
||||
{ label: exercise.doc?.title },
|
||||
]
|
||||
})
|
||||
|
||||
usePageMeta(() => {
|
||||
return {
|
||||
title: __('Programming Exercise Submission'),
|
||||
icon: brand.favicon,
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style>
|
||||
.ProseMirror pre {
|
||||
background: theme('colors.gray.200');
|
||||
color: theme('colors.gray.900');
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,306 @@
|
||||
<template>
|
||||
<header
|
||||
class="sticky flex items-center justify-between top-0 z-10 border-b bg-surface-white px-3 py-2.5 sm:px-5"
|
||||
>
|
||||
<Breadcrumbs :items="breadcrumbs" />
|
||||
</header>
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between space-x-32 mb-5">
|
||||
<div class="text-xl font-semibold text-ink-gray-7">
|
||||
{{
|
||||
submissions.data?.length
|
||||
? __('{0} Submissions').format(submissions.data.length)
|
||||
: __('No Submissions')
|
||||
}}
|
||||
</div>
|
||||
<div
|
||||
v-if="submissions.data?.length"
|
||||
class="grid grid-cols-3 gap-5 flex-1"
|
||||
>
|
||||
<Link
|
||||
doctype="LMS Programming Exercise"
|
||||
v-model="filters.exercise"
|
||||
:placeholder="__('Filter by Exercise')"
|
||||
/>
|
||||
<Link
|
||||
doctype="User"
|
||||
v-model="filters.member"
|
||||
:placeholder="__('Filter by Member')"
|
||||
:readonly="isStudent"
|
||||
/>
|
||||
<FormControl
|
||||
v-model="filters.status"
|
||||
type="select"
|
||||
:options="[
|
||||
{ label: __(''), value: '' },
|
||||
{ label: __('Passed'), value: 'Passed' },
|
||||
{ label: __('Failed'), value: 'Failed' },
|
||||
]"
|
||||
:placeholder="__('Filter by Status')"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<ListView
|
||||
v-if="submissions.loading || submissions.data?.length"
|
||||
:columns="submissionColumns"
|
||||
:rows="submissions.data"
|
||||
rowKey="name"
|
||||
:options="{
|
||||
selectable: true,
|
||||
}"
|
||||
>
|
||||
<ListHeader
|
||||
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
|
||||
>
|
||||
<ListHeaderItem
|
||||
:item="item"
|
||||
v-for="item in submissionColumns"
|
||||
:key="item.key"
|
||||
>
|
||||
<template #prefix="{ item }">
|
||||
<FeatherIcon :name="item.icon?.toString()" class="h-4 w-4" />
|
||||
</template>
|
||||
</ListHeaderItem>
|
||||
</ListHeader>
|
||||
<ListRows>
|
||||
<router-link
|
||||
v-for="row in submissions.data"
|
||||
:to="{
|
||||
name: 'ProgrammingExerciseSubmission',
|
||||
params: {
|
||||
exerciseID: row.exercise,
|
||||
submissionID: row.name,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<ListRow :row="row">
|
||||
<template #default="{ column, item }">
|
||||
<ListRowItem :item="row[column.key]" :align="column.align">
|
||||
<template #prefix>
|
||||
<div v-if="column.key == 'member_name'">
|
||||
<Avatar
|
||||
class="flex items-center"
|
||||
:image="row['member_image']"
|
||||
:label="item"
|
||||
size="sm"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<div v-if="column.key == 'status'">
|
||||
<Badge
|
||||
:theme="row[column.key] === 'Passed' ? 'green' : 'red'"
|
||||
>
|
||||
{{ row[column.key] }}
|
||||
</Badge>
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ row[column.key] }}
|
||||
</div>
|
||||
</ListRowItem>
|
||||
</template>
|
||||
</ListRow>
|
||||
</router-link>
|
||||
</ListRows>
|
||||
<ListSelectBanner>
|
||||
<template #actions="{ unselectAll, selections }">
|
||||
<div class="flex gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
@click="deleteExercises(selections, unselectAll)"
|
||||
>
|
||||
<Trash2 class="h-4 w-4 stroke-1.5" />
|
||||
</Button>
|
||||
</div>
|
||||
</template>
|
||||
</ListSelectBanner>
|
||||
</ListView>
|
||||
<EmptyState v-else type="Programming Exercise Submissions" />
|
||||
<div
|
||||
v-if="submissions.data && submissions.hasNextPage"
|
||||
class="flex justify-center my-5"
|
||||
>
|
||||
<Button @click="submissions.next()">
|
||||
{{ __('Load More') }}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
Avatar,
|
||||
Badge,
|
||||
Breadcrumbs,
|
||||
Button,
|
||||
createListResource,
|
||||
FeatherIcon,
|
||||
FormControl,
|
||||
ListView,
|
||||
ListHeader,
|
||||
ListHeaderItem,
|
||||
ListRows,
|
||||
ListRow,
|
||||
ListRowItem,
|
||||
ListSelectBanner,
|
||||
usePageMeta,
|
||||
toast,
|
||||
} from 'frappe-ui'
|
||||
import type {
|
||||
ProgrammingExerciseSubmission,
|
||||
Filters,
|
||||
} from '@/pages/ProgrammingExercises/types'
|
||||
import { computed, inject, onMounted, ref, watch } from 'vue'
|
||||
import { sessionStore } from '@/stores/session'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { Trash2 } from 'lucide-vue-next'
|
||||
import Link from '@/components/Controls/Link.vue'
|
||||
import EmptyState from '@/components/EmptyState.vue'
|
||||
|
||||
const { brand } = sessionStore()
|
||||
const dayjs = inject('$dayjs') as any
|
||||
const user = inject('$user') as any
|
||||
const filterFields = ['exercise', 'member', 'status']
|
||||
const filters = ref<Filters>({
|
||||
exercise: '',
|
||||
member: '',
|
||||
status: '',
|
||||
})
|
||||
const router = useRouter()
|
||||
|
||||
onMounted(() => {
|
||||
setFiltersFromRoute()
|
||||
fetchBasedOnRole()
|
||||
})
|
||||
|
||||
const setFiltersFromRoute = () => {
|
||||
filterFields.forEach((field) => {
|
||||
if (router.currentRoute.value.query[field]) {
|
||||
filters.value[field as keyof Filters] = router.currentRoute.value.query[
|
||||
field
|
||||
] as string
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const fetchBasedOnRole = () => {
|
||||
if (isStudent.value) {
|
||||
filters.value['member'] = user.data?.name
|
||||
} else {
|
||||
submissions.reload()
|
||||
}
|
||||
}
|
||||
|
||||
const submissions = createListResource({
|
||||
doctype: 'LMS Programming Exercise Submission',
|
||||
fields: [
|
||||
'name',
|
||||
'exercise',
|
||||
'exercise_title',
|
||||
'member_name',
|
||||
'member_image',
|
||||
'status',
|
||||
'modified',
|
||||
],
|
||||
orderBy: 'modified desc',
|
||||
transform(data: ProgrammingExercise[]) {
|
||||
return data.map((submission: ProgrammingExerciseSubmission) => {
|
||||
return {
|
||||
...submission,
|
||||
modified: dayjs(submission.modified).fromNow(),
|
||||
}
|
||||
})
|
||||
},
|
||||
})
|
||||
|
||||
watch(filters.value, () => {
|
||||
let filtersToApply: Record<string, any> = {}
|
||||
filterFields.forEach((field) => {
|
||||
if (filters.value[field as keyof Filters]) {
|
||||
filtersToApply[field] = filters.value[field as keyof Filters]
|
||||
router.push({
|
||||
query: {
|
||||
...router.currentRoute.value.query,
|
||||
[field]: filters.value[field as keyof Filters],
|
||||
},
|
||||
})
|
||||
} else {
|
||||
delete filtersToApply[field]
|
||||
const query = { ...router.currentRoute.value.query }
|
||||
delete query[field]
|
||||
router.push({
|
||||
query,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
submissions.update({
|
||||
filters: {
|
||||
...filtersToApply,
|
||||
},
|
||||
})
|
||||
submissions.reload()
|
||||
})
|
||||
|
||||
const deleteExercises = (selections: Set<string>, unselectAll: () => void) => {
|
||||
Array.from(selections).forEach(async (submission: string) => {
|
||||
await submissions.delete.submit(submission)
|
||||
})
|
||||
unselectAll()
|
||||
toast.success(__('Submissions deleted successfully'))
|
||||
}
|
||||
|
||||
const isStudent = computed(() => {
|
||||
return (
|
||||
!user.data?.is_instructor &&
|
||||
!user.data?.is_moderator &&
|
||||
!user.data?.is_evaluator
|
||||
)
|
||||
})
|
||||
|
||||
const submissionColumns = computed(() => {
|
||||
return [
|
||||
{
|
||||
label: __('Member'),
|
||||
key: 'member_name',
|
||||
width: '20%',
|
||||
icon: 'user',
|
||||
},
|
||||
{
|
||||
label: __('Exercise'),
|
||||
key: 'exercise_title',
|
||||
width: '30%',
|
||||
icon: 'code',
|
||||
},
|
||||
{
|
||||
label: __('Status'),
|
||||
key: 'status',
|
||||
width: '20%',
|
||||
icon: 'check-circle',
|
||||
},
|
||||
{
|
||||
label: __('Modified'),
|
||||
key: 'modified',
|
||||
width: '20%',
|
||||
icon: 'clock',
|
||||
align: 'right',
|
||||
},
|
||||
]
|
||||
})
|
||||
|
||||
const breadcrumbs = computed(() => {
|
||||
return [
|
||||
{
|
||||
label: __('Programming Exercise Submissions'),
|
||||
route: {
|
||||
name: 'ProgrammingExerciseSubmissions',
|
||||
},
|
||||
},
|
||||
]
|
||||
})
|
||||
|
||||
usePageMeta(() => {
|
||||
return {
|
||||
title: __('Programming Exercises'),
|
||||
icon: brand.favicon,
|
||||
}
|
||||
})
|
||||
</script>
|
||||
170
frontend/src/pages/ProgrammingExercises/ProgrammingExercises.vue
Normal file
170
frontend/src/pages/ProgrammingExercises/ProgrammingExercises.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<header
|
||||
class="sticky flex items-center justify-between top-0 z-10 border-b bg-surface-white px-3 py-2.5 sm:px-5"
|
||||
>
|
||||
<Breadcrumbs :items="breadcrumbs" />
|
||||
<div class="space-x-2">
|
||||
<router-link
|
||||
:to="{
|
||||
name: 'ProgrammingExerciseSubmissions',
|
||||
}"
|
||||
>
|
||||
<Button>
|
||||
<template #prefix>
|
||||
<ClipboardList class="size-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('Check All Submissions') }}
|
||||
</Button>
|
||||
</router-link>
|
||||
<Button
|
||||
v-if="!readOnlyMode"
|
||||
variant="solid"
|
||||
@click="
|
||||
() => {
|
||||
exerciseID = 'new'
|
||||
showForm = true
|
||||
}
|
||||
"
|
||||
>
|
||||
<template #prefix>
|
||||
<Plus class="h-4 w-4 stroke-1.5" />
|
||||
</template>
|
||||
{{ __('New') }}
|
||||
</Button>
|
||||
</div>
|
||||
</header>
|
||||
<div class="md:w-4/5 md:mx-auto p-5">
|
||||
<div class="flex items-center justify-between mb-5">
|
||||
<div v-if="exerciseCount" class="text-lg font-semibold text-ink-gray-9">
|
||||
{{ __('{0} Exercises').format(exerciseCount) }}
|
||||
</div>
|
||||
<div
|
||||
v-if="exercises.data?.length || exerciseCount > 0"
|
||||
class="grid grid-cols-2 gap-5"
|
||||
>
|
||||
<!-- <FormControl
|
||||
v-model="titleFilter"
|
||||
:placeholder="__('Search by title')"
|
||||
/>
|
||||
<FormControl
|
||||
v-model="typeFilter"
|
||||
type="select"
|
||||
:options="assignmentTypes"
|
||||
:placeholder="__('Type')"
|
||||
/> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="exercises.data?.length"
|
||||
class="grid grid-cols-1 md:grid-cols-3 gap-4"
|
||||
>
|
||||
<div
|
||||
v-for="exercise in exercises.data"
|
||||
:key="exercise.name"
|
||||
@click="
|
||||
() => {
|
||||
exerciseID = exercise.name
|
||||
showForm = true
|
||||
}
|
||||
"
|
||||
class="flex flex-col border rounded-md p-3 h-full hover:border-outline-gray-3 space-y-2 cursor-pointer"
|
||||
>
|
||||
<div class="text-lg font-semibold text-ink-gray-9">
|
||||
{{ exercise.title }}
|
||||
</div>
|
||||
<div class="text-sm text-ink-gray-7">
|
||||
{{ exercise.language }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<EmptyState v-else type="Programming Exercises" />
|
||||
<div
|
||||
v-if="exercises.data && exercises.hasNextPage"
|
||||
class="flex justify-center my-5"
|
||||
>
|
||||
<Button @click="exercises.next()">
|
||||
{{ __('Load More') }}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<ProgrammingExerciseForm
|
||||
v-model="showForm"
|
||||
:exerciseID="exerciseID"
|
||||
v-model:exercises="exercises"
|
||||
/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { computed, inject, onMounted, ref } from 'vue'
|
||||
import {
|
||||
Breadcrumbs,
|
||||
Button,
|
||||
call,
|
||||
createListResource,
|
||||
usePageMeta,
|
||||
} from 'frappe-ui'
|
||||
import { ClipboardList, Plus } from 'lucide-vue-next'
|
||||
import { sessionStore } from '@/stores/session'
|
||||
import { useRouter } from 'vue-router'
|
||||
import ProgrammingExerciseForm from '@/pages/ProgrammingExercises/ProgrammingExerciseForm.vue'
|
||||
|
||||
const exerciseCount = ref<number>(0)
|
||||
const readOnlyMode = window.read_only_mode
|
||||
const { brand } = sessionStore()
|
||||
const showForm = ref<boolean>(false)
|
||||
const exerciseID = ref<string | null>('new')
|
||||
const user = inject<any>('$user')
|
||||
const router = useRouter()
|
||||
|
||||
onMounted(() => {
|
||||
validatePermissions()
|
||||
getExerciseCount()
|
||||
})
|
||||
|
||||
const validatePermissions = () => {
|
||||
if (
|
||||
!user.data?.is_instructor &&
|
||||
!user.data?.is_moderator &&
|
||||
!user.data?.is_evaluator
|
||||
) {
|
||||
router.push({
|
||||
name: 'ProgrammingExerciseSubmissions',
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const getExerciseCount = () => {
|
||||
call('frappe.client.get_count', {
|
||||
doctype: 'LMS Programming Exercise',
|
||||
})
|
||||
.then((count: number) => {
|
||||
exerciseCount.value = count
|
||||
})
|
||||
.catch((error: any) => {
|
||||
console.error('Error fetching exercise count:', error)
|
||||
})
|
||||
}
|
||||
|
||||
const exercises = createListResource({
|
||||
doctype: 'LMS Programming Exercise',
|
||||
cache: ['programmingExercises'],
|
||||
fields: ['name', 'title', 'language', 'problem_statement'],
|
||||
auto: true,
|
||||
})
|
||||
|
||||
usePageMeta(() => {
|
||||
return {
|
||||
title: __('Programming Exercises'),
|
||||
icon: brand.favicon,
|
||||
}
|
||||
})
|
||||
|
||||
const breadcrumbs = computed(() => {
|
||||
return [
|
||||
{
|
||||
label: __('Programming Exercises'),
|
||||
route: { name: 'ProgrammingExercises' },
|
||||
},
|
||||
]
|
||||
})
|
||||
</script>
|
||||
47
frontend/src/pages/ProgrammingExercises/types.ts
Normal file
47
frontend/src/pages/ProgrammingExercises/types.ts
Normal file
@@ -0,0 +1,47 @@
|
||||
interface ProgrammingExercise {
|
||||
name: string;
|
||||
title: string;
|
||||
language: 'Python' | 'JavaScript';
|
||||
test_cases_count: number;
|
||||
problem_statement: string;
|
||||
test_cases: [TestCase];
|
||||
}
|
||||
|
||||
interface TestCase {
|
||||
name: string;
|
||||
input: string;
|
||||
expected_output: string;
|
||||
output: string;
|
||||
status: 'Passed' | 'Failed';
|
||||
}
|
||||
|
||||
type Filters = {
|
||||
exercise?: string,
|
||||
member?: string,
|
||||
status?: string
|
||||
}
|
||||
|
||||
type ProgrammingExercises = {
|
||||
data: ProgrammingExercise[]
|
||||
reload: () => void
|
||||
hasNextPage: boolean
|
||||
next: () => void
|
||||
setValue: {
|
||||
submit: (
|
||||
data: ProgrammingExercise,
|
||||
options?: { onSuccess?: () => void }
|
||||
) => void
|
||||
}
|
||||
insert: {
|
||||
submit: (
|
||||
data: ProgrammingExercise,
|
||||
options?: { onSuccess?: () => void }
|
||||
) => void
|
||||
}
|
||||
delete: {
|
||||
submit: (
|
||||
name: string,
|
||||
options?: { onSuccess?: () => void }
|
||||
) => void
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user