fansunited-widgets-cdn 0.0.85 → 0.0.86-RC2

package/chunks/MatchPredictionContainer-Ct6gXvLw.js

@@ -0,0 +1,751 @@
+import { j as e, B as h, t as C, r as a, a as W, f as q, C as ne } from "./main-XP7dqk6g.js";
+import { B as U, T as w } from "./Button-BV7YIFkS.js";
+import { C as K } from "./Card-DRIT0wtY.js";
+import { G as D } from "./Grid-Dpv_ZL23.js";
+import { S as te } from "./Snackbar-DHxnbCA3.js";
+import { c as V } from "./createSvgIcon-DVA0KIUd.js";
+import { C as ie, a as ae } from "./ChevronRight-BrCKlr3T.js";
+import { I as ce } from "./IconButton-Lt9Xks7c.js";
+import { A as le } from "./Alert-CuOsmojH.js";
+const de = V(/* @__PURE__ */ e.jsx("path", {
+  d: "M16.59 7.58 10 14.17l-3.59-3.58L5 12l5 5 8-8zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8"
+}), "CheckCircleOutline"), ue = V(/* @__PURE__ */ e.jsx("path", {
+  d: "M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"
+}), "KeyboardArrowDown"), xe = V(/* @__PURE__ */ e.jsx("path", {
+  d: "M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z"
+}), "KeyboardArrowUp"), b = {
+  // Main card styles
+  card: {
+    borderColor: "divider",
+    backgroundRepeat: "no-repeat",
+    backgroundSize: "cover",
+    backgroundPosition: "center",
+    "&:hover": { borderColor: "divider" },
+    p: 2.5
+  },
+  // Prediction button styles
+  predictionButton: {
+    base: (t, r, s) => {
+      const n = r ? t.palette.primary[500] : "transparent", l = t.palette.text.primary;
+      return {
+        width: "100%",
+        height: "100px",
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        backgroundColor: n,
+        border: r ? "none !important" : "1px solid " + t.palette.primary.outlinedBorder + " !important",
+        color: l,
+        "& .MuiTypography-root": {
+          color: l
+        },
+        "&:hover": {
+          backgroundColor: s ? void 0 : t.palette.primary[500]
+        }
+      };
+    }
+  },
+  // Team logo container
+  teamLogoContainer: {
+    width: 64,
+    height: 64,
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    borderRadius: "50%",
+    // backgroundColor: "neutral.softBg",
+    padding: "4px"
+  },
+  // Team logo image
+  teamLogoImage: {
+    width: 64,
+    height: 64,
+    objectFit: "contain"
+  },
+  // Progress bar container
+  progressContainer: {
+    mt: 1
+  },
+  // Progress bar track
+  progressTrack: {
+    height: 8,
+    width: "100%",
+    backgroundColor: "primary.outlinedColor",
+    borderRadius: 4,
+    overflow: "hidden",
+    mb: 0.5
+  },
+  // Progress bar indicator
+  progressIndicator: (t, r) => ({
+    height: "100%",
+    width: `${r}%`,
+    backgroundColor: t ? "primary.500" : "primary.outlinedColor",
+    transition: "width 0.4s ease-in-out"
+  })
+}, g = {
+  // Main card styles
+  card: {
+    p: 2,
+    display: "flex",
+    flexDirection: "column",
+    gap: 2,
+    backgroundRepeat: "no-repeat",
+    backgroundSize: "cover",
+    backgroundPosition: "center",
+    borderRadius: "md",
+    // boxShadow: "sm",
+    border: "1px solid",
+    borderColor: "divider",
+    "&:hover": { borderColor: "divider" },
+    "&:active": { borderColor: "divider" }
+  },
+  // Title styles
+  title: {
+    textAlign: "center"
+  },
+  // Desktop layout container
+  desktopContainer: {
+    display: { xs: "none", sm: "flex" },
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: 2
+  },
+  // Mobile layout container
+  mobileContainer: {
+    display: { xs: "flex", sm: "none" },
+    flexDirection: "column",
+    gap: 1.5
+  },
+  // Mobile row container
+  mobileRow: {
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center"
+  },
+  // Team display container
+  teamDisplay: {
+    base: {
+      display: "flex",
+      alignItems: "center",
+      gap: 1.5,
+      flex: 1,
+      minWidth: 0
+    },
+    homeDesktop: {
+      justifyContent: "flex-start"
+    },
+    awayDesktop: {
+      flexDirection: "row-reverse",
+      textAlign: "right"
+    }
+  },
+  // Team logo
+  teamLogo: {
+    width: { xs: 32, sm: 48, md: 64 },
+    height: { xs: 32, sm: 48, md: 64 },
+    objectFit: "contain"
+  },
+  // Team name
+  teamName: {
+    fontWeight: 600,
+    color: "text.primary",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap"
+  },
+  // Score controls container
+  scoreControlsContainer: {
+    display: "flex",
+    alignItems: "center",
+    gap: 1.5,
+    flexShrink: 0
+  },
+  // Score input container
+  scoreInputContainer: {
+    horizontal: {
+      display: "flex",
+      alignItems: "center",
+      gap: 0.5
+    },
+    vertical: {
+      display: "flex",
+      alignItems: "center",
+      gap: 1
+    },
+    verticalInner: {
+      display: "flex",
+      flexDirection: "column"
+    }
+  },
+  // Score display
+  scoreDisplay: {
+    fontWeight: 700,
+    minWidth: "44px",
+    textAlign: "center",
+    userSelect: "none",
+    bgcolor: "white",
+    borderRadius: "sm",
+    px: 1.5,
+    height: "48px",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    color: "neutral.700"
+  },
+  // Score separator
+  scoreSeparator: {
+    color: "neutral.400",
+    userSelect: "none"
+  },
+  // Submit button
+  submitButton: {
+    mt: 1,
+    width: { xs: "100%", sm: "auto" },
+    alignSelf: { sm: "center" },
+    "&:disabled": {
+      bgcolor: "primary.50"
+    }
+  },
+  // Error alert
+  errorAlert: {
+    mt: 1
+  }
+}, re = (t, r) => r === 0 ? 0 : Math.round(t / r * 100), X = ({
+  type: t,
+  isSelected: r,
+  isPredictionMade: s,
+  isLoading: n,
+  predictionCount: l,
+  totalPredictions: c,
+  onClick: f,
+  teamName: x,
+  teamLogo: p
+}) => {
+  const m = re(l, c), y = t === "x";
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx(
+      U,
+      {
+        variant: "outlined",
+        color: "primary",
+        onClick: () => !s && f(t),
+        disabled: n || s,
+        sx: (i) => b.predictionButton.base(i, r, s),
+        children: y ? (
+          // Draw button content
+          /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+            /* @__PURE__ */ e.jsx(h, { sx: b.teamLogoContainer, children: /* @__PURE__ */ e.jsx(w, { level: "h3", textColor: "text.primary", sx: { fontWeight: "bold" }, children: "X" }) }),
+            /* @__PURE__ */ e.jsx(w, { level: "body-sm", textColor: "text.primary", children: C("predictions.draw") })
+          ] })
+        ) : (
+          // Team button content
+          /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+            p && /* @__PURE__ */ e.jsx(h, { sx: b.teamLogoContainer, children: /* @__PURE__ */ e.jsx("img", { src: p, alt: x || "", style: b.teamLogoImage }) }),
+            /* @__PURE__ */ e.jsx(w, { level: "body-sm", textColor: "text.primary", children: x || "" })
+          ] })
+        )
+      }
+    ),
+    s && /* @__PURE__ */ e.jsxs(h, { sx: b.progressContainer, children: [
+      /* @__PURE__ */ e.jsx(h, { sx: b.progressTrack, children: /* @__PURE__ */ e.jsx(h, { sx: b.progressIndicator(r, m) }) }),
+      /* @__PURE__ */ e.jsxs(w, { level: "body-xs", textAlign: "center", textColor: "text.secondary", children: [
+        m,
+        "% (",
+        l,
+        ")"
+      ] })
+    ] })
+  ] });
+}, oe = (t, r, s) => {
+  const [n, l] = a.useState({
+    1: 0,
+    x: 0,
+    2: 0,
+    total: 0
+  }), [c, f] = a.useState(!1), [x, p] = a.useState(null), m = async () => {
+    try {
+      const i = await t.predictor.getMarketSummary(r, s);
+      if (i && i.fullTimeOneXTwo) {
+        const { "1": o, x: d, "2": u } = i.fullTimeOneXTwo, S = o + d + u;
+        l({
+          1: o,
+          x: d,
+          2: u,
+          total: S
+        });
+      }
+      p(null);
+    } catch (i) {
+      console.error("Error fetching market summary:", i), p(i instanceof Error ? i : new Error("Failed to fetch market summary"));
+    }
+  }, y = async (i) => {
+    f(!0);
+    try {
+      return await t.predictor.makeFootballPrediction(r, s, i), l((o) => {
+        const d = { ...o };
+        return d[i] += 1, d.total += 1, d;
+      }), p(null), !0;
+    } catch (o) {
+      return console.error("Error making prediction:", o), p(o instanceof Error ? o : new Error("Failed to make prediction")), !1;
+    } finally {
+      f(!1);
+    }
+  };
+  return a.useEffect(() => {
+    r && m();
+  }, [r]), {
+    predictionStats: n,
+    isLoading: c,
+    error: x,
+    makePrediction: y,
+    refreshSummary: m
+  };
+}, pe = ({ match: t, market: r, title: s }) => {
+  var A, E, O, T, B, z;
+  const n = W(), { defaultImagePlaceholderUrl: l } = q(), [c, f] = a.useState(null), [x, p] = a.useState(!1), [m, y] = a.useState(!1), { predictionStats: i, isLoading: o, makePrediction: d } = oe(n, t.id, r), u = async (H) => {
+    f(H), await d(H) && (p(!0), y(!0), setTimeout(() => {
+      y(!1);
+    }, 3e3));
+  }, S = s || (r === "HT_1X2" ? C("predictions.question_ht_1x2") : C("predictions.question_ft_1x2"));
+  return /* @__PURE__ */ e.jsxs(K, { sx: { ...b.card, backgroundImage: l ? `url(${l})` : "none" }, children: [
+    /* @__PURE__ */ e.jsx(w, { level: "h4", textAlign: "center", children: S }),
+    /* @__PURE__ */ e.jsxs(D, { container: !0, spacing: 1, sx: { justifyContent: "center" }, children: [
+      /* @__PURE__ */ e.jsx(D, { xs: 4, children: /* @__PURE__ */ e.jsx(
+        X,
+        {
+          type: "1",
+          isSelected: c === "1",
+          isPredictionMade: x,
+          isLoading: o,
+          predictionCount: i[1],
+          totalPredictions: i.total,
+          onClick: u,
+          teamName: ((A = t.homeTeam) == null ? void 0 : A.name) || "",
+          teamLogo: (O = (E = t.homeTeam) == null ? void 0 : E.assets) == null ? void 0 : O.logo
+        }
+      ) }),
+      /* @__PURE__ */ e.jsx(D, { xs: 4, children: /* @__PURE__ */ e.jsx(
+        X,
+        {
+          type: "x",
+          isSelected: c === "x",
+          isPredictionMade: x,
+          isLoading: o,
+          predictionCount: i.x,
+          totalPredictions: i.total,
+          onClick: u
+        }
+      ) }),
+      /* @__PURE__ */ e.jsx(D, { xs: 4, children: /* @__PURE__ */ e.jsx(
+        X,
+        {
+          type: "2",
+          isSelected: c === "2",
+          isPredictionMade: x,
+          isLoading: o,
+          predictionCount: i[2],
+          totalPredictions: i.total,
+          onClick: u,
+          teamName: ((T = t.awayTeam) == null ? void 0 : T.name) || "",
+          teamLogo: (z = (B = t.awayTeam) == null ? void 0 : B.assets) == null ? void 0 : z.logo
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ e.jsx(
+      te,
+      {
+        open: m,
+        anchorOrigin: { vertical: "top", horizontal: "center" },
+        autoHideDuration: 3e3,
+        color: "success",
+        onClose: () => y(!1),
+        children: C("predictions.success_message")
+      }
+    )
+  ] });
+}, N = a.memo(({ score: t, onIncrement: r, onDecrement: s, isLoading: n, layout: l }) => {
+  const c = (x) => /* @__PURE__ */ e.jsx(ce, { size: "sm", variant: "solid", color: "primary", ...x }), f = /* @__PURE__ */ e.jsx(w, { level: "h3", sx: g.scoreDisplay, children: t });
+  return l === "horizontal" ? /* @__PURE__ */ e.jsxs(h, { sx: g.scoreInputContainer.horizontal, children: [
+    /* @__PURE__ */ e.jsx(
+      c,
+      {
+        onClick: s,
+        disabled: n || t <= 0,
+        size: "md",
+        sx: {
+          p: 0.3,
+          minWidth: "34px",
+          height: "36px",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          "&:disabled": {
+            bgcolor: "primary.200"
+          }
+        },
+        children: /* @__PURE__ */ e.jsx(ie, {})
+      }
+    ),
+    f,
+    /* @__PURE__ */ e.jsx(
+      c,
+      {
+        onClick: r,
+        disabled: n || t >= 99,
+        size: "md",
+        sx: {
+          p: 0.3,
+          minWidth: "34px",
+          height: "36px",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          "&:disabled": {
+            bgcolor: "primary.200"
+          }
+        },
+        children: /* @__PURE__ */ e.jsx(ae, {})
+      }
+    )
+  ] }) : /* @__PURE__ */ e.jsx(h, { sx: g.scoreInputContainer.vertical, children: /* @__PURE__ */ e.jsxs(h, { sx: g.scoreInputContainer.verticalInner, children: [
+    /* @__PURE__ */ e.jsx(
+      c,
+      {
+        onClick: r,
+        disabled: n || t >= 99,
+        sx: {
+          p: 0.3,
+          mb: 0.5,
+          "&:disabled": {
+            bgcolor: "primary.200"
+          }
+        },
+        children: /* @__PURE__ */ e.jsx(xe, {})
+      }
+    ),
+    f,
+    /* @__PURE__ */ e.jsx(
+      c,
+      {
+        onClick: s,
+        disabled: n || t <= 0,
+        sx: {
+          p: 0.3,
+          mt: 0.5,
+          "&:disabled": {
+            bgcolor: "primary.200"
+          }
+        },
+        children: /* @__PURE__ */ e.jsx(ue, {})
+      }
+    )
+  ] }) });
+});
+N.displayName = "ScoreInput";
+const F = a.memo(({ team: t, sx: r }) => {
+  var s;
+  return /* @__PURE__ */ e.jsxs(h, { sx: { ...g.teamDisplay.base, ...r }, children: [
+    ((s = t == null ? void 0 : t.assets) == null ? void 0 : s.logo) && /* @__PURE__ */ e.jsx(h, { component: "img", src: t.assets.logo, alt: t.name, sx: g.teamLogo }),
+    /* @__PURE__ */ e.jsx(w, { level: "title-md", sx: g.teamName, children: (t == null ? void 0 : t.name) || "Team" })
+  ] });
+});
+F.displayName = "TeamDisplay";
+const me = ({ match: t, market: r, title: s }) => {
+  const n = W(), { defaultImagePlaceholderUrl: l } = q(), [c, f] = a.useState(0), [x, p] = a.useState(0), [m, y] = a.useState(!1), [i, o] = a.useState(!1), [d, u] = a.useState(!1), [S, A] = a.useState(!0), [E, O] = a.useState(null), { isLoading: T, makePrediction: B } = oe(n, t.id, r);
+  a.useEffect(() => {
+    const k = async () => {
+      var j, $, R;
+      try {
+        A(!0);
+        const _ = await n.predictor.getMyPredictionsForMatches([t.id]);
+        if (_ != null && _.data && _.data.length > 0) {
+          const P = _.data.find(
+            (M) => {
+              var v, L, G, J, Q, Z;
+              return ((L = (v = M.fixtures) == null ? void 0 : v[0]) == null ? void 0 : L.market) === r || // Handle market variations (e.g., CORRECT_SCORE_HT)
+              r === "CORRECT_SCORE_HT" && ((J = (G = M.fixtures) == null ? void 0 : G[0]) == null ? void 0 : J.market) === "CORRECT_SCORE_HT" || r === "CORRECT_SCORE_ADVANCED" && ((Z = (Q = M.fixtures) == null ? void 0 : Q[0]) == null ? void 0 : Z.market) === "CORRECT_SCORE_ADVANCED";
+            }
+          );
+          if ((R = ($ = (j = P == null ? void 0 : P.fixtures) == null ? void 0 : j[0]) == null ? void 0 : $.prediction) != null && R.value) {
+            const M = P.fixtures[0].prediction.value, [v, L] = M.split(":").map(Number);
+            !isNaN(v) && !isNaN(L) && (f(v), p(L), O(P.id));
+          }
+        }
+      } catch (_) {
+        console.error("Error fetching existing prediction:", _);
+      } finally {
+        A(!1);
+      }
+    };
+    n != null && n.predictor && (t != null && t.id) && k();
+  }, [n, t.id, r]);
+  const z = s || (r === "CORRECT_SCORE_HT" ? C("predictions.question_correct_score_ht") : C("predictions.question_correct_score")), H = async () => {
+    var k;
+    y(!0), u(!1);
+    try {
+      if (E)
+        try {
+          await n.predictor.deleteFootballPrediction(E);
+        } catch (R) {
+          console.error("Error deleting existing prediction:", R);
+        }
+      const j = `${c}:${x}`, $ = await B(j);
+      if (y(!1), $) {
+        if (o(!0), !E) {
+          const R = await n.predictor.getMyPredictionsForMatches([t.id]), _ = (k = R == null ? void 0 : R.data) == null ? void 0 : k.find((P) => {
+            var M, v;
+            return ((v = (M = P.fixtures) == null ? void 0 : M[0]) == null ? void 0 : v.market) === r;
+          });
+          _ && O(_.id);
+        }
+        setTimeout(() => o(!1), 3e3);
+      } else
+        u(!0), setTimeout(() => u(!1), 3e3);
+    } catch {
+      y(!1), u(!0), setTimeout(() => u(!1), 3e3);
+    }
+  }, I = (k) => {
+    k === "home" ? f((j) => Math.min(j + 1, 99)) : p((j) => Math.min(j + 1, 99)), o(!1);
+  }, Y = (k) => {
+    k === "home" ? f((j) => Math.max(j - 1, 0)) : p((j) => Math.max(j - 1, 0)), o(!1);
+  }, se = i ? C("predictions.success_message", "Prediction accepted") : E ? C("predictions.update_prediction", "Update prediction") : C("predictions.make_prediction", "Submit prediction");
+  return /* @__PURE__ */ e.jsxs(K, { sx: { ...g.card, backgroundImage: l ? `url(${l})` : "none" }, children: [
+    /* @__PURE__ */ e.jsx(w, { level: "h4", sx: g.title, children: z }),
+    /* @__PURE__ */ e.jsxs(h, { sx: g.desktopContainer, children: [
+      /* @__PURE__ */ e.jsx(F, { team: t.homeTeam, sx: g.teamDisplay.homeDesktop }),
+      /* @__PURE__ */ e.jsxs(h, { sx: g.scoreControlsContainer, children: [
+        /* @__PURE__ */ e.jsx(
+          N,
+          {
+            score: c,
+            onIncrement: () => I("home"),
+            onDecrement: () => Y("home"),
+            isLoading: T || m || S,
+            layout: "vertical"
+          }
+        ),
+        /* @__PURE__ */ e.jsx(w, { level: "h3", sx: g.scoreSeparator, children: ":" }),
+        /* @__PURE__ */ e.jsx(
+          N,
+          {
+            score: x,
+            onIncrement: () => I("away"),
+            onDecrement: () => Y("away"),
+            isLoading: T || m || S,
+            layout: "vertical"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsx(F, { team: t.awayTeam, sx: g.teamDisplay.awayDesktop })
+    ] }),
+    /* @__PURE__ */ e.jsxs(h, { sx: g.mobileContainer, children: [
+      /* @__PURE__ */ e.jsxs(h, { sx: g.mobileRow, children: [
+        /* @__PURE__ */ e.jsx(F, { team: t.homeTeam }),
+        /* @__PURE__ */ e.jsx(
+          N,
+          {
+            score: c,
+            onIncrement: () => I("home"),
+            onDecrement: () => Y("home"),
+            isLoading: T || m || S,
+            layout: "horizontal"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs(h, { sx: g.mobileRow, children: [
+        /* @__PURE__ */ e.jsx(F, { team: t.awayTeam }),
+        /* @__PURE__ */ e.jsx(
+          N,
+          {
+            score: x,
+            onIncrement: () => I("away"),
+            onDecrement: () => Y("away"),
+            isLoading: T || m || S,
+            layout: "horizontal"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e.jsx(
+      U,
+      {
+        onClick: H,
+        loading: m || S,
+        disabled: T,
+        color: i ? "success" : "primary",
+        variant: "solid",
+        startDecorator: i ? /* @__PURE__ */ e.jsx(de, {}) : void 0,
+        sx: g.submitButton,
+        children: se
+      }
+    ),
+    d && /* @__PURE__ */ e.jsx(le, { variant: "soft", color: "danger", sx: g.errorAlert, children: C("predictions.error_message", "Failed to submit prediction. Please try again.") })
+  ] });
+}, ee = ({
+  type: t,
+  isSelected: r,
+  isPredictionMade: s,
+  isLoading: n,
+  predictionCount: l,
+  totalPredictions: c,
+  onClick: f
+}) => {
+  const x = re(l, c);
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx(
+      U,
+      {
+        variant: "outlined",
+        color: "primary",
+        onClick: () => !s && f(),
+        disabled: n || s,
+        sx: (p) => ({
+          ...b.predictionButton.base(p, r, s),
+          height: "auto"
+        }),
+        children: /* @__PURE__ */ e.jsx(w, { level: "body-sm", textColor: "text.primary", children: t === "yes" ? C("predictions.yes") : C("predictions.no") })
+      }
+    ),
+    s && /* @__PURE__ */ e.jsxs(h, { sx: b.progressContainer, children: [
+      /* @__PURE__ */ e.jsx(h, { sx: b.progressTrack, children: /* @__PURE__ */ e.jsx(h, { sx: b.progressIndicator(r, x) }) }),
+      /* @__PURE__ */ e.jsxs(w, { level: "body-xs", textAlign: "center", textColor: "text.secondary", children: [
+        x,
+        "% (",
+        l,
+        ")"
+      ] })
+    ] })
+  ] });
+}, fe = (t, r, s, n) => {
+  const [l, c] = a.useState({
+    yes: 0,
+    no: 0,
+    total: 0
+  }), [f, x] = a.useState(!1), [p, m] = a.useState(null), y = async () => {
+    try {
+      const o = n ? (
+        // @ts-expect-error - market is not assignable to type 'MarketType'
+        await t.predictor.getMarketSummary(r, s, n)
+      ) : (
+        // @ts-expect-error - market is not assignable to type 'MarketType'
+        await t.predictor.getMarketSummary(r, s)
+      );
+      if (o) {
+        let d = 0, u = 0;
+        o.bothTeamsScore ? (d = o.bothTeamsScore.yes, u = o.bothTeamsScore.no) : o.penaltyMatch ? (d = o.penaltyMatch.yes, u = o.penaltyMatch.no) : o.redCardMatch ? (d = o.redCardMatch.yes, u = o.redCardMatch.no) : n && o.yes !== void 0 && o.no !== void 0 && (d = o.yes, u = o.no);
+        const S = d + u;
+        c({
+          yes: d,
+          no: u,
+          total: S
+        });
+      }
+      m(null);
+    } catch (o) {
+      console.error("Error fetching market summary:", o), m(o instanceof Error ? o : new Error("Failed to fetch market summary"));
+    }
+  }, i = async (o) => {
+    x(!0);
+    try {
+      return n && ["PLAYER_SCORE", "PLAYER_YELLOW_CARD", "PLAYER_RED_CARD"].includes(s) ? await t.predictor.makeFootballPrediction(r, s, o, n) : await t.predictor.makeFootballPrediction(r, s, o), c((d) => {
+        const u = { ...d };
+        return o ? u.yes += 1 : u.no += 1, u.total += 1, u;
+      }), m(null), !0;
+    } catch (d) {
+      return console.error("Error making prediction:", d), m(d instanceof Error ? d : new Error("Failed to make prediction")), !1;
+    } finally {
+      x(!1);
+    }
+  };
+  return a.useEffect(() => {
+    r && y();
+  }, [r, n]), {
+    predictionStats: l,
+    isLoading: f,
+    error: p,
+    makePrediction: i,
+    refreshSummary: y
+  };
+}, he = ({ match: t, market: r, title: s, playerId: n }) => {
+  const l = W(), { defaultImagePlaceholderUrl: c } = q(), [f, x] = a.useState(null), [p, m] = a.useState(!1), [y, i] = a.useState(!1), { predictionStats: o, isLoading: d, makePrediction: u } = fe(l, t.id, r, n), S = async (E) => {
+    x(E), await u(E) && (m(!0), i(!0), setTimeout(() => {
+      i(!1);
+    }, 3e3));
+  }, A = () => {
+    if (s) return s;
+    switch (r) {
+      case "BOTH_TEAMS_SCORE":
+        return C("predictions.question_both_teams_score");
+      case "PENALTY_MATCH":
+        return C("predictions.question_penalty_match");
+      case "RED_CARD_MATCH":
+        return C("predictions.question_red_card_match");
+      case "PLAYER_SCORE":
+        return C("predictions.question_player_score");
+      default:
+        return C("predictions.make_prediction");
+    }
+  };
+  return /* @__PURE__ */ e.jsxs(K, { sx: { ...b.card, backgroundImage: c ? `url(${c})` : "none" }, children: [
+    /* @__PURE__ */ e.jsx(w, { level: "h4", textAlign: "center", children: A() }),
+    /* @__PURE__ */ e.jsxs(D, { container: !0, spacing: 1, sx: { justifyContent: "center" }, children: [
+      /* @__PURE__ */ e.jsx(D, { xs: 6, children: /* @__PURE__ */ e.jsx(
+        ee,
+        {
+          type: "yes",
+          isSelected: f === !0,
+          isPredictionMade: p,
+          isLoading: d,
+          predictionCount: o.yes,
+          totalPredictions: o.total,
+          onClick: () => S(!0)
+        }
+      ) }),
+      /* @__PURE__ */ e.jsx(D, { xs: 6, children: /* @__PURE__ */ e.jsx(
+        ee,
+        {
+          type: "no",
+          isSelected: f === !1,
+          isPredictionMade: p,
+          isLoading: d,
+          predictionCount: o.no,
+          totalPredictions: o.total,
+          onClick: () => S(!1)
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ e.jsx(
+      te,
+      {
+        open: y,
+        anchorOrigin: { vertical: "top", horizontal: "center" },
+        autoHideDuration: 3e3,
+        color: "success",
+        onClose: () => i(!1),
+        children: C("predictions.success_message")
+      }
+    )
+  ] });
+}, ge = ["BOTH_TEAMS_SCORE", "PENALTY_MATCH", "RED_CARD_MATCH"], ye = ["FT_1X2", "HT_1X2"], Ce = ["CORRECT_SCORE", "CORRECT_SCORE_HT", "CORRECT_SCORE_ADVANCED"], Se = ({ match: t, market: r }) => {
+  const s = () => !t || !t.availableMarkets ? !1 : t.availableMarkets.includes(r), n = () => s() ? ye.includes(r) ? /* @__PURE__ */ e.jsx(pe, { match: t, market: r }) : ge.includes(r) ? /* @__PURE__ */ e.jsx(he, { match: t, market: r }) : Ce.includes(r) ? /* @__PURE__ */ e.jsx(me, { match: t, market: r }) : (console.warn(`Unsupported market type: ${r}`), null) : (console.warn(`Market ${r} is not available for match ${t.id}`), null);
+  return /* @__PURE__ */ e.jsx(h, { children: n() });
+}, ve = ({ contentId: t, market: r, contentType: s }) => {
+  const [n, l] = a.useState(!0), [c, f] = a.useState(null), [x, p] = a.useState(!1), m = W(), y = async () => {
+    l(!0), p(!1);
+    try {
+      let i;
+      s === "match" ? i = await m.football.getMatchById(t) : i = await m.football.getNextMatchForTeam(t), f(i);
+    } catch (i) {
+      console.warn(`Error fetching ${s}:`, i), p(!0);
+    } finally {
+      l(!1);
+    }
+  };
+  return a.useEffect(() => {
+    y();
+  }, [t, s]), !c || x ? null : n ? /* @__PURE__ */ e.jsx(h, { sx: { display: "flex", justifyContent: "center", p: 4 }, children: /* @__PURE__ */ e.jsx(ne, {}) }) : /* @__PURE__ */ e.jsx(Se, { match: c, market: r });
+};
+export {
+  ve as default
+};