refresh speaking practice filter after create

Re-fetch practice options after creating a speaking practice and auto-select the new set so freshly created practices appear immediately in the filter and question list.

Made-with: Cursor

src/pages/content-management/SpeakingPage.tsx

@@ -268,53 +268,46 @@ export function SpeakingPage() {
     fetchAudioQuestions()
   }, [fetchAudioQuestions, audioPageSize, selectedPracticeId])
 
-  useEffect(() => {
+  const fetchPracticeOptions = useCallback(async () => {
-    let cancelled = false
+    const batchSize = 100
-    const fetchPractices = async () => {
+    let offset = 0
-      try {
+    let total = Number.POSITIVE_INFINITY
-        const batchSize = 100
+    const all: QuestionSet[] = []
-        let offset = 0
+    while (all.length < total) {
-        let total = Number.POSITIVE_INFINITY
+      const res = await getQuestionSets({
-        const all: QuestionSet[] = []
+        set_type: "PRACTICE",
-        while (all.length < total) {
+        limit: batchSize,
-          const res = await getQuestionSets({
+        offset,
-            set_type: "PRACTICE",
+      })
-            limit: batchSize,
+      const payload = res.data?.data
-            offset,
+      let chunk: QuestionSet[] = []
-          })
+      let chunkTotal = 0
-          const payload = res.data?.data
+      if (Array.isArray(payload)) {
-          let chunk: QuestionSet[] = []
+        chunk = payload
-          let chunkTotal = 0
+        chunkTotal = payload.length
-          if (Array.isArray(payload)) {
+      } else if (payload && typeof payload === "object") {
-            chunk = payload
+        chunk = payload.question_sets ?? []
-            chunkTotal = payload.length
+        chunkTotal = payload.total_count ?? chunk.length
-          } else if (payload && typeof payload === "object") {
-            chunk = payload.question_sets ?? []
-            chunkTotal = payload.total_count ?? chunk.length
-          }
-          all.push(...chunk)
-          total = chunkTotal
-          if (chunk.length < batchSize) break
-          offset += chunk.length
-        }
-        if (!cancelled) {
-          setPracticeOptions(
-            all.map((p) => ({
-              id: p.id,
-              title: p.title,
-            })),
-          )
-        }
-      } catch {
-        if (!cancelled) setPracticeOptions([])
       }
+      all.push(...chunk)
+      total = chunkTotal
+      if (chunk.length < batchSize) break
+      offset += chunk.length
     }
-    fetchPractices()
+    setPracticeOptions(
-    return () => {
+      all.map((p) => ({
-      cancelled = true
+        id: p.id,
-    }
+        title: p.title,
+      })),
+    )
   }, [])
 
+  useEffect(() => {
+    fetchPracticeOptions().catch(() => {
+      setPracticeOptions([])
+    })
+  }, [fetchPracticeOptions])
+
   useEffect(() => {
     let cancelled = false
     const fetchSubCourseOptions = async () => {
@@ -894,6 +887,8 @@ export function SpeakingPage() {
       setOpenCreate(false)
       setCurrentStep(1)
       resetCreateForm()
+      await fetchPracticeOptions()
+      setSelectedPracticeId(String(setId))
       toast.success(`Speaking practice created with ${draftsToCreate.length} AUDIO question(s)`)
       await fetchAudioQuestions()
     } catch (error) {