LEDと看板のロジック変更

components/発車時刻表/LED_vidion.js

@@ -138,7 +138,6 @@ export default function LED_vision(props) {
       });
       return { train: d, time: a.time, lastStation: a.lastStation };
     });
-    console.log(returnData);
     return returnData.sort((a, b) => {
       switch (true) {
         case parseInt(a.time.split(":")[0]) < parseInt(b.time.split(":")[0]):

menu.js

@@ -1,4 +1,4 @@
-import React, { useRef, useState, useEffect } from "react";
+import React, { useRef, useState, useEffect, useMemo } from "react";
 import Carousel from "react-native-snap-carousel";
 import {
   Platform,
@@ -118,21 +118,33 @@ export default function Menu(props) {
   }, [location, originalStationList]);
 
   //Favoriteから現在地を排除し現在地を最初に持ってくるバージョン
-  const [locationAndFavorite, setLocationAndFavorite] = useState([]);
+  //const [locationAndFavorite, setLocationAndFavorite] = useState([]);
-  useEffect(() => {
+  const locationAndFavorite = useMemo(() => {
-    if (!favoriteStation) return () => {};
     const data = favoriteStation.filter((d) =>
       JSON.stringify(d) === JSON.stringify(currentAreaStation) ? false : true
     );
-    setLocationAndFavorite([...currentAreaStation, ...data]);
+    return [...currentAreaStation, ...data];
   }, [currentAreaStation, favoriteStation]);
+  // useEffect(() => {
+  //   if (!favoriteStation) return () => {};
+  //   const data = favoriteStation.filter((d) =>
+  //     JSON.stringify(d) === JSON.stringify(currentAreaStation) ? false : true
+  //   );
+  //   setLocationAndFavorite([...currentAreaStation, ...data]);
+  // }, [currentAreaStation, favoriteStation]);
 
+  const [selectedCurrentStation, setSelectedCurrentStation] = useState(0);
   useEffect(() => {
-    if (!(selectedCurrentStation < favoriteStation.length)) {
+    console.log(selectedCurrentStation > locationAndFavorite.length);
-      setSelectedCurrentStation(favoriteStation.length - 1);
+    if (locationAndFavorite.length == 0) {
-      carouselRef.current.snapToItem(favoriteStation.length - 1);
+      //carouselRef.current.snapToItem(0);
+      setSelectedCurrentStation(0);
     }
-  }, [favoriteStation]);
+    if (selectedCurrentStation > locationAndFavorite.length - 1) {
+      //carouselRef.current.snapToItem(locationAndFavorite.length - 1);
+      setSelectedCurrentStation(locationAndFavorite.length - 1);
+    }
+  }, [locationAndFavorite]);
 
   const [count, setCount] = useState(0);
   const [delayData, setDelayData] = useState(undefined);
@@ -141,7 +153,6 @@ export default function Menu(props) {
   const carouselRef = useRef();
   const scrollRef = useRef();
   const [isScroll, setIsScroll] = useState(true);
-  const [selectedCurrentStation, setSelectedCurrentStation] = useState(0);
 
   useEffect(() => {
     fetch(
@@ -182,7 +193,6 @@ export default function Menu(props) {
             setSelectedCurrentStation(d);
           }}
           renderItem={({ item, index }) => {
-            console.log(item);
             return (
               <View style={{ marginVertical: 10 }} key={item[0].StationNumber}>
                 <Sign
@@ -196,7 +206,7 @@ export default function Menu(props) {
             );
           }}
         />
-        {locationAndFavorite.length != 0 && originalStationList && (
+        {originalStationList && locationAndFavorite[selectedCurrentStation] && (
           <LED_vision
             station={
               originalStationList &&