diff options
| author | Joe Carstairs <me@joeac.net> | 2024-12-12 08:26:53 +0000 |
|---|---|---|
| committer | Joe Carstairs <me@joeac.net> | 2024-12-12 08:26:53 +0000 |
| commit | 8a30bcbdf9264d235bf93da3df8e170cfde53d02 (patch) | |
| tree | 5f9b6fe956c72b89a89cc936ab86ec1bffc271f5 /gui/src/components/histogram/Histogram.tsx | |
| parent | 51711fb42a44b452cdf1b4fd6a716d0251f23dda (diff) | |
Removes web GUI
Diffstat (limited to 'gui/src/components/histogram/Histogram.tsx')
| -rw-r--r-- | gui/src/components/histogram/Histogram.tsx | 80 |
1 files changed, 0 insertions, 80 deletions
diff --git a/gui/src/components/histogram/Histogram.tsx b/gui/src/components/histogram/Histogram.tsx deleted file mode 100644 index 1dd8c65..0000000 --- a/gui/src/components/histogram/Histogram.tsx +++ /dev/null @@ -1,80 +0,0 @@ -import { BalanceToBudgetRatio } from "../../types/balanceToBudgetRatio"; -import { Category } from "../../types/category"; -import { Group } from "../../types/group"; -import { groupCategories } from "../../util/groupCategories"; -import './Histogram.scss'; - -function Histogram({ categories }: Props) { - if (categories === null) { - return ( - <p>No categories to show</p> - ); - } - - const balanceToBudgetRatioNormaliser = BalanceToBudgetRatio.makeNormaliser(...categories.map(c => c.balanceToBudgetRatio)); - for (const category of categories) { - category.balanceToBudgetRatio = balanceToBudgetRatioNormaliser(category.balanceToBudgetRatio); - } - - const groups = [...groupCategories(categories)]; - - return ( - <table> - <thead> - <tr> - <th>Category</th> - <th>Balance-to-Budget Ratio</th> - <th>Balance</th> - </tr> - </thead> - { - groups.map(g => <RowGroup group={g} />) - } - </table> - ); -} - -function RowGroup({ group }: GroupProps) { - return ( - <tbody> - <tr role="heading" aria-level="3">{group.name}</tr> - { - group.categories - .sort((c1, c2) => BalanceToBudgetRatio.compare(c1.balanceToBudgetRatio, c2.balanceToBudgetRatio)) - .map((category) => Row({ category })) - } - </tbody> - ); -} - -function Row({ category }: RowProps) { - return ( - <tr> - <td class="name">{category.name}</td> - <td - class={`ratio ratio--${category.balanceToBudgetRatio?.recommendedAction ?? ''}`} - style={`--normal-abs-ratio: ${Math.abs(category.balanceToBudgetRatio?.normalisedRatio ?? 0)};`} - > - <span class="ratio__text"> - {category.balanceToBudgetRatio?.toString() ?? ''} - </span> - <span class="ratio__bar"></span> - </td> - <td class="balance">{category.currentBalance.toString()}</td> - </tr> - ); -} - -type Props = { - categories: Category[] | null, -}; - -type GroupProps = { - group: Group; -} - -type RowProps = { - category: Category, -}; - -export default Histogram; |
