From eb0c35d6c611abd7d587902fc4c7c8f5fe9d83f9 Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Sun, 11 Oct 2026 14:00:09 -0500 Subject: [PATCH] max cons and provs --- .../src/components/Button/index.module.css | 5 ++++ .../website/src/components/Button/index.tsx | 3 +++ .../components/TankopediaLoadout/index.tsx | 26 +++++++++++++++++++ 3 files changed, 34 insertions(+) diff --git a/packages/website/src/components/Button/index.module.css b/packages/website/src/components/Button/index.module.css index ce60f9b24..5f0b5fc0c 100644 --- a/packages/website/src/components/Button/index.module.css +++ b/packages/website/src/components/Button/index.module.css @@ -16,6 +16,11 @@ cursor: pointer; + &[data-disabled="true"] { + cursor: default; + opacity: 0.5; + } + &[data-size="minor"] { font-size: 0.7em; padding: var(--space-2) var(--space-3); diff --git a/packages/website/src/components/Button/index.tsx b/packages/website/src/components/Button/index.tsx index e2a25188f..7e7121d08 100644 --- a/packages/website/src/components/Button/index.tsx +++ b/packages/website/src/components/Button/index.tsx @@ -39,6 +39,7 @@ export function Button({ listChild, parentListChild, + disabled, ...props }: ButtonProps) { return ( @@ -51,6 +52,8 @@ export function Button({ data-size={size} data-list-child={listChild} data-parent-list-child={parentListChild} + data-disabled={disabled} + disabled={disabled} {...props} /> ); diff --git a/packages/website/src/components/TankopediaLoadout/index.tsx b/packages/website/src/components/TankopediaLoadout/index.tsx index f0b0c6597..d45956800 100644 --- a/packages/website/src/components/TankopediaLoadout/index.tsx +++ b/packages/website/src/components/TankopediaLoadout/index.tsx @@ -173,8 +173,15 @@ interface ProvisionEntryProps { function ProvisionEntry({ id, provision }: ProvisionEntryProps) { const isSelected = useProvision("protagonist", id); + const tank = useDuel("protagonist", DuelModule.Tank); + const selectedCount = Tankopedia.use( + (state) => state.protagonist.provisions.length, + ); + const unwrap = useUnwrapper(); + const disabled = !isSelected && selectedCount >= tank.max_provisions; + return ( { Tankopedia.mutate((draft) => { const index = draft.protagonist.provisions.indexOf(id); if (index === -1) { + if (draft.protagonist.provisions.length === tank.max_provisions) { + return; + } + draft.protagonist.provisions.push(id); } else { draft.protagonist.provisions.splice(index, 1); @@ -252,11 +264,18 @@ interface ConsumableProps { } function ConsumableEntry({ id, consumable }: ConsumableProps) { + const tank = useDuel("protagonist", DuelModule.Tank); const isSelected = Tankopedia.use((state) => state.protagonist.consumables.includes(id), ); + const selectedCount = Tankopedia.use( + (state) => state.protagonist.consumables.length, + ); + const unwrap = useUnwrapper(); + const disabled = !isSelected && selectedCount >= tank.max_consumables; + return (
@@ -265,11 +284,18 @@ function ConsumableEntry({ id, consumable }: ConsumableProps) { variant={isSelected ? "surface" : "soft"} color={isSelected ? undefined : "gray"} className={styles.consumable} + disabled={disabled} onClick={() => { Tankopedia.mutate((draft) => { const index = draft.protagonist.consumables.indexOf(id); if (index === -1) { + if ( + draft.protagonist.consumables.length === tank.max_consumables + ) { + return; + } + draft.protagonist.consumables.push(id); } else { draft.protagonist.consumables.splice(index, 1);