関係ありそうな列車をピックアップする機能を仮作成

components/ActionSheetComponents/EachTrainInfo.js

@@ -28,6 +28,8 @@ import lineColorList from "../../assets/originData/lineColorList";
 import { useCurrentTrain } from "../../stateBox/useCurrentTrain";
 import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData";
 import dayjs from "dayjs";
+import { getTrainType } from "../../lib/getTrainType";
+import { customTrainDataDetector } from "../custom-train-data";
 
 export const EachTrainInfo = (props) => {
   if (!props.payload) return <></>;
@@ -46,7 +48,52 @@ export const EachTrainInfo = (props) => {
   const { currentTrain } = useCurrentTrain();
 
   const [currentTrainData, setCurrentTrainData] = useState([]);
+  const [nearTrainIDList, setNearTrainIDList] = useState([]);
 
+  useEffect(() => {
+    const returnArray = [];
+    if (!data.trainNum) return;
+    if (
+      new RegExp(/^4[1-9]\d\d[DM]$/).test(data.trainNum) ||
+      new RegExp(/^5[1-7]\d\d[DM]$/).test(data.trainNum)
+    ) {
+      if (trainList[data.trainNum.substring(1)]) {
+        returnArray.push(data.trainNum.substring(1));
+      }
+    }
+    if (new RegExp(/^[1-9]\d\d[DM]$/).test(data.trainNum)) {
+      if (trainList["4" + data.trainNum]) {
+        returnArray.push("4" + data.trainNum);
+      }
+      if (trainList["5" + data.trainNum]) {
+        returnArray.push("5" + data.trainNum);
+      }
+    }
+    setNearTrainIDList(returnArray);
+  }, [data]);
+  const openTrainInfo = (d) => {
+    const train = customTrainDataDetector(d);
+    let TrainNumber = "";
+    if (train.trainNumDistance != undefined) {
+      const timeInfo =
+        parseInt(d.replace("M", "").replace("D", "")) - train.trainNumDistance;
+      TrainNumber = timeInfo + "号";
+    }
+    const payload = {
+      data: {
+        trainNum: d,
+        limited: `${getTrainType(train.type).data}:${
+          train.trainName
+        }${TrainNumber}`,
+      },
+      navigate,
+      originalStationList,
+      from: "AllTrainDiagramView",
+    };
+    SheetManager.show("EachTrainInfo", {
+      payload,
+    });
+  };
   useEffect(() => {
     setCurrentTrainData(
       checkDuplicateTrainData(
@@ -302,9 +349,17 @@ export const EachTrainInfo = (props) => {
               : ""}
           </Text>
           <View style={{ flex: 1 }} />
-          <Text style={{ fontSize: 20, fontWeight: "bold", color: "white" }}>
-            {data.trainNum}
-          </Text>
+          <TouchableOpacity
+            onPress={() => {
+              nearTrainIDList.length && openTrainInfo(nearTrainIDList[0]);
+            }}
+          >
+            <Text style={{ fontSize: 20, fontWeight: "bold", color: "white" }}>
+              {data.trainNum}
+              {nearTrainIDList.length ? "..." : ""}
+            </Text>
+          </TouchableOpacity>
+
           {data.limited != undefined &&
             getType(data.limited.split(":")[0]) &&
             !data.limited.split(":")[1].match("サンポート") && (