temp

nickgros · Jan 3, 2025 · b2701ff · b2701ff
1 parent 81ce6f8
commit b2701ff
Show file tree

Hide file tree

Showing 14 changed files with 1,533 additions and 3,340 deletions.
diff --git a/packages/synapse-react-client/.storybook/main.mts b/packages/synapse-react-client/.storybook/main.mts
@@ -25,27 +25,27 @@ const config: StorybookConfig = {
     },
   },
 
-  typescript: {
-    // These options are from https://storybook.js.org/blog/material-ui-in-storybook/
-    check: false,
-    checkOptions: {},
-    reactDocgen: 'react-docgen-typescript',
-    reactDocgenTypescriptOptions: {
-      // @ts-ignore - speeds up storybook build time
-      allowSyntheticDefaultImports: false,
-      // speeds up storybook build time
-      esModuleInterop: false,
-      // makes union prop types like variant and size appear as select controls
-      shouldExtractLiteralValuesFromEnum: true,
-      // makes string and boolean types that can be undefined appear as inputs and switches
-      shouldRemoveUndefinedFromOptional: true,
-      // Filter out third-party props from node_modules except @mui packages
-      propFilter: prop =>
-        prop.parent
-          ? !/node_modules\/(?!@mui)/.test(prop.parent.fileName)
-          : true,
-    },
-  },
+  // typescript: {
+  //   // These options are from https://storybook.js.org/blog/material-ui-in-storybook/
+  //   check: false,
+  //   checkOptions: {},
+  //   reactDocgen: 'react-docgen-typescript',
+  //   reactDocgenTypescriptOptions: {
+  //     // @ts-ignore - speeds up storybook build time
+  //     allowSyntheticDefaultImports: false,
+  //     // speeds up storybook build time
+  //     esModuleInterop: false,
+  //     // makes union prop types like variant and size appear as select controls
+  //     shouldExtractLiteralValuesFromEnum: true,
+  //     // makes string and boolean types that can be undefined appear as inputs and switches
+  //     shouldRemoveUndefinedFromOptional: true,
+  //     // Filter out third-party props from node_modules except @mui packages
+  //     propFilter: prop =>
+  //       prop.parent
+  //         ? !/node_modules\/(?!@mui)/.test(prop.parent.fileName)
+  //         : true,
+  //   },
+  // },
 
   staticDirs: ['../public'],
 

diff --git a/packages/synapse-react-client/.storybook/preview.tsx b/packages/synapse-react-client/.storybook/preview.tsx
@@ -46,9 +46,9 @@ if (process.env.NODE_ENV === 'development') {
   // whyDidYouRender is a dev/debugging tool that logs to the console with information about why a component rendered
   // It won't track most components by default. Follow these instructions to track a component
   // https://github.com/welldone-software/why-did-you-render#tracking-components
-  whyDidYouRender(React, {
-    trackAllPureComponents: true,
-  })
+  // whyDidYouRender(React, {
+  //   trackAllPureComponents: true,
+  // })
 }
 
 export const parameters = {

diff --git a/packages/synapse-react-client/package.json b/packages/synapse-react-client/package.json
@@ -60,6 +60,7 @@
     "@tanstack/react-query": "5.22.2",
     "@tanstack/react-query-devtools": "5.24.0",
     "@tanstack/react-table": "^8.20.5",
+    "@tanstack/react-virtual": "^3.11.1",
     "@upsetjs/react": "^1.11.0",
     "animate.css": "^4.1.1",
     "bootstrap": "^4.6.2",
@@ -147,18 +148,18 @@
     "@jest/reporters": "^29.7.0",
     "@juggle/resize-observer": "^3.4.0",
     "@open-draft/deferred-promise": "^2.2.0",
-    "@storybook/addon-actions": "^8.2.4",
-    "@storybook/addon-designs": "^8.0.3",
-    "@storybook/addon-essentials": "^8.2.4",
-    "@storybook/addon-interactions": "^8.2.4",
-    "@storybook/addon-links": "^8.2.4",
-    "@storybook/addon-themes": "^8.2.4",
-    "@storybook/manager-api": "^8.2.4",
-    "@storybook/react": "^8.2.4",
-    "@storybook/react-vite": "^8.2.4",
-    "@storybook/test": "^8.2.4",
+    "@storybook/addon-actions": "^8.4.7",
+    "@storybook/addon-designs": "^8.0.4",
+    "@storybook/addon-essentials": "^8.4.7",
+    "@storybook/addon-interactions": "^8.4.7",
+    "@storybook/addon-links": "^8.4.7",
+    "@storybook/addon-themes": "^8.4.7",
+    "@storybook/manager-api": "^8.4.7",
+    "@storybook/react": "^8.4.7",
+    "@storybook/react-vite": "^8.4.7",
+    "@storybook/test": "^8.4.7",
     "@storybook/testing-library": "^0.2.2",
-    "@storybook/theming": "^8.2.4",
+    "@storybook/theming": "^8.4.7",
     "@svgr/plugin-jsx": "^8.1.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
@@ -225,7 +226,7 @@
     "react-dom": "^18.2.0",
     "react-select-event": "^5.5.1",
     "react-test-renderer": "^18.2.0",
-    "storybook": "^8.2.4",
+    "storybook": "^8.4.7",
     "stream-browserify": "^3.0.0",
     "stream-http": "^3.2.0",
     "timers-browserify": "^2.0.12",

diff --git a/packages/synapse-react-client/src/components/ChallengeDataDownload/Renderers.tsx b/packages/synapse-react-client/src/components/ChallengeDataDownload/Renderers.tsx
@@ -1,22 +1,23 @@
-import React from 'react'
-import { CellRendererProps } from './types'
-import { calculateFriendlyFileSize } from '../../utils/functions/calculateFriendlyFileSize'
-import { EntityIdAndVersionNumber } from '../EntityFinder/details/view/DetailsViewTableRenderers'
 import { Skeleton } from '@mui/material'
-import { useGetEntityBundle } from '../../synapse-queries'
 import { FileHandle } from '@sage-bionetworks/synapse-types'
+import { CellContext } from '@tanstack/react-table'
+import React from 'react'
+import { useGetEntityBundle } from '../../synapse-queries'
+import { calculateFriendlyFileSize } from '../../utils/functions/calculateFriendlyFileSize'
 import FileEntityDirectDownload from '../DirectDownload/FileEntityDirectDownload'
+import { EntityFinderTableViewRowData } from '../EntityFinder/details/view/DetailsView'
 
 export type FileHandleWithPreview = FileHandle & {
   isPreview?: boolean
 }
 
-export function SizeRenderer<T extends EntityIdAndVersionNumber>(
-  props: CellRendererProps<T>,
+export function SizeRenderer(
+  props: CellContext<EntityFinderTableViewRowData, unknown>,
 ) {
+  const { row } = props
   const { data: bundle, isLoading } = useGetEntityBundle(
-    props.rowData.entityId,
-    props.rowData.versionNumber,
+    row.original.entityId,
+    row.original.versionNumber,
   )
 
   if (isLoading) {
@@ -31,13 +32,14 @@ export function SizeRenderer<T extends EntityIdAndVersionNumber>(
   return <span>{friendlySize}</span>
 }
 
-export function DownloadRenderer<T extends EntityIdAndVersionNumber>(
-  props: CellRendererProps<T>,
+export function DownloadRenderer(
+  props: CellContext<EntityFinderTableViewRowData, unknown>,
 ) {
+  const { row } = props
   return (
     <FileEntityDirectDownload
-      entityId={props.rowData.entityId}
-      entityVersionNumber={props.rowData.versionNumber}
+      entityId={row.original.entityId}
+      entityVersionNumber={row.original.versionNumber}
       stopPropagation={true}
     />
   )