@databiosphere/findable-ui 15.0.0 → 15.0.2

package/.release-please-manifest.json

@@ -1,3 +1,3 @@
 {
-  ".": "15.0.0"
+  ".": "15.0.2"
 }

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [15.0.2](https://github.com/DataBiosphere/findable-ui/compare/v15.0.1...v15.0.2) (2024-11-20)
+
+
+### Bug Fixes
+
+* centre alignment of version info and update Config Provider entity list as optional ([#275](https://github.com/DataBiosphere/findable-ui/issues/275)) ([#276](https://github.com/DataBiosphere/findable-ui/issues/276)) ([4234063](https://github.com/DataBiosphere/findable-ui/commit/4234063fe1180afde7e5195bb54faa453c190ae0))
+
+## [15.0.1](https://github.com/DataBiosphere/findable-ui/compare/v15.0.0...v15.0.1) (2024-11-20)
+
+
+### Bug Fixes
+
+* access NEXT_PUBLIC environment variables directly from the environment ([#272](https://github.com/DataBiosphere/findable-ui/issues/272)) ([#273](https://github.com/DataBiosphere/findable-ui/issues/273)) ([0926331](https://github.com/DataBiosphere/findable-ui/commit/0926331f4dbe4c069e03789b97fa8888ebfc898a))
+
 ## [15.0.0](https://github.com/DataBiosphere/findable-ui/compare/v14.0.0...v15.0.0) (2024-11-19)
 
 

package/lib/components/Layout/components/Footer/components/VersionInfo/constants.d.ts

@@ -1,3 +1,5 @@
 import { ChipProps, TooltipProps } from "@mui/material";
+import { VersionInfo } from "./types";
 export declare const CHIP_PROPS: Partial<ChipProps>;
 export declare const TOOLTIP_PROPS: Partial<TooltipProps>;
+export declare const VERSION_INFO: VersionInfo;

package/lib/components/Layout/components/Footer/components/VersionInfo/constants.js

@@ -25,3 +25,8 @@ export const TOOLTIP_PROPS = {
         },
     },
 };
+export const VERSION_INFO = {
+    buildDate: process.env.NEXT_PUBLIC_BUILD_DATE,
+    gitHash: process.env.NEXT_PUBLIC_GIT_HASH,
+    version: process.env.NEXT_PUBLIC_VERSION,
+};

package/lib/components/Layout/components/Footer/components/VersionInfo/versionInfo.js

@@ -1,10 +1,12 @@
 import { Tooltip } from "@mui/material";
 import React from "react";
+import { useCatalog } from "../../../../../../hooks/useCatalog";
 import { Title } from "./components/Tooltip/components/Title/title";
-import { CHIP_PROPS, TOOLTIP_PROPS } from "./constants";
+import { CHIP_PROPS, TOOLTIP_PROPS, VERSION_INFO } from "./constants";
 import { getLabel } from "./utils";
 import { StyledChip } from "./versionInfo.styles";
-export const VersionInfo = ({ chipProps, className, tooltipProps, versionInfo, }) => {
-    return (React.createElement(Tooltip, { ...TOOLTIP_PROPS, title: React.createElement(Title, { versionInfo: versionInfo }), ...tooltipProps },
-        React.createElement(StyledChip, { ...CHIP_PROPS, className: className, label: getLabel(versionInfo), ...chipProps })));
+export const VersionInfo = ({ chipProps, className, tooltipProps, versionInfo = VERSION_INFO, }) => {
+    const catalog = useCatalog();
+    return (React.createElement(Tooltip, { ...TOOLTIP_PROPS, title: React.createElement(Title, { versionInfo: { catalog, ...versionInfo } }), ...tooltipProps },
+        React.createElement(StyledChip, { ...CHIP_PROPS, className: className, label: getLabel({ catalog, ...versionInfo }), ...chipProps })));
 };

package/lib/components/Layout/components/Footer/components/VersionInfo/versionInfo.styles.js

@@ -2,6 +2,7 @@ import styled from "@emotion/styled";
 import { Chip } from "@mui/material";
 import { inkLight } from "../../../../../../styles/common/mixins/colors";
 export const StyledChip = styled(Chip) `
+  align-self: center;
   border-radius: 4px;
   .MuiChip-label {
     color: ${inkLight};

package/lib/components/Layout/components/Footer/footer.js

@@ -1,6 +1,8 @@
 import { Toolbar } from "@mui/material";
 import React from "react";
 import { ANCHOR_TARGET } from "../../../Links/common/entities";
+import { isNodeBoolean } from "../../../utils";
+import { VersionInfo } from "./components/VersionInfo/versionInfo";
 import { AppBar, Link, Links, Socials } from "./footer.styles";
 export const Footer = ({ Branding, className, navLinks, socials, versionInfo, }) => {
     return (React.createElement(AppBar, { className: className, color: "inherit", component: "footer", variant: "footer" },
@@ -10,5 +12,5 @@ export const Footer = ({ Branding, className, navLinks, socials, versionInfo, })
                 navLinks &&
                     navLinks.map(({ label, target = ANCHOR_TARGET.SELF, url }, i) => (React.createElement(Link, { key: `${url}${i}`, label: label, target: target, url: url }))),
                 socials && React.createElement(Socials, { buttonSize: "small", socials: socials }),
-                versionInfo)))));
+                isNodeBoolean(versionInfo) ? React.createElement(VersionInfo, null) : versionInfo)))));
 };

package/lib/components/utils.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from "react";
+/**
+ * Type guard for ReactNode; returns true if the value is a boolean.
+ * @param value - Value to check.
+ * @returns true if the value is a boolean.
+ */
+export declare function isNodeBoolean(value: ReactNode): value is boolean;

package/lib/components/utils.js

@@ -0,0 +1,8 @@
+/**
+ * Type guard for ReactNode; returns true if the value is a boolean.
+ * @param value - Value to check.
+ * @returns true if the value is a boolean.
+ */
+export function isNodeBoolean(value) {
+    return typeof value === "boolean";
+}

package/lib/config/utils.js

@@ -67,6 +67,8 @@ export function getDefaultSorting(entityConfig) {
 export function getEntityConfig(entities, entityListType
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- This config model is part of a generic array
 ) {
+    if (!entityListType)
+        return getDefaultEntityConfig();
     const entityConfig = entities.find(({ route }) => route === entityListType);
     if (!entityConfig) {
         throw Error("No entity config found with name: " + entityListType);

package/lib/providers/config.d.ts

@@ -9,7 +9,7 @@ export type ConfigContextProps = {
 export interface ConfigProps {
     children: ReactNode | ReactNode[];
     config: SiteConfig;
-    entityListType: string;
+    entityListType?: string;
 }
 export declare const ConfigContext: React.Context<ConfigContextProps>;
 export declare function ConfigProvider({ children, config, entityListType, }: ConfigProps): JSX.Element;

package/lib/providers/config.js

@@ -6,7 +6,7 @@ export const ConfigContext = createContext({
     entityConfig: getDefaultEntityConfig(),
     entityListType: "",
 });
-export function ConfigProvider({ children, config, entityListType, }) {
+export function ConfigProvider({ children, config, entityListType = "", }) {
     const { entities } = config;
     const defaultEntityListType = config.redirectRootToPath.slice(1);
     const entityName = entityListType || defaultEntityListType;

package/package.json

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

package/src/components/Layout/components/Footer/components/VersionInfo/constants.ts

@@ -1,5 +1,6 @@
 import { ChipProps, TooltipProps } from "@mui/material";
 import { CHIP_PROPS as MUI_CHIP_PROPS } from "../../../../../../styles/common/mui/chip";
+import { VersionInfo } from "./types";
 
 export const CHIP_PROPS: Partial<ChipProps> = {
   color: MUI_CHIP_PROPS.COLOR.DEFAULT,
@@ -28,3 +29,9 @@ export const TOOLTIP_PROPS: Partial<TooltipProps> = {
     },
   },
 };
+
+export const VERSION_INFO: VersionInfo = {
+  buildDate: process.env.NEXT_PUBLIC_BUILD_DATE,
+  gitHash: process.env.NEXT_PUBLIC_GIT_HASH,
+  version: process.env.NEXT_PUBLIC_VERSION,
+};

package/src/components/Layout/components/Footer/components/VersionInfo/versionInfo.styles.ts

@@ -3,6 +3,7 @@ import { Chip } from "@mui/material";
 import { inkLight } from "../../../../../../styles/common/mixins/colors";
 
 export const StyledChip = styled(Chip)`
+  align-self: center;
   border-radius: 4px;
   .MuiChip-label {
     color: ${inkLight};

package/src/components/Layout/components/Footer/components/VersionInfo/versionInfo.tsx

@@ -1,10 +1,10 @@
 import { Tooltip } from "@mui/material";
 import React from "react";
+import { useCatalog } from "../../../../../../hooks/useCatalog";
 import { BaseComponentProps } from "../../../../../types";
 import { Title } from "./components/Tooltip/components/Title/title";
-import { CHIP_PROPS, TOOLTIP_PROPS } from "./constants";
+import { CHIP_PROPS, TOOLTIP_PROPS, VERSION_INFO } from "./constants";
 import { VersionInfoProps } from "./types";
-
 import { getLabel } from "./utils";
 import { StyledChip } from "./versionInfo.styles";
 
@@ -12,18 +12,19 @@ export const VersionInfo = ({
   chipProps,
   className,
   tooltipProps,
-  versionInfo,
+  versionInfo = VERSION_INFO,
 }: BaseComponentProps & VersionInfoProps): JSX.Element | null => {
+  const catalog = useCatalog();
   return (
     <Tooltip
       {...TOOLTIP_PROPS}
-      title={<Title versionInfo={versionInfo} />}
+      title={<Title versionInfo={{ catalog, ...versionInfo }} />}
       {...tooltipProps}
     >
       <StyledChip
         {...CHIP_PROPS}
         className={className}
-        label={getLabel(versionInfo)}
+        label={getLabel({ catalog, ...versionInfo })}
         {...chipProps}
       />
     </Tooltip>

package/src/components/Layout/components/Footer/footer.tsx

@@ -2,7 +2,9 @@ import { Toolbar } from "@mui/material";
 import React, { ReactNode } from "react";
 import { Social } from "../../../common/Socials/socials";
 import { ANCHOR_TARGET } from "../../../Links/common/entities";
+import { isNodeBoolean } from "../../../utils";
 import { NavLinkItem } from "../Header/components/Content/components/Navigation/navigation";
+import { VersionInfo } from "./components/VersionInfo/versionInfo";
 import { AppBar, Link, Links, Socials } from "./footer.styles";
 
 export interface FooterProps {
@@ -41,7 +43,7 @@ export const Footer = ({
                 />
               ))}
             {socials && <Socials buttonSize="small" socials={socials} />}
-            {versionInfo}
+            {isNodeBoolean(versionInfo) ? <VersionInfo /> : versionInfo}
           </Links>
         )}
       </Toolbar>

package/src/components/utils.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+
+/**
+ * Type guard for ReactNode; returns true if the value is a boolean.
+ * @param value - Value to check.
+ * @returns true if the value is a boolean.
+ */
+export function isNodeBoolean(value: ReactNode): value is boolean {
+  return typeof value === "boolean";
+}

package/src/config/utils.ts

@@ -75,6 +75,7 @@ export function getEntityConfig(
   entityListType: string
   // eslint-disable-next-line @typescript-eslint/no-explicit-any -- This config model is part of a generic array
 ): EntityConfig {
+  if (!entityListType) return getDefaultEntityConfig();
   const entityConfig = entities.find(({ route }) => route === entityListType);
   if (!entityConfig) {
     throw Error("No entity config found with name: " + entityListType);

package/src/providers/config.tsx

@@ -16,7 +16,7 @@ export type ConfigContextProps = {
 export interface ConfigProps {
   children: ReactNode | ReactNode[];
   config: SiteConfig;
-  entityListType: string;
+  entityListType?: string;
 }
 
 export const ConfigContext = createContext<ConfigContextProps>({
@@ -29,7 +29,7 @@ export const ConfigContext = createContext<ConfigContextProps>({
 export function ConfigProvider({
   children,
   config,
-  entityListType,
+  entityListType = "",
 }: ConfigProps): JSX.Element {
   const { entities } = config;
   const defaultEntityListType = config.redirectRootToPath.slice(1);