delayをトップに配置

App.js

@@ -20,6 +20,8 @@ import Setting from "./components/settings.js";
 import TrainMenu from "./components/trainMenu.js";
 import FavoriteList from "./components/FavoriteList.js";
 import { LogBox } from "react-native";
+import useInterval from "./lib/useInterval";
+import { HeaderConfig } from "./lib/HeaderConfig";
 
 LogBox.ignoreLogs([
   "ViewPropTypes will be removed",
@@ -65,6 +67,30 @@ export default function App() {
       });
   }, []);
 
+  const [currentTrain, setCurrentTrain] = useState([]); //現在在線中の全列車 { num: 列車番号, delay: 遅延時分(状態), Pos: 位置情報 }
+  const [currentTrainLoading, setCurrentTrainLoading] = useState("loading"); // success, error, loading
+  const getCurrentTrain = () =>
+    fetch(
+      "https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train",
+      HeaderConfig
+    )
+      .then((response) => response.json())
+      .then((d) =>
+        d.map((x) => ({ num: x.TrainNum, delay: x.delay, Pos: x.Pos }))
+      )
+      .then((d) => {
+        setCurrentTrain(d);
+        setCurrentTrainLoading("success");
+      })
+      .catch((e) => {
+        console.log("えらー");
+        setCurrentTrainLoading("error");
+      });
+
+  useEffect(getCurrentTrain, []); //初回だけ現在の全在線列車取得
+
+  useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得
+
   return (
     <NavigationContainer name="Root" style={{ flex: 1 }}>
       <Tab.Navigator detachInactiveScreens={false}>
@@ -83,6 +109,12 @@ export default function App() {
               favoriteStation={favoriteStation}
               setFavoriteStation={setFavoriteStation}
               busAndTrainData={busAndTrainData}
+              currentTrainState={{ currentTrain, setCurrentTrain }}
+              currentTrainLoadingState={{
+                currentTrainLoading,
+                setCurrentTrainLoading,
+              }}
+              getCurrentTrain={getCurrentTrain}
             />
           )}
         </Tab.Screen>
@@ -101,6 +133,12 @@ export default function App() {
               favoriteStation={favoriteStation}
               setFavoriteStation={setFavoriteStation}
               busAndTrainData={busAndTrainData}
+              currentTrainState={{ currentTrain, setCurrentTrain }}
+              currentTrainLoadingState={{
+                currentTrainLoading,
+                setCurrentTrainLoading,
+              }}
+              getCurrentTrain={getCurrentTrain}
             />
           )}
         </Tab.Screen>
@@ -142,6 +180,9 @@ const Top = ({
   favoriteStation,
   setFavoriteStation,
   busAndTrainData,
+  currentTrainState,
+  currentTrainLoadingState,
+  getCurrentTrain,
 }) => {
   const webview = useRef();
 
@@ -178,6 +219,9 @@ const Top = ({
             setFavoriteStation={setFavoriteStation}
             busAndTrainData={busAndTrainData}
             stationData={mapsStationData}
+            currentTrainState={currentTrainState}
+            currentTrainLoadingState={currentTrainLoadingState}
+            getCurrentTrain={getCurrentTrain}
           />
         )}
       </Stack.Screen>
@@ -233,6 +277,9 @@ function MenuPage({
   favoriteStation,
   setFavoriteStation,
   busAndTrainData,
+  currentTrainState,
+  currentTrainLoadingState,
+  getCurrentTrain,
 }) {
   useEffect(() => {
     const unsubscribe = navigation.addListener("tabPress", (e) => {
@@ -264,6 +311,9 @@ function MenuPage({
             favoriteStation={favoriteStation}
             setFavoriteStation={setFavoriteStation}
             busAndTrainData={busAndTrainData}
+            currentTrainState={currentTrainState}
+            currentTrainLoadingState={currentTrainLoadingState}
+            getCurrentTrain={getCurrentTrain}
           />
         )}
       </Stack.Screen>

Apps.js

@@ -27,7 +27,13 @@ export default function Apps({
   setFavoriteStation,
   busAndTrainData,
   stationData,
+  currentTrainState,
+  currentTrainLoadingState,
+  getCurrentTrain,
 }) {
+  const { currentTrain, setCurrentTrain } = currentTrainState;
+  const { currentTrainLoading, setCurrentTrainLoading } =
+    currentTrainLoadingState;
   const { navigate } = navigation;
   var urlcache = "";
 
@@ -151,7 +157,11 @@ export default function Apps({
       case "ShowTrainTimeInfo": {
         const { trainNum, limited } = dataSet;
         //alert(trainNum, limited);
-        setTrainInfo({ trainNum, limited, delay: undefined }); //遅延情報は未実装
+        setTrainInfo({
+          trainNum,
+          limited,
+          delay: currentTrain.filter((t) => t.num == trainNum)[0].delay,
+        }); //遅延情報は未実装
         EachTrainInfoAsSR.current?.show();
         return;
       }

components/発車時刻表/LED_vidion.js

@@ -9,6 +9,7 @@ import { useInterval } from "../../lib/useInterval";
 import { objectIsEmpty } from "../../lib/objectIsEmpty";
 import { getTrainType } from "../../lib/getTrainType";
 import { HeaderConfig } from "../../lib/HeaderConfig";
+import { getTrainDelayStatus } from "../../lib/getTrainDelayStatus";
 
 let diagramData = undefined;
 
@@ -42,10 +43,19 @@ let diagramData = undefined;
  * 9062D 四国まんなか千年ものがたり(臨時？)
  */
 export default function LED_vision(props) {
-  const { station, setTrainInfo, EachTrainInfoAsSR, trainDiagram } = props;
+  const {
+    station,
+    setTrainInfo,
+    EachTrainInfoAsSR,
+    trainDiagram,
+    currentTrainState,
+    currentTrainLoadingState,
+    getCurrentTrain,
+  } = props;
+  const { currentTrain, setCurrentTrain } = currentTrainState;
+  const { currentTrainLoading, setCurrentTrainLoading } =
+    currentTrainLoadingState;
   const [stationDiagram, setStationDiagram] = useState({}); //当該駅の全時刻表
-  const [currentTrain, setCurrentTrain] = useState([]); //現在在線中の全列車 { num: 列車番号, delay: 遅延時分(状態), Pos: 位置情報 }
-  const [currentTrainLoading, setCurrentTrainLoading] = useState("loading"); // success, error, loading
   const [finalSwitch, setFinalSwitch] = useState(false);
   const [trainIDSwitch, setTrainIDSwitch] = useState(false);
   const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
@@ -85,28 +95,6 @@ export default function LED_vision(props) {
     setSelectedTrain(data);
   }, [trainTimeAndNumber, currentTrain, finalSwitch]);
 
-  const getCurrentTrain = () =>
-    fetch(
-      "https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train",
-      HeaderConfig
-    )
-      .then((response) => response.json())
-      .then((d) =>
-        d.map((x) => ({ num: x.TrainNum, delay: x.delay, Pos: x.Pos }))
-      )
-      .then((d) => {
-        setCurrentTrain(d);
-        setCurrentTrainLoading("success");
-      })
-      .catch((e) => {
-        console.log("えらー");
-        setCurrentTrainLoading("error");
-      });
-
-  useEffect(getCurrentTrain, []); //初回だけ現在の全在線列車取得
-
-  useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得
-
   const getTime = (stationDiagram, station) => {
     const returnData = Object.keys(stationDiagram).map((trainNum) => {
       let trainData = {};
@@ -301,9 +289,7 @@ const EachData = ({
       limited: `${getTrainType(train.type).data}:${
         train.trainName
       }${TrainNumber}`,
-      delay: getTrainDelayStatus(
+      delay: currentTrain.filter((t) => t.num == d.train)[0].delay,
-        currentTrain.filter((t) => t.num == d.train)[0]
-      ),
     });
     EachTrainInfoAsSR.current?.show();
   };
@@ -312,26 +298,9 @@ const EachData = ({
     setTrain(customTrainDataDetector(d.train));
   }, [currentTrain, d.train, trainDescriptionSwitch]);
   // 土讃線複数存在対策
-  const getTrainDelayStatus = (current) => {
-    if (!current) return () => {};
-    const delay = current.delay;
-    switch (true) {
-      case delay === "入線":
-        if (current.Pos === station.Station_JP) {
-          return "当駅始発";
-        } else {
-          return "発車前";
-        }
-      case isNaN(delay):
-        return delay;
-      case delay === 0:
-        return "定刻通り";
-      default:
-        return delay + "分遅れ";
-    }
-  };
   const trainDelayStatus = getTrainDelayStatus(
-    checkDuplicateTrainData(currentTrain.filter((a) => a.num == d.train))
+    checkDuplicateTrainData(currentTrain.filter((a) => a.num == d.train)),
+    station.Station_JP
   );
   return (
     <>

lib/getTrainDelayStatus.js

@@ -0,0 +1,18 @@
+export const getTrainDelayStatus = (current, Station_JP) => {
+  if (!current) return () => {};
+  const delay = current.delay;
+  switch (true) {
+    case delay === "入線":
+      if (current.Pos === Station_JP) {
+        return "当駅始発";
+      } else {
+        return "発車前";
+      }
+    case isNaN(delay):
+      return delay;
+    case delay === 0:
+      return "定刻通り";
+    default:
+      return delay + "分遅れ";
+  }
+};

menu.js

@@ -46,6 +46,9 @@ export default function Menu(props) {
     favoriteStation,
     setFavoriteStation,
     busAndTrainData,
+    currentTrainState,
+    currentTrainLoadingState,
+    getCurrentTrain,
   } = props;
   const JRSTraInfoEXAcSR = useRef(null);
   const StationBoardAcSR = useRef(null);
@@ -249,6 +252,9 @@ export default function Menu(props) {
               setTrainInfo={setTrainInfo}
               EachTrainInfoAsSR={EachTrainInfoAsSR}
               trainDiagram={trainDiagram}
+              currentTrainState={currentTrainState}
+              currentTrainLoadingState={currentTrainLoadingState}
+              getCurrentTrain={getCurrentTrain}
             />
           )}
         <JRSTraInfoBox