TresAbhi/blitzkit
1
0 Fork 0
mirror of https://github.com/blitzkit/blitzkit.git synced 2026-10-22 19:19:52 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: equipment icons

Browse Source
This commit is contained in:
TrèsAbhi committed 2024-01-16 16:58:00 -06:00
1 parent a741cc305a
commit 5adc69977b
20 files changed
+428 -218
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/app/tools/tankopedia/[id]/components/Configure.tsx
+91
View File
@@ -0,0 +1,91 @@
import { Flex, Heading } from '@radix-ui/themes';
import { produce } from 'immer';
import { Dispatch, SetStateAction } from 'react';
import { ModuleButton } from '../../../../../components/ModuleButton';
import { Duel } from '../page';
interface ConfigureProps {
duel: Duel;
setDuel: Dispatch<SetStateAction<Duel>>;
}
export function Configure({ duel, setDuel }: ConfigureProps) {
return (
<Flex gap="6" direction="column">
<Heading>Configure</Heading>
<Flex gap="4" direction="column">
<Heading size="5">Modules</Heading>
<Flex gap="2">
<Flex>
{duel.protagonist.tank.turrets.map((thisTurret, index) => {
return (
<ModuleButton
key={thisTurret.id}
selected={duel.protagonist.turret.id === thisTurret.id}
type="module"
module="turret"
tier={thisTurret.tier}
first={index === 0}
last={index === duel.protagonist.tank.turrets.length - 1}
rowChild
onClick={() => {
setDuel(
produce<Duel>((draft) => {
draft.protagonist.turret = thisTurret;
draft.protagonist.gun = thisTurret.guns.at(-1)!;
draft.protagonist.shell =
thisTurret.guns.at(-1)!.shells[0];
}),
);
}}
/>
);
})}
</Flex>
<Flex>
{duel.protagonist.turret.guns.map((thisGun, index) => {
return (
<ModuleButton
key={thisGun.id}
type="module"
module="gun"
tier={thisGun.tier}
selected={duel.protagonist.gun.id === thisGun.id}
first={index === 0}
last={index === duel.protagonist.turret.guns.length - 1}
rowChild
onClick={() => {
setDuel(
produce<Duel>((draft) => {
draft.protagonist.gun = thisGun;
draft.protagonist.shell = thisGun.shells[0];
}),
);
}}
/>
);
})}
</Flex>
</Flex>
</Flex>
<Flex gap="4" direction="column">
<Heading size="5">Camouflage</Heading>
</Flex>
<Flex gap="4" direction="column">
<Heading size="5">Consumables</Heading>
</Flex>
<Flex gap="4" direction="column">
<Heading size="5">Provisions</Heading>
</Flex>
<Flex gap="4" direction="column">
<Heading size="5">Equipment</Heading>
</Flex>
</Flex>
);
}
src/app/tools/tankopedia/[id]/components/Modules.tsx
-67
View File
@@ -1,67 +0,0 @@
import { Flex } from '@radix-ui/themes';
import { produce } from 'immer';
import { Dispatch, SetStateAction } from 'react';
import { ModuleButton } from '../../../../../components/ModuleButton';
import { Duel } from '../page';
interface ModulesProps {
duel: Duel;
setDuel: Dispatch<SetStateAction<Duel>>;
}
export function Modules({ duel, setDuel }: ModulesProps) {
return (
<Flex gap="2">
<Flex>
{duel.protagonist.tank.turrets.map((thisTurret, index) => {
return (
<ModuleButton
key={thisTurret.id}
selected={duel.protagonist.turret.id === thisTurret.id}
type="module"
module="turret"
tier={thisTurret.tier}
first={index === 0}
last={index === duel.protagonist.tank.turrets.length - 1}
rowChild
onClick={() => {
setDuel(
produce<Duel>((draft) => {
draft.protagonist.turret = thisTurret;
draft.protagonist.gun = thisTurret.guns.at(-1)!;
draft.protagonist.shell = thisTurret.guns.at(-1)!.shells[0];
}),
);
}}
/>
);
})}
</Flex>
<Flex>
{duel.protagonist.turret.guns.map((thisGun, index) => {
return (
<ModuleButton
key={thisGun.id}
type="module"
module="gun"
tier={thisGun.tier}
selected={duel.protagonist.gun.id === thisGun.id}
first={index === 0}
last={index === duel.protagonist.turret.guns.length - 1}
rowChild
onClick={() => {
setDuel(
produce<Duel>((draft) => {
draft.protagonist.gun = thisGun;
draft.protagonist.shell = thisGun.shells[0];
}),
);
}}
/>
);
})}
</Flex>
</Flex>
);
}
src/app/tools/tankopedia/[id]/page.tsx
+3 -2
View File
@@ -7,8 +7,8 @@ import PageWrapper from '../../../../components/PageWrapper';
import { tankDefinitions } from '../../../../core/blitzkrieg/tankDefinitions';
import mutateTankopedia, { DuelMember } from '../../../../stores/tankopedia';
import { AntagonistBar } from './components/AntagonistBar';
import { Configure } from './components/Configure';
import { TankDisplay } from './components/Model/TankDisplay';
import { Modules } from './components/Modules';
import { Title } from './components/Title';
export interface Duel {
@@ -83,8 +83,9 @@ export default function Page({ params }: { params: { id: string } }) {
<Title duel={duel} />
<TankDisplay duel={duel} />
<AntagonistBar duel={duel} setDuel={setDuel} />
<Modules duel={duel} setDuel={setDuel} />
</Flex>
<Configure duel={duel} setDuel={setDuel} />
</Flex>
</PageWrapper>
);