Add nicer loading screen while OTA is loading (#9499)

src/screens/Settings/components/OTAInfo.tsx

@@ -4,6 +4,8 @@ import {useLingui} from '@lingui/react'
 import {Trans} from '@lingui/react/macro'
 import {useMutation, useQuery} from '@tanstack/react-query'
 
+import {splash} from '#/lib/hooks/useOTAUpdates'
+import {useTheme} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
 import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as RetryIcon} from '#/components/icons/ArrowRotate'
 import {Shapes_Stroke2_Corner0_Rounded as ShapesIcon} from '#/components/icons/Shapes'
@@ -13,6 +15,7 @@ import * as SettingsList from '../components/SettingsList'
 
 export function OTAInfo() {
   const {_} = useLingui()
+  const t = useTheme()
   const {
     data: isAvailable,
     isPending: isPendingInfo,
@@ -31,7 +34,9 @@ export function OTAInfo() {
     useMutation({
       mutationFn: async () => {
         await Updates.fetchUpdateAsync()
-        await Updates.reloadAsync()
+        await Updates.reloadAsync({
+          reloadScreenOptions: splash(t.scheme),
+        })
       },
       onError: error =>
         Toast.show(`Failed to update: ${error.message}`, {