pawarprasad123 commented on code in PR #688:
URL: https://github.com/apache/atlas/pull/688#discussion_r3819431281
##########
dashboard/src/components/EntityDisplayImage.tsx:
##########
@@ -15,86 +15,58 @@
* limitations under the License.
*/
-import { useEffect, useState } from "react";
-import { Avatar, Skeleton } from "@mui/material";
+import { Avatar } from "@mui/material";
import { getEntityIconPath } from "../utils/Utils";
+interface DisplayImageProps {
+ entity: Record<string, unknown>;
+ width?: string | number;
+ height?: string | number;
+ avatarDisplay?: boolean;
+ isProcess?: boolean;
+}
+
const DisplayImage = ({
entity,
width,
height,
avatarDisplay,
isProcess
-}: any) => {
- const [imageUrl, setImageUrl] = useState<any>(null);
- const [checkEntityImage, setCheckEntityImage] = useState<any>({
- [entity.guid]: false
- });
-
- useEffect(() => {
- const fetchImagePath = async () => {
- let entityData = { ...entity, ...{ isProcess: isProcess } };
- let imagePath: any = getEntityIconPath({ entityData: entityData });
- try {
- const response = await fetch(imagePath);
- const contentType: any = response.headers.get("Content-Type");
-
- if (contentType.startsWith("image/")) {
- let cache = { [entityData.guid]: imagePath };
- setCheckEntityImage(cache);
- setImageUrl(getEntityIconPath({ entityData: entityData }));
- } else {
- setImageUrl(
- getEntityIconPath({ entityData: entityData, errorUrl: imagePath })
- );
- }
- } catch (error) {
- setImageUrl(
- getEntityIconPath({ entityData: entityData, errorUrl: imagePath })
- );
- }
- };
+}: DisplayImageProps) => {
+ const entityData = { ...entity, isProcess: isProcess };
+
+ const primaryUrl = getEntityIconPath({ entityData }) || "";
+ const fallbackUrl = getEntityIconPath({ entityData, errorUrl: primaryUrl })
|| "";
- fetchImagePath();
- }, []);
+ const handleError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {
Review Comment:
React.SyntheticEvent used without React import
add import type { SyntheticEvent } from "react"
##########
dashboard/src/views/SideBar/SideBarBody.tsx:
##########
@@ -21,11 +21,13 @@ import {
useCallback,
useEffect,
useState,
- ChangeEvent,
KeyboardEvent,
lazy,
Review Comment:
1) no test for "Version unavailable" footer when versionError is set - Add
negative test
2) relationships icon hidden when relationshipSearch is falsy - Add
conditional visibility test
3) SideBarBody.test.tsx:500-505 — still tests removed loading prop on
SideBarBody- Remove or update stale test
4) 121-131- > Wrap getActiveModule() in useMemo([location.pathname,
location.search]) to avoid recalculating every render
##########
dashboard/src/views/SideBar/SideBarTree/SideBarTree.tsx:
##########
@@ -287,1027 +322,1069 @@ const BarTreeView: FC<{
sideBarOpen,
searchTerm,
loader,
+ isPopover,
}) => {
- const dispatch = useAppDispatch();
- const { savedSearchData }: any = useAppSelector(
- (state: any) => state.savedSearch
- );
- const { bmguid } = useParams();
- const location = useLocation();
- const navigate = useNavigate();
- const searchParams = new URLSearchParams(location.search);
- const [expand, setExpand] = useState<null | HTMLElement>(null);
- const [selectedNode, setSelectedNode] = useState<{
- type: string | null;
- tag: string | null;
- relationship: string | null;
- businessMetadata: string | null;
- }>({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: null,
- });
-
- const [openModal, setOpenModal] = useState<boolean>(false);
- const toastId: any = useRef(null);
- const open = Boolean(expand);
- const [expandedItems, setExpandedItems] = useState<string[]>([]);
- const [tagModal, setTagModal] = useState<boolean>(false);
- const [glossaryModal, setGlossaryModal] = useState<boolean>(false);
- const { businessMetaData }: any = useAppSelector(
- (state: any) => state.businessMetaData
- );
-
- const filteredData = useMemo(() => {
- return treeData.filter((node) => {
- return (
- node.label?.toLowerCase().includes(searchTerm.toLowerCase()) ||
- (node.children &&
- node.children.some((child) =>
- child.label?.toLowerCase().includes(searchTerm.toLowerCase())
- ))
- );
+ const { savedSearchData }: any = useAppSelector(
+ (state: any) => state.savedSearch
+ );
+ const { bmguid } = useParams();
+ const dispatch = useAppDispatch();
+ const location = useLocation();
+ const navigate = useNavigate();
+ const searchParams = new URLSearchParams(location.search);
+ const [expand, setExpand] = useState<null | HTMLElement>(null);
+ const [selectedNode, setSelectedNode] = useState<SelectedNode>({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
});
- }, [treeData, searchTerm]);
- const displayTreeName = useMemo(() => {
- return treeName === "CustomFilters" ? "Custom Filters" : treeName
- }, [treeName]);
+ const [openModal, setOpenModal] = useState<boolean>(false);
+ const toastId: any = useRef(null);
+ const open = Boolean(expand);
+ const [expandedItems, setExpandedItems] = useState<string[]>([]);
+ const [tagModal, setTagModal] = useState<boolean>(false);
+ const [glossaryModal, setGlossaryModal] = useState<boolean>(false);
+ const { businessMetaData }: any = useAppSelector(
+ (state: any) => state.businessMetaData
+ );
- const highlightText = useMemo(() => {
- return (text: string) => {
- if (!searchTerm) return text;
+ const filteredData = useMemo(() => {
+ return treeData.filter((node) => {
+ return (
+ node.label?.toLowerCase().includes(searchTerm.toLowerCase()) ||
+ (node.children &&
+ node.children.some((child) =>
+ child.label?.toLowerCase().includes(searchTerm.toLowerCase())
+ ))
+ );
+ });
+ }, [treeData, searchTerm]);
- const parts = text.split(new RegExp(`(${searchTerm})`, "gi"));
- return parts.map((part, index) =>
- part.toLowerCase() === searchTerm.toLowerCase() ? (
- <span key={index} style={{ color: "#D3D3D3", fontWeight: "600" }}>
- {part}
- </span>
- ) : (
- part
- )
- );
- };
- }, [searchTerm]);
-
- const expandedItemsMemo = useMemo(() => {
- const allNodeIds = filteredData.flatMap((node) => {
- return [
- node.id,
- ...(node.children ? node.children.map((child) => child.id) : []),
- ];
- });
- return [...allNodeIds, ...[treeName]];
- }, [filteredData, treeName]);
+ const displayTreeName = useMemo(() => {
+ return treeName === "CustomFilters" ? "Custom Filters" : treeName
+ }, [treeName]);
- useEffect(() => {
- setExpandedItems(expandedItemsMemo);
- }, [expandedItemsMemo]);
+ const highlightText = useMemo(() => {
+ return (text: string) => {
+ if (!searchTerm) return text;
- useEffect(() => {
- const searchParams = new URLSearchParams(location.search);
- const nodeIdFromParamsType = searchParams.get("type");
- const nodeIdFromParamsTag = searchParams.get("tag");
- const nodeIdFromParamsRelationshipName =
- searchParams.get("relationshipName");
- const nodeIdFromBMName = location.pathname.includes(
- "/administrator/businessMetadata"
- );
+ const escapeRegExp = (string: string) => {
+ return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means
the whole matched string
+ };
+
+ const escapedSearchTerm = escapeRegExp(searchTerm);
+ const parts = text.split(new RegExp(`(${escapedSearchTerm})`, "gi"));
+ return parts.map((part, index) =>
+ part.toLowerCase() === searchTerm.toLowerCase() ? (
+ <span key={index} className="sidebar-tree-highlight">
+ {part}
+ </span>
+ ) : (
+ part
+ )
+ );
+ };
+ }, [searchTerm]);
+
+ const expandedItemsMemo = useMemo(() => {
+ const allNodeIds = filteredData.flatMap((node) => {
+ return [
+ node.id,
+ ...(node.children ? node.children.map((child) => child.id) : []),
+ ];
+ });
+ return [...allNodeIds, ...[treeName]];
+ }, [filteredData, treeName]);
+
+ useEffect(() => {
+ setExpandedItems(expandedItemsMemo);
+ }, [expandedItemsMemo]);
+
+ const getNodeId = (node: TreeNode) => {
+ if (treeName == "Classifications" && node.types == "parent") {
+ return node.label;
+ } else if (treeName == "Classifications" && node.types == "child") {
+ return `${node.id}@${node.label}`;
+ }
+ return !isEmpty(node?.parent) ? `${node.id}@${node?.parent}` : node.id;
+ };
+
+ useEffect(() => {
+ const searchParams = new URLSearchParams(location.search);
+ const nodeIdFromParamsType = searchParams.get("type");
+ const nodeIdFromParamsTag = searchParams.get("tag");
+ const nodeIdFromParamsRelationshipName =
+ searchParams.get("relationshipName");
+ const nodeIdFromBMName = location.pathname.includes(
+ "/administrator/businessMetadata"
+ );
+ const nodeIdFromParamsTerm = searchParams.get("term") ||
searchParams.get("category") || searchParams.get("gtype") ||
location.pathname.split("/glossary/")[1];
+ const nodeIdFromCustomFilter = searchParams.get("customFilter");
- const bmObj = !isEmpty(businessMetaData?.businessMetadataDefs)
- ? businessMetaData?.businessMetadataDefs?.find((obj: EnumTypeDefData) =>
{
+ const bmObj = !isEmpty(businessMetaData?.businessMetadataDefs)
+ ? businessMetaData?.businessMetadataDefs?.find((obj: EnumTypeDefData)
=> {
if (bmguid == obj.guid) {
return obj;
}
})
- : {};
- const { name = "" } = bmObj || {};
-
- setSelectedNode({
- type: nodeIdFromParamsType,
- tag: nodeIdFromParamsTag,
- relationship: nodeIdFromParamsRelationshipName,
- businessMetadata: nodeIdFromBMName ? name : null,
- });
+ : {};
+ const { name = "" } = bmObj || {};
- if (
- !nodeIdFromParamsType &&
- !nodeIdFromParamsTag &&
- !nodeIdFromParamsRelationshipName &&
- !nodeIdFromBMName
- ) {
setSelectedNode({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: null,
+ type: nodeIdFromParamsType,
+ tag: nodeIdFromParamsTag,
+ relationship: nodeIdFromParamsRelationshipName,
+ businessMetadata: nodeIdFromBMName ? name : null,
+ term: nodeIdFromParamsTerm || null,
+ customFilter: nodeIdFromCustomFilter || null,
});
- }
- }, [location.search]);
- const getEmptyTypesTitle = () => {
- switch (treeName) {
- case "Entities":
- return `${isEmptyServicetype ? "Hide" : "Show"} empty service types`;
+ if (nodeIdFromParamsTerm && typeof nodeIdFromParamsTerm === "string" &&
nodeIdFromParamsTerm.includes("@") && treeName === "Glossary") {
+ const glossaryName = nodeIdFromParamsTerm.split("@")[1];
+ if (glossaryName) {
+ const parentNode = treeData.find((n) => n.label === glossaryName);
+ if (parentNode) {
+ const nodeIdToExpand = getNodeId(parentNode);
+ setExpandedItems((prev) => {
+ if (!prev.includes(nodeIdToExpand)) {
+ return [...prev, nodeIdToExpand];
+ }
+ return prev;
+ });
+ }
+ }
+ }
- case "Classifications":
- return `${isEmptyServicetype ? "Show" : "Hide"} unused
classifications`;
+ if (
+ !nodeIdFromParamsType &&
+ !nodeIdFromParamsTag &&
+ !nodeIdFromParamsRelationshipName &&
+ !nodeIdFromBMName &&
+ !nodeIdFromParamsTerm &&
+ !nodeIdFromCustomFilter
+ ) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ }, [location.search, treeData, treeName, businessMetaData, bmguid]);
- case "Glossary":
- return `Show ${isEmptyServicetype ? "Category" : "Term"}`;
+ const getEmptyTypesTitle = () => {
+ switch (treeName) {
+ case "Entities":
+ return `${isEmptyServicetype ? "Hide" : "Show"} empty service types`;
- case "CustomFilters":
- return `Show ${isEmptyServicetype ? "all" : "Type"}`;
+ case "Classifications":
+ return `${isEmptyServicetype ? "Show" : "Hide"} unused
classifications`;
- default:
- return "";
- }
- };
+ case "Glossary":
+ return `Show ${isEmptyServicetype ? "Category" : "Term"}`;
- const handleExpandedItemsChange = (
- _event: SyntheticEvent,
- newExpandedItems: string[]
- ) => {
- setExpandedItems(newExpandedItems);
- };
+ case "CustomFilters":
+ return `Show ${isEmptyServicetype ? "all" : "Type"}`;
- const handleOpenModal = () => {
- setOpenModal(true);
- };
- const handleCloseModal = () => {
- setOpenModal(false);
- };
+ default:
+ return "";
+ }
+ };
- const handleClickMenu = (event: MouseEvent<HTMLElement>) => {
- event.stopPropagation();
- setExpand(event.currentTarget);
- };
+ const handleExpandedItemsChange = (
+ _event: SyntheticEvent,
+ newExpandedItems: string[]
+ ) => {
+ setExpandedItems(newExpandedItems);
+ };
- const handleClose = () => {
- setExpand(null);
- };
+ const handleOpenModal = () => {
+ setOpenModal(true);
+ };
+ const handleCloseModal = () => {
+ setOpenModal(false);
+ };
- const handleCloseTagModal = () => {
- setTagModal(false);
- };
- const handleCloseGlossaryModal = () => {
- setGlossaryModal(false);
- };
+ const handleClickMenu = (event: MouseEvent<HTMLElement>) => {
+ event.stopPropagation();
+ setExpand(event.currentTarget);
+ };
- const handleClickNode = (nodeId: string) => {
- const searchParams = new URLSearchParams(location.search);
- const isTypeMatch = searchParams.get("type") === nodeId;
- const isTagMatch = searchParams.get("tag") === nodeId;
- const isRelationshipMatch = searchParams.get("relationshipName") ===
nodeId;
- const isBusinessMetadataMatch = location.pathname.includes(
- "/administrator/businessMetadata"
- );
+ const handleClose = () => {
+ setExpand(null);
+ };
- if (isTypeMatch) {
- setSelectedNode({
- type: nodeId,
- tag: null,
- relationship: null,
- businessMetadata: null,
- });
- }
- if (isTagMatch) {
- setSelectedNode({
- type: null,
- tag: nodeId,
- relationship: null,
- businessMetadata: null,
- });
- }
- if (isRelationshipMatch) {
- setSelectedNode({
- type: null,
- tag: null,
- relationship: nodeId,
- businessMetadata: null,
- });
- }
- if (isBusinessMetadataMatch) {
- setSelectedNode({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: nodeId,
- });
- }
- };
+ const handleCloseTagModal = () => {
+ setTagModal(false);
+ };
+ const handleCloseGlossaryModal = () => {
+ setGlossaryModal(false);
+ };
- const getNodeId = (node: TreeNode) => {
- if (treeName == "Classifications" && node.types == "parent") {
- return node.label;
- } else if (treeName == "Classifications" && node.types == "child") {
- return `${node.id}@${node.label}`;
- }
- return !isEmpty(node?.parent) ? `${node.id}@${node?.parent}` : node.id;
- };
+ const handleClickNode = (nodeId: string) => {
+ const searchParams = new URLSearchParams(location.search);
+ const isTypeMatch = searchParams.get("type") === nodeId;
+ const isTagMatch = searchParams.get("tag") === nodeId;
+ const isRelationshipMatch = searchParams.get("relationshipName") ===
nodeId;
+ const isBusinessMetadataMatch = location.pathname.includes(
+ "/administrator/businessMetadata"
+ );
+
+ if (isTypeMatch) {
+ setSelectedNode({
+ type: nodeId,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isTagMatch) {
+ setSelectedNode({
+ type: null,
+ tag: nodeId,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isRelationshipMatch) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: nodeId,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isBusinessMetadataMatch) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: nodeId,
+ term: null,
+ customFilter: null,
+ });
+ }
+ };
- const handleNodeClick = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- navigate: NavigateFunction,
- isEmptyServicetype: boolean | undefined,
- savedSearchData: any,
- toastId: any
- ) => {
- globalSearchFilterInitialQuery.setQuery({});
- searchParams.delete("tabActive");
-
- if (treeName === "Classifications") {
- handleClickNode(node.id);
- } else {
- handleClickNode(node.id);
- }
-
- if (node.id === "No Records Found") {
- if (typeof event !== "undefined" && event.stopPropagation) {
- event.stopPropagation();
+ const handleNodeClick = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ navigate: NavigateFunction,
+ isEmptyServicetype: boolean | undefined,
+ savedSearchData: any,
+ toastId: any
+ ) => {
+ globalSearchFilterInitialQuery.setQuery({});
+ searchParams.delete("tabActive");
+
+ if (treeName === "Classifications") {
+ handleClickNode(node.id);
+ } else {
+ handleClickNode(node.id);
}
- return;
- }
-
- if (shouldSetSearchParams(node, treeName)) {
- setSearchParams(
- node,
- treeName,
- searchParams,
- isEmptyServicetype,
- savedSearchData
+
+ if (node.id === "No Records Found") {
+ if (typeof event !== "undefined" && event.stopPropagation) {
+ event.stopPropagation();
+ }
+ return;
+ }
+
+ if (shouldSetSearchParams(node, treeName)) {
+ setSearchParams(
+ node,
+ treeName,
+ searchParams,
+ isEmptyServicetype,
+ savedSearchData
+ );
+ navigateToPath(
+ node,
+ treeName,
+ searchParams,
+ navigate,
+ isEmptyServicetype,
+ toastId
+ );
+ }
+ };
+
+ const shouldSetSearchParams = (node: TreeNode, treeName: string) => {
+ if (treeName === "CustomFilters" && node.types === "parent") {
+ return false;
+ }
+ return (
+ node.children === undefined ||
+ isEmpty(node.children) ||
+ treeName === "Classifications" ||
+ (treeName === "Glossary" && node.types === "child")
);
- navigateToPath(
- node,
- treeName,
- searchParams,
- navigate,
- isEmptyServicetype,
- toastId
+ };
+
+ const setSearchParams = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ isEmptyServicetype: boolean | undefined,
+ savedSearchData: any
+ ) => {
+ searchParams.set(
+ "searchType",
+ node.parent === "ADVANCED" ? "dsl" : "basic"
);
- }
- };
- const shouldSetSearchParams = (node: TreeNode, treeName: string) => {
- if (treeName === "CustomFilters" && node.types === "parent") {
- return false;
- }
- return (
- node.children === undefined ||
- isEmpty(node.children) ||
- treeName === "Classifications" ||
- (treeName === "Glossary" && node.types === "child")
- );
- };
+ switch (treeName) {
+ case "Entities":
+ searchParams.delete("relationshipName");
+ searchParams.set("type", node.id);
+ break;
+ case "Classifications": {
+ searchParams.delete("relationshipName");
+ const id = node.label.split(" (")[0];
+ searchParams.set("tag", id);
+ break;
+ }
+ case "Glossary":
+ setGlossarySearchParams(node, searchParams, isEmptyServicetype);
+ break;
+ case "Relationships":
+ case "CustomFilters":
+ setCustomFiltersSearchParams(node, searchParams, savedSearchData);
+ break;
+ default:
+ break;
+ }
- const setSearchParams = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- isEmptyServicetype: boolean | undefined,
- savedSearchData: any
- ) => {
- searchParams.set(
- "searchType",
- node.parent === "ADVANCED" ? "dsl" : "basic"
- );
+ if (treeName !== "CustomFilters") {
+ searchParams.delete("attributes");
+ searchParams.delete("entityFilters");
+ searchParams.delete("tagFilters");
+ searchParams.delete("relationshipFilters");
+ searchParams.set("pageLimit", "25");
+ searchParams.set("pageOffset", "0");
+ }
+ };
- switch (treeName) {
- case "Entities":
- searchParams.delete("relationshipName");
- searchParams.set("type", node.id);
- break;
- case "Classifications": {
- searchParams.delete("relationshipName");
- const id = node.label.split(" (")[0];
- searchParams.set("tag", id);
- break;
+ const setGlossarySearchParams = (
+ node: TreeNode,
+ searchParams: URLSearchParams,
+ isEmptyServicetype: boolean | undefined
+ ) => {
+ const guid =
+ !isEmptyServicetype && node.cGuid !== undefined
+ ? node.cGuid
+ : node.guid || "";
+ searchParams.delete("relationshipName");
+
+ if (isEmptyServicetype) {
+ searchParams.set("term", `${node.id}@${node.parent}`);
+ } else {
+ searchParams.delete("type");
+ searchParams.delete("tag");
+ searchParams.set("gid", node.guid as string);
}
- case "Glossary":
- setGlossarySearchParams(node, searchParams, isEmptyServicetype);
- break;
- case "Relationships":
- case "CustomFilters":
- setCustomFiltersSearchParams(node, searchParams, savedSearchData);
- break;
- default:
- break;
- }
-
- if (treeName !== "CustomFilters") {
- searchParams.delete("attributes");
- searchParams.delete("entityFilters");
- searchParams.delete("tagFilters");
- searchParams.delete("relationshipFilters");
- searchParams.set("pageLimit", "25");
- searchParams.set("pageOffset", "0");
- }
- };
- const setGlossarySearchParams = (
- node: TreeNode,
- searchParams: URLSearchParams,
- isEmptyServicetype: boolean | undefined
- ) => {
- const guid =
- !isEmptyServicetype && node.cGuid !== undefined
- ? node.cGuid
- : node.guid || "";
- searchParams.delete("relationshipName");
-
- if (isEmptyServicetype) {
- searchParams.set("term", `${node.id}@${node.parent}`);
- } else {
- searchParams.delete("type");
- searchParams.delete("tag");
- searchParams.set("gid", node.guid as string);
- }
-
- searchParams.set("gtype", `${isEmptyServicetype ? "term" : "category"}`);
- searchParams.set("viewType", `${isEmptyServicetype ? "term" :
"category"}`);
- searchParams.set("guid", guid);
- };
+ searchParams.set("gtype", `${isEmptyServicetype ? "term" : "category"}`);
+ searchParams.set("viewType", `${isEmptyServicetype ? "term" :
"category"}`);
+ searchParams.set("guid", guid);
+ };
- const setCustomFiltersSearchParams = (
- node: TreeNode,
- searchParams: URLSearchParams,
- savedSearchData: any[]
- ) => {
- // Clear all existing params except searchType
- const keys = Array.from(searchParams.keys());
- for (let i = 0; i < keys.length; i++) {
- if (keys[i] !== "searchType") {
- searchParams.delete(keys[i]);
- }
- }
-
- // Clear globalSearchFilterInitialQuery when applying new saved search
- globalSearchFilterInitialQuery.setQuery({});
-
- if (treeName === "CustomFilters") {
- const params = savedSearchData.find((obj) => obj.name === node.id);
- if (params) {
- const searchParamsObj = params?.searchParameters || {};
-
- // Step 1: Set searchType based on saved search type
- if (params.searchType) {
- const searchTypeValue = params.searchType === "ADVANCED" ? "dsl" :
"basic";
- searchParams.set("searchType", searchTypeValue);
+ const setCustomFiltersSearchParams = (
+ node: TreeNode,
+ searchParams: URLSearchParams,
+ savedSearchData: any[]
+ ) => {
+ // Clear all existing params except searchType
+ const keys = Array.from(searchParams.keys());
+ for (let i = 0; i < keys.length; i++) {
+ if (keys[i] !== "searchType") {
+ searchParams.delete(keys[i]);
}
-
- // Step 2: Apply basic search parameters (excluding filters which are
handled separately)
- for (const key in searchParamsObj) {
- if (shouldSetCustomFilterParam(node, key) &&
+ }
+
+ // Clear globalSearchFilterInitialQuery when applying new saved search
+ globalSearchFilterInitialQuery.setQuery({});
+
+ if (treeName === "CustomFilters") {
+ const params = savedSearchData.find((obj) => obj.name === node.id);
+ if (params) {
+ const searchParamsObj = params?.searchParameters || {};
+
+ // Step 1: Set searchType based on saved search type
+ if (params.searchType) {
+ const searchTypeValue = params.searchType === "ADVANCED" ? "dsl" :
"basic";
+ searchParams.set("searchType", searchTypeValue);
+ }
+
+ // Step 2: Apply basic search parameters (excluding filters which
are handled separately)
+ for (const key in searchParamsObj) {
+ if (shouldSetCustomFilterParam(node, key) &&
!["entityFilters", "tagFilters",
"relationshipFilters"].includes(key)) {
- setCustomFilterParam(searchParams, key, searchParamsObj[key]);
+ setCustomFilterParam(searchParams, key, searchParamsObj[key]);
+ }
}
- }
-
- // Step 3: Convert and apply entityFilters from API format to URL
string format
- if (searchParamsObj.entityFilters &&
!isEmpty(searchParamsObj.entityFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.entityFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("entityFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.entityFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- entityFilters: qbFilter
- });
+
+ // Step 3: Convert and apply entityFilters from API format to URL
string format
+ if (searchParamsObj.entityFilters &&
!isEmpty(searchParamsObj.entityFilters)) {
+ const clonedFilter = cloneDeep(searchParamsObj.entityFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("entityFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.entityFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ entityFilters: qbFilter
+ });
+ }
}
}
- }
-
- // Step 4: Convert and apply tagFilters from API format to URL string
format
- if (searchParamsObj.tagFilters &&
!isEmpty(searchParamsObj.tagFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.tagFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("tagFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.tagFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- tagFilters: qbFilter
- });
+
+ // Step 4: Convert and apply tagFilters from API format to URL
string format
+ if (searchParamsObj.tagFilters &&
!isEmpty(searchParamsObj.tagFilters)) {
+ const clonedFilter = cloneDeep(searchParamsObj.tagFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("tagFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.tagFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ tagFilters: qbFilter
+ });
+ }
}
}
- }
-
- // Step 5: Convert and apply relationshipFilters from API format to
URL string format
- if (searchParamsObj.relationshipFilters &&
!isEmpty(searchParamsObj.relationshipFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.relationshipFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("relationshipFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.relationshipFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- relationshipFilters: qbFilter
- });
+
+ // Step 5: Convert and apply relationshipFilters from API format to
URL string format
+ if (searchParamsObj.relationshipFilters &&
!isEmpty(searchParamsObj.relationshipFilters)) {
+ const clonedFilter =
cloneDeep(searchParamsObj.relationshipFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("relationshipFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.relationshipFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ relationshipFilters: qbFilter
+ });
+ }
}
}
+
+ searchParams.set("isCF", "true");
+ searchParams.set("customFilter", node.id);
}
-
- searchParams.set("isCF", "true");
+ } else {
+ searchParams.set("relationshipName", node.id);
}
- } else {
- searchParams.set("relationshipName", node.id);
- }
- };
-
- // Helper function to convert API format filter (criterion/condition) to
query builder format (rules/combinator)
- const convertApiToQueryBuilder = (apiFilter: any): any => {
- if (!apiFilter || typeof apiFilter !== "object") {
- return null;
- }
-
- const result: any = {};
-
- // Convert condition to combinator
- if (apiFilter.condition) {
- result.combinator = apiFilter.condition.toLowerCase();
- } else {
- result.combinator = "and"; // default
- }
-
- // Convert criterion to rules
- if (apiFilter.criterion && Array.isArray(apiFilter.criterion)) {
- result.rules = apiFilter.criterion.map((rule: any) => {
- // If nested condition, recurse
- if (rule.condition || rule.criterion) {
- return convertApiToQueryBuilder(rule);
- }
- // Convert API rule format to query builder format
- return {
- field: rule.attributeName || rule.id,
- operator: rule.operator,
- value: rule.attributeValue || rule.value,
- type: rule.type || rule.attributeType
- };
- });
- } else if (apiFilter.rules && Array.isArray(apiFilter.rules)) {
- // Already in query builder format
- result.rules = apiFilter.rules.map((rule: any) =>
- rule.condition || rule.criterion ? convertApiToQueryBuilder(rule) :
rule
- );
- }
-
- return Object.keys(result).length > 0 ? result : null;
- };
+ };
- const shouldSetCustomFilterParam = (node: TreeNode, key: string) => {
- return (
- node.parent === "BASIC" ||
- node.parent === "ADVANCED" ||
- (node.parent === "BASIC_RELATIONSHIP" &&
- (key === "relationshipName" || key === "limit" || key === "offset"))
- );
- };
+ // Helper function to convert API format filter (criterion/condition) to
query builder format (rules/combinator)
+ const convertApiToQueryBuilder = (apiFilter: any): any => {
+ if (!apiFilter || typeof apiFilter !== "object") {
+ return null;
+ }
- const setCustomFilterParam = (
- searchParams: URLSearchParams,
- key: string,
- value: any
- ) => {
- if (key === "limit") {
- searchParams.set("pageLimit", value || 25);
- } else if (key === "offset") {
- searchParams.set("pageOffset", value);
- } else if (key === "typeName") {
- searchParams.set("type", value);
- } else if (key === "classification") {
- // Map classification to tag parameter for URL (matching classic UI)
- searchParams.set("tag", value);
- } else if (key === "termName") {
- // Map termName (API format) to term parameter for URL (matching classic
UI)
- searchParams.set("term", value);
- } else if (value !== null && value !== undefined && value !== "") {
- // Only set parameter if value is not null, undefined, or empty string
- searchParams.set(key, value);
- }
- };
+ const result: any = {};
- const navigateToPath = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- navigate: NavigateFunction,
- isEmptyServicetype: boolean | undefined,
- toastId: any
- ) => {
- switch (treeName) {
- case "Business MetaData":
- searchParams.delete("relationshipName");
- navigate(
- { pathname: `administrator/businessMetadata/${node.guid}` },
- { replace: true }
+ // Convert condition to combinator
+ if (apiFilter.condition) {
+ result.combinator = apiFilter.condition.toLowerCase();
+ } else {
+ result.combinator = "and"; // default
+ }
+
+ // Convert criterion to rules
+ if (apiFilter.criterion && Array.isArray(apiFilter.criterion)) {
+ result.rules = apiFilter.criterion.map((rule: any) => {
+ // If nested condition, recurse
+ if (rule.condition || rule.criterion) {
+ return convertApiToQueryBuilder(rule);
+ }
+ // Convert API rule format to query builder format
+ return {
+ field: rule.attributeName || rule.id,
+ operator: rule.operator,
+ value: rule.attributeValue || rule.value,
+ type: rule.type || rule.attributeType
+ };
+ });
+ } else if (apiFilter.rules && Array.isArray(apiFilter.rules)) {
+ // Already in query builder format
+ result.rules = apiFilter.rules.map((rule: any) =>
+ rule.condition || rule.criterion ? convertApiToQueryBuilder(rule) :
rule
);
- break;
- case "Glossary":
- if (!isEmptyServicetype) {
- searchParams.delete("relationshipName");
- navigate(
- {
- pathname: `glossary/${
- node.cGuid !== undefined ? node.cGuid : node.guid
- }`,
- search: searchParams.toString(),
- },
- { replace: true }
- );
- } else if (node.types === "parent") {
- toast.dismiss(toastId.current);
- toastId.current = toast.warning("Create a Term or Category");
- } else {
+ }
+
+ return Object.keys(result).length > 0 ? result : null;
+ };
+
+ const shouldSetCustomFilterParam = (node: TreeNode, key: string) => {
+ return (
+ node.parent === "BASIC" ||
+ node.parent === "ADVANCED" ||
+ (node.parent === "BASIC_RELATIONSHIP" &&
+ (key === "relationshipName" || key === "limit" || key === "offset"))
+ );
+ };
+
+ const setCustomFilterParam = (
+ searchParams: URLSearchParams,
+ key: string,
+ value: any
+ ) => {
+ if (key === "limit") {
+ searchParams.set("pageLimit", value || 25);
+ } else if (key === "offset") {
+ searchParams.set("pageOffset", value);
+ } else if (key === "typeName") {
+ searchParams.set("type", value);
+ } else if (key === "classification") {
+ // Map classification to tag parameter for URL (matching classic UI)
+ searchParams.set("tag", value);
+ } else if (key === "termName") {
+ // Map termName (API format) to term parameter for URL (matching
classic UI)
+ searchParams.set("term", value);
+ } else if (value !== null && value !== undefined && value !== "") {
+ // Only set parameter if value is not null, undefined, or empty string
+ searchParams.set(key, value);
+ }
+ };
+
+ const navigateToPath = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ navigate: NavigateFunction,
+ isEmptyServicetype: boolean | undefined,
+ toastId: any
+ ) => {
+ switch (treeName) {
+ case "Business MetaData":
searchParams.delete("relationshipName");
navigate(
- {
- pathname: "/search/searchResult",
- search: searchParams.toString(),
- },
- { replace: true }
- );
- }
- break;
- case "Relationships":
- case "CustomFilters":
- if (
- treeName == "Relationships" ||
- (treeName == "CustomFilters" && node.parent == "BASIC_RELATIONSHIP")
- ) {
- navigate(
- {
- pathname: `relationship/relationshipSearchresult`,
- search: searchParams.toString(),
- },
+ { pathname: `administrator/businessMetadata/${node.guid}` },
{ replace: true }
);
- } else {
+ break;
+ case "Glossary":
+ if (!isEmptyServicetype) {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: `glossary/${node.cGuid !== undefined ? node.cGuid :
node.guid
+ }`,
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ } else if (node.types === "parent") {
+ toast.dismiss(toastId.current);
+ toastId.current = toast.warning("Create a Term or Category");
+ } else {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: "/search/searchResult",
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ }
+ break;
+ case "Relationships":
+ case "CustomFilters":
+ if (
+ treeName == "Relationships" ||
+ (treeName == "CustomFilters" && node.parent ==
"BASIC_RELATIONSHIP")
+ ) {
+ navigate(
+ {
+ pathname: `relationship/relationshipSearchresult`,
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ } else {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: "/search/searchResult",
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ }
+ break;
+ default:
searchParams.delete("relationshipName");
navigate(
- {
- pathname: "/search/searchResult",
- search: searchParams.toString(),
- },
+ { pathname: "/search/searchResult", search:
searchParams.toString() },
{ replace: true }
);
- }
- break;
- default:
- searchParams.delete("relationshipName");
- navigate(
- { pathname: "/search/searchResult", search: searchParams.toString()
},
- { replace: true }
- );
- break;
- }
- };
-
- const TreeLabelWithTooltip: React.FC<{ label: string }> = ({ label }) => {
- const labelRef = useRef<HTMLSpanElement>(null);
- const [isOverflown, setIsOverflown] = useState(false);
-
- useEffect(() => {
- const el = labelRef.current;
- if (el) {
- setIsOverflown(el.scrollWidth > el.clientWidth);
+ break;
}
- }, [label, searchTerm]);
+ };
- return (
- <LightTooltip title={label} disableHoverListener={!isOverflown}>
- <span
- ref={labelRef}
- className="tree-item-label"
- style={{
- display: "inline-block",
- maxWidth: "100%",
- overflow: "hidden",
- textOverflow: "ellipsis",
- whiteSpace: "nowrap",
- }}
- >
- {highlightText(label)}
- </span>
- </LightTooltip>
- );
- };
+ const TreeLabelWithTooltip: React.FC<{ label: string }> = ({ label }) => {
+ const labelRef = useRef<HTMLSpanElement>(null);
+ const [isOverflown, setIsOverflown] = useState(false);
- const renderTreeItem = (node: TreeNode) =>
- node?.id && (
- <CustomTreeItem
- key={node.id}
- itemId={getNodeId(node)}
- label={
- <div
- {...({
- selectedNodeType: selectedNode.type,
- selectedNodeTag: selectedNode.tag,
- selectedNodeRelationship: selectedNode.relationship,
- selectedNodeBM: selectedNode.businessMetadata,
- node: node.id,
- onClick: (_event: MouseEvent<HTMLElement>) => {
- handleNodeClick(
- node,
- treeName,
- searchParams,
- navigate,
- isEmptyServicetype,
- savedSearchData,
- toastId
- );
- },
- className: "custom-treeitem-label",
- } as any)}
+ useEffect(() => {
+ const el = labelRef.current;
+ if (el) {
+ setIsOverflown(el.scrollWidth > el.clientWidth);
+ }
+ }, [label, searchTerm]);
+
+ return (
+ <LightTooltip title={label} disableHoverListener={!isOverflown}>
+ <span
+ ref={labelRef}
+ className="tree-item-label"
+ style={{
Review Comment:
Inline style={{ whiteSpace: "nowrap" }} duplicates .sidebar-tree-label-nowrap
##########
dashboard/src/styles/sidebar.scss:
##########
Review Comment:
Dead CSS for removed dragger
(.sidebar-dragger) — remove if dragger is gone
##########
dashboard/src/redux/slice/__tests__/sessionSlice.test.ts:
##########
Review Comment:
initialState missing versionData; "should return initial state" doesn't
assert it - Extend initial state test
##########
dashboard/src/views/SideBar/SideBarTree/SideBarTree.tsx:
##########
@@ -287,1027 +322,1069 @@ const BarTreeView: FC<{
sideBarOpen,
searchTerm,
loader,
+ isPopover,
}) => {
- const dispatch = useAppDispatch();
- const { savedSearchData }: any = useAppSelector(
- (state: any) => state.savedSearch
- );
- const { bmguid } = useParams();
- const location = useLocation();
- const navigate = useNavigate();
- const searchParams = new URLSearchParams(location.search);
- const [expand, setExpand] = useState<null | HTMLElement>(null);
- const [selectedNode, setSelectedNode] = useState<{
- type: string | null;
- tag: string | null;
- relationship: string | null;
- businessMetadata: string | null;
- }>({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: null,
- });
-
- const [openModal, setOpenModal] = useState<boolean>(false);
- const toastId: any = useRef(null);
- const open = Boolean(expand);
- const [expandedItems, setExpandedItems] = useState<string[]>([]);
- const [tagModal, setTagModal] = useState<boolean>(false);
- const [glossaryModal, setGlossaryModal] = useState<boolean>(false);
- const { businessMetaData }: any = useAppSelector(
- (state: any) => state.businessMetaData
- );
-
- const filteredData = useMemo(() => {
- return treeData.filter((node) => {
- return (
- node.label?.toLowerCase().includes(searchTerm.toLowerCase()) ||
- (node.children &&
- node.children.some((child) =>
- child.label?.toLowerCase().includes(searchTerm.toLowerCase())
- ))
- );
+ const { savedSearchData }: any = useAppSelector(
+ (state: any) => state.savedSearch
+ );
+ const { bmguid } = useParams();
+ const dispatch = useAppDispatch();
+ const location = useLocation();
+ const navigate = useNavigate();
+ const searchParams = new URLSearchParams(location.search);
+ const [expand, setExpand] = useState<null | HTMLElement>(null);
+ const [selectedNode, setSelectedNode] = useState<SelectedNode>({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
});
- }, [treeData, searchTerm]);
- const displayTreeName = useMemo(() => {
- return treeName === "CustomFilters" ? "Custom Filters" : treeName
- }, [treeName]);
+ const [openModal, setOpenModal] = useState<boolean>(false);
+ const toastId: any = useRef(null);
+ const open = Boolean(expand);
+ const [expandedItems, setExpandedItems] = useState<string[]>([]);
+ const [tagModal, setTagModal] = useState<boolean>(false);
+ const [glossaryModal, setGlossaryModal] = useState<boolean>(false);
+ const { businessMetaData }: any = useAppSelector(
+ (state: any) => state.businessMetaData
+ );
- const highlightText = useMemo(() => {
- return (text: string) => {
- if (!searchTerm) return text;
+ const filteredData = useMemo(() => {
+ return treeData.filter((node) => {
+ return (
+ node.label?.toLowerCase().includes(searchTerm.toLowerCase()) ||
+ (node.children &&
+ node.children.some((child) =>
+ child.label?.toLowerCase().includes(searchTerm.toLowerCase())
+ ))
+ );
+ });
+ }, [treeData, searchTerm]);
- const parts = text.split(new RegExp(`(${searchTerm})`, "gi"));
- return parts.map((part, index) =>
- part.toLowerCase() === searchTerm.toLowerCase() ? (
- <span key={index} style={{ color: "#D3D3D3", fontWeight: "600" }}>
- {part}
- </span>
- ) : (
- part
- )
- );
- };
- }, [searchTerm]);
-
- const expandedItemsMemo = useMemo(() => {
- const allNodeIds = filteredData.flatMap((node) => {
- return [
- node.id,
- ...(node.children ? node.children.map((child) => child.id) : []),
- ];
- });
- return [...allNodeIds, ...[treeName]];
- }, [filteredData, treeName]);
+ const displayTreeName = useMemo(() => {
+ return treeName === "CustomFilters" ? "Custom Filters" : treeName
+ }, [treeName]);
- useEffect(() => {
- setExpandedItems(expandedItemsMemo);
- }, [expandedItemsMemo]);
+ const highlightText = useMemo(() => {
+ return (text: string) => {
+ if (!searchTerm) return text;
- useEffect(() => {
- const searchParams = new URLSearchParams(location.search);
- const nodeIdFromParamsType = searchParams.get("type");
- const nodeIdFromParamsTag = searchParams.get("tag");
- const nodeIdFromParamsRelationshipName =
- searchParams.get("relationshipName");
- const nodeIdFromBMName = location.pathname.includes(
- "/administrator/businessMetadata"
- );
+ const escapeRegExp = (string: string) => {
+ return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means
the whole matched string
+ };
+
+ const escapedSearchTerm = escapeRegExp(searchTerm);
+ const parts = text.split(new RegExp(`(${escapedSearchTerm})`, "gi"));
+ return parts.map((part, index) =>
+ part.toLowerCase() === searchTerm.toLowerCase() ? (
+ <span key={index} className="sidebar-tree-highlight">
+ {part}
+ </span>
+ ) : (
+ part
+ )
+ );
+ };
+ }, [searchTerm]);
+
+ const expandedItemsMemo = useMemo(() => {
+ const allNodeIds = filteredData.flatMap((node) => {
+ return [
+ node.id,
+ ...(node.children ? node.children.map((child) => child.id) : []),
+ ];
+ });
+ return [...allNodeIds, ...[treeName]];
+ }, [filteredData, treeName]);
+
+ useEffect(() => {
+ setExpandedItems(expandedItemsMemo);
+ }, [expandedItemsMemo]);
+
+ const getNodeId = (node: TreeNode) => {
+ if (treeName == "Classifications" && node.types == "parent") {
+ return node.label;
+ } else if (treeName == "Classifications" && node.types == "child") {
+ return `${node.id}@${node.label}`;
+ }
+ return !isEmpty(node?.parent) ? `${node.id}@${node?.parent}` : node.id;
+ };
+
+ useEffect(() => {
+ const searchParams = new URLSearchParams(location.search);
+ const nodeIdFromParamsType = searchParams.get("type");
+ const nodeIdFromParamsTag = searchParams.get("tag");
+ const nodeIdFromParamsRelationshipName =
+ searchParams.get("relationshipName");
+ const nodeIdFromBMName = location.pathname.includes(
+ "/administrator/businessMetadata"
+ );
+ const nodeIdFromParamsTerm = searchParams.get("term") ||
searchParams.get("category") || searchParams.get("gtype") ||
location.pathname.split("/glossary/")[1];
+ const nodeIdFromCustomFilter = searchParams.get("customFilter");
- const bmObj = !isEmpty(businessMetaData?.businessMetadataDefs)
- ? businessMetaData?.businessMetadataDefs?.find((obj: EnumTypeDefData) =>
{
+ const bmObj = !isEmpty(businessMetaData?.businessMetadataDefs)
+ ? businessMetaData?.businessMetadataDefs?.find((obj: EnumTypeDefData)
=> {
if (bmguid == obj.guid) {
return obj;
}
})
- : {};
- const { name = "" } = bmObj || {};
-
- setSelectedNode({
- type: nodeIdFromParamsType,
- tag: nodeIdFromParamsTag,
- relationship: nodeIdFromParamsRelationshipName,
- businessMetadata: nodeIdFromBMName ? name : null,
- });
+ : {};
+ const { name = "" } = bmObj || {};
- if (
- !nodeIdFromParamsType &&
- !nodeIdFromParamsTag &&
- !nodeIdFromParamsRelationshipName &&
- !nodeIdFromBMName
- ) {
setSelectedNode({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: null,
+ type: nodeIdFromParamsType,
+ tag: nodeIdFromParamsTag,
+ relationship: nodeIdFromParamsRelationshipName,
+ businessMetadata: nodeIdFromBMName ? name : null,
+ term: nodeIdFromParamsTerm || null,
+ customFilter: nodeIdFromCustomFilter || null,
});
- }
- }, [location.search]);
- const getEmptyTypesTitle = () => {
- switch (treeName) {
- case "Entities":
- return `${isEmptyServicetype ? "Hide" : "Show"} empty service types`;
+ if (nodeIdFromParamsTerm && typeof nodeIdFromParamsTerm === "string" &&
nodeIdFromParamsTerm.includes("@") && treeName === "Glossary") {
+ const glossaryName = nodeIdFromParamsTerm.split("@")[1];
+ if (glossaryName) {
+ const parentNode = treeData.find((n) => n.label === glossaryName);
+ if (parentNode) {
+ const nodeIdToExpand = getNodeId(parentNode);
+ setExpandedItems((prev) => {
+ if (!prev.includes(nodeIdToExpand)) {
+ return [...prev, nodeIdToExpand];
+ }
+ return prev;
+ });
+ }
+ }
+ }
- case "Classifications":
- return `${isEmptyServicetype ? "Show" : "Hide"} unused
classifications`;
+ if (
+ !nodeIdFromParamsType &&
+ !nodeIdFromParamsTag &&
+ !nodeIdFromParamsRelationshipName &&
+ !nodeIdFromBMName &&
+ !nodeIdFromParamsTerm &&
+ !nodeIdFromCustomFilter
+ ) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ }, [location.search, treeData, treeName, businessMetaData, bmguid]);
- case "Glossary":
- return `Show ${isEmptyServicetype ? "Category" : "Term"}`;
+ const getEmptyTypesTitle = () => {
+ switch (treeName) {
+ case "Entities":
+ return `${isEmptyServicetype ? "Hide" : "Show"} empty service types`;
- case "CustomFilters":
- return `Show ${isEmptyServicetype ? "all" : "Type"}`;
+ case "Classifications":
+ return `${isEmptyServicetype ? "Show" : "Hide"} unused
classifications`;
- default:
- return "";
- }
- };
+ case "Glossary":
+ return `Show ${isEmptyServicetype ? "Category" : "Term"}`;
- const handleExpandedItemsChange = (
- _event: SyntheticEvent,
- newExpandedItems: string[]
- ) => {
- setExpandedItems(newExpandedItems);
- };
+ case "CustomFilters":
+ return `Show ${isEmptyServicetype ? "all" : "Type"}`;
- const handleOpenModal = () => {
- setOpenModal(true);
- };
- const handleCloseModal = () => {
- setOpenModal(false);
- };
+ default:
+ return "";
+ }
+ };
- const handleClickMenu = (event: MouseEvent<HTMLElement>) => {
- event.stopPropagation();
- setExpand(event.currentTarget);
- };
+ const handleExpandedItemsChange = (
+ _event: SyntheticEvent,
+ newExpandedItems: string[]
+ ) => {
+ setExpandedItems(newExpandedItems);
+ };
- const handleClose = () => {
- setExpand(null);
- };
+ const handleOpenModal = () => {
+ setOpenModal(true);
+ };
+ const handleCloseModal = () => {
+ setOpenModal(false);
+ };
- const handleCloseTagModal = () => {
- setTagModal(false);
- };
- const handleCloseGlossaryModal = () => {
- setGlossaryModal(false);
- };
+ const handleClickMenu = (event: MouseEvent<HTMLElement>) => {
+ event.stopPropagation();
+ setExpand(event.currentTarget);
+ };
- const handleClickNode = (nodeId: string) => {
- const searchParams = new URLSearchParams(location.search);
- const isTypeMatch = searchParams.get("type") === nodeId;
- const isTagMatch = searchParams.get("tag") === nodeId;
- const isRelationshipMatch = searchParams.get("relationshipName") ===
nodeId;
- const isBusinessMetadataMatch = location.pathname.includes(
- "/administrator/businessMetadata"
- );
+ const handleClose = () => {
+ setExpand(null);
+ };
- if (isTypeMatch) {
- setSelectedNode({
- type: nodeId,
- tag: null,
- relationship: null,
- businessMetadata: null,
- });
- }
- if (isTagMatch) {
- setSelectedNode({
- type: null,
- tag: nodeId,
- relationship: null,
- businessMetadata: null,
- });
- }
- if (isRelationshipMatch) {
- setSelectedNode({
- type: null,
- tag: null,
- relationship: nodeId,
- businessMetadata: null,
- });
- }
- if (isBusinessMetadataMatch) {
- setSelectedNode({
- type: null,
- tag: null,
- relationship: null,
- businessMetadata: nodeId,
- });
- }
- };
+ const handleCloseTagModal = () => {
+ setTagModal(false);
+ };
+ const handleCloseGlossaryModal = () => {
+ setGlossaryModal(false);
+ };
- const getNodeId = (node: TreeNode) => {
- if (treeName == "Classifications" && node.types == "parent") {
- return node.label;
- } else if (treeName == "Classifications" && node.types == "child") {
- return `${node.id}@${node.label}`;
- }
- return !isEmpty(node?.parent) ? `${node.id}@${node?.parent}` : node.id;
- };
+ const handleClickNode = (nodeId: string) => {
+ const searchParams = new URLSearchParams(location.search);
+ const isTypeMatch = searchParams.get("type") === nodeId;
+ const isTagMatch = searchParams.get("tag") === nodeId;
+ const isRelationshipMatch = searchParams.get("relationshipName") ===
nodeId;
+ const isBusinessMetadataMatch = location.pathname.includes(
+ "/administrator/businessMetadata"
+ );
+
+ if (isTypeMatch) {
+ setSelectedNode({
+ type: nodeId,
+ tag: null,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isTagMatch) {
+ setSelectedNode({
+ type: null,
+ tag: nodeId,
+ relationship: null,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isRelationshipMatch) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: nodeId,
+ businessMetadata: null,
+ term: null,
+ customFilter: null,
+ });
+ }
+ if (isBusinessMetadataMatch) {
+ setSelectedNode({
+ type: null,
+ tag: null,
+ relationship: null,
+ businessMetadata: nodeId,
+ term: null,
+ customFilter: null,
+ });
+ }
+ };
- const handleNodeClick = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- navigate: NavigateFunction,
- isEmptyServicetype: boolean | undefined,
- savedSearchData: any,
- toastId: any
- ) => {
- globalSearchFilterInitialQuery.setQuery({});
- searchParams.delete("tabActive");
-
- if (treeName === "Classifications") {
- handleClickNode(node.id);
- } else {
- handleClickNode(node.id);
- }
-
- if (node.id === "No Records Found") {
- if (typeof event !== "undefined" && event.stopPropagation) {
- event.stopPropagation();
+ const handleNodeClick = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ navigate: NavigateFunction,
+ isEmptyServicetype: boolean | undefined,
+ savedSearchData: any,
+ toastId: any
+ ) => {
+ globalSearchFilterInitialQuery.setQuery({});
+ searchParams.delete("tabActive");
+
+ if (treeName === "Classifications") {
+ handleClickNode(node.id);
+ } else {
+ handleClickNode(node.id);
}
- return;
- }
-
- if (shouldSetSearchParams(node, treeName)) {
- setSearchParams(
- node,
- treeName,
- searchParams,
- isEmptyServicetype,
- savedSearchData
+
+ if (node.id === "No Records Found") {
+ if (typeof event !== "undefined" && event.stopPropagation) {
+ event.stopPropagation();
+ }
+ return;
+ }
+
+ if (shouldSetSearchParams(node, treeName)) {
+ setSearchParams(
+ node,
+ treeName,
+ searchParams,
+ isEmptyServicetype,
+ savedSearchData
+ );
+ navigateToPath(
+ node,
+ treeName,
+ searchParams,
+ navigate,
+ isEmptyServicetype,
+ toastId
+ );
+ }
+ };
+
+ const shouldSetSearchParams = (node: TreeNode, treeName: string) => {
+ if (treeName === "CustomFilters" && node.types === "parent") {
+ return false;
+ }
+ return (
+ node.children === undefined ||
+ isEmpty(node.children) ||
+ treeName === "Classifications" ||
+ (treeName === "Glossary" && node.types === "child")
);
- navigateToPath(
- node,
- treeName,
- searchParams,
- navigate,
- isEmptyServicetype,
- toastId
+ };
+
+ const setSearchParams = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ isEmptyServicetype: boolean | undefined,
+ savedSearchData: any
+ ) => {
+ searchParams.set(
+ "searchType",
+ node.parent === "ADVANCED" ? "dsl" : "basic"
);
- }
- };
- const shouldSetSearchParams = (node: TreeNode, treeName: string) => {
- if (treeName === "CustomFilters" && node.types === "parent") {
- return false;
- }
- return (
- node.children === undefined ||
- isEmpty(node.children) ||
- treeName === "Classifications" ||
- (treeName === "Glossary" && node.types === "child")
- );
- };
+ switch (treeName) {
+ case "Entities":
+ searchParams.delete("relationshipName");
+ searchParams.set("type", node.id);
+ break;
+ case "Classifications": {
+ searchParams.delete("relationshipName");
+ const id = node.label.split(" (")[0];
+ searchParams.set("tag", id);
+ break;
+ }
+ case "Glossary":
+ setGlossarySearchParams(node, searchParams, isEmptyServicetype);
+ break;
+ case "Relationships":
+ case "CustomFilters":
+ setCustomFiltersSearchParams(node, searchParams, savedSearchData);
+ break;
+ default:
+ break;
+ }
- const setSearchParams = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- isEmptyServicetype: boolean | undefined,
- savedSearchData: any
- ) => {
- searchParams.set(
- "searchType",
- node.parent === "ADVANCED" ? "dsl" : "basic"
- );
+ if (treeName !== "CustomFilters") {
+ searchParams.delete("attributes");
+ searchParams.delete("entityFilters");
+ searchParams.delete("tagFilters");
+ searchParams.delete("relationshipFilters");
+ searchParams.set("pageLimit", "25");
+ searchParams.set("pageOffset", "0");
+ }
+ };
- switch (treeName) {
- case "Entities":
- searchParams.delete("relationshipName");
- searchParams.set("type", node.id);
- break;
- case "Classifications": {
- searchParams.delete("relationshipName");
- const id = node.label.split(" (")[0];
- searchParams.set("tag", id);
- break;
+ const setGlossarySearchParams = (
+ node: TreeNode,
+ searchParams: URLSearchParams,
+ isEmptyServicetype: boolean | undefined
+ ) => {
+ const guid =
+ !isEmptyServicetype && node.cGuid !== undefined
+ ? node.cGuid
+ : node.guid || "";
+ searchParams.delete("relationshipName");
+
+ if (isEmptyServicetype) {
+ searchParams.set("term", `${node.id}@${node.parent}`);
+ } else {
+ searchParams.delete("type");
+ searchParams.delete("tag");
+ searchParams.set("gid", node.guid as string);
}
- case "Glossary":
- setGlossarySearchParams(node, searchParams, isEmptyServicetype);
- break;
- case "Relationships":
- case "CustomFilters":
- setCustomFiltersSearchParams(node, searchParams, savedSearchData);
- break;
- default:
- break;
- }
-
- if (treeName !== "CustomFilters") {
- searchParams.delete("attributes");
- searchParams.delete("entityFilters");
- searchParams.delete("tagFilters");
- searchParams.delete("relationshipFilters");
- searchParams.set("pageLimit", "25");
- searchParams.set("pageOffset", "0");
- }
- };
- const setGlossarySearchParams = (
- node: TreeNode,
- searchParams: URLSearchParams,
- isEmptyServicetype: boolean | undefined
- ) => {
- const guid =
- !isEmptyServicetype && node.cGuid !== undefined
- ? node.cGuid
- : node.guid || "";
- searchParams.delete("relationshipName");
-
- if (isEmptyServicetype) {
- searchParams.set("term", `${node.id}@${node.parent}`);
- } else {
- searchParams.delete("type");
- searchParams.delete("tag");
- searchParams.set("gid", node.guid as string);
- }
-
- searchParams.set("gtype", `${isEmptyServicetype ? "term" : "category"}`);
- searchParams.set("viewType", `${isEmptyServicetype ? "term" :
"category"}`);
- searchParams.set("guid", guid);
- };
+ searchParams.set("gtype", `${isEmptyServicetype ? "term" : "category"}`);
+ searchParams.set("viewType", `${isEmptyServicetype ? "term" :
"category"}`);
+ searchParams.set("guid", guid);
+ };
- const setCustomFiltersSearchParams = (
- node: TreeNode,
- searchParams: URLSearchParams,
- savedSearchData: any[]
- ) => {
- // Clear all existing params except searchType
- const keys = Array.from(searchParams.keys());
- for (let i = 0; i < keys.length; i++) {
- if (keys[i] !== "searchType") {
- searchParams.delete(keys[i]);
- }
- }
-
- // Clear globalSearchFilterInitialQuery when applying new saved search
- globalSearchFilterInitialQuery.setQuery({});
-
- if (treeName === "CustomFilters") {
- const params = savedSearchData.find((obj) => obj.name === node.id);
- if (params) {
- const searchParamsObj = params?.searchParameters || {};
-
- // Step 1: Set searchType based on saved search type
- if (params.searchType) {
- const searchTypeValue = params.searchType === "ADVANCED" ? "dsl" :
"basic";
- searchParams.set("searchType", searchTypeValue);
+ const setCustomFiltersSearchParams = (
+ node: TreeNode,
+ searchParams: URLSearchParams,
+ savedSearchData: any[]
+ ) => {
+ // Clear all existing params except searchType
+ const keys = Array.from(searchParams.keys());
+ for (let i = 0; i < keys.length; i++) {
+ if (keys[i] !== "searchType") {
+ searchParams.delete(keys[i]);
}
-
- // Step 2: Apply basic search parameters (excluding filters which are
handled separately)
- for (const key in searchParamsObj) {
- if (shouldSetCustomFilterParam(node, key) &&
+ }
+
+ // Clear globalSearchFilterInitialQuery when applying new saved search
+ globalSearchFilterInitialQuery.setQuery({});
+
+ if (treeName === "CustomFilters") {
+ const params = savedSearchData.find((obj) => obj.name === node.id);
+ if (params) {
+ const searchParamsObj = params?.searchParameters || {};
+
+ // Step 1: Set searchType based on saved search type
+ if (params.searchType) {
+ const searchTypeValue = params.searchType === "ADVANCED" ? "dsl" :
"basic";
+ searchParams.set("searchType", searchTypeValue);
+ }
+
+ // Step 2: Apply basic search parameters (excluding filters which
are handled separately)
+ for (const key in searchParamsObj) {
+ if (shouldSetCustomFilterParam(node, key) &&
!["entityFilters", "tagFilters",
"relationshipFilters"].includes(key)) {
- setCustomFilterParam(searchParams, key, searchParamsObj[key]);
+ setCustomFilterParam(searchParams, key, searchParamsObj[key]);
+ }
}
- }
-
- // Step 3: Convert and apply entityFilters from API format to URL
string format
- if (searchParamsObj.entityFilters &&
!isEmpty(searchParamsObj.entityFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.entityFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("entityFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.entityFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- entityFilters: qbFilter
- });
+
+ // Step 3: Convert and apply entityFilters from API format to URL
string format
+ if (searchParamsObj.entityFilters &&
!isEmpty(searchParamsObj.entityFilters)) {
+ const clonedFilter = cloneDeep(searchParamsObj.entityFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("entityFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.entityFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ entityFilters: qbFilter
+ });
+ }
}
}
- }
-
- // Step 4: Convert and apply tagFilters from API format to URL string
format
- if (searchParamsObj.tagFilters &&
!isEmpty(searchParamsObj.tagFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.tagFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("tagFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.tagFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- tagFilters: qbFilter
- });
+
+ // Step 4: Convert and apply tagFilters from API format to URL
string format
+ if (searchParamsObj.tagFilters &&
!isEmpty(searchParamsObj.tagFilters)) {
+ const clonedFilter = cloneDeep(searchParamsObj.tagFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("tagFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.tagFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ tagFilters: qbFilter
+ });
+ }
}
}
- }
-
- // Step 5: Convert and apply relationshipFilters from API format to
URL string format
- if (searchParamsObj.relationshipFilters &&
!isEmpty(searchParamsObj.relationshipFilters)) {
- const clonedFilter = cloneDeep(searchParamsObj.relationshipFilters);
- const ruleUrl = attributeFilter.generateUrl({
- value: clonedFilter,
- formatedDateToLong: true
- });
-
- if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
- searchParams.set("relationshipFilters", ruleUrl);
-
- // Convert API format to query builder format for Filters
component UI
- const qbFilter =
convertApiToQueryBuilder(searchParamsObj.relationshipFilters);
- if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
- globalSearchFilterInitialQuery.setQuery({
- relationshipFilters: qbFilter
- });
+
+ // Step 5: Convert and apply relationshipFilters from API format to
URL string format
+ if (searchParamsObj.relationshipFilters &&
!isEmpty(searchParamsObj.relationshipFilters)) {
+ const clonedFilter =
cloneDeep(searchParamsObj.relationshipFilters);
+ const ruleUrl = attributeFilter.generateUrl({
+ value: clonedFilter,
+ formatedDateToLong: true
+ });
+
+ if (ruleUrl && !isEmpty(ruleUrl) && typeof ruleUrl === "string") {
+ searchParams.set("relationshipFilters", ruleUrl);
+
+ // Convert API format to query builder format for Filters
component UI
+ const qbFilter =
convertApiToQueryBuilder(searchParamsObj.relationshipFilters);
+ if (qbFilter && (qbFilter.rules || qbFilter.combinator)) {
+ globalSearchFilterInitialQuery.setQuery({
+ relationshipFilters: qbFilter
+ });
+ }
}
}
+
+ searchParams.set("isCF", "true");
+ searchParams.set("customFilter", node.id);
}
-
- searchParams.set("isCF", "true");
+ } else {
+ searchParams.set("relationshipName", node.id);
}
- } else {
- searchParams.set("relationshipName", node.id);
- }
- };
-
- // Helper function to convert API format filter (criterion/condition) to
query builder format (rules/combinator)
- const convertApiToQueryBuilder = (apiFilter: any): any => {
- if (!apiFilter || typeof apiFilter !== "object") {
- return null;
- }
-
- const result: any = {};
-
- // Convert condition to combinator
- if (apiFilter.condition) {
- result.combinator = apiFilter.condition.toLowerCase();
- } else {
- result.combinator = "and"; // default
- }
-
- // Convert criterion to rules
- if (apiFilter.criterion && Array.isArray(apiFilter.criterion)) {
- result.rules = apiFilter.criterion.map((rule: any) => {
- // If nested condition, recurse
- if (rule.condition || rule.criterion) {
- return convertApiToQueryBuilder(rule);
- }
- // Convert API rule format to query builder format
- return {
- field: rule.attributeName || rule.id,
- operator: rule.operator,
- value: rule.attributeValue || rule.value,
- type: rule.type || rule.attributeType
- };
- });
- } else if (apiFilter.rules && Array.isArray(apiFilter.rules)) {
- // Already in query builder format
- result.rules = apiFilter.rules.map((rule: any) =>
- rule.condition || rule.criterion ? convertApiToQueryBuilder(rule) :
rule
- );
- }
-
- return Object.keys(result).length > 0 ? result : null;
- };
+ };
- const shouldSetCustomFilterParam = (node: TreeNode, key: string) => {
- return (
- node.parent === "BASIC" ||
- node.parent === "ADVANCED" ||
- (node.parent === "BASIC_RELATIONSHIP" &&
- (key === "relationshipName" || key === "limit" || key === "offset"))
- );
- };
+ // Helper function to convert API format filter (criterion/condition) to
query builder format (rules/combinator)
+ const convertApiToQueryBuilder = (apiFilter: any): any => {
+ if (!apiFilter || typeof apiFilter !== "object") {
+ return null;
+ }
- const setCustomFilterParam = (
- searchParams: URLSearchParams,
- key: string,
- value: any
- ) => {
- if (key === "limit") {
- searchParams.set("pageLimit", value || 25);
- } else if (key === "offset") {
- searchParams.set("pageOffset", value);
- } else if (key === "typeName") {
- searchParams.set("type", value);
- } else if (key === "classification") {
- // Map classification to tag parameter for URL (matching classic UI)
- searchParams.set("tag", value);
- } else if (key === "termName") {
- // Map termName (API format) to term parameter for URL (matching classic
UI)
- searchParams.set("term", value);
- } else if (value !== null && value !== undefined && value !== "") {
- // Only set parameter if value is not null, undefined, or empty string
- searchParams.set(key, value);
- }
- };
+ const result: any = {};
- const navigateToPath = (
- node: TreeNode,
- treeName: string,
- searchParams: URLSearchParams,
- navigate: NavigateFunction,
- isEmptyServicetype: boolean | undefined,
- toastId: any
- ) => {
- switch (treeName) {
- case "Business MetaData":
- searchParams.delete("relationshipName");
- navigate(
- { pathname: `administrator/businessMetadata/${node.guid}` },
- { replace: true }
+ // Convert condition to combinator
+ if (apiFilter.condition) {
+ result.combinator = apiFilter.condition.toLowerCase();
+ } else {
+ result.combinator = "and"; // default
+ }
+
+ // Convert criterion to rules
+ if (apiFilter.criterion && Array.isArray(apiFilter.criterion)) {
+ result.rules = apiFilter.criterion.map((rule: any) => {
+ // If nested condition, recurse
+ if (rule.condition || rule.criterion) {
+ return convertApiToQueryBuilder(rule);
+ }
+ // Convert API rule format to query builder format
+ return {
+ field: rule.attributeName || rule.id,
+ operator: rule.operator,
+ value: rule.attributeValue || rule.value,
+ type: rule.type || rule.attributeType
+ };
+ });
+ } else if (apiFilter.rules && Array.isArray(apiFilter.rules)) {
+ // Already in query builder format
+ result.rules = apiFilter.rules.map((rule: any) =>
+ rule.condition || rule.criterion ? convertApiToQueryBuilder(rule) :
rule
);
- break;
- case "Glossary":
- if (!isEmptyServicetype) {
- searchParams.delete("relationshipName");
- navigate(
- {
- pathname: `glossary/${
- node.cGuid !== undefined ? node.cGuid : node.guid
- }`,
- search: searchParams.toString(),
- },
- { replace: true }
- );
- } else if (node.types === "parent") {
- toast.dismiss(toastId.current);
- toastId.current = toast.warning("Create a Term or Category");
- } else {
+ }
+
+ return Object.keys(result).length > 0 ? result : null;
+ };
+
+ const shouldSetCustomFilterParam = (node: TreeNode, key: string) => {
+ return (
+ node.parent === "BASIC" ||
+ node.parent === "ADVANCED" ||
+ (node.parent === "BASIC_RELATIONSHIP" &&
+ (key === "relationshipName" || key === "limit" || key === "offset"))
+ );
+ };
+
+ const setCustomFilterParam = (
+ searchParams: URLSearchParams,
+ key: string,
+ value: any
+ ) => {
+ if (key === "limit") {
+ searchParams.set("pageLimit", value || 25);
+ } else if (key === "offset") {
+ searchParams.set("pageOffset", value);
+ } else if (key === "typeName") {
+ searchParams.set("type", value);
+ } else if (key === "classification") {
+ // Map classification to tag parameter for URL (matching classic UI)
+ searchParams.set("tag", value);
+ } else if (key === "termName") {
+ // Map termName (API format) to term parameter for URL (matching
classic UI)
+ searchParams.set("term", value);
+ } else if (value !== null && value !== undefined && value !== "") {
+ // Only set parameter if value is not null, undefined, or empty string
+ searchParams.set(key, value);
+ }
+ };
+
+ const navigateToPath = (
+ node: TreeNode,
+ treeName: string,
+ searchParams: URLSearchParams,
+ navigate: NavigateFunction,
+ isEmptyServicetype: boolean | undefined,
+ toastId: any
+ ) => {
+ switch (treeName) {
+ case "Business MetaData":
searchParams.delete("relationshipName");
navigate(
- {
- pathname: "/search/searchResult",
- search: searchParams.toString(),
- },
- { replace: true }
- );
- }
- break;
- case "Relationships":
- case "CustomFilters":
- if (
- treeName == "Relationships" ||
- (treeName == "CustomFilters" && node.parent == "BASIC_RELATIONSHIP")
- ) {
- navigate(
- {
- pathname: `relationship/relationshipSearchresult`,
- search: searchParams.toString(),
- },
+ { pathname: `administrator/businessMetadata/${node.guid}` },
{ replace: true }
);
- } else {
+ break;
+ case "Glossary":
+ if (!isEmptyServicetype) {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: `glossary/${node.cGuid !== undefined ? node.cGuid :
node.guid
+ }`,
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ } else if (node.types === "parent") {
+ toast.dismiss(toastId.current);
+ toastId.current = toast.warning("Create a Term or Category");
+ } else {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: "/search/searchResult",
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ }
+ break;
+ case "Relationships":
+ case "CustomFilters":
+ if (
+ treeName == "Relationships" ||
+ (treeName == "CustomFilters" && node.parent ==
"BASIC_RELATIONSHIP")
+ ) {
+ navigate(
+ {
+ pathname: `relationship/relationshipSearchresult`,
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ } else {
+ searchParams.delete("relationshipName");
+ navigate(
+ {
+ pathname: "/search/searchResult",
+ search: searchParams.toString(),
+ },
+ { replace: true }
+ );
+ }
+ break;
+ default:
searchParams.delete("relationshipName");
navigate(
- {
- pathname: "/search/searchResult",
- search: searchParams.toString(),
- },
+ { pathname: "/search/searchResult", search:
searchParams.toString() },
{ replace: true }
);
- }
- break;
- default:
- searchParams.delete("relationshipName");
- navigate(
- { pathname: "/search/searchResult", search: searchParams.toString()
},
- { replace: true }
- );
- break;
- }
- };
-
- const TreeLabelWithTooltip: React.FC<{ label: string }> = ({ label }) => {
- const labelRef = useRef<HTMLSpanElement>(null);
- const [isOverflown, setIsOverflown] = useState(false);
-
- useEffect(() => {
- const el = labelRef.current;
- if (el) {
- setIsOverflown(el.scrollWidth > el.clientWidth);
+ break;
}
- }, [label, searchTerm]);
+ };
- return (
- <LightTooltip title={label} disableHoverListener={!isOverflown}>
- <span
- ref={labelRef}
- className="tree-item-label"
- style={{
- display: "inline-block",
- maxWidth: "100%",
- overflow: "hidden",
- textOverflow: "ellipsis",
- whiteSpace: "nowrap",
- }}
- >
- {highlightText(label)}
- </span>
- </LightTooltip>
- );
- };
+ const TreeLabelWithTooltip: React.FC<{ label: string }> = ({ label }) => {
+ const labelRef = useRef<HTMLSpanElement>(null);
+ const [isOverflown, setIsOverflown] = useState(false);
- const renderTreeItem = (node: TreeNode) =>
- node?.id && (
- <CustomTreeItem
- key={node.id}
- itemId={getNodeId(node)}
- label={
- <div
- {...({
- selectedNodeType: selectedNode.type,
- selectedNodeTag: selectedNode.tag,
- selectedNodeRelationship: selectedNode.relationship,
- selectedNodeBM: selectedNode.businessMetadata,
- node: node.id,
- onClick: (_event: MouseEvent<HTMLElement>) => {
- handleNodeClick(
- node,
- treeName,
- searchParams,
- navigate,
- isEmptyServicetype,
- savedSearchData,
- toastId
- );
- },
- className: "custom-treeitem-label",
- } as any)}
+ useEffect(() => {
+ const el = labelRef.current;
+ if (el) {
+ setIsOverflown(el.scrollWidth > el.clientWidth);
+ }
+ }, [label, searchTerm]);
+
+ return (
+ <LightTooltip title={label} disableHoverListener={!isOverflown}>
+ <span
+ ref={labelRef}
+ className="tree-item-label"
+ style={{
+ whiteSpace: "nowrap",
+ }}
>
- {node.id != "No Records Found" && (
- <TreeIcons
- node={node}
- treeName={treeName}
- isEmptyServicetype={isEmptyServicetype ?? false}
- />
- )}
- <TreeLabelWithTooltip label={node.label} />
- {(treeName == "Entities" ||
- treeName == "Classifications" ||
- treeName == "CustomFilters" ||
- treeName == "Glossary") &&
- node.id != "No Records Found" && (
- <TreeNodeIcons
- node={node}
- treeName={treeName}
- updatedData={refreshData}
- isEmptyServicetype={isEmptyServicetype}
- />
+ {highlightText(label)}
+ </span>
+ </LightTooltip>
+ );
+ };
+
+ const renderTreeItem = (node: TreeNode) =>
+ node?.id && (
+ <CustomTreeItem
+ key={node.id}
+ itemId={getNodeId(node)}
+ label={
+ <HoverableTreeItemContainer
+ {...({
+ selectedNodeType: selectedNode.type,
+ selectedNodeTag: selectedNode.tag,
+ selectedNodeRelationship: selectedNode.relationship,
+ selectedNodeBM: selectedNode.businessMetadata,
+ selectedNodeTerm: selectedNode.term ?
selectedNode.term.split("@")[0] : null,
+ selectedNodeCustomFilter: selectedNode.customFilter,
+ node: treeName === "Classifications" && node.label ?
node.label.split(" (")[0] : node.id,
+ onClick: (_event: MouseEvent<HTMLElement>) => {
+ handleNodeClick(
+ node,
+ treeName,
+ searchParams,
+ navigate,
+ isEmptyServicetype,
+ savedSearchData,
+ toastId
+ );
+ },
+ className: "custom-treeitem-label",
+ } as any)}
+ >
+ {(isHovered: boolean) => (
+ <>
+ {node.id != "No Records Found" && (
+ <TreeIcons
+ node={node}
+ treeName={treeName}
+ isEmptyServicetype={isEmptyServicetype ?? false}
+ />
+ )}
+ <TreeLabelWithTooltip label={node.label} />
+ {(treeName == "Entities" ||
+ treeName == "Classifications" ||
+ treeName == "CustomFilters" ||
+ treeName == "Glossary") &&
+ node.id != "No Records Found" && (
+ <TreeNodeIcons
+ node={node}
+ treeName={treeName}
+ updatedData={refreshData}
+ isEmptyServicetype={isEmptyServicetype}
+ isHovered={isHovered}
+ />
+ )}
+ </>
)}
- </div>
- }
- >
- {node.children && node.children.map((child) => renderTreeItem(child))}
- </CustomTreeItem>
- );
+ </HoverableTreeItemContainer>
+ }
+ >
+ {node.children && node.children.map((child) =>
renderTreeItem(child))}
+ </CustomTreeItem>
+ );
- const downloadFile = async () => {
- try {
- if (treeName == "Glossary") {
- await downloadGlossaryImportTemplate();
- return;
- }
- const apiResp: any = await getBusinessMetadataImportTmpl({});
- const text: string = apiResp ? apiResp.data : "";
- const blob = new Blob([text], { type: "text/plain" });
+ const downloadFile = async () => {
+ try {
+ if (treeName == "Glossary") {
+ await downloadGlossaryImportTemplate();
+ return;
+ }
+ const apiResp: any = await getBusinessMetadataImportTmpl({});
+ const text: string = apiResp ? apiResp.data : "";
+ const blob = new Blob([text], { type: "text/plain" });
- const url = window.URL.createObjectURL(blob);
+ const url = window.URL.createObjectURL(blob);
- const link = document.createElement("a");
- link.href = url;
- link.setAttribute("download", "template_business_metadata");
+ const link = document.createElement("a");
+ link.href = url;
+ link.setAttribute("download", "template_business_metadata");
- document.body.appendChild(link);
+ document.body.appendChild(link);
- link.click();
+ link.click();
- document.body.removeChild(link);
- window.URL.revokeObjectURL(url);
- } catch {
- /* ignore download error */
- }
- };
+ document.body.removeChild(link);
+ window.URL.revokeObjectURL(url);
+ } catch {
+ /* ignore download error */
+ }
+ };
- const label = { inputProps: { "aria-label": "Switch demo" } };
- return (
- <>
- <Stack
- className="sidebar-tree-box"
- sx={{
- ...(sideBarOpen == false && {
- visibility: "hidden !important",
- top: "62px !important",
- }),
- minWidth: "30px",
- width: `100% !important`,
- overflowX: "auto",
- }}
- >
- <SimpleTreeView
- expandedItems={expandedItems}
- onExpandedItemsChange={handleExpandedItemsChange}
- aria-label="customized"
- className="sidebar-treeview"
+ const label = { inputProps: { "aria-label": "Switch demo" } };
+ return (
+ <>
+ <Stack
+ className="sidebar-tree-box"
+ sx={{
+ ...(sideBarOpen == false && {
+ visibility: "hidden !important",
+ top: "62px !important",
+ }),
+ minWidth: "30px",
+ width: `100% !important`,
+ }}
>
- <TreeItem
- itemId={treeName}
- label={
- <Stack
- display="flex"
- alignItems="center"
- flexDirection="row"
- className="tree-item-parent-label"
- >
- <Stack flexGrow={1}>
- <span>{displayTreeName}</span>
- </Stack>
- <Stack direction="row" alignItems="center" gap="0.375rem">
- <LightTooltip title="Refresh">
- <IconButton
- size="small"
- data-cy="refreshTree"
- onClick={(e) => {
- e.stopPropagation();
- refreshData();
- }}
- disabled={loader}
- >
- <RefreshIcon />
- </IconButton>
- </LightTooltip>
-
+ <SimpleTreeView
+ expandedItems={expandedItems}
+ onExpandedItemsChange={handleExpandedItemsChange}
+ aria-label="customized"
+ className="sidebar-treeview"
+ >
+ <TreeItem
+ itemId={treeName}
+ label={
+ <Stack
+ display="flex"
+ alignItems="center"
+ flexDirection="row"
+ className="tree-item-parent-label"
+ >
+ <Stack flexGrow={1} direction="row" alignItems="center"
gap="12px">
+ {treeName === "Entities" && <img
src="/img/sidebar-icons/icon-entities.svg" style={{ width: "20px", height:
"20px", opacity: 1 }} alt="" />}
+ {treeName === "Classifications" && <img
src="/img/sidebar-icons/icon-classifications.svg" style={{ width: "20px",
height: "20px", opacity: 1 }} alt="" />}
+ {treeName === "Business MetaData" && <img
src="/img/sidebar-icons/icon-business-metadata.svg" style={{ width: "20px",
height: "20px", opacity: 1 }} alt="" />}
+ {treeName === "Glossary" && <img
src="/img/sidebar-icons/icon-glossary.svg" style={{ width: "20px", height:
"20px", opacity: 1 }} alt="" />}
+ {treeName === "CustomFilters" && <img
src="/img/sidebar-icons/icon-custom-filters.svg" style={{ width: "20px",
height: "20px", opacity: 1 }} alt="" />}
+ <Typography sx={{ fontWeight: "500", fontSize: "14px",
color: "rgba(255, 255, 255, 0.9)", whiteSpace: "nowrap", overflow: "hidden",
textOverflow: "ellipsis" }}>{displayTreeName}</Typography>
+ </Stack>
+ <Stack direction="row" alignItems="center" gap="0.375rem">
+ <LightTooltip title="Refresh">
+ <IconButton
+ size="small"
+ data-cy="refreshTree"
+ onClick={(e) => {
+ e.stopPropagation();
+ refreshData();
+ }}
+ disabled={loader}
+ >
+ <RefreshIcon />
+ </IconButton>
+ </LightTooltip>
- {(treeName == "Entities" ||
- treeName == "Classifications" ||
- treeName == "Glossary") && (
- <>
- {
- <LightTooltip title={getEmptyTypesTitle()}>
- <AntSwitch
- {...label}
- size="small"
- onClick={(e: { stopPropagation: () => void }) => {
- e.stopPropagation();
- if (setisEmptyServicetype) {
- setisEmptyServicetype(!isEmptyServicetype);
- }
- }}
- data-cy="showEmptyServiceType"
- inputProps={{ "aria-label": "ant design" }}
- />
- </LightTooltip>
- }
- </>
- )}
- {(treeName == "Entities" ||
- treeName == "Classifications" ||
- treeName == "Glossary") && (
- <MoreVertIcon
- onClick={(e: any) => {
- e.stopPropagation();
- handleClickMenu(e);
- }}
- data-cy="dropdownMenuButton"
- fontSize="small"
- />
- )}
+ {(treeName == "Entities" ||
+ treeName == "Classifications" ||
+ treeName == "Glossary") && (
+ <>
+ {
+ <LightTooltip title={getEmptyTypesTitle()}>
+ <AntSwitch
+ {...label}
+ size="small"
+ onClick={(e: { stopPropagation: () => void })
=> {
+ e.stopPropagation();
+ if (setisEmptyServicetype) {
+ setisEmptyServicetype(!isEmptyServicetype);
+ }
+ }}
+ data-cy="showEmptyServiceType"
+ inputProps={{ "aria-label": "ant design" }}
+ />
+ </LightTooltip>
+ }
+ </>
+ )}
+
+ {(treeName == "Entities" ||
+ treeName == "Classifications" ||
+ treeName == "Glossary") && (
+ <MoreVertIcon
+ onClick={(e: any) => {
+ e.stopPropagation();
+ handleClickMenu(e);
+ }}
+ data-cy="dropdownMenuButton"
+ fontSize="small"
+ />
+ )}
- {treeName == "Business MetaData" && (
- <LightTooltip title="Open Businesss Metadata">
- <LaunchOutlinedIcon
- fontSize="small"
+ {treeName == "Business MetaData" && (
+ <LightTooltip title="Open Businesss Metadata">
Review Comment:
Typo: "Open Businesss Metadata" (3 s's)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
