Typescript

src/components/map/MapTile.tsx

@@ -0,0 +1,42 @@
+import React from "react";
+import { Map } from "../../types/Map";
+
+import Tile from "../tile/Tile";
+import MapImage from "./MapTileImage";
+
+type MapTileProps = {
+  map: Map;
+  isSelected: boolean;
+  onSelect: (mapId: string) => void;
+  onEdit: (mapId: string) => void;
+  onDoubleClick: () => void;
+  canEdit: boolean;
+  badges: React.ReactChild[];
+};
+
+function MapTile({
+  map,
+  isSelected,
+  onSelect,
+  onEdit,
+  onDoubleClick,
+  canEdit,
+  badges,
+}: MapTileProps) {
+  return (
+    <Tile
+      title={map.name}
+      isSelected={isSelected}
+      onSelect={() => onSelect(map.id)}
+      onEdit={() => onEdit(map.id)}
+      onDoubleClick={() => canEdit && onDoubleClick()}
+      canEdit={canEdit}
+      badges={badges}
+      editTitle="Edit Map"
+    >
+      <MapImage map={map} />
+    </Tile>
+  );
+}
+
+export default MapTile;