Move the copy to screenshot button to the toolbar

Signed-off-by: popcorny <[email protected]>
DataRecce · Oct 18, 2024 · 1ca1ce9 · 1ca1ce9
1 parent ea88129
commit 1ca1ce9
Show file tree

Hide file tree

Showing 8 changed files with 423 additions and 374 deletions.
diff --git a/js/src/components/data-grid/ScreenshotDataGrid.tsx b/js/src/components/data-grid/ScreenshotDataGrid.tsx
@@ -1,28 +1,24 @@
 import "react-data-grid/lib/styles.css";
 import DataGrid, { DataGridProps } from "react-data-grid";
-import { Flex, Text } from "@chakra-ui/react";
+import { Flex, forwardRef, Text } from "@chakra-ui/react";
 import {
   useCopyToClipboardButton,
   useImageDownloadModal,
 } from "@/lib/hooks/ScreenShot";
 import { useCallback } from "react";
 
-interface ScreenshotDataGridProps extends DataGridProps<any> {
-  enableScreenshot?: boolean;
-}
+interface ScreenshotDataGridProps extends DataGridProps<any> {}
 
-export function ScreenshotDataGrid({
-  enableScreenshot = true,
-  ...props
-}: ScreenshotDataGridProps) {
-  const { ref, CopyToClipboardButton } = useCopyToClipboardButton();
-  return (
-    <>
-      <DataGrid ref={ref} {...props} />
-      {enableScreenshot && <CopyToClipboardButton imageType="png" />}
-    </>
-  );
-}
+export const ScreenshotDataGrid = forwardRef(
+  ({ ...props }: ScreenshotDataGridProps, ref: any) => {
+    const { CopyToClipboardButton } = useCopyToClipboardButton();
+    return (
+      <>
+        <DataGrid ref={ref} {...props} />
+      </>
+    );
+  }
+);
 
 export function EmptyRowsRenderer() {
   return (