Move

web/apps/photos/src/components/Chip.tsx

@@ -1,9 +0,0 @@
-import { Button, ButtonProps, styled } from "@mui/material";
-import { CSSProperties } from "@mui/material/styles/createTypography";
-
-export const Chip = styled((props: ButtonProps) => (
-    <Button color="secondary" {...props} />
-))(({ theme }) => ({
-    ...(theme.typography.small as CSSProperties),
-    padding: "8px",
-}));

web/apps/photos/src/components/PhotoViewer/FileInfo/index.tsx

@@ -16,6 +16,7 @@ import {
     type ParsedMetadataDate,
 } from "@/media/file-metadata";
 import { FileType } from "@/media/file-type";
+import { ChipButton } from "@/new/photos/components/mui/ChipButton";
 import { FilePeopleList } from "@/new/photos/components/PeopleList";
 import { PhotoDateTimePicker } from "@/new/photos/components/PhotoDateTimePicker";
 import { fileInfoDrawerZIndex } from "@/new/photos/components/utils/z-index";
@@ -49,7 +50,6 @@ import {
     styled,
     Typography,
 } from "@mui/material";
-import { Chip } from "components/Chip";
 import LinkButton from "components/pages/gallery/LinkButton";
 import { t } from "i18next";
 import { GalleryContext } from "pages/gallery";
@@ -288,14 +288,14 @@ export const FileInfo: React.FC<FileInfoProps> = ({
                                     collectionNameMap.has(collectionID),
                                 )
                                 ?.map((collectionID) => (
-                                    <Chip
+                                    <ChipButton
                                         key={collectionID}
                                         onClick={() =>
                                             onCollectionChipClick(collectionID)
                                         }
                                     >
                                         {collectionNameMap.get(collectionID)}
-                                    </Chip>
+                                    </ChipButton>
                                 ))}
                         </Box>
                     </InfoItem>

web/packages/new/photos/components/mui/ChipButton.tsx

@@ -0,0 +1,8 @@
+import { Button, type ButtonProps, styled } from "@mui/material";
+
+export const ChipButton = styled((props: ButtonProps) => (
+    <Button color="secondary" {...props} />
+))(({ theme }) => ({
+    ...theme.typography.small,
+    padding: "8px",
+}));