Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion openmetadata-ui/pom.xml
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@
<phase>prepare-package</phase>
<configuration>
<yarnInheritsProxyConfigFromMaven>${yarnInheritsProxyConfigFromMaven}</yarnInheritsProxyConfigFromMaven>
<arguments>install --frozen-lockfile</arguments>
<arguments>install --frozen-lockfile --prefer-offline</arguments>
</configuration>
</execution>
<execution>
Expand Down
4 changes: 2 additions & 2 deletions openmetadata-ui/src/main/resources/ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"build": "vite build",
"preview": "vite preview",
"postinstall": "yarn run build-check",
"preinstall": "cd ../../../../.. && yarn install --frozen-lockfile && cd openmetadata-ui-core-components/src/main/resources/ui && yarn install && yarn build",
"preinstall": "cd ../../../../.. && yarn install --frozen-lockfile --prefer-offline && cd openmetadata-ui-core-components/src/main/resources/ui && yarn install --prefer-offline && yarn build",
"pre-commit": "lint-staged --concurrent false",
"test": "jest --passWithNoTests",
"prepare": "cd ../../../../.. && husky install openmetadata-ui/src/main/resources/ui/.husky",
Expand Down Expand Up @@ -165,6 +165,7 @@
"@babel/plugin-transform-runtime": "^7.14.5",
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"@eslint/js": "^9.18.0",
"@estruyf/github-actions-reporter": "^1.7.0",
"@playwright/test": "1.57.0",
"@testing-library/jest-dom": "^5.11.10",
Expand Down Expand Up @@ -197,7 +198,6 @@
"@types/use-analytics": "^0.0.0",
"@typescript-eslint/eslint-plugin": "^8.20.0",
"@typescript-eslint/parser": "^8.20.0",
"@eslint/js": "^9.18.0",
"@vitejs/plugin-react": "^5.0.1",
"babel-eslint": "^10.1.0",
"babel-jest": "^29.7.0",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
@import (reference) 'antd/dist/antd.variable.less';
@import (reference) '../../../styles/variables.less';

.grid-container {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
*/

@import (reference) '../../../styles/variables.less';
@import (reference) '../../../styles/components/card.less';

.entity-right-panel-vertical-nav {
&.drawer-entity-right-panel-vertical-nav {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
*/

@import (reference) '../../../styles/variables.less';
@import (reference) '../../../styles/components/card.less';

.entity-summary-panel-container,
.column-detail-panel-container {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,15 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { FC, useMemo } from 'react';
import { FC, lazy, Suspense, useMemo } from 'react';
import { useLocation } from 'react-router-dom';
import LineageProvider from '../../../context/LineageProvider/LineageProvider';
import { EntityType } from '../../../enums/entity.enum';
import Loader from '../../common/Loader/Loader';
import LineageTable from '../../LineageTable/LineageTable';
import { SourceType } from '../../SearchedData/SearchedData.interface';
import Lineage from '../Lineage.component';

const Lineage = lazy(() => import('../Lineage.component'));

interface EntityLineageTabProps {
deleted: boolean;
Expand All @@ -43,12 +45,14 @@ export const EntityLineageTab: FC<EntityLineageTabProps> = ({

const lineageTab = useMemo(
() => (
<Lineage
deleted={deleted}
entity={entity}
entityType={entityType}
hasEditAccess={hasEditAccess}
/>
<Suspense fallback={<Loader />}>
<Lineage
deleted={deleted}
entity={entity}
entityType={entityType}
hasEditAccess={hasEditAccess}
/>
</Suspense>
),
[deleted, entity, entityType, hasEditAccess]
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,14 @@ import { DefaultOptionType } from 'antd/lib/select';
import { AxiosError } from 'axios';
import { debounce, startCase } from 'lodash';
import QueryString from 'qs';
import { useCallback, useEffect, useMemo, useState } from 'react';
import {
lazy,
Suspense,
useCallback,
useEffect,
useMemo,
useState,
} from 'react';
import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom';
import { ReactComponent as DownloadIcon } from '../../assets/svg/ic-download.svg';
Expand All @@ -29,7 +36,6 @@ import { useEntityExportModalProvider } from '../../components/Entity/EntityExpo
import { LineageConfig } from '../../components/Entity/EntityLineage/EntityLineage.interface';
import EntitySuggestionOption from '../../components/Entity/EntityLineage/EntitySuggestionOption/EntitySuggestionOption.component';
import LineageConfigModal from '../../components/Entity/EntityLineage/LineageConfigModal';
import Lineage from '../../components/Lineage/Lineage.component';
import { StyledIconButton } from '../../components/LineageTable/LineageTable.styled';
import PageHeader from '../../components/PageHeader/PageHeader.component';
import PageLayoutV1 from '../../components/PageLayoutV1/PageLayoutV1';
Expand Down Expand Up @@ -74,6 +80,10 @@ import { showErrorToast } from '../../utils/ToastUtils';
import { useRequiredParams } from '../../utils/useRequiredParams';
import './platform-lineage.less';

const Lineage = lazy(
() => import('../../components/Lineage/Lineage.component')
);

const PlatformLineage = () => {
const { t } = useTranslation();
const navigate = useNavigate();
Expand Down Expand Up @@ -299,15 +309,17 @@ const PlatformLineage = () => {

return (
<LineageProvider>
<Lineage
isPlatformLineage
entity={selectedEntity}
entityType={entityType}
hasEditAccess={
permissions?.EditAll || permissions?.EditLineage || false
}
platformHeader={header}
/>
<Suspense fallback={<Loader />}>
<Lineage
isPlatformLineage
entity={selectedEntity}
entityType={entityType}
hasEditAccess={
permissions?.EditAll || permissions?.EditLineage || false
}
platformHeader={header}
/>
</Suspense>
</LineageProvider>
);
}, [selectedEntity, loading, permissions, entityType, header]);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,18 @@
* limitations under the License.
*/

import { useEffect, useState } from 'react';
import { lazy, Suspense, useEffect, useState } from 'react';
import Loader from '../../components/common/Loader/Loader';
import {
GRAPH_BACKGROUND_COLOR,
TEXT_BODY_COLOR,
} from '../../constants/constants';
import { useApplicationStore } from '../../hooks/useApplicationStore';
import { getOidcToken } from '../../utils/SwTokenStorageUtils';
import RapiDocReact from './RapiDocReact';
import './swagger.less';

const RapiDocReact = lazy(() => import('./RapiDocReact'));

const SwaggerPage = () => {
const { theme } = useApplicationStore();
const [idToken, setIdToken] = useState<string>('');
Expand All @@ -46,24 +47,26 @@ const SwaggerPage = () => {
className="container-fluid"
data-testid="fluid-container"
id="doc-container">
<RapiDocReact
allow-spec-file-download
api-key-location="header"
api-key-name="Authorization"
api-key-value={apiKeyValue}
font-size="large"
nav-bg-color={GRAPH_BACKGROUND_COLOR}
nav-item-spacing="compact"
nav-text-color={TEXT_BODY_COLOR}
primary-color={theme.primaryColor}
regular-font="Open Sans"
render-style="focused"
show-header={false}
show-method-in-nav-bar="as-colored-block"
spec-url="./swagger.json"
text-color={TEXT_BODY_COLOR}
theme="light"
/>
<Suspense fallback={<Loader />}>
<RapiDocReact
allow-spec-file-download
api-key-location="header"
api-key-name="Authorization"
api-key-value={apiKeyValue}
font-size="large"
nav-bg-color={GRAPH_BACKGROUND_COLOR}
nav-item-spacing="compact"
nav-text-color={TEXT_BODY_COLOR}
primary-color={theme.primaryColor}
regular-font="Open Sans"
render-style="focused"
show-header={false}
show-method-in-nav-bar="as-colored-block"
spec-url="./swagger.json"
text-color={TEXT_BODY_COLOR}
theme="light"
/>
</Suspense>
</div>
);
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
*/

@import (reference) '../variables.less';
@import (reference) 'antd/dist/antd.less';

.page-layout-v1-vertical-scroll {
height: calc(100vh - @om-navbar-height);
Expand Down
35 changes: 20 additions & 15 deletions openmetadata-ui/src/main/resources/ui/src/utils/TableUtils.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,6 @@ import SchemaTable from '../components/Database/SchemaTable/SchemaTable.componen
import TableQueries from '../components/Database/TableQueries/TableQueries';
import { ContractTab } from '../components/DataContract/ContractTab/ContractTab';
import { useEntityExportModalProvider } from '../components/Entity/EntityExportModalProvider/EntityExportModalProvider.component';
import KnowledgeGraph from '../components/KnowledgeGraph/KnowledgeGraph';
import { SourceType } from '../components/SearchedData/SearchedData.interface';
import { NON_SERVICE_TYPE_ASSETS } from '../constants/Assets.constants';
import { FQN_SEPARATOR_CHAR } from '../constants/char.constants';
Expand Down Expand Up @@ -204,6 +203,10 @@ import { TableDetailPageTabProps } from './TableClassBase';
import { TableFieldsInfoCommonEntities } from './TableUtils.interface';
import { extractTopicFields } from './TopicDetailsUtils';

const KnowledgeGraph = lazy(
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚨 **Bug:** Missing `lazy` and `Suspense` imports in TableUtils.tsx

The file uses lazy() to import KnowledgeGraph at line 206 and wraps it with <Suspense> at line 1004, but the diff doesn't show the necessary React imports being added.

Looking at other files in this PR (EntityLineageTab.tsx, PlatformLineage.tsx, SwaggerPage/index.tsx), they all properly add lazy and Suspense to their React imports. However, TableUtils.tsx is missing this change.

Impact: This will cause a build/runtime error as lazy and Suspense are undefined.

Suggested fix: Add lazy and Suspense to the React imports at the top of TableUtils.tsx:

import { lazy, Suspense } from 'react';

Or if React is already imported:

import React, { lazy, Suspense } from 'react';

Was this helpful? React with 👍 / 👎

() => import('../components/KnowledgeGraph/KnowledgeGraph')
);

const EntityLineageTab = lazy(() =>
import('../components/Lineage/EntityLineageTab/EntityLineageTab').then(
(module) => ({ default: module.EntityLineageTab })
Expand Down Expand Up @@ -998,20 +1001,22 @@ export const getTableDetailPageBaseTabs = ({
),
key: EntityTabs.KNOWLEDGE_GRAPH,
children: (
<KnowledgeGraph
depth={2}
entity={
tableDetails
? {
id: tableDetails.id,
name: tableDetails.name,
fullyQualifiedName: tableDetails.fullyQualifiedName,
type: EntityType.TABLE,
}
: undefined
}
entityType={EntityType.TABLE}
/>
<Suspense fallback={<Loader />}>
<KnowledgeGraph
depth={2}
entity={
tableDetails
? {
id: tableDetails.id,
name: tableDetails.name,
fullyQualifiedName: tableDetails.fullyQualifiedName,
type: EntityType.TABLE,
}
: undefined
}
entityType={EntityType.TABLE}
/>
</Suspense>
),
isHidden: !useApplicationStore.getState().rdfEnabled,
},
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
/*
* Copyright 2025 Collate.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

import fs from 'fs';
import { transform as svgrTransform } from '@svgr/core';
import jsxPlugin from '@svgr/plugin-jsx';
import { Plugin, transformWithEsbuild } from 'vite';

export default function viteSvgrOptimized(): Plugin {
return {
name: 'vite-plugin-svgr-optimized',
enforce: 'pre',

async transform(code, id) {
// Early exit for non-SVG files
if (!id.endsWith('.svg')) {
return null;
}

if (id.includes('node_modules')) {
return null;
}

const cleanId = id.replace(/[?#].*$/s, '');

try {
const svgCode = await fs.promises.readFile(cleanId, 'utf8');

const componentCode = await svgrTransform(
svgCode,
{
ref: true,
exportType: 'named',
svgo: true,
titleProp: true,
plugins: ['@svgr/plugin-jsx'],
},
{
filePath: cleanId,
caller: {
previousExport: code,
defaultPlugins: [jsxPlugin],
},
}
);

const res = await transformWithEsbuild(componentCode, id, {
loader: 'jsx',
jsx: 'automatic',
});

return {
code: res.code,
map: res.map,
};
} catch (error) {
this.error(`Failed to transform SVG: ${id}\n${error}`);
}
},
};
}
Loading
Loading