refactor: merge watch targets, flatten callback (#812)

packages/stage-ui/src/components/gadgets/AudioSpectrum.vue

@@ -18,9 +18,7 @@ onMounted(() => {
   handleAnalyze()
 })
 
-watch(() => props.stream, () => {
-  handleAnalyze()
-})
+watch(() => props.stream, handleAnalyze)
 
 function handleAnalyze() {
   if (!props.stream) {

packages/stage-ui/src/components/scenarios/chat/ChatHistory.vue

@@ -42,10 +42,9 @@ function scrollToBottom() {
   })
 }
 
-watch(() => props.messages, () => scrollToBottom(), { deep: true, flush: 'post' })
-watch(() => props.streamingMessage, () => scrollToBottom(), { deep: true, flush: 'post' })
-watch(() => props.sending, () => scrollToBottom(), { flush: 'post' })
-onMounted(() => scrollToBottom())
+watch([() => props.messages, () => props.streamingMessage], scrollToBottom, { deep: true, flush: 'post' })
+watch(() => props.sending, scrollToBottom, { flush: 'post' })
+onMounted(scrollToBottom)
 
 const streaming = computed<ChatAssistantMessage>(() => props.streamingMessage ?? { role: 'assistant', content: '', slices: [], tool_results: [] })
 const showStreamingPlaceholder = computed(() => (streaming.value.slices?.length ?? 0) === 0 && !streaming.value.content)

packages/stage-ui/src/components/scenarios/dialogs/onboarding/step-provider-configuration.vue

@@ -37,9 +37,7 @@ function initializeForm() {
 }
 
 // Watch for provider changes
-watch(() => context.selectedProvider.value?.id, () => {
-  initializeForm()
-})
+watch(() => context.selectedProvider.value?.id, initializeForm)
 
 // Computed properties
 const needsApiKey = computed(() => {

packages/stage-ui/src/components/scenes/live2d/Canvas.vue

@@ -65,8 +65,7 @@ function handleResize() {
   // The CSS styles handle the display size, so we don't need to manually set view dimensions
 }
 
-watch([() => props.width, () => props.height], () => handleResize())
-watch(() => props.resolution, () => handleResize())
+watch([() => props.width, () => props.height, () => props.resolution], handleResize)
 
 onMounted(async () => containerRef.value && await initLive2DPixiStage(containerRef.value))
 onUnmounted(() => pixiApp.value?.destroy())

packages/stage-ui/src/components/scenes/live2d/Model.vue

@@ -393,7 +393,7 @@ function updateDropShadowFilter() {
   model.value.filters = [dropShadowFilter.value]
 }
 
-watch([() => props.width, () => props.height], () => handleResize())
+watch([() => props.width, () => props.height], handleResize)
 watch(modelSrcRef, async () => await loadModel(), { immediate: true })
 watch(dark, updateDropShadowFilter, { immediate: true })
 watch([model, themeColorsHue], updateDropShadowFilter)