StationNameを移動

components/駅名表/Sign.js

@@ -7,6 +7,8 @@ import { useInterval } from "../../lib/useInterval";
 import { AS } from "../../storageControl";
 import { useFavoriteStation } from "../../stateBox/useFavoriteStation";
 
+import { StationName } from "./StationName";
+
 import lineColorList from "../../assets/originData/lineColorList";
 
 export default function Sign(props) {
@@ -307,15 +309,7 @@ const StationNameArea = (props) => {
   );
 };
 
-const StationName = (props) => {
+
-  const { stringData, ss } = props;
-  return (
-    <View style={ss}>
-      <Text style={styleSheet.下枠駅名}>{stringData.Station_JP}</Text>
-      <Text style={styleSheet.下枠駅名}>{stringData.Station_EN}</Text>
-    </View>
-  );
-};
 
 const styleSheet = {
   外枠: {
@@ -388,11 +382,4 @@ const styleSheet = {
     borderWidth: parseInt("2%"),
     borderRadius: parseInt("100%"),
   },
-  下枠駅名: {
-    fontWeight: "bold",
-    fontSize: parseInt("15%"),
-    color: "white",
-    flex: 1,
-    textAlignVertical: "center",
-  },
 };

components/駅名表/StationName.tsx

@@ -0,0 +1,22 @@
+import React, { FC } from "react";
+import { Text, TextStyle, View } from "react-native";
+export const StationName: FC<{
+  stringData: { Station_JP: string; Station_EN: string };
+  ss: TextStyle;
+}> = (props) => {
+  const { stringData, ss } = props;
+  return (
+    <View style={ss}>
+      <Text style={styleSheet}>{stringData.Station_JP}</Text>
+      <Text style={styleSheet}>{stringData.Station_EN}</Text>
+    </View>
+  );
+};
+
+const styleSheet: TextStyle = {
+  fontWeight: "bold",
+  fontSize: parseInt("15%"),
+  color: "white",
+  flex: 1,
+  textAlignVertical: "center",
+};