playball/dist/components/Standings.js

Watch MLB games from the comfort of your terminal

import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
import { useDispatch, useSelector } from "react-redux/lib/alternate-renderers.js";
import { fetchStandings, selectData } from "../features/standings.js";
import { teamFavoriteStar, getSport } from "../utils.js";
function formatHeaderRow(record) {
  return record.division.nameShort.padEnd(15) + '    W' + '    L' + '    PCT' + '    GB' + '  WCGB' + '   L10' + ' STRK';
}
function formatTeamRow(record) {
  var _record$streak;
  const lastTen = record.records.splitRecords.find(o => o.type === 'lastTen');
  const star = teamFavoriteStar(record.team);
  return star + record.team.teamName.padEnd(star ? 13 : 15) + record.wins.toString().padStart(5) + record.losses.toString().padStart(5) + record.winningPercentage.padStart(7) + record.gamesBack.padStart(6) + record.wildCardGamesBack.padStart(6) + `${lastTen.wins}-${lastTen.losses}`.padStart(6) + (((_record$streak = record.streak) === null || _record$streak === void 0 ? void 0 : _record$streak.streakCode) || '').padStart(5);
}
function Division({
  record,
  top,
  left,
  width
}) {
  return /*#__PURE__*/React.createElement("box", {
    top: top,
    left: left,
    height: 6,
    width: width
  }, /*#__PURE__*/React.createElement("box", {
    top: 0,
    left: 0,
    height: 1,
    fg: "black",
    bg: "white",
    content: formatHeaderRow(record),
    wrap: false
  }), /*#__PURE__*/React.createElement("box", {
    top: 1,
    left: 0,
    height: 5,
    content: record.teamRecords.map(formatTeamRow).join('\n'),
    wrap: false,
    tags: true
  }));
}
Division.propTypes = {
  record: PropTypes.object,
  top: PropTypes.number,
  left: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
};
function Standings() {
  const dispatch = useDispatch();
  const standings = useSelector(selectData);
  const sport = getSport();
  useEffect(() => dispatch(fetchStandings()), []);
  if (!standings) {
    return /*#__PURE__*/React.createElement("element", null);
  }
  if (sport === 'wbc') {
    // WBC Pool Standings
    if (!standings.records || standings.records.length === 0) {
      return /*#__PURE__*/React.createElement("box", {
        top: 0,
        left: 0,
        width: "100%",
        height: "100%"
      }, /*#__PURE__*/React.createElement("text", {
        top: 1,
        left: 2
      }, "WBC Standings not available during this phase of the tournament."), /*#__PURE__*/React.createElement("text", {
        top: 3,
        left: 2
      }, "Use Schedule view to see games and results."));
    }

    // Render WBC pools (records likely grouped by pool/division)
    const halfPoint = Math.ceil(standings.records.length / 2);
    return /*#__PURE__*/React.createElement("element", null, standings.records.slice(0, halfPoint).map((pool, idx) => {
      var _pool$division;
      return /*#__PURE__*/React.createElement(Division, {
        top: idx * 7,
        left: 0,
        width: "50%-1",
        key: ((_pool$division = pool.division) === null || _pool$division === void 0 ? void 0 : _pool$division.id) || idx,
        record: pool
      });
    }), standings.records.slice(halfPoint).map((pool, idx) => {
      var _pool$division2;
      return /*#__PURE__*/React.createElement(Division, {
        top: idx * 7,
        left: "50%+1",
        width: "50%-1",
        key: ((_pool$division2 = pool.division) === null || _pool$division2 === void 0 ? void 0 : _pool$division2.id) || idx + halfPoint,
        record: pool
      });
    }));
  }

  // MLB AL/NL Standings (existing logic)
  return /*#__PURE__*/React.createElement("element", null, standings.records.filter(record => record.league.id === 103).map((record, idx) => /*#__PURE__*/React.createElement(Division, {
    top: idx * 7,
    left: 0,
    width: "50%-1",
    key: record.division.id,
    record: record
  })), standings.records.filter(record => record.league.id === 104).map((record, idx) => /*#__PURE__*/React.createElement(Division, {
    top: idx * 7,
    left: "50%+1",
    width: "50%-1",
    key: record.division.id,
    record: record
  })));
}
export default Standings;