getTrainTypeの仕様変更に追従

components/StationDiagram/StationDiagramView.tsx

@@ -18,8 +18,8 @@ import dayjs from "dayjs";
 import { ExGridView } from "./ExGridView";
 import { Switch } from "react-native-elements";
 import { customTrainDataDetector } from "../custom-train-data";
-import { typeID } from "@/lib/getStringConfig";
-import { colorString } from "@/lib/getTrainType";
+import { getTrainType } from "@/lib/getTrainType";
+import { trainTypeID } from "@/lib/CommonTypes";
 
 type props = {
   route: {
@@ -55,7 +55,7 @@ export const StationDiagramView: FC<props> = ({ route }) => {
   const { navigate, addListener, goBack, canGoBack } = useNavigation();
   const [keyBoardVisible, setKeyBoardVisible] = useState(false);
   const [input, setInput] = useState("");
-  const [selectedTypeList, setSelectedTypeList] = useState<typeID[]>([
+  const [selectedTypeList, setSelectedTypeList] = useState<trainTypeID[]>([
     "Normal",
     "OneMan",
     "Rapid",
@@ -262,48 +262,36 @@ export const StationDiagramView: FC<props> = ({ route }) => {
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="普通"
                 typeID="Normal"
-                color="black"
                 relativeID={["OneMan"]}
               />
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="快速"
                 typeID="Rapid"
-                color="#00b8d8cc"
                 relativeID={["OneManRapid"]}
               />
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="特急"
                 typeID="LTDEXP"
-                color="red"
                 relativeID={["NightLTDEXP"]}
               />
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="臨時"
                 typeID="SPCL"
-                color="#297bff"
                 relativeID={["SPCL_Normal", "SPCL_Rapid", "SPCL_EXP", "Party"]}
               />
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="貨物"
                 typeID="Freight"
-                color="#00869ecc"
               />
               <TypeSelectorBox
                 selectedTypeList={selectedTypeList}
                 setSelectedTypeList={setSelectedTypeList}
-                typeName="回送"
                 typeID="Forwarding"
-                color="#727272cc"
                 relativeID={["FreightForwarding"]}
               />
               <TouchableOpacity
@@ -395,23 +383,15 @@ export const StationDiagramView: FC<props> = ({ route }) => {
 };
 
 export const TypeSelectorBox: FC<{
-  selectedTypeList: typeID[];
-  setSelectedTypeList: (list: typeID[]) => void;
-  typeName: string;
-  typeID: typeID;
-  color: colorString;
-  relativeID?: typeID[];
+  selectedTypeList: trainTypeID[];
+  setSelectedTypeList: (list: trainTypeID[]) => void;
+  typeID: trainTypeID;
+  relativeID?: trainTypeID[];
 }> = (props) => {
-  const {
-    selectedTypeList,
-    setSelectedTypeList,
-    typeName,
-    typeID,
-    relativeID,
-    color,
-  } = props;
+  const { selectedTypeList, setSelectedTypeList, typeID, relativeID } = props;
   const isSelected =
     selectedTypeList.findIndex((item) => item === typeID) !== -1;
+  const { color, shortName } = getTrainType({ type: typeID, whiteMode: true });
   return (
     <TouchableOpacity
       style={{
@@ -447,7 +427,7 @@ export const TypeSelectorBox: FC<{
           margin: 5,
         }}
       >
-        {typeName}
+        {shortName}
       </Text>
     </TouchableOpacity>
   );