favoriteListItemのお気に入り調整

components/FavoriteList.js

@@ -1,10 +1,11 @@
 import React from "react";
 import { View, Text, TouchableOpacity, ScrollView } from "react-native";
-import { ListItem } from "native-base";
+
 import Icon from "react-native-vector-icons/Entypo";
 import { useFavoriteStation } from "../stateBox/useFavoriteStation";
 import { useCurrentTrain } from "../stateBox/useCurrentTrain";
 import { useNavigation } from "@react-navigation/native";
+import { FavoriteListItem } from "./atom/FavoriteListItem";
 export default function FavoriteList({ stationData }) {
   const { favoriteStation } = useFavoriteStation();
   const { webview } = useCurrentTrain();
@@ -15,7 +16,7 @@ export default function FavoriteList({ stationData }) {
       <Text
         style={{
           textAlign: "center",
-          fontSize: 25,
+          fontSize: 20,
           color: "white",
           fontWeight: "bold",
           paddingVertical: 10,
@@ -28,7 +29,8 @@ export default function FavoriteList({ stationData }) {
           .filter((d) => d[0].StationMap)
           .map((currentStation) => {
             return (
-              <ListItem
+              <FavoriteListItem
+                currentStation={currentStation}
                 onPress={() => {
                   const getStationLine = (now) => {
                     const returnData = Object.keys(stationData).filter((d) => {
@@ -48,28 +50,20 @@ export default function FavoriteList({ stationData }) {
                   navigate("Apps");
                 }}
               >
-                <Text style={{ fontSize: 20, flex: 2 }}>
-                  {currentStation
-                    .map((d) => d.StationNumber)
-                    .filter((d) => d !== null)
-                    .join("/")}
-                </Text>
-                <Text style={{ fontSize: 20, flex: 3 }}>
-                  {currentStation[0].Station_JP}
-                </Text>
                 <View
                   style={{
                     flex: 2,
                     flexDirection: "row",
                     alignContent: "center",
                     alignItems: "center",
+                    marginVertical: 4,
                   }}
                 >
                   <View style={{ flex: 1 }} />
                   <Text style={{ fontSize: 20 }}>移動する</Text>
                   <Icon name="chevron-right" size={20} />
                 </View>
-              </ListItem>
+              </FavoriteListItem>
             );
           })}
       </ScrollView>