90 lines
2.3 KiB
TypeScript
90 lines
2.3 KiB
TypeScript
import React, { useEffect, useMemo, useState } from "react";
|
|
import { View, Text, StyleSheet } from "react-native";
|
|
import { ColorValue } from "react-native";
|
|
|
|
interface ChipDistributionSummaryProps {
|
|
playerCount: number;
|
|
buyInAmount: number | null;
|
|
totalChipsCount: number[];
|
|
colors?: ColorValue[];
|
|
}
|
|
|
|
const MAX_CHIPS = 500;
|
|
|
|
const ChipDistributionSummary = ({
|
|
playerCount,
|
|
buyInAmount,
|
|
totalChipsCount,
|
|
colors = ["white", "red", "green", "blue", "black"],
|
|
}: ChipDistributionSummaryProps) => {
|
|
const [chipDistribution, setChipDistribution] = useState<number[]>([]);
|
|
|
|
useEffect(() => {
|
|
if (buyInAmount !== null && playerCount > 0) {
|
|
let totalChips = totalChipsCount.reduce((sum, count) => sum + count, 0);
|
|
|
|
if (totalChips > MAX_CHIPS) {
|
|
const scaleFactor = MAX_CHIPS / totalChips;
|
|
totalChipsCount = totalChipsCount.map((count) =>
|
|
Math.floor(count * scaleFactor)
|
|
);
|
|
totalChips = MAX_CHIPS;
|
|
}
|
|
const distribution = totalChipsCount.map((chipCount) =>
|
|
Math.floor(chipCount / playerCount)
|
|
);
|
|
|
|
setChipDistribution(distribution);
|
|
} else {
|
|
setChipDistribution([]);
|
|
}
|
|
}, [buyInAmount, playerCount, totalChipsCount]);
|
|
|
|
const hasValidDistribution = useMemo(
|
|
() =>
|
|
buyInAmount !== null && playerCount > 0 && chipDistribution.length > 0,
|
|
[buyInAmount, playerCount, chipDistribution]
|
|
);
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<Text style={styles.title}>Chip Distribution Summary:</Text>
|
|
{hasValidDistribution ? (
|
|
chipDistribution.map((count, index) => (
|
|
<Text key={index} style={[styles.chipText, { color: colors[index] }]}>
|
|
{`${colors[index]?.toString().toUpperCase()} Chips: ${count} per player`}
|
|
</Text>
|
|
))
|
|
) : (
|
|
<Text style={styles.noDataText}>
|
|
No valid distribution calculated yet.
|
|
</Text>
|
|
)}
|
|
</View>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
marginTop: 20,
|
|
padding: 15,
|
|
backgroundColor: "#F8F9FA",
|
|
borderRadius: 10,
|
|
},
|
|
title: {
|
|
fontSize: 18,
|
|
fontWeight: "bold",
|
|
marginBottom: 10,
|
|
},
|
|
chipText: {
|
|
fontSize: 16,
|
|
marginVertical: 2,
|
|
},
|
|
noDataText: {
|
|
fontSize: 16,
|
|
color: "gray",
|
|
},
|
|
});
|
|
|
|
export default ChipDistributionSummary;
|