列車情報が正しく表示されるように更新

components/Apps/FixedPositionBox/FixedStationBox.tsx

@@ -1,5 +1,7 @@
 import lineColorList from "@/assets/originData/lineColorList";
 import { StationNumberMaker } from "@/components/駅名表/StationNumberMaker";
+import { checkDuplicateTrainData } from "@/lib/checkDuplicateTrainData";
+import { getTrainDelayStatus } from "@/lib/getTrainDelayStatus";
 import { objectIsEmpty } from "@/lib/objectIsEmpty";
 import { trainPosition } from "@/lib/trainPositionTextArray";
 import { useAllTrainDiagram } from "@/stateBox/useAllTrainDiagram";
@@ -238,29 +240,51 @@ export const FixedStation = ({ stationID }) => {
         style={{
           flex: 5,
           flexDirection: "column",
-          backgroundColor: lineColor,
+          backgroundColor: "white",
           borderTopWidth: 5,
           borderTopColor: lineColor,
         }}
       >
         {selectedTrain.length > 0 ? (
           selectedTrain.map((d) => (
-            <View
-              style={{ backgroundColor: "white", flexDirection: "row" }}
-              key={d.train + "-fixedStationBox"}
-            >
-              <Text style={{ fontSize: 20, flex: 1 }}>{d.time}</Text>
-              <Text style={{ fontSize: 20, flex: 1 }}>{d.train}</Text>
-              <Text style={{ fontSize: 20, flex: 1 }}>{d.lastStation}</Text>
-              <Text style={{ fontSize: 20, flex: 1 }}>定刻</Text>
-            </View>
+            <FixedStationBoxEachTrain
+              d={d}
+              station={station[0]}
+              key={d.train}
+            />
           ))
         ) : (
           <View style={{ backgroundColor: "white", flex: 1 }}>
-            <Text style={{ fontSize: 20 }}>次：15:00 快速マリン　岡山</Text>
+            <Text style={{ fontSize: 20 }}>当駅を発着する走行中の列車はありません。</Text>
           </View>
         )}
       </View>
     </TouchableOpacity>
   );
 };
+
+const FixedStationBoxEachTrain = ({ d, station }) => {
+  const { currentTrain } = useCurrentTrain();
+  const { stationList } = useStationList();
+  const currentTrainData = checkDuplicateTrainData(
+    currentTrain.filter((a) => a.num == d.train),
+    stationList
+  );
+
+  const trainDelayStatus = `${getTrainDelayStatus(
+    currentTrainData,
+    station.Station_JP
+  )}`;
+
+  return (
+    <View
+      style={{ backgroundColor: "white", flexDirection: "row"}}
+      key={d.train + "-fixedStationBox"}
+    >
+      <Text style={{ fontSize: 20, flex: 1 }}>{d.time}</Text>
+      <Text style={{ fontSize: 20, flex: 1 }}>{d.train}</Text>
+      <Text style={{ fontSize: 20, flex: 1 }}>{d.lastStation}</Text>
+      <Text style={{ fontSize: 20 }}>{trainDelayStatus}</Text>
+    </View>
+  );
+};