ファイルの分離、整理

components/ActionSheetComponents/EachTrainInfoCore.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useMemo, useState } from "react";
 import {
   View,
-  LayoutAnimation,
   Text,
   TouchableOpacity,
   StyleSheet,
@@ -9,7 +8,6 @@ import {
   BackHandler,
   Linking,
 } from "react-native";
-import { Ionicons } from "@expo/vector-icons";
 import { SheetManager } from "react-native-actions-sheet";
 import { AS } from "../../storageControl";
 import trainList from "../../assets/originData/trainList";
@@ -33,8 +31,8 @@ import { getType } from "../../lib/eachTrainInfoCoreLib/getType";
 import { searchSpecialTrain } from "../../lib/eachTrainInfoCoreLib/searchSpecialTrain";
 import { openBackTrainInfo } from "../../lib/eachTrainInfoCoreLib/openBackTrainInfo";
 import { ShowSpecialTrain } from "./EachTrainInfo/ShowSpecialTrain";
-import { TrainIconStatus } from "./EachTrainInfo/trainIconStatus";
 import { useTrainMenu } from "../../stateBox/useTrainMenu";
+import { HeaderText } from "./EachTrainInfoCore/HeaderText";
 
 export const EachTrainInfoCore = ({
   actionSheetRef,
@@ -45,10 +43,7 @@ export const EachTrainInfoCore = ({
 }) => {
   // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false);
   const { currentTrain } = useCurrentTrain();
-  const {
-    setTrainInfo,
-    originalStationList,
-  } = useTrainMenu();
+  const { setTrainInfo, originalStationList } = useTrainMenu();
   const [currentTrainData, setCurrentTrainData] = useState();
 
   // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false);
@@ -84,7 +79,6 @@ export const EachTrainInfoCore = ({
   const [currentPosition, setCurrentPosition] = useState([]);
   const [trainData, setTrainData] = useState([]);
 
-
   const stationList =
     originalStationList &&
     lineList.map((d) =>
@@ -283,37 +277,17 @@ export const EachTrainInfoCore = ({
           />
         </View>
       )}
-      <View style={{ padding: 10, flexDirection: "row", alignItems: "center" }}>
-        <TrainIconStatus trainData={data} />
-        <Text style={{ fontSize: 20, fontWeight: "bold", color: "white" }}>
-          {trainName}
-        </Text>
-        <View style={{ flex: 1 }} />
-        <Text style={{ fontSize: 20, fontWeight: "bold", color: "white" }}>
-          {showHeadStation.map((d) => `${headStation[d].id} + `)}
-          {data.trainNum}
-          {showTailStation.map((d) => ` + ${tailStation[d].id}`)}
-        </Text>
+      <HeaderText
+        data={data}
+        trainData={trainData}
+        showHeadStation={showHeadStation}
+        showTailStation={showTailStation}
+        headStation={headStation}
+        tailStation={tailStation}
+        navigate={navigate}
+        from={from}
+      />
 
-        {data.limited != undefined &&
-          getType(data.limited.split(":")[0]) &&
-          !data.limited.split(":")[1].match("サンポート") && (
-            <Ionicons
-              name="subway"
-              color="white"
-              size={30}
-              style={{ margin: 5 }}
-              onPress={() => {
-                LayoutAnimation.easeInEaseOut(); //setLoadingDelayData(true);
-                navigate("trainbase", {
-                  info: "train.html?tn=" + data.trainNum,
-                  from,
-                });
-                SheetManager.hide("EachTrainInfo");
-              }}
-            />
-          )}
-      </View>
       <DynamicHeaderScrollView
         from={from}
         styles={styles}