バスのある駅でデータを出すボタンを設置

App.js

@@ -46,6 +46,24 @@ export default function App() {
       })
       .catch((d) => console.log(d));
   }, []);
+  const [busAndTrainData, setBusAndTrainData] = useState([]);
+  useEffect(() => {
+    AS.getItem("busAndTrain")
+      .then((d) => {
+        const returnData = JSON.parse(d);
+        setBusAndTrainData(returnData);
+      })
+      .catch((d) => {
+        fetch(
+          "https://script.google.com/macros/s/AKfycbw0UW6ZeCDgUYFRP0zxpc_Oqfy-91dBdbWv-cM8n3narKp14IyCd2wy5HW7taXcW7E/exec"
+        )
+          .then((d) => d.json())
+          .then((d) => {
+            setBusAndTrainData(d);
+            AS.setItem("busAndTrain", JSON.stringify(d));
+          });
+      });
+  }, []);
 
   return (
     <NavigationContainer name="Root" style={{ flex: 1 }}>
@@ -64,6 +82,7 @@ export default function App() {
               {...props}
               favoriteStation={favoriteStation}
               setFavoriteStation={setFavoriteStation}
+              busAndTrainData={busAndTrainData}
             />
           )}
         </Tab.Screen>
@@ -81,6 +100,7 @@ export default function App() {
               {...props}
               favoriteStation={favoriteStation}
               setFavoriteStation={setFavoriteStation}
+              busAndTrainData={busAndTrainData}
             />
           )}
         </Tab.Screen>
@@ -117,7 +137,12 @@ const initIcon = (name, type) => {
   }
 };
 
-const Top = ({ navigation, favoriteStation, setFavoriteStation }) => {
+const Top = ({
+  navigation,
+  favoriteStation,
+  setFavoriteStation,
+  busAndTrainData,
+}) => {
   const webview = useRef();
 
   //地図用
@@ -151,6 +176,7 @@ const Top = ({ navigation, favoriteStation, setFavoriteStation }) => {
             webview={webview}
             favoriteStation={favoriteStation}
             setFavoriteStation={setFavoriteStation}
+            busAndTrainData={busAndTrainData}
           />
         )}
       </Stack.Screen>
@@ -202,7 +228,7 @@ const Top = ({ navigation, favoriteStation, setFavoriteStation }) => {
     </Stack.Navigator>
   );
 };
-function MenuPage({ favoriteStation, setFavoriteStation }) {
+function MenuPage({ favoriteStation, setFavoriteStation, busAndTrainData }) {
   return (
     <Stack.Navigator>
       <Stack.Screen
@@ -218,6 +244,7 @@ function MenuPage({ favoriteStation, setFavoriteStation }) {
             {...props}
             favoriteStation={favoriteStation}
             setFavoriteStation={setFavoriteStation}
+            busAndTrainData={busAndTrainData}
           />
         )}
       </Stack.Screen>

Apps.js

@@ -24,6 +24,7 @@ export default function Apps({
   webview,
   favoriteStation,
   setFavoriteStation,
+  busAndTrainData,
 }) {
   const { navigate } = navigation;
   var urlcache = "";
@@ -199,6 +200,7 @@ export default function Apps({
         originalStationList={originalStationList}
         favoriteStation={favoriteStation}
         setFavoriteStation={setFavoriteStation}
+        busAndTrainData={busAndTrainData}
       />
     </View>
   );

assets/originData/lineColorList.js

@@ -0,0 +1,11 @@
+export default {
+  Y: "#F5AC13",
+  U: "#F5AC13",
+  S: "#9AA7D7",
+  D: "#DC4586",
+  K: "#DC4586",
+  B: "#366481",
+  N: "#881F61",
+  T: "#87CA3B",
+  M: "#0071be",
+};

components/ActionSheetComponents/StationDeteilView.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { View, Linking } from "react-native";
 import { FontAwesome, Foundation, Ionicons } from "@expo/vector-icons";
 import ActionSheet from "react-native-actions-sheet";
@@ -17,7 +17,20 @@ export const StationDeteilView = (props) => {
     originalStationList,
     favoriteStation,
     setFavoriteStation,
+    busAndTrainData,
   } = props;
+  const [trainBus, setTrainBus] = useState();
+  useEffect(() => {
+    if (!currentStation) return () => {};
+    const data = busAndTrainData.filter((d) => {
+      return d.name === currentStation[0].Station_JP;
+    });
+    if (data.length == 0) {
+      setTrainBus();
+      return () => {};
+    }
+    setTrainBus(data[0]);
+  }, [currentStation]);
 
   return (
     <ActionSheet
@@ -98,7 +111,17 @@ export const StationDeteilView = (props) => {
                     Linking.openURL(currentStation[0].StationMap)
                   }
                 >
-                  GoogleMap
+                  Map
+                </TicketBox>
+              )}
+              {!trainBus || (
+                <TicketBox
+                  backgroundColor={"#CE5C00"}
+                  icon={<Ionicons name="bus" color="white" size={50} />}
+                  flex={1}
+                  onPressButton={() => Linking.openURL(trainBus.address)}
+                >
+                  平行バス
                 </TicketBox>
               )}
             </View>

menu.js

@@ -41,6 +41,7 @@ export default function Menu(props) {
     navigation: { navigate },
     favoriteStation,
     setFavoriteStation,
+    busAndTrainData,
   } = props;
   const JRSTraInfoEXAcSR = useRef(null);
   const StationBoardAcSR = useRef(null);
@@ -519,6 +520,7 @@ export default function Menu(props) {
         originalStationList={originalStationList}
         favoriteStation={favoriteStation}
         setFavoriteStation={setFavoriteStation}
+        busAndTrainData={busAndTrainData}
       />
       <JRSTraInfo
         JRSTraInfoEXAcSR={JRSTraInfoEXAcSR}