From 9b4843cd9167044e24575b21fa680307e5c62d5f Mon Sep 17 00:00:00 2001
From: Tsubasa SEKIGUCHI <oss@tinykitten.me>
Date: Sun, 1 Sep 2024 09:54:45 +0900
Subject: [PATCH] =?UTF-8?q?=E7=B5=8C=E8=B7=AF=E6=A4=9C=E7=B4=A2=E3=83=90?=
 =?UTF-8?q?=E3=82=B0=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/RouteListModal.tsx |  9 ++++++---
 src/screens/RouteSearchScreen.tsx | 21 ++++++++++-----------
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/components/RouteListModal.tsx b/src/components/RouteListModal.tsx
index d460f46ba..e9346f016 100644
--- a/src/components/RouteListModal.tsx
+++ b/src/components/RouteListModal.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { Modal, StyleSheet, View } from 'react-native'
+import { ActivityIndicator, Modal, StyleSheet, View } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Route } from '../../gen/proto/stationapi_pb'
 import { LED_THEME_BG_COLOR } from '../constants'
@@ -40,6 +40,7 @@ const styles = StyleSheet.create({
     alignSelf: 'center',
     marginTop: 12,
   },
+  loading: { marginTop: 12 },
 })
 
 const SAFE_AREA_FALLBACK = 32
@@ -100,9 +101,11 @@ export const RouteListModal: React.FC<Props> = ({
             >
               <Heading>{translate('routeSearchTitle')}</Heading>
             </View>
-            {routes.length ? (
+            {loading ? (
+              <ActivityIndicator style={styles.loading} />
+            ) : (
               <RouteList data={routes} onSelect={onSelect} />
-            ) : null}
+            )}
           </View>
         </View>
         <FAB onPress={onClose} icon="close" />
diff --git a/src/screens/RouteSearchScreen.tsx b/src/screens/RouteSearchScreen.tsx
index 159c1fef9..31504d0d0 100644
--- a/src/screens/RouteSearchScreen.tsx
+++ b/src/screens/RouteSearchScreen.tsx
@@ -277,11 +277,11 @@ const RouteSearchScreen = () => {
     [
       currentStation?.groupId,
       navigation,
-      routesData,
       selectedStation?.groupId,
       setLineState,
       setNavigationState,
       setStationState,
+      withoutPassStationRoutes,
     ]
   )
 
@@ -326,16 +326,15 @@ const RouteSearchScreen = () => {
         </KeyboardAvoidingView>
       </View>
       <FAB onPress={onPressBack} icon="close" />
-      {routesData?.length ? (
-        <RouteListModal
-          visible={isRouteListModalVisible}
-          routes={withoutPassStationRoutes}
-          loading={isRoutesLoading}
-          error={fetchRoutesError}
-          onClose={() => setIsRouteListModalVisible(false)}
-          onSelect={handleSelect}
-        />
-      ) : null}
+
+      <RouteListModal
+        visible={isRouteListModalVisible}
+        routes={withoutPassStationRoutes}
+        loading={isRoutesLoading}
+        error={fetchRoutesError}
+        onClose={() => setIsRouteListModalVisible(false)}
+        onSelect={handleSelect}
+      />
     </>
   )
 }