TresAbhi/blitzkit
1
0 Fork 0
mirror of https://github.com/blitzkit/blitzkit.git synced 2026-11-14 13:16:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: better titles

Browse Source
This commit is contained in:
TrèsAbhi committed 2024-04-05 13:40:18 -05:00
1 parent 8565d75747
commit cf419a9ebb
2 files changed
+89 -94
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/app/tools/compare/components/TankControl.tsx
+65 -67
View File
@@ -4,7 +4,7 @@ import {
ShuffleIcon,
TrashIcon,
} from '@radix-ui/react-icons';
import { Dialog, Flex, IconButton, Table } from '@radix-ui/themes';
import { Dialog, Flex, IconButton } from '@radix-ui/themes';
import { useState } from 'react';
import { TankDefinition } from '../../../../core/blitzkrieg/tankDefinitions';
import { tankToDuelMember } from '../../../../core/blitzkrieg/tankToDuelMember';
@@ -21,81 +21,79 @@ export function TankControl({ index, tank, members }: TankControlProps) {
const [switchTankDialogOpen, setSwitchTankDialogOpen] = useState(false);
return (
<Table.ColumnHeaderCell width="0" key={tank.id}>
<Flex gap="4" style={{ padding: '0 4px' }}>
{index !== 0 && (
<IconButton
variant="ghost"
onClick={() => {
mutateCompare((draft) => {
const item = draft.members[index];
draft.members.splice(index, 1);
draft.members.splice(index - 1, 0, item);
});
}}
>
<CaretLeftIcon />
</IconButton>
)}
<Flex gap="4" style={{ padding: '0 4px' }}>
{index !== 0 && (
<IconButton
variant="ghost"
onClick={() => {
mutateCompare((draft) => {
const item = draft.members[index];
draft.members.splice(index, 1);
draft.members.splice(index - 1, 0, item);
});
}}
>
<TrashIcon />
<CaretLeftIcon />
</IconButton>
<Dialog.Root
open={switchTankDialogOpen}
onOpenChange={setSwitchTankDialogOpen}
>
<Dialog.Trigger>
<IconButton variant="ghost">
<ShuffleIcon />
</IconButton>
</Dialog.Trigger>
<Dialog.Content>
<Flex gap="4" direction="column">
<Flex
direction="column"
gap="4"
style={{ flex: 1 }}
justify="center"
>
<TankSearch
compact
onSelect={(tank) => {
mutateCompare((draft) => {
draft.members[index] = {
...tankToDuelMember(tank),
crewSkills: {},
};
});
setSwitchTankDialogOpen(false);
}}
/>
</Flex>
</Flex>
</Dialog.Content>
</Dialog.Root>
{index !== members.length - 1 && (
<IconButton
variant="ghost"
onClick={() => {
mutateCompare((draft) => {
const item = draft.members[index];
draft.members.splice(index, 1);
draft.members.splice(index + 1, 0, item);
});
}}
>
<CaretRightIcon />
)}
<IconButton
variant="ghost"
onClick={() => {
mutateCompare((draft) => {
draft.members.splice(index, 1);
});
}}
>
<TrashIcon />
</IconButton>
<Dialog.Root
open={switchTankDialogOpen}
onOpenChange={setSwitchTankDialogOpen}
>
<Dialog.Trigger>
<IconButton variant="ghost">
<ShuffleIcon />
</IconButton>
)}
</Flex>
</Table.ColumnHeaderCell>
</Dialog.Trigger>
<Dialog.Content>
<Flex gap="4" direction="column">
<Flex
direction="column"
gap="4"
style={{ flex: 1 }}
justify="center"
>
<TankSearch
compact
onSelect={(tank) => {
mutateCompare((draft) => {
draft.members[index] = {
...tankToDuelMember(tank),
crewSkills: {},
};
});
setSwitchTankDialogOpen(false);
}}
/>
</Flex>
</Flex>
</Dialog.Content>
</Dialog.Root>
{index !== members.length - 1 && (
<IconButton
variant="ghost"
onClick={() => {
mutateCompare((draft) => {
const item = draft.members[index];
draft.members.splice(index, 1);
draft.members.splice(index + 1, 0, item);
});
}}
>
<CaretRightIcon />
</IconButton>
)}
</Flex>
);
}