chore: upgrade findable and allow toggling all columns (#203, #204) (#…

…205)
galaxyproject · Jan 10, 2025 · f4bdff4 · f4bdff4
1 parent 5d050df
commit f4bdff4
Show file tree

Hide file tree

Showing 5 changed files with 195 additions and 40 deletions.
diff --git a/app/components/Table/components/TableCell/components/AnalyzeGenome/analyzeGenome.tsx b/app/components/Table/components/TableCell/components/AnalyzeGenome/analyzeGenome.tsx
@@ -24,7 +24,7 @@ export const AnalyzeGenome = ({
       >
         {analyze.label}
       </Button>
-      <DropdownMenu {...MENU_PROPS} Button={renderButton}>
+      <DropdownMenu {...MENU_PROPS} button={renderButton}>
         {({ closeMenu }): JSX.Element[] =>
           views.map((view, i) => (
             <MenuItem

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -14,7 +14,7 @@
     "build-brc-db": "esrun files/build-catalog.ts"
   },
   "dependencies": {
-    "@databiosphere/findable-ui": "15.0.2",
+    "@databiosphere/findable-ui": "^21.0.0",
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@mdx-js/loader": "^3.0.1",

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -19,6 +19,7 @@ import type { AppProps } from "next/app";
 import { StyledFooter } from "../app/components/Layout/components/Footer/footer.styles";
 import { config } from "../app/config/config";
 import { mergeAppTheme } from "../app/theme/theme";
+import { GoogleSignInAuthenticationProvider } from "@databiosphere/findable-ui/lib/providers/googleSignInAuthentication/provider";
 
 const DEFAULT_ENTITY_LIST_TYPE = "organisms";
 
@@ -60,35 +61,37 @@ function MyApp({ Component, pageProps }: AppPropsWithComponent): JSX.Element {
           <Head pageTitle={pageTitle} />
           <CssBaseline />
           <SystemStatusProvider>
-            <LayoutStateProvider>
-              <AppLayout>
-                <DXHeader {...header} />
-                <ExploreStateProvider entityListType={entityListType}>
-                  <Main>
-                    <ErrorBoundary
-                      fallbackRender={({
-                        error,
-                        reset,
-                      }: {
-                        error: DataExplorerError;
-                        reset: () => void;
-                      }): JSX.Element => (
-                        <Error
-                          errorMessage={error.message}
-                          requestUrlMessage={error.requestUrlMessage}
-                          rootPath={redirectRootToPath}
-                          onReset={reset}
-                        />
-                      )}
-                    >
-                      <Component {...pageProps} />
-                      <Floating {...floating} />
-                    </ErrorBoundary>
-                  </Main>
-                </ExploreStateProvider>
-                <StyledFooter {...footer} />
-              </AppLayout>
-            </LayoutStateProvider>
+            <GoogleSignInAuthenticationProvider>
+              <LayoutStateProvider>
+                <AppLayout>
+                  <DXHeader {...header} />
+                  <ExploreStateProvider entityListType={entityListType}>
+                    <Main>
+                      <ErrorBoundary
+                        fallbackRender={({
+                          error,
+                          reset,
+                        }: {
+                          error: DataExplorerError;
+                          reset: () => void;
+                        }): JSX.Element => (
+                          <Error
+                            errorMessage={error.message}
+                            requestUrlMessage={error.requestUrlMessage}
+                            rootPath={redirectRootToPath}
+                            onReset={reset}
+                          />
+                        )}
+                      >
+                        <Component {...pageProps} />
+                        <Floating {...floating} />
+                      </ErrorBoundary>
+                    </Main>
+                  </ExploreStateProvider>
+                  <StyledFooter {...footer} />
+                </AppLayout>
+              </LayoutStateProvider>
+            </GoogleSignInAuthenticationProvider>
           </SystemStatusProvider>
         </DXConfigProvider>
       </ThemeProvider>

diff --git a/site-config/brc-analytics/local/index/genomeEntityConfig.ts b/site-config/brc-analytics/local/index/genomeEntityConfig.ts
@@ -75,7 +75,7 @@ export const genomeEntityConfig: BRCEntityConfig<BRCDataCatalogGenome> = {
           component: C.AnalyzeGenome,
           viewBuilder: V.buildAnalyzeGenome,
         } as ComponentConfig<typeof C.AnalyzeGenome, BRCDataCatalogGenome>,
-        disableSorting: true,
+        enableSorting: false,
         header: BRC_DATA_CATALOG_CATEGORY_LABEL.ANALYZE_GENOME,
         id: BRC_DATA_CATALOG_CATEGORY_KEY.ANALYZE_GENOME,
         width: "auto",
@@ -145,9 +145,16 @@ export const genomeEntityConfig: BRCEntityConfig<BRCDataCatalogGenome> = {
         width: { max: "0.5fr", min: "142px" },
       },
     ],
-    defaultSort: {
-      desc: SORT_DIRECTION.ASCENDING,
-      id: BRC_DATA_CATALOG_CATEGORY_KEY.SPECIES,
+    tableOptions: {
+      initialState: {
+        columnVisibility: {},
+        sorting: [
+          {
+            desc: SORT_DIRECTION.ASCENDING,
+            id: BRC_DATA_CATALOG_CATEGORY_KEY.SPECIES,
+          },
+        ],
+      },
     },
   } as ListConfig<BRCDataCatalogGenome>,
   listView: {