feat: modules button

src/app/tools/compare/page.tsx

@@ -488,12 +488,14 @@ export default function Page() {
                         <Flex
                           align="center"
                           justify="center"
+                          direction="column"
                           gap="3"
                           style={{
                             width: '100%',
                             height: '100%',
                           }}
                         >
+                          <Flex align="center" justify="center" gap="3">
                             <Popover.Root>
                               <Popover.Trigger>
                                 <Button
@@ -550,7 +552,9 @@ export default function Page() {
                                     (provision) => provision.id,
                                   )}
                                   selected={provisions}
-                                disabled={tank.provisions === provisions.length}
+                                  disabled={
+                                    tank.provisions === provisions.length
+                                  }
                                   onChange={(provisions) => {
                                     mutateCompareTemporary((draft) => {
                                       draft.members[index].provisions =
@@ -586,7 +590,8 @@ export default function Page() {
                                         }}
                                       >
                                         {times(3, (x) => {
-                                        const equipment = equipmentMatrix[y][x];
+                                          const equipment =
+                                            equipmentMatrix[y][x];
 
                                           return (
                                             <Flex
@@ -665,7 +670,9 @@ export default function Page() {
                                       mutateCompareTemporary((draft) => {
                                         draft.members.forEach((member) => {
                                           member.equipmentMatrix =
-                                          draft.members[index].equipmentMatrix;
+                                            draft.members[
+                                              index
+                                            ].equipmentMatrix;
                                           draft.sorting = undefined;
                                         });
                                       });
@@ -757,6 +764,25 @@ export default function Page() {
                               </Popover.Content>
                             </Popover.Root>
                           </Flex>
+
+                          <Button variant="ghost">
+                            <Flex align="center">
+                              {['turret', 'gun', 'engine', 'chassis'].map(
+                                (module, index) => (
+                                  <img
+                                    width={24}
+                                    height={24}
+                                    src={asset(`icons/modules/${module}.webp`)}
+                                    style={{
+                                      objectFit: 'contain',
+                                      marginLeft: index > 0 ? -4 : 0,
+                                    }}
+                                  />
+                                ),
+                              )}
+                            </Flex>
+                          </Button>
+                        </Flex>
                       </Table.Cell>
                     );
                   },