@redocly/theme 0.19.1 → 0.19.2

package/lib/components/Catalog/useCatalog.js

@@ -27,10 +27,13 @@ exports.useCatalog = void 0;
 const React = __importStar(require("react"));
 const react_router_dom_1 = require("react-router-dom");
 const telemetry_1 = require("../../mocks/telemetry");
+const usePageData_1 = require("../../mocks/hooks/usePageData");
 const utils_1 = require("../../utils");
 function useCatalog(items, config) {
+    var _a;
     const location = (0, react_router_dom_1.useLocation)();
     const navigate = (0, react_router_dom_1.useNavigate)();
+    const pageData = (0, usePageData_1.usePageData)();
     const searchParams = useSearchParams(location);
     const [filtersState, setFiltersState] = React.useState(() => {
         var _a;
@@ -47,7 +50,8 @@ function useCatalog(items, config) {
     });
     const [filterTerm, setFilterTerm] = React.useState(() => searchParams.get('filter') || '');
     const filtersWithOptions = React.useMemo(() => collectFilterOptions(items, config.filters), [items, config.filters]);
-    const normalizedItems = React.useMemo(() => normalizeItems(items, config), [items, config]);
+    const customFields = (_a = pageData === null || pageData === void 0 ? void 0 : pageData.props) === null || _a === void 0 ? void 0 : _a.customFields;
+    const normalizedItems = React.useMemo(() => normalizeItems(items, config, customFields || {}), [items, config, customFields]);
     const toggleOption = React.useCallback((filterIdx, option) => {
         setFiltersState((prev) => {
             const newFilterOptions = prev[filterIdx] ? prev[filterIdx] : new Set();
@@ -178,7 +182,7 @@ function groupByFirstFilter(filters, filteredItems) {
 function useSearchParams(location) {
     return React.useMemo(() => new URLSearchParams(location.search), [location.search]);
 }
-function normalizeItems(items, config) {
+function normalizeItems(items, config, customFields) {
     // because of RBAC some versions can be missing so we need to pick up other default version
     const hasDeafultVersion = {};
     for (const item of items) {
@@ -203,9 +207,10 @@ function normalizeItems(items, config) {
     return items.map((item) => {
         var _a, _b, _c;
         const metadata = item.metadata || {};
+        const apiCustomFields = customFields[item.fsPath || ''] || {};
         const link = item.link || ((_a = (0, utils_1.findDeepFirst)(item.items || [], (i) => 'link' in i && !!i.link)) === null || _a === void 0 ? void 0 : _a.link);
         const firstSidebarItem = (_b = item.sidebar) === null || _b === void 0 ? void 0 : _b[0];
-        return Object.assign(Object.assign({}, metadata), { publishedAt: metadata.publishedAt || metadata.createdAt, title: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.title) || item.label || 'Untitled', description: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.description), link: (_c = (0, utils_1.withoutHash)(link)) !== null && _c !== void 0 ? _c : '#', docsLink: (0, utils_1.withoutHash)(firstSidebarItem === null || firstSidebarItem === void 0 ? void 0 : firstSidebarItem.link), image: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.image) });
+        return Object.assign(Object.assign(Object.assign({}, metadata), apiCustomFields), { publishedAt: metadata.publishedAt || metadata.createdAt, title: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.title) || item.label || 'Untitled', description: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.description), link: (_c = (0, utils_1.withoutHash)(link)) !== null && _c !== void 0 ? _c : '#', docsLink: (0, utils_1.withoutHash)(firstSidebarItem === null || firstSidebarItem === void 0 ? void 0 : firstSidebarItem.link), image: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.image) });
     });
 }
 function collectFilterParents(filtersWithOptions) {

package/lib/mocks/hooks/usePageData.d.ts

@@ -2,4 +2,5 @@ import type { ResolvedNavLinkItem } from '../../types/portal';
 export declare function usePageData(): {
     prevPage: ResolvedNavLinkItem | null;
     nextPage: ResolvedNavLinkItem | null;
+    props?: any;
 } | null;

package/lib/types/portal/src/shared/types/nav.d.ts

@@ -17,6 +17,7 @@ export type ResolvedNavLinkItem = {
     httpVerb?: string;
     separatorLine?: boolean;
     routeSlug?: string;
+    fsPath?: string;
     active?: boolean;
     icon?: string;
     srcSet?: string;
@@ -41,6 +42,7 @@ export type ResolvedNavGroupItem = {
     menuStyle?: MenuStyle;
     separatorLine?: boolean;
     routeSlug?: string;
+    fsPath?: string;
     active?: boolean;
     icon?: string;
     srcSet?: string;
@@ -52,6 +54,7 @@ export type ResolvedNavItem = ResolvedNavLinkItem | ResolvedNavGroupItem | {
     label?: string;
     labelTranslationKey?: string;
     routeSlug?: never;
+    fsPath?: never;
     version?: string;
     isDefault?: boolean;
     versionFolderId?: string;
@@ -70,6 +73,7 @@ export type ResolvedNavItem = ResolvedNavLinkItem | ResolvedNavGroupItem | {
     versionFolderId?: string;
     metadata?: Record<string, unknown>;
     routeSlug?: never;
+    fsPath?: never;
     label: string;
     labelTranslationKey?: string;
     link?: undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.19.1",
+  "version": "0.19.2",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",

package/src/components/Catalog/useCatalog.ts

@@ -4,6 +4,7 @@ import { useLocation, useNavigate } from 'react-router-dom';
 import type { Location } from 'react-router-dom';
 
 import { telemetry } from '@portal/telemetry';
+import { usePageData } from '@portal/hooks/usePageData';
 import type { ResolvedNavItem } from '@theme/types/portal';
 import type {
   CatalogItem,
@@ -16,6 +17,7 @@ import type { CatalogConfig, CatalogFilterConfig } from '@theme/config';
 export function useCatalog(items: ResolvedNavItem[], config: CatalogConfig): FilteredCatalog {
   const location = useLocation();
   const navigate = useNavigate();
+  const pageData = usePageData();
   const searchParams = useSearchParams(location);
   const [filtersState, setFiltersState] = React.useState(() =>
     (config.filters ?? []).map((f) => {
@@ -33,7 +35,12 @@ export function useCatalog(items: ResolvedNavItem[], config: CatalogConfig): Fil
     () => collectFilterOptions(items, config.filters),
     [items, config.filters],
   );
-  const normalizedItems = React.useMemo(() => normalizeItems(items, config), [items, config]);
+
+  const customFields = pageData?.props?.customFields;
+  const normalizedItems = React.useMemo(
+    () => normalizeItems(items, config, customFields || ({} as any)),
+    [items, config, customFields],
+  );
 
   const toggleOption = React.useCallback((filterIdx, option) => {
     setFiltersState((prev) => {
@@ -198,7 +205,11 @@ function useSearchParams(location: Location) {
   return React.useMemo(() => new URLSearchParams(location.search), [location.search]);
 }
 
-function normalizeItems(items: ResolvedNavItem[], config: CatalogConfig): CatalogItem[] {
+function normalizeItems(
+  items: ResolvedNavItem[],
+  config: CatalogConfig,
+  customFields: Record<string, Record<string, unknown>>,
+): CatalogItem[] {
   // because of RBAC some versions can be missing so we need to pick up other default version
   const hasDeafultVersion: Record<string, boolean> = {};
   for (const item of items) {
@@ -223,10 +234,12 @@ function normalizeItems(items: ResolvedNavItem[], config: CatalogConfig): Catalo
 
   return items.map((item) => {
     const metadata = item.metadata || {};
+    const apiCustomFields = customFields[item.fsPath || ''] || {};
     const link = item.link || findDeepFirst(item.items || [], (i) => 'link' in i && !!i.link)?.link;
     const firstSidebarItem = (item as any).sidebar?.[0];
     return {
       ...metadata,
+      ...apiCustomFields,
       publishedAt: metadata.publishedAt || metadata.createdAt,
       title: toStringIfDefined(metadata?.title) || item.label || 'Untitled',
       description: toStringIfDefined(metadata?.description),

package/src/mocks/hooks/usePageData.ts

@@ -3,6 +3,7 @@ import type { ResolvedNavLinkItem } from '@theme/types/portal';
 export function usePageData(): {
   prevPage: ResolvedNavLinkItem | null;
   nextPage: ResolvedNavLinkItem | null;
+  props?: any;
 } | null {
   return {
     prevPage: { label: 'Intro', type: 'link', link: '#prev' },

package/src/types/portal/src/shared/types/nav.ts

@@ -20,6 +20,7 @@ export type ResolvedNavLinkItem = {
   httpVerb?: string;
   separatorLine?: boolean;
   routeSlug?: string;
+  fsPath?: string
   active?: boolean;
   icon?: string;
   srcSet?: string;
@@ -47,6 +48,7 @@ export type ResolvedNavGroupItem = {
   menuStyle?: MenuStyle;
   separatorLine?: boolean;
   routeSlug?: string;
+  fsPath?: string
   active?: boolean;
   icon?: string;
   srcSet?: string;
@@ -62,6 +64,7 @@ export type ResolvedNavItem =
     label?: string;
     labelTranslationKey?: string;
     routeSlug?: never;
+    fsPath?: never
 
     version?: string;
     isDefault?: boolean;
@@ -84,6 +87,7 @@ export type ResolvedNavItem =
     versionFolderId?: string;
     metadata?: Record<string, unknown>;
     routeSlug?: never;
+    fsPath?: never
 
     label: string;
     labelTranslationKey?: string;