@vixoniccom/footbal-score 1.4.1 → 1.4.2

package/CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.4.2](https://github.com/Vixonic/store-football-score/compare/v1.4.2-dev.0...v1.4.2) (2026-06-13)
+
+
+### Bug Fixes
+
+* load request when start match ([8b68820](https://github.com/Vixonic/store-football-score/commit/8b688204b15130642d9085838beeda75984435ff))
+
+### [1.4.2-dev.0](https://github.com/Vixonic/store-football-score/compare/v1.4.1...v1.4.2-dev.0) (2026-06-13)
+
 ### [1.4.1](https://github.com/Vixonic/store-football-score/compare/v1.4.1-dev.0...v1.4.1) (2026-06-11)
 
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vixoniccom/footbal-score",
   "alias": "Resultados Deportivos",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "description": "Muestra resultados en vivo de fútbol.",
   "main": "main.js",
   "author": "",

package/src/App.tsx

@@ -1,6 +1,5 @@
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useRef, useState } from 'react'
 import localforage from 'localforage'
-import moment from 'moment'
 import { FontLoader, FormattedText, Table } from './components'
 import { getFixture } from './helpers/getFixture'
 
@@ -9,74 +8,140 @@ export type Props = {
   start: boolean
 }
 
+const LIVE_STATUSES = ['1H', 'HT', '2H', 'P', 'ET', 'BT', 'LIVE', 'INT']
+const PRE_MATCH_MS = 5 * 60 * 1000
+
+localforage.config({ name: 'request_api_football' })
+
+const log = (msg: string, ...args: any[]) =>
+  console.log(`[⚽ football-score ${new Date().toLocaleTimeString()}]`, msg, ...args)
+
+// Returns the timestamp (ms) when the next fetch should happen based on fixture states.
+// Persisted in localStorage so re-mounts don't reset the schedule.
+function computeNextFetchTime(fixtures: any[], pollIntervalMs: number): number {
+  const now = Date.now()
+
+  const liveMatches = fixtures.filter(f => LIVE_STATUSES.includes(f.fixture?.status?.short))
+  if (liveMatches.length > 0) {
+    const next = new Date(now + pollIntervalMs)
+    log(`🟢 ${liveMatches.length} partido(s) en vivo → próximo fetch en ${next.toLocaleTimeString()} (${pollIntervalMs / 1000}s)`)
+    return now + pollIntervalMs
+  }
+
+  const nextMatchAt = fixtures
+    .filter(f => f.fixture?.status?.short === 'NS')
+    .map(f => new Date(f.fixture.date).getTime())
+    .filter(t => t > now)
+    .sort((a, b) => a - b)[0]
+
+  if (nextMatchAt !== undefined) {
+    const wakeUp = nextMatchAt - PRE_MATCH_MS
+    if (wakeUp <= now) {
+      const next = new Date(now + pollIntervalMs)
+      log(`🟡 Dentro de ventana pre-partido → próximo fetch en ${next.toLocaleTimeString()}`)
+      return now + pollIntervalMs
+    }
+    log(`⏰ Próximo partido: ${new Date(nextMatchAt).toLocaleTimeString()} → fetch a las ${new Date(wakeUp).toLocaleTimeString()} (10 min antes)`)
+    return wakeUp
+  }
+
+  const tomorrow = new Date()
+  tomorrow.setDate(tomorrow.getDate() + 1)
+  tomorrow.setHours(0, 15, 0, 0)
+  log(`💤 Sin partidos pendientes → próximo check: ${tomorrow.toLocaleString()}`)
+  return tomorrow.getTime()
+}
+
 export const App: React.FunctionComponent<Props> = ({ data, start }) => {
   const [dataFixture, setDataFixture] = useState<any[]>([])
   const [leagueState, setLeagueState] = useState<string>('')
   const { parameters, downloadsPath } = data
-  const { backgroundImage, padding, msj0 = '', updateTime = 300000, league = '9' } = parameters
+  const { backgroundImage, padding, msj0 = '', league = '9' } = parameters
   const backgroundImageState = backgroundImage?.filename
     ? `url("${downloadsPath}/${backgroundImage.filename}")`
     : ''
 
-  const getData = async () => {
-    const dataLocal: any = await getLocalData()
-    const momentLocalStorage = dataLocal ? moment().diff(dataLocal.date, 'millisecond') : undefined
-    const timeNowFormat = moment().format('h:mma')
-    const timeNow = moment(timeNowFormat, 'h:mma')
-    const startTime = moment(parameters.timeStart, 'h:mma')
-    const endTime = moment(parameters.timeEnd, 'h:mma')
-    // When the end time is earlier than the start time the window crosses midnight,
-    // e.g. 10am-1am means [10am, midnight) plus [midnight, 1am)
-    const isWithinSchedule = endTime.isAfter(startTime)
-      ? timeNow.isBetween(startTime, endTime)
-      : timeNow.isSameOrAfter(startTime) || timeNow.isBefore(endTime)
-
-    if (momentLocalStorage == undefined || (isWithinSchedule && momentLocalStorage > updateTime!)) {
-      const dataRequest = await getFixture(league, parameters.matchesYesterday, parameters.matchesTomorrow)
-      setDataLocal(dataRequest)
-      setDataFixture(dataRequest)
-    } else {
-      setDataFixture(dataLocal.data)
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+  // Refs keep the timeout callback from closing over stale props
+  const leagueRef = useRef(league)
+  const paramsRef = useRef(parameters)
+  useEffect(() => {
+    leagueRef.current = league
+    paramsRef.current = parameters
+  })
+
+  const clearSchedule = () => {
+    if (timeoutRef.current !== null) {
+      clearTimeout(timeoutRef.current)
+      timeoutRef.current = null
     }
   }
 
-  useEffect(() => {
-    if (start) {
-      setLeagueState(league)
-      getData()
-    }
-  }, [data])
+  const fetchAndSchedule = async () => {
+    const { matchesYesterday, matchesTomorrow, updateTime: ut = 300000 } = paramsRef.current
+    const cached: any = await localforage.getItem('football-score')
 
-  useEffect(() => {
-    if (leagueState !== league) {
-      setLeagueState(league)
-      localforage.clear()
-      getData()
+    log(`🔄 Fetching fixtures (liga ${leagueRef.current})...`)
+    let fixtures: any[]
+    try {
+      fixtures = await getFixture(leagueRef.current, matchesYesterday, matchesTomorrow)
+      log(`✅ ${fixtures.length} fixture(s) recibidos`)
+    } catch (err) {
+      console.error('[football-score] API error:', err)
+      fixtures = cached?.data ?? []
+      log(`❌ API falló → usando cache (${fixtures.length} fixtures)`)
     }
-  }, [league])
 
-  //Request data every 5 minutes
-  useEffect(() => {
-    const interval = setInterval(() => {
-      getData()
-    }, updateTime)
-    return () => clearInterval(interval)
-  }, [updateTime, data])
-
-  const setDataLocal = async (data: any) => {
-    localforage.config({ name: 'request_api_football' })
+    const nextFetchTime = computeNextFetchTime(fixtures, ut)
+
     try {
-      await localforage.setItem('football-score', { date: Date.now(), data })
+      await localforage.setItem('football-score', { date: Date.now(), data: fixtures, nextFetchTime })
     } catch (err) {
-      console.log('err', err)
+      console.error('[football-score] localStorage write error', err)
     }
+
+    setDataFixture(fixtures)
+
+    clearSchedule()
+    timeoutRef.current = setTimeout(fetchAndSchedule, Math.max(0, nextFetchTime - Date.now()))
   }
 
-  const getLocalData = async () => {
-    const dataLocal = await localforage.getItem('football-score')
-    return dataLocal
+  const init = async () => {
+    const cached: any = await localforage.getItem('football-score')
+    const now = Date.now()
+
+    if (!cached?.data) {
+      log(`🆕 Sin cache → fetch inmediato`)
+      fetchAndSchedule()
+      return
+    }
+
+    setDataFixture(cached.data)
+
+    if (!cached.nextFetchTime || cached.nextFetchTime <= now) {
+      log(`🔁 Mount check: nextFetchTime ya pasó (${cached.nextFetchTime ? new Date(cached.nextFetchTime).toLocaleTimeString() : 'null'}) → fetch inmediato`)
+      fetchAndSchedule()
+    } else {
+      const mins = Math.round((cached.nextFetchTime - now) / 60000)
+      log(`💾 Mount check: usando cache → próximo fetch en ${new Date(cached.nextFetchTime).toLocaleTimeString()} (~${mins} min)`)
+    }
   }
 
+  useEffect(() => {
+    if (!start) return
+    setLeagueState(league)
+    init()
+    return clearSchedule
+  }, [data])
+
+  useEffect(() => {
+    if (leagueState === '' || leagueState === league) return
+    setLeagueState(league)
+    clearSchedule()
+    localforage.clear()
+    fetchAndSchedule()
+  }, [league])
+
   return (
     dataFixture.length > 0 ?
       <div style={{

package/src/helpers/getFixture.ts

@@ -27,11 +27,6 @@ export const getFixture = async (league: string, yesterday?: boolean, tomorrow?:
     headers: { 'X-RapidAPI-Key': FOOTBALL_API_KEY, 'X-RapidAPI-Host': FOOTBALL_API_HOST },
   }
 
-  try {
-    const response = await axios.request(options)
-    return response.data.response
-  } catch (error) {
-    console.error(error)
-    return []
-  }
+  const response = await axios.request(options)
+  return response.data.response
 }

package/build/index.html

@@ -1 +0,0 @@
-<!doctype html><html lang="en" style="position:absolute;height:100%;width:100%;overflow:hidden"><head><title></title><meta charset="utf-8"/></head><body style="margin:0;overflow:hidden"><div id="root" style="position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden"></div><script src="./main.js"></script></body></html>