@vixoniccom/footbal-score 1.2.1-beta.0 → 1.2.1

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.2.1](https://bitbucket.org/vixonic_dev/football-score/compare/v1.2.1-beta.1...v1.2.1) (2024-06-26)
+
+### [1.2.1-beta.1](https://bitbucket.org/vixonic_dev/football-score/compare/v1.2.1-beta.0...v1.2.1-beta.1) (2024-06-25)
+
+
+### Bug Fixes
+
+* pagination was added to the app ([b847626](https://bitbucket.org/vixonic_dev/football-score/commit/b847626d7982b74c5e479fcc5878b65968349cc0))
+
 ### [1.2.1-beta.0](https://bitbucket.org/vixonic_dev/football-score/compare/v1.2.0...v1.2.1-beta.0) (2024-06-24)
 
 

package/configuration.json

@@ -299,7 +299,7 @@
         {
           "type": "text-input",
           "id": "title0",
-          "description": "Texto.",
+          "description": "Título",
           "show": "{{titleEnabled}} === true"
         },
         {
@@ -317,7 +317,21 @@
         {
           "type": "text-format",
           "id": "formatMjs",
-          "label": "Formato Status"
+          "label": "Formato Mensaje"
+        },
+        {
+          "type": "number-input",
+          "id": "itemsPerPage",
+          "range": "[1:100]",
+          "label": "Elementos por página",
+          "defaultValue": 4
+        },
+        {
+          "type": "number-input",
+          "id": "durationPerPage",
+          "range": "[1:100]",
+          "label": "Duración por página (segundos)",
+          "defaultValue": 5
         },
         {
           "id": "alignVerticalMsj",

package/package.json

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

package/src/components/Table/index.tsx

@@ -1,12 +1,36 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import { Row } from './components'
 
 type Props = {
-  dataFixture: any
+  dataFixture: any[]
   parameters: VixonicParameters
 }
 
 export const Table = ({ dataFixture, parameters }: Props) => {
+  const { itemsPerPage, durationPerPage } = parameters
+  const rows = Number(itemsPerPage || 4)
+  const orderedData = dataFixture.sort((a, b) => a.fixture.timestamp - b.fixture.timestamp)
+  const [page, setPage] = useState<number>(1)
+  const [items, setItems] = useState<string[][]>(orderedData.slice(0, rows))
+  const total = orderedData.length
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      handlePagination()
+    }, Number(durationPerPage || 5) * 1000)
+
+    return () => clearTimeout(timer)
+  }, [page, dataFixture])
+
+  const handlePagination = () => {
+    const newPage = page < (total / rows) ? page + 1 : 1
+    const startIndex = rows * (newPage - 1)
+    const endIndex = (startIndex + rows) < total ? startIndex + rows : total
+    const filterData = orderedData.slice(startIndex, endIndex)
+    setItems(filterData)
+    setPage(newPage)
+  }
+
   return <div
     style={{
       display: 'flex',
@@ -18,7 +42,7 @@ export const Table = ({ dataFixture, parameters }: Props) => {
     }}
   >
     {
-      dataFixture.map((item: any) => (
+      items.map((item: any) => (
         <Row item={item} parameters={parameters} />
       ))
     }

package/src/parameters.d.ts

@@ -76,6 +76,8 @@ declare type VixonicParameters = Partial<{
   league: string
   matchesTomorrow: boolean
   matchesYesterday: boolean
+  itemsPerPage: number
+  durationPerPage: number
 }>
 
 type GeneralData = {