🚸(frontend) add loading spinner for recording save process

Display loading spinner in side panel during transcript and screen recording
save operations. Provides visual feedback about ongoing processing that was
previously only indicated by title text, making the save status more explicit
to users.

src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx

@@ -22,6 +22,7 @@ import {
 } from '@/features/notifications'
 import posthog from 'posthog-js'
 import { useSnapshot } from 'valtio/index'
+import { Spinner } from '@/primitives/Spinner'
 
 export const ScreenRecordingSidePanel = () => {
   const [isLoading, setIsLoading] = useState(false)
@@ -160,6 +161,7 @@ export const ScreenRecordingSidePanel = () => {
               >
                 {t('stopping.body')}
               </Text>
+              <Spinner />
             </>
           ) : (
             <>

src/frontend/src/features/recording/components/TranscriptSidePanel.tsx

@@ -26,6 +26,7 @@ import {
 } from '@/features/notifications'
 import posthog from 'posthog-js'
 import { useSnapshot } from 'valtio/index'
+import { Spinner } from '@/primitives/Spinner'
 
 export const TranscriptSidePanel = () => {
   const [isLoading, setIsLoading] = useState(false)
@@ -193,6 +194,7 @@ export const TranscriptSidePanel = () => {
                   >
                     {t('stopping.body')}
                   </Text>
+                  <Spinner />
                 </>
               ) : (
                 <>