@databiosphere/findable-ui 32.1.1 → 33.0.0

package/.release-please-manifest.json

@@ -1,3 +1,3 @@
 {
-  ".": "32.1.1"
+  ".": "33.0.0"
 }

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## [33.0.0](https://github.com/DataBiosphere/findable-ui/compare/v32.1.1...v33.0.0) (2025-05-23)
+
+
+### ⚠ BREAKING CHANGES
+
+* updated allowed annotation values #489 ([#498](https://github.com/DataBiosphere/findable-ui/issues/498))
+
+### Features
+
+* updated allowed annotation values [#489](https://github.com/DataBiosphere/findable-ui/issues/489) ([#498](https://github.com/DataBiosphere/findable-ui/issues/498)) ([78a6d4c](https://github.com/DataBiosphere/findable-ui/commit/78a6d4ca3bd798079ae1596078eb91ae2a1b9ab2))
+
+
+### Bug Fixes
+
+* fix incorrect labels on filters ([#499](https://github.com/DataBiosphere/findable-ui/issues/499)) ([#500](https://github.com/DataBiosphere/findable-ui/issues/500)) ([d6d85e4](https://github.com/DataBiosphere/findable-ui/commit/d6d85e4d04e2d9b6f441a9a2105a1bd31baf560f))
+
 ## [32.1.1](https://github.com/DataBiosphere/findable-ui/compare/v32.1.0...v32.1.1) (2025-05-22)
 
 

package/lib/common/categories/config/utils.d.ts

@@ -9,7 +9,7 @@ import { CategoryConfig } from "./types";
  * @returns category config.
  */
 export declare function findCategoryConfig<V extends VIEW_KIND>(viewKind: V, key: Category["key"], configs: CategoryConfig[]): Extract<CategoryConfig, {
-    viewKind: V;
+    viewKind?: V;
 }> | undefined;
 /**
  * Returns the range category config for the given category config key.

package/lib/common/categories/config/utils.js

@@ -7,7 +7,11 @@ import { VIEW_KIND } from "../views/types";
  * @returns category config.
  */
 export function findCategoryConfig(viewKind, key, configs) {
-    return configs.find((c) => c.viewKind === viewKind && c.key === key);
+    return configs.find((c) => 
+    // When `viewKind` is undefined, it corresponds to a `SelectCategoryConfig`.
+    // This predicate ensures that `viewKind` is either explicitly matched or treated as undefined
+    // for compatibility with `SelectCategoryConfig` and other explicitly defined view kinds.
+    (c.viewKind === undefined || c.viewKind === viewKind) && c.key === key);
 }
 /**
  * Returns the range category config for the given category config key.

package/lib/common/entities.d.ts

@@ -3,9 +3,7 @@ import { ColumnDef, RowData } from "@tanstack/react-table";
  * Model of a value of a metadata class.
  */
 export interface Attribute {
-    annotations?: {
-        [key in keyof DataDictionaryPrefix]: string;
-    };
+    annotations?: Record<string, string | string[] | undefined>;
     description: string;
     example?: string;
     multivalued: boolean;

package/lib/components/DataDictionary/dataDictionary.js

@@ -10,12 +10,12 @@ import { View } from "./dataDictionary.styles";
 import { useDataDictionary } from "./hooks/UseDataDictionary/hook";
 import { useLayoutSpacing } from "./hooks/UseLayoutSpacing/hook";
 export const DataDictionary = ({ className, EntitiesLayout = DefaultEntitiesLayout, Outline = DefaultOutline, OutlineLayout = DefaultOutlineLayout, Title = DefaultTitle, TitleLayout = DefaultTitleLayout, }) => {
-    const { classes, columnDefs } = useDataDictionary();
+    const { classes, columnDefs, title } = useDataDictionary();
     const { spacing } = useLayoutSpacing();
     const outline = useMemo(() => buildClassesOutline(classes), [classes]);
     return (React.createElement(View, { className: className },
         React.createElement(TitleLayout, { ...spacing },
-            React.createElement(Title, null)),
+            React.createElement(Title, { title: title })),
         React.createElement(OutlineLayout, { ...spacing },
             React.createElement(Outline, { outline: outline })),
         React.createElement(EntitiesLayout, { ...spacing },

package/lib/components/DataDictionary/hooks/UseDataDictionary/hook.js

@@ -6,6 +6,7 @@ export const useDataDictionary = () => {
     return useMemo(() => {
         const classes = dataDictionaryConfig?.dataDictionary?.classes || [];
         const columnDefs = dataDictionaryConfig?.columnDefs || [];
-        return { classes, columnDefs };
+        const title = dataDictionaryConfig?.dataDictionary?.title || "";
+        return { classes, columnDefs, title };
     }, [dataDictionaryConfig]);
 };

package/lib/components/DataDictionary/hooks/UseDataDictionary/types.d.ts

@@ -3,4 +3,5 @@ import { Attribute, Class } from "../../../../common/entities";
 export interface UseDataDictionary<T extends RowData = Attribute> {
     classes: Class<T>[];
     columnDefs: ColumnDef<T, T[keyof T]>[];
+    title: string;
 }

package/lib/components/Layout/components/Header/header.styles.js

@@ -3,6 +3,9 @@ import styled from "@emotion/styled";
 import { AppBar as MAppBar } from "@mui/material";
 import { smokeMain } from "../../../../styles/common/mixins/colors";
 import { HEADER_HEIGHT } from "./common/constants";
+// See https://github.com/emotion-js/emotion/issues/1105.
+// See https://github.com/emotion-js/emotion/releases/tag/%40emotion%2Fcache%4011.10.2.
+const ignoreSsrWarning = "/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */";
 export const AppBar = styled(MAppBar) `
   border-bottom: 1px solid ${smokeMain};
 
@@ -31,7 +34,7 @@ export const Left = styled.div `
   justify-content: flex-start;
 
   .MuiButton-navPrimary {
-    &:first-of-type {
+    &:first-child:not(style)${ignoreSsrWarning} { {
       margin-left: 24px;
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@databiosphere/findable-ui",
-  "version": "32.1.1",
+  "version": "33.0.0",
   "description": "",
   "scripts": {
     "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js",

package/src/common/categories/config/utils.ts

@@ -13,10 +13,13 @@ export function findCategoryConfig<V extends VIEW_KIND>(
   viewKind: V,
   key: Category["key"],
   configs: CategoryConfig[]
-): Extract<CategoryConfig, { viewKind: V }> | undefined {
+): Extract<CategoryConfig, { viewKind?: V }> | undefined {
   return configs.find(
-    (c): c is Extract<CategoryConfig, { viewKind: V }> =>
-      c.viewKind === viewKind && c.key === key
+    (c): c is Extract<CategoryConfig, { viewKind?: V }> =>
+      // When `viewKind` is undefined, it corresponds to a `SelectCategoryConfig`.
+      // This predicate ensures that `viewKind` is either explicitly matched or treated as undefined
+      // for compatibility with `SelectCategoryConfig` and other explicitly defined view kinds.
+      (c.viewKind === undefined || c.viewKind === viewKind) && c.key === key
   );
 }
 

package/src/common/entities.ts

@@ -4,9 +4,8 @@ import { ColumnDef, RowData } from "@tanstack/react-table";
  * Model of a value of a metadata class.
  */
 export interface Attribute {
-  annotations?: {
-    [key in keyof DataDictionaryPrefix]: string; // Prefix to fragment mapping, e.g. cxg: "batch_condition".
-  };
+  // Prefix to fragment mapping, e.g. cxg: "batch_condition", or, general tags e.g. tier: "Tier 1" and bionetwork: ["gut"]
+  annotations?: Record<string, string | string[] | undefined>; // 'undefined' allows for mix of keys across attributes e.g. tier, or tier and cxg, or cxg
   description: string;
   example?: string; // Free text example of attribute
   multivalued: boolean; // True if attribute can have multiple values

package/src/components/DataDictionary/dataDictionary.tsx

@@ -21,13 +21,13 @@ export const DataDictionary = <T extends RowData = Attribute>({
   Title = DefaultTitle,
   TitleLayout = DefaultTitleLayout,
 }: DataDictionaryProps): JSX.Element => {
-  const { classes, columnDefs } = useDataDictionary<T>();
+  const { classes, columnDefs, title } = useDataDictionary<T>();
   const { spacing } = useLayoutSpacing();
   const outline = useMemo(() => buildClassesOutline(classes), [classes]);
   return (
     <View className={className}>
       <TitleLayout {...spacing}>
-        <Title />
+        <Title title={title} />
       </TitleLayout>
       <OutlineLayout {...spacing}>
         <Outline outline={outline} />

package/src/components/DataDictionary/hooks/UseDataDictionary/hook.ts

@@ -18,6 +18,7 @@ export const useDataDictionary = <
   return useMemo(() => {
     const classes = dataDictionaryConfig?.dataDictionary?.classes || [];
     const columnDefs = dataDictionaryConfig?.columnDefs || [];
-    return { classes, columnDefs };
+    const title = dataDictionaryConfig?.dataDictionary?.title || "";
+    return { classes, columnDefs, title };
   }, [dataDictionaryConfig]);
 };

package/src/components/DataDictionary/hooks/UseDataDictionary/types.ts

@@ -4,4 +4,5 @@ import { Attribute, Class } from "../../../../common/entities";
 export interface UseDataDictionary<T extends RowData = Attribute> {
   classes: Class<T>[];
   columnDefs: ColumnDef<T, T[keyof T]>[];
+  title: string;
 }

package/src/components/Layout/components/Header/header.styles.ts

@@ -4,6 +4,11 @@ import { AppBar as MAppBar } from "@mui/material";
 import { smokeMain } from "../../../../styles/common/mixins/colors";
 import { HEADER_HEIGHT } from "./common/constants";
 
+// See https://github.com/emotion-js/emotion/issues/1105.
+// See https://github.com/emotion-js/emotion/releases/tag/%40emotion%2Fcache%4011.10.2.
+const ignoreSsrWarning =
+  "/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */";
+
 export const AppBar = styled(MAppBar)`
   border-bottom: 1px solid ${smokeMain};
 
@@ -34,7 +39,7 @@ export const Left = styled.div`
   justify-content: flex-start;
 
   .MuiButton-navPrimary {
-    &:first-of-type {
+    &:first-child:not(style)${ignoreSsrWarning} { {
       margin-left: 24px;
     }
   }