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,10 +268,7 @@ export function SpeakingPage() {
     fetchAudioQuestions()
   }, [fetchAudioQuestions, audioPageSize, selectedPracticeId])
 
-  useEffect(() => {
+  const fetchPracticeOptions = useCallback(async () => {
-    let cancelled = false
-    const fetchPractices = async () => {
-      try {
     const batchSize = 100
     let offset = 0
     let total = Number.POSITIVE_INFINITY
@@ -297,24 +294,20 @@ export function SpeakingPage() {
       if (chunk.length < batchSize) break
       offset += chunk.length
     }
-        if (!cancelled) {
     setPracticeOptions(
       all.map((p) => ({
         id: p.id,
         title: p.title,
       })),
     )
-        }
-      } catch {
-        if (!cancelled) setPracticeOptions([])
-      }
-    }
-    fetchPractices()
-    return () => {
-      cancelled = true
-    }
   }, [])
 
+  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) {