chore: toast and load indicator

hyoban · Aug 17, 2024 · 96fb9bd · 96fb9bd
1 parent c1ddd37
commit 96fb9bd
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 7 deletions.
diff --git a/app/(app)/_layout.tsx b/app/(app)/_layout.tsx
@@ -3,7 +3,7 @@ import * as Notifications from 'expo-notifications'
 import { Redirect, Stack } from 'expo-router'
 import { useAtomValue } from 'jotai'
 import { useEffect } from 'react'
-import { Platform } from 'react-native'
+import { ActivityIndicator, Platform } from 'react-native'
 import BackgroundFetch from 'react-native-background-fetch'
 import TrackPlayer, { Capability, Event } from 'react-native-track-player'
 import { createStyleSheet, useStyles } from 'react-native-unistyles'
@@ -97,10 +97,11 @@ export default function RootLayout() {
         options={({ route }) => {
           const view = tabViewList.find(view => view.name === getFocusedRouteNameFromRoute(route))
           return {
-            title: isUpdating ? 'Updating...' : view?.title,
+            title: view?.title,
             headerLeft: () => (
               <Row gap={18}>
                 <SettingsLink />
+                {isUpdating && <ActivityIndicator />}
               </Row>
             ),
             headerRight: () => (

diff --git a/app/(app)/feed/detail/[entryId].tsx b/app/(app)/feed/detail/[entryId].tsx
@@ -10,7 +10,7 @@ import { FlatList, Pressable, View } from 'react-native'
 import PagerView from 'react-native-pager-view'
 import Animated, { FadeIn, runOnJS, SlideInDown, SlideOutDown, useAnimatedScrollHandler, useSharedValue } from 'react-native-reanimated'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
-import { useToast } from 'react-native-toast-notifications'
+import { Toast } from 'react-native-toast-notifications'
 import { createStyleSheet, UnistylesRuntime, useStyles } from 'react-native-unistyles'
 import useSWR from 'swr'
 
@@ -109,7 +109,6 @@ function EntryReadUsers({ users }: { users?: Array<Omit<User, 'emailVerified'>>
 
 function EntryToolsbar({ entry }: { entry: Entry }) {
   const { styles } = useStyles(stylesheet)
-  const toast = useToast()
   if (!entry.url) {
     return null
   }
@@ -120,7 +119,7 @@ function EntryToolsbar({ entry }: { entry: Entry }) {
         onPress={() => {
           Clipboard.setStringAsync(entry.url!)
             .then(() => {
-              toast.show('Copied to clipboard', { type: 'success' })
+              Toast.show('Copied to clipboard', { type: 'success' })
             })
             .catch(console.error)
         }}

diff --git a/app/_layout.tsx b/app/_layout.tsx
@@ -111,7 +111,7 @@ export default function Root() {
         },
       }}
     >
-      <ToastProvider offsetBottom={100} duration={1000}>
+      <ToastProvider offsetTop={100} duration={1000} placement="top">
         <ThemeProvider
           value={UnistylesRuntime.colorScheme === 'light' ? DefaultTheme : DarkTheme}
         >

diff --git a/components/entry-list.tsx b/components/entry-list.tsx
@@ -9,6 +9,7 @@ import { useAtomValue } from 'jotai'
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
 import { Platform, Pressable, View } from 'react-native'
 import ContextMenu from 'react-native-context-menu-view'
+import { Toast } from 'react-native-toast-notifications'
 import TrackPlayer, { usePlaybackState } from 'react-native-track-player'
 import { useStyles } from 'react-native-unistyles'
 
@@ -323,8 +324,10 @@ export function EntryList({
       },
     )
       .then((publishedAt) => {
-        if (!publishedAt)
+        if (!publishedAt) {
+          Toast.show('No more entries')
           return
+        }
         lastItemPublishedAt.current = publishedAt
       })
       .catch((error) => {