@c-rex/components 0.3.0-build.38 → 0.3.0-build.40

package/package.json

@@ -1,6 +1,6 @@
 {
     "name":  "@c-rex/components",
-    "version":  "0.3.0-build.38",
+    "version":  "0.3.0-build.40",
     "files":  [
                   "src"
               ],

package/src/info/information-unit-metadata-grid-client.tsx

@@ -12,32 +12,18 @@ import { InformationUnitsGetAllClient } from "../generated/client-components";
 import type {
     CommonItemsModel,
     InformationUnitModel,
-    LiteralModel,
-    ObjectRefModel,
-    RenditionModel,
 } from "@c-rex/interfaces";
+import type { AvailableLanguageVersion } from "@c-rex/services/read-models";
 import {
-    INFORMATION_UNIT_PROPERTY_PRESENTATION,
-    type InformationUnitPropertyKey,
-} from "@c-rex/services/metadata-presentation-config";
-import type { AvailableLanguageVersion, MetadataFacetLabelOverrides } from "@c-rex/services/read-models";
+    buildMetadataDisplayRows,
+    type MetadataFacetLabelOverrides,
+} from "@c-rex/services/metadata-display-builder";
 import { resolveMetadataDisplayProperties } from "@c-rex/services/metadata-view-profile";
 import {
     extractCountryCodeFromLanguage,
-    getFileRenditionGroups,
     resolvePreferredLanguage,
-    sortAndDeduplicateLanguages,
 } from "@c-rex/utils";
 
-type MetadataDisplayRow = {
-    key: InformationUnitPropertyKey;
-    label: string;
-    labelSource: "translationKey" | "direct";
-    values: string[];
-    valueType?: "text" | "language" | "rendition";
-    renditions?: RenditionModel[];
-};
-
 type Props = {
     title: string;
     linkPattern: string;
@@ -51,198 +37,6 @@ type Props = {
     availableInVersions?: AvailableLanguageVersion[];
 };
 
-const resolveLiteralLabel = (labels?: LiteralModel[] | null, uiLanguage?: string): string | undefined => {
-    if (!labels || labels.length === 0) return undefined;
-    const language = uiLanguage || "en";
-    const preferred = resolvePreferredLanguage(
-        labels.map((item) => item.language || ""),
-        language
-    );
-    if (preferred) {
-        const exact = labels.find((item) => item.language === preferred)?.value;
-        if (exact) return exact;
-    }
-    return labels.find((item) => item.value)?.value || undefined;
-};
-
-const resolveObjectRefLabel = (item: ObjectRefModel, uiLanguage: string): string | undefined => {
-    return resolveLiteralLabel(item.labels || [], uiLanguage) || item.shortId || item.id || undefined;
-};
-
-const resolveObjectRefClassLabel = (item: ObjectRefModel, uiLanguage: string): string | undefined => {
-    return resolveLiteralLabel(item.class?.labels || [], uiLanguage)
-        || item.class?.shortId
-        || item.class?.id
-        || undefined;
-};
-
-const asObjectRefArray = (value: unknown): ObjectRefModel[] => {
-    if (!Array.isArray(value)) return [];
-    return value.filter((item): item is ObjectRefModel => Boolean(item && typeof item === "object"));
-};
-
-const asLiteralArray = (value: unknown): LiteralModel[] => {
-    if (!Array.isArray(value)) return [];
-    return value.filter((item): item is LiteralModel => Boolean(item && typeof item === "object"));
-};
-
-const buildMetadataDisplayRows = (
-    data: CommonItemsModel,
-    uiLanguage: string,
-    includeProperties: InformationUnitPropertyKey[],
-    overrides?: MetadataFacetLabelOverrides
-): MetadataDisplayRow[] => {
-    const preferredTitle = resolveLiteralLabel(data.titles || [], uiLanguage) || resolveLiteralLabel(data.labels || [], uiLanguage);
-    const rows: MetadataDisplayRow[] = [];
-
-    for (const key of includeProperties) {
-        const config = INFORMATION_UNIT_PROPERTY_PRESENTATION[key];
-        if (!config?.metadataDisplay?.supported) continue;
-
-        if (key === "labels") continue;
-
-        if (key === "titles") {
-            if (preferredTitle) {
-                rows.push({
-                    key,
-                    label: key,
-                    labelSource: "translationKey",
-                    values: [preferredTitle],
-                    valueType: "text",
-                });
-            }
-            continue;
-        }
-
-        const value = (data as InformationUnitModel)[key];
-        if (value == null) continue;
-
-        if (key === "languages") {
-            const languages = sortAndDeduplicateLanguages((value as string[]) || []);
-            if (languages.length > 0) {
-                rows.push({
-                    key,
-                    label: key,
-                    labelSource: "translationKey",
-                    values: languages,
-                    valueType: "language",
-                });
-            }
-            continue;
-        }
-
-        if (config.valueKind === "scalar") {
-            rows.push({
-                key,
-                label: key,
-                labelSource: "translationKey",
-                values: [String(value)],
-                valueType: "text",
-            });
-            continue;
-        }
-
-        if (config.valueKind === "stringArray") {
-            const values = Array.from(new Set((value as string[]).map((item) => String(item)).filter(Boolean)));
-            if (values.length > 0) {
-                rows.push({
-                    key,
-                    label: key,
-                    labelSource: "translationKey",
-                    values,
-                    valueType: "text",
-                });
-            }
-            continue;
-        }
-
-        if (config.valueKind === "literalArray") {
-            const preferred = resolveLiteralLabel(asLiteralArray(value), uiLanguage);
-            if (preferred) {
-                rows.push({
-                    key,
-                    label: key,
-                    labelSource: "translationKey",
-                    values: [preferred],
-                    valueType: "text",
-                });
-            }
-            continue;
-        }
-
-        if (config.valueKind === "objectRef") {
-            const label = resolveObjectRefLabel(value as ObjectRefModel, uiLanguage);
-            if (label) {
-                rows.push({
-                    key,
-                    label: key,
-                    labelSource: "translationKey",
-                    values: [label],
-                    valueType: "text",
-                });
-            }
-            continue;
-        }
-
-        if (config.valueKind === "objectRefArray") {
-            const refs = asObjectRefArray(value);
-            if (refs.length === 0) continue;
-
-            const groupedValues = new Map<string, Set<string>>();
-
-            refs.forEach((ref) => {
-                const shortId = ref.shortId || "";
-                const override = shortId ? overrides?.[key]?.[shortId] : undefined;
-                const valueLabel = override?.label || resolveObjectRefLabel(ref, uiLanguage);
-                if (!valueLabel) return;
-
-                const sectionLabel = config.metadataDisplay.sectionStrategy === "none"
-                    ? key
-                    : override?.sectionLabel || resolveObjectRefClassLabel(ref, uiLanguage) || key;
-
-                const existing = groupedValues.get(sectionLabel) || new Set<string>();
-                existing.add(valueLabel);
-                groupedValues.set(sectionLabel, existing);
-            });
-
-            Array.from(groupedValues.entries())
-                .sort(([left], [right]) => left.localeCompare(right))
-                .forEach(([sectionLabel, valueSet]) => {
-                    const values = Array.from(valueSet).sort((a, b) => a.localeCompare(b));
-                    if (values.length === 0) return;
-
-                    rows.push({
-                        key,
-                        label: sectionLabel,
-                        labelSource: sectionLabel === key ? "translationKey" : "direct",
-                        values,
-                        valueType: "text",
-                    });
-                });
-            continue;
-        }
-
-        if (config.valueKind === "renditionArray") {
-            const renditions = Array.isArray(value)
-                ? value.filter((item): item is RenditionModel => Boolean(item && typeof item === "object"))
-                : [];
-            if (renditions.length === 0) continue;
-            if (getFileRenditionGroups({ renditions }).length === 0) continue;
-
-            rows.push({
-                key,
-                label: "files",
-                labelSource: "translationKey",
-                values: [],
-                valueType: "rendition",
-                renditions,
-            });
-        }
-    }
-
-    return rows;
-};
-
 const normalizeVersionItems = (items: CommonItemsModel[], uiLanguage: string) => {
     const uniqueByShortId = new Map<string, { shortId: string; language: string }>();
 
@@ -339,7 +133,11 @@ export const InformationUnitMetadataGridClient = ({
                 : [...(metadataExcludeProperties || []), "renditions"],
         });
 
-        return buildMetadataDisplayRows(data, locale, includeProperties, metadataLabelOverrides);
+        return buildMetadataDisplayRows(data as InformationUnitModel, {
+            uiLanguage: locale,
+            includeProperties,
+            overrides: metadataLabelOverrides,
+        });
     }, [data, locale, metadataExcludeProperties, metadataIncludeProperties, metadataLabelOverrides, showFileRenditions]);
 
     const cardContent = (

package/src/restriction-menu/__tests__/restriction-hierarchy.test.ts

@@ -0,0 +1,12 @@
+import { isRestrictionHierarchyNodeSelectable } from "../restriction-hierarchy";
+
+describe("restriction hierarchy semantics", () => {
+    it("treats materialized structural taxonomy nodes as non-selectable", () => {
+        expect(isRestrictionHierarchyNodeSelectable({ isStructural: true })).toBe(false);
+    });
+
+    it("keeps live taxonomy nodes selectable", () => {
+        expect(isRestrictionHierarchyNodeSelectable({ isStructural: false })).toBe(true);
+        expect(isRestrictionHierarchyNodeSelectable({})).toBe(true);
+    });
+});

package/src/restriction-menu/restriction-hierarchy.ts

@@ -0,0 +1,7 @@
+export type RestrictionHierarchyNode = {
+    isStructural?: boolean;
+};
+
+export const isRestrictionHierarchyNodeSelectable = (
+    item: RestrictionHierarchyNode
+): boolean => !item.isStructural;

package/src/restriction-menu/restriction-menu-item.tsx

@@ -15,6 +15,7 @@ type Props = {
     removeRestrictParam?: boolean;
     selected?: boolean;
     onClick?: () => void;
+    multipleSelection?: boolean;
 };
 
 export const RestrictionNavigationItem: FC<Props> = ({
@@ -23,6 +24,7 @@ export const RestrictionNavigationItem: FC<Props> = ({
     restrictField,
     removeRestrictParam = false,
     selected = false,
+    multipleSelection = true,
 }) => {
     const [restrict, setRestrict] = useQueryState("restrict", {
         shallow: false,
@@ -35,6 +37,7 @@ export const RestrictionNavigationItem: FC<Props> = ({
         restrictField,
         removeRestrictParam,
         selected,
+        multipleSelection,
         currentRestrict: restrict,
     });
 
@@ -72,6 +75,7 @@ export const RestrictionDropdownItem: FC<Props> = ({
     restrictField,
     selected = false,
     onClick,
+    multipleSelection = true
 }) => {
     const [restrict, setRestrict] = useQueryState("restrict", {
         shallow: false,
@@ -83,6 +87,7 @@ export const RestrictionDropdownItem: FC<Props> = ({
         shortId,
         restrictField,
         selected,
+        multipleSelection,
         currentRestrict: restrict,
     });
 
@@ -121,7 +126,7 @@ function getRestrictionValue({
     restrictField,
     removeRestrictParam = false,
     selected = false,
-
+    multipleSelection = true,
     currentRestrict,
 }: {
     shortId?: string;
@@ -129,11 +134,12 @@ function getRestrictionValue({
     removeRestrictParam?: boolean;
     selected?: boolean;
     currentRestrict: string | null;
+    multipleSelection?: boolean;
 }): { restrictionValue: string | null; shouldRemoveRestrictParam: boolean } {
     let restrictParam = "";
     let shouldRemoveRestrictParam = removeRestrictParam;
 
-    if (currentRestrict) {
+    if (currentRestrict && multipleSelection) {
         if (selected) {
             const restrictionsLength = currentRestrict.split(",").length;
             //if there is only one restriction, we can remove the whole restrict param

package/src/restriction-menu/restriction-selection-command-menu.tsx

@@ -9,6 +9,7 @@ import {
 import { RestrictionNavigationItem } from "./restriction-menu-item";
 import { parseAsString, useQueryState, useQueryStates } from "nuqs";
 import { DomainEntityModel, ObjectRefModel } from "@c-rex/interfaces";
+import type { TaxonomyResult } from "@c-rex/services/read-models";
 import { useLocale, useTranslations } from 'next-intl'
 import { cn, getLabelByLang } from "@c-rex/utils";
 import { useRestrictionStore } from "../stores/restriction-store";
@@ -20,16 +21,18 @@ import { Button } from "@c-rex/ui/button";
 import { Check, ChevronDown } from "lucide-react";
 import { useSearchNavigationStore } from "../stores/search-navigation-store";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@c-rex/ui/tooltip";
+import { buildTaxonomyHierarchy, type HierarchyItem } from "../taxonomy/hierarchy";
+import { isRestrictionHierarchyNodeSelectable } from "./restriction-hierarchy";
 
 type Props = {
     restrictField: string
     navigationMenuListClassName?: string
     items: DomainEntityModel[],
     enableHierarchy?: boolean,
+    hierarchyTaxonomy?: TaxonomyResult,
     hasMoreItems?: boolean,
     showAllWhenEmpty?: boolean,
     onRequestMore?: () => void,
-    stripLabelPrefix?: string,
     itemsByRow?: {
         [DEVICE_OPTIONS.MOBILE]: number,
         [DEVICE_OPTIONS.TABLET]: number,
@@ -42,6 +45,10 @@ type RestrictionTreeNode = {
     children: RestrictionTreeNode[];
 };
 
+type RestrictionHierarchyItem = HierarchyItem & {
+    item?: DomainEntityModel;
+};
+
 const hasSelectedDescendant = (node: RestrictionTreeNode, selectedShortIds: Set<string>): boolean => {
     const shortId = node.item.shortId;
     if (shortId && selectedShortIds.has(shortId)) return true;
@@ -65,6 +72,13 @@ const extractParentKeys = (item: DomainEntityModel): string[] => {
     });
 };
 
+const extractParentIds = (item: DomainEntityModel): string[] => {
+    const withParents = item as DomainEntityModel & { parents?: ObjectRefModel[] | null };
+    return (withParents.parents || [])
+        .map((parent) => parent.id || parent.shortId)
+        .filter((parentId): parentId is string => Boolean(parentId));
+};
+
 const buildRestrictionTree = (items: DomainEntityModel[]): RestrictionTreeNode[] => {
     const nodes = new Map<string, RestrictionTreeNode>();
     items.forEach((item) => {
@@ -218,18 +232,25 @@ const RestrictionCommandDialog: FC<RestrictionCommandDialogProps> = ({
                                 const groupShortId = node.item.shortId ?? "";
                                 const groupLabel = fmt(getLabelByLang(node.item.labels, lang) ?? groupShortId);
                                 const groupIsSelected = selectedRestrictionIds.has(groupShortId);
+                                const groupIsSelectable = isRestrictionHierarchyNodeSelectable(node.item);
 
                                 return (
                                     <>
-                                        <CommandItem
-                                            key={groupShortId}
-                                            value={groupLabel}
-                                            onSelect={() => handleSelect(groupShortId, groupIsSelected)}
-                                            className="cursor-pointer"
-                                        >
-                                            <span className={cn("flex-1", groupIsSelected && "font-medium")}>{groupLabel}</span>
-                                            {groupIsSelected && <Check className="h-4 w-4 shrink-0 text-primary" />}
-                                        </CommandItem>
+                                        {groupIsSelectable ? (
+                                            <CommandItem
+                                                key={groupShortId}
+                                                value={groupLabel}
+                                                onSelect={() => handleSelect(groupShortId, groupIsSelected)}
+                                                className="cursor-pointer"
+                                            >
+                                                <span className={cn("flex-1", groupIsSelected && "font-medium")}>{groupLabel}</span>
+                                                {groupIsSelected && <Check className="h-4 w-4 shrink-0 text-primary" />}
+                                            </CommandItem>
+                                        ) : (
+                                            <div key={groupShortId} className="px-2 py-3 text-sm text-muted-foreground">
+                                                {groupLabel}
+                                            </div>
+                                        )}
                                         {node.children.map((child) => {
                                             const shortId = child.item.shortId ?? "";
                                             const childLabel = fmt(getLabelByLang(child.item.labels, lang) ?? shortId);
@@ -261,10 +282,10 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
     items,
     restrictField,
     enableHierarchy = false,
+    hierarchyTaxonomy,
     hasMoreItems = false,
     showAllWhenEmpty = true,
     onRequestMore,
-    stripLabelPrefix,
     navigationMenuListClassName = "items-center justify-start gap-4 flex-row",
     itemsByRow = {
         [DEVICE_OPTIONS.MOBILE]: 2,
@@ -274,9 +295,6 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
 }) => {
     const t = useTranslations();
     const setRestrictionList = useRestrictionStore((state) => state.setRestrictionList);
-    const formatLabel = stripLabelPrefix
-        ? (label: string) => label.replace(new RegExp(`^${stripLabelPrefix}`, "i"), "")
-        : undefined;
 
     const [params] = useQueryStates({
         restrict: parseAsString,
@@ -318,8 +336,39 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
 
     const hierarchyRoots = useMemo(() => {
         if (!enableHierarchy) return [];
-        return buildRestrictionTree(sortedItems);
-    }, [enableHierarchy, sortedItems]);
+        if (!hierarchyTaxonomy) return buildRestrictionTree(sortedItems);
+
+        const hierarchy = buildTaxonomyHierarchy<RestrictionHierarchyItem>(
+            sortedItems.map((item) => ({
+                shortId: item.shortId || item.id || "",
+                label: getLabelByLang(item.labels, lang) || item.shortId || item.id || "",
+                active: selectedRestrictionIds.has(item.shortId || ""),
+                hits: 0,
+                total: 0,
+                taxonomyId: item.id || undefined,
+                parentIds: extractParentIds(item),
+                item,
+            })),
+            hierarchyTaxonomy
+        );
+
+        const toTreeNode = (node: RestrictionHierarchyItem): RestrictionTreeNode => {
+            const nodeKey = node.taxonomyId || node.shortId;
+            const runtimeItem = node.item || {
+                id: node.taxonomyId,
+                shortId: node.shortId,
+                labels: [{ language: lang, value: node.label }],
+                isStructural: node.isStructural,
+            } as DomainEntityModel;
+
+            return {
+                item: runtimeItem,
+                children: (hierarchy.children.get(nodeKey) || []).map((child) => toTreeNode(child)),
+            };
+        };
+
+        return hierarchy.roots.map((root) => toTreeNode(root));
+    }, [enableHierarchy, hierarchyTaxonomy, lang, selectedRestrictionIds, sortedItems]);
 
     const device = useBreakpoint();
     const [visibleCount, setVisibleCount] = useState(0);
@@ -373,7 +422,7 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
 
                 {!enableHierarchy && visibleItems.map((item) => {
                     const rawLabel = getLabelByLang(item.labels, lang);
-                    const label = rawLabel && formatLabel ? formatLabel(rawLabel) : rawLabel;
+                    const label = rawLabel
                     return (
                         <RestrictionNavigationItem
                             key={item.shortId}
@@ -388,13 +437,24 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                 {enableHierarchy && visibleHierarchyRoots.map((rootNode) => {
                     const shortId = rootNode.item.shortId || "";
                     const hasChildren = rootNode.children.length > 0;
+                    const isSelectable = isRestrictionHierarchyNodeSelectable(rootNode.item);
                     const rawLabel = getLabelByLang(rootNode.item.labels, lang);
-                    const label = rawLabel && formatLabel ? formatLabel(rawLabel) : rawLabel;
+                    const label = rawLabel
                     const rootSelected = restrictionValues.includes(shortId);
                     const hasActiveDescendant = hasChildren && hasSelectedDescendant(rootNode, selectedRestrictionIds);
                     const shouldHighlightBranch = hasActiveDescendant && !rootSelected;
 
                     if (!hasChildren) {
+                        if (!isSelectable) {
+                            return (
+                                <NavigationMenuItem key={shortId}>
+                                    <div className="flex min-h-9 items-center rounded-full border border-transparent px-4 py-2 text-sm text-muted-foreground">
+                                        {label}
+                                    </div>
+                                </NavigationMenuItem>
+                            );
+                        }
+
                         return (
                             <RestrictionNavigationItem
                                 key={shortId}
@@ -415,7 +475,7 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                                 selectedRestrictionIds={selectedRestrictionIds}
                                 lang={lang}
                                 highlighted={shouldHighlightBranch}
-                                formatLabel={formatLabel}
+
                             />
                         </NavigationMenuItem>
                     );
@@ -434,7 +494,6 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                             selectedRestrictionIds={selectedRestrictionIds}
                             lang={lang}
                             highlighted={false}
-                            formatLabel={formatLabel}
                         />
                     </NavigationMenuItem>
                 )}