jrshikoku/components/Menu/SpecialTrainInfoBox.tsx
2025-04-11 10:22:40 +00:00

67 lines
1.9 KiB
TypeScript

import { FC, useEffect, useLayoutEffect, useState } from "react";
import { View, Text, TouchableOpacity } from "react-native";
import { getPDFViewURL } from "@/lib/getPdfViewURL";
import { ScrollView, SheetManager } from "react-native-actions-sheet";
type props = {
navigate: (screen: string, params?: object) => void;
};
export const SpecialTrainInfoBox: FC<props> = ({ navigate }) => {
const [specialData, setSpecialData] = useState([]);
useLayoutEffect(() => {
fetch("https://n8n.haruk.in/webhook/sptrainfo")
.then((res) => res.json())
.then((data) => setSpecialData(data.data))
.catch((err) => console.log(err));
}, []);
return (
<View
style={{
backgroundColor: "#0099CC",
}}
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<Text
style={{
fontSize: 30,
fontWeight: "bold",
color: "white",
paddingHorizontal: 10,
paddingVertical: 5,
}}
>
</Text>
</View>
<ScrollView
style={{
backgroundColor: "white",
}}
>
{specialData.map((d) => (
<TouchableOpacity
onPress={() => {
navigate("howto", {
info: getPDFViewURL("https://www.jr-shikoku.co.jp" + d.address),
goTo: "menu",
});
SheetManager.hide("SpecialTrainInfo");
}}
onLongPress={() => alert(d.description)}
key={d.address}
style={{
padding: 10,
borderBottomWidth: 1,
borderBottomColor: "#ccc",
flexDirection: "row",
alignItems: "center",
}}
>
<Text style={{ color: "black", fontSize: 20 }}>{d.text}</Text>
</TouchableOpacity>
))}
</ScrollView>
</View>
);
};