jrshikoku/components/Menu/TopMenuButton.tsx
harukin-expo-dev-env 44f8be994e 単発の変更
2025-04-13 10:32:30 +00:00

52 lines
1.4 KiB
TypeScript

import React from "react";
import { Linking, View } from "react-native";
import { UsefulBox } from "@/components/TrainMenu/UsefulBox";
import MaterialCommunityIcons from "@expo/vector-icons/build/MaterialCommunityIcons";
export const TopMenuButton = () => {
const buttonList:{
backgroundColor: string;
icon: keyof typeof MaterialCommunityIcons.glyphMap;
onPress: () => void;
title: string;
}[] = [
{
backgroundColor: "#F89038",
icon: "train-car",
onPress: () =>
Linking.openURL("https://www.jr-shikoku.co.jp/01_trainbus/sp/"),
title: "駅・鉄道情報",
},
{
backgroundColor: "#EA4752",
icon: "google-spreadsheet",
onPress: () =>
Linking.openURL(
"https://www.jr-shikoku.co.jp/01_trainbus/jikoku/sp/#mainprice-box"
),
title: "運賃表",
},
{
backgroundColor: "#91C31F",
icon: "clipboard-list-outline",
onPress: () => Linking.openURL("https://www.jr-shikoku.co.jp/e5489/"),
title: "予約",
},
];
return (
<View style={{ flexDirection: "row" }}>
{buttonList.map((d, index) => (
<UsefulBox
backgroundColor={d.backgroundColor}
icon={d.icon}
flex={1}
onPressButton={d.onPress}
key={index + d.icon}
>
{d.title}
</UsefulBox>
))}
</View>
);
};