From 73ee79315d1599d9ceeb8c592dcab005c4f29191 Mon Sep 17 00:00:00 2001
From: Huy Do <huydhn@gmail.com>
Date: Fri, 16 Feb 2024 15:37:34 -0800
Subject: [PATCH] Keep the behavior of DataGrid table to hide the footer by
 default (#4955)

https://github.com/pytorch/test-infra/pull/4745 changed the behavior of
the DataGrid table to show the footer and pagination by default and this
breaks exiting table like https://hud.pytorch.org/benchmark/compilers
where the summary table now include pagination.

This change switches the default behavior back to what is was before of
not showing and also allow the user benchmark table from
https://github.com/pytorch/test-infra/pull/4745 to show the footer it
needs

### Testing

The summary table on the dashboard is back without footer
https://torchci-git-fork-huydhn-fix-dashboard-summa-7ec9fd-fbopensource.vercel.app/benchmark/compilers

While the user benchmark table has footer and pagination
https://torchci-git-fork-huydhn-fix-dashboard-summa-7ec9fd-fbopensource.vercel.app/torchbench/userbenchmark
---
 torchci/components/metrics/panels/TablePanel.tsx | 8 ++++++++
 torchci/pages/torchbench/userbenchmark.tsx       | 1 +
 2 files changed, 9 insertions(+)

diff --git a/torchci/components/metrics/panels/TablePanel.tsx b/torchci/components/metrics/panels/TablePanel.tsx
index bbac84fc79..b646721fdc 100644
--- a/torchci/components/metrics/panels/TablePanel.tsx
+++ b/torchci/components/metrics/panels/TablePanel.tsx
@@ -22,6 +22,8 @@ export default function TablePanel({
   dataGridProps,
   // An optional help link to display in the title
   helpLink,
+  // An optional flag to show the table footer
+  showFooter,
 }: {
   title: string;
   queryCollection?: string;
@@ -30,6 +32,7 @@ export default function TablePanel({
   columns: GridColDef[];
   dataGridProps: any;
   helpLink?: string;
+  showFooter?: boolean;
 }) {
   const url = `/api/query/${queryCollection}/${queryName}?parameters=${encodeURIComponent(
     JSON.stringify(queryParams)
@@ -46,6 +49,7 @@ export default function TablePanel({
       columns={columns}
       dataGridProps={dataGridProps}
       helpLink={helpLink}
+      showFooter={showFooter}
     />
   );
 }
@@ -61,12 +65,15 @@ export function TablePanelWithData({
   dataGridProps,
   // An optional help link to display in the title
   helpLink,
+  // An optional flag to show the table footer
+  showFooter,
 }: {
   title: string;
   data: any;
   columns: GridColDef[];
   dataGridProps: any;
   helpLink?: string;
+  showFooter?: boolean;
 }) {
   if (data === undefined) {
     return <Skeleton variant={"rectangular"} height={"100%"} />;
@@ -95,6 +102,7 @@ export function TablePanelWithData({
       density={"compact"}
       rows={data}
       columns={columns}
+      hideFooter={!showFooter}
       autoPageSize
       components={{
         Toolbar: Header,
diff --git a/torchci/pages/torchbench/userbenchmark.tsx b/torchci/pages/torchbench/userbenchmark.tsx
index 96b0627660..09dd61c0cc 100644
--- a/torchci/pages/torchbench/userbenchmark.tsx
+++ b/torchci/pages/torchbench/userbenchmark.tsx
@@ -343,6 +343,7 @@ function Report({
           <TablePanelWithData
             title={"Metrics"}
             data={metrics}
+            showFooter={true}
             columns={[
               {
                 field: "metadata",