From d8c9204b61c8b616647b1067ae65f44fcc143844 Mon Sep 17 00:00:00 2001
From: muhamiyan <apriliansyahidris@gmail.com>
Date: Tue, 9 Dec 2025 11:19:51 +0700
Subject: [PATCH] fix: open dialog directly to create quiz

---
 frontend/src/pages/QuizForm.vue | 70 +++++++++++++++++++++++++++++++--
 frontend/src/pages/Quizzes.vue  |  6 ++-
 2 files changed, 72 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/QuizForm.vue b/frontend/src/pages/QuizForm.vue
index d3e8cc7a..4c4596d7 100644
--- a/frontend/src/pages/QuizForm.vue
+++ b/frontend/src/pages/QuizForm.vue
@@ -39,11 +39,37 @@
 					{{ __('Check Submissions') }}
 				</Button>
 			</router-link>
-			<Button variant="solid" @click="submitQuiz()">
+			<Button v-if="quizDetails.doc?.name" variant="solid" @click="submitQuiz()">
 				{{ __('Save') }}
 			</Button>
+			<Button v-else variant="solid" @click="showNewQuizModal = true">
+				<template #prefix>
+					<Plus class="w-4 h-4" />
+				</template>
+				{{ __('Create') }}
+			</Button>
 		</div>
 	</header>
+	<Dialog
+		v-model="showNewQuizModal"
+		:options="{
+			title: __('Create a Quiz'),
+			size: 'sm',
+			actions: [
+				{
+					label: __('Save'),
+					variant: 'solid',
+					onClick({ close }) {
+						saveQuizCreation(close)
+					},
+				},
+			],
+		}"
+	>
+		<template #body-content>
+			<FormControl v-model="quizTitle" :label="__('Title')" type="text" />
+		</template>
+	</Dialog>
 	<div v-if="quizDetails.doc" class="py-5">
 		<div class="px-20 pb-5 space-y-5 border-b mb-5">
 			<div class="text-lg text-ink-gray-9 font-semibold mb-4">
@@ -217,7 +243,7 @@ import {
 	usePageMeta,
 	toast,
 	createDocumentResource,
-	Badge,
+	Badge, Dialog, createListResource,
 } from 'frappe-ui'
 import {
 	computed,
@@ -244,6 +270,8 @@ const currentQuestion = reactive({
 const user = inject('$user')
 const router = useRouter()
 const readOnlyMode = window.read_only_mode
+const quizTitle = ref('')
+const showNewQuizModal = ref(false)
 
 const props = defineProps({
 	quizID: {
@@ -260,6 +288,8 @@ onMounted(() => {
 	}
 	if (props.quizID !== 'new') {
 		quizDetails.reload()
+	} else {
+		showNewQuizModal.value = true
 	}
 	window.addEventListener('keydown', keyboardShortcut)
 })
@@ -296,7 +326,41 @@ const quizDetails = createDocumentResource({
 })
 
 const validateTitle = () => {
-	quizDetails.doc.title = escapeHTML(quizDetails.doc.title.trim())
+	if (props.quizID !== 'new') {
+		quizDetails.doc.title = escapeHTML(quizDetails.doc.title.trim())
+	} else {
+		quizTitle.value = escapeHTML(quizTitle.value.trim())
+	}
+}
+
+const quizCreate = createListResource({
+	doctype: 'LMS Quiz',
+})
+
+const saveQuizCreation = (close) => {
+	validateTitle()
+	quizCreate.insert.submit(
+		{
+			title: quizTitle.value
+		},
+		{
+			onSuccess(data) {
+				toast.success(__('Quiz created successfully'))
+				close()
+				router.push({
+					name: 'QuizForm',
+					params: {
+						quizID: data.name,
+					},
+				}).then(() => {
+					router.go(0)
+				})
+			},
+			onError(error) {
+				toast.error(__('Error creating quiz: {0}', error.message))
+			},
+		}
+	)
 }
 
 const submitQuiz = () => {
diff --git a/frontend/src/pages/Quizzes.vue b/frontend/src/pages/Quizzes.vue
index b8c6afab..7d40878a 100644
--- a/frontend/src/pages/Quizzes.vue
+++ b/frontend/src/pages/Quizzes.vue
@@ -134,7 +134,7 @@ import {
 	toast,
 	usePageMeta,
 } from 'frappe-ui'
-import { useRouter } from 'vue-router'
+import { useRouter, useRoute } from 'vue-router'
 import { computed, inject, onMounted, ref, watch } from 'vue'
 import { Plus } from 'lucide-vue-next'
 import { sessionStore } from '@/stores/session'
@@ -145,6 +145,7 @@ const { brand } = sessionStore()
 const user = inject('$user')
 const dayjs = inject('$dayjs')
 const router = useRouter()
+const route = useRoute();
 const search = ref('')
 const readOnlyMode = window.read_only_mode
 const quizFilters = ref({})
@@ -157,6 +158,9 @@ onMounted(() => {
 	} else if (!user.data?.is_moderator) {
 		quizFilters.value['owner'] = user.data?.name
 	}
+	if (route.query.new === 'true') {
+		showForm.value = true
+	}
 })
 
 watch(search, () => {