diff --git a/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx b/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx index 4093a8feb39a1..30103dafa566c 100644 --- a/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx +++ b/superset-frontend/src/SqlLab/components/QueryHistory/index.tsx @@ -42,7 +42,7 @@ interface QueryHistoryProps { const StyledEmptyStateWrapper = styled.div` height: 100%; - .ant-empty-image img { + .antd5-empty-image img { margin-right: 28px; } diff --git a/superset-frontend/src/SqlLab/components/SouthPane/Results.tsx b/superset-frontend/src/SqlLab/components/SouthPane/Results.tsx index 221583718cd10..3dfec40bdc037 100644 --- a/superset-frontend/src/SqlLab/components/SouthPane/Results.tsx +++ b/superset-frontend/src/SqlLab/components/SouthPane/Results.tsx @@ -37,7 +37,7 @@ type Props = { const StyledEmptyStateWrapper = styled.div` height: 100%; - .ant-empty-image img { + .antd5-empty-image img { margin-right: 28px; } diff --git a/superset-frontend/src/components/EmptyState/Empty.test.tsx b/superset-frontend/src/components/EmptyState/Empty.test.tsx new file mode 100644 index 0000000000000..7c9ace0fc8124 --- /dev/null +++ b/superset-frontend/src/components/EmptyState/Empty.test.tsx @@ -0,0 +1,26 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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 { render } from 'spec/helpers/testing-library'; +import { Empty } from './Empty'; + +test('should render', () => { + const { container } = render(); + expect(container).toBeInTheDocument(); +}); diff --git a/superset-frontend/src/components/EmptyState/Empty.tsx b/superset-frontend/src/components/EmptyState/Empty.tsx new file mode 100644 index 0000000000000..b507027c64dfc --- /dev/null +++ b/superset-frontend/src/components/EmptyState/Empty.tsx @@ -0,0 +1,29 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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 { Empty as AntdEmpty } from 'antd-v5'; +import { EmptyProps } from 'antd-v5/es/empty'; + +export const Empty = Object.assign( + (props: EmptyProps) => , + { + PRESENTED_IMAGE_SIMPLE: AntdEmpty.PRESENTED_IMAGE_SIMPLE, + PRESENTED_IMAGE_DEFAULT: AntdEmpty.PRESENTED_IMAGE_DEFAULT, + }, +); diff --git a/superset-frontend/src/components/EmptyState/index.tsx b/superset-frontend/src/components/EmptyState/index.tsx index 9eb3d9e9d7ae9..edc13e622fa34 100644 --- a/superset-frontend/src/components/EmptyState/index.tsx +++ b/superset-frontend/src/components/EmptyState/index.tsx @@ -23,8 +23,8 @@ import { MouseEventHandler as ReactMouseEventHandler, } from 'react'; import { styled, css, SupersetTheme, t } from '@superset-ui/core'; -import { Empty } from 'src/components'; import Button from 'src/components/Button'; +import { Empty } from './Empty'; export enum EmptyStateSize { Small, @@ -60,7 +60,7 @@ const EmptyStateContainer = styled.div` padding: ${theme.gridUnit * 4}px; text-align: center; - & .ant-empty-image svg { + & .antd5-empty-image svg { width: auto; } diff --git a/superset-frontend/src/components/ListView/ListView.test.jsx b/superset-frontend/src/components/ListView/ListView.test.jsx index 35bd2ca071202..64869ad67acd8 100644 --- a/superset-frontend/src/components/ListView/ListView.test.jsx +++ b/superset-frontend/src/components/ListView/ListView.test.jsx @@ -22,7 +22,7 @@ import { QueryParamProvider } from 'use-query-params'; import { supersetTheme, ThemeProvider } from '@superset-ui/core'; import Button from 'src/components/Button'; -import { Empty } from 'src/components'; +import { Empty } from 'src/components/EmptyState/Empty'; import CardCollection from 'src/components/ListView/CardCollection'; import { CardSortSelect } from 'src/components/ListView/CardSortSelect'; import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox'; diff --git a/superset-frontend/src/components/ListView/ListView.tsx b/superset-frontend/src/components/ListView/ListView.tsx index c9a39e71754fe..30bcb99aa3b98 100644 --- a/superset-frontend/src/components/ListView/ListView.tsx +++ b/superset-frontend/src/components/ListView/ListView.tsx @@ -67,8 +67,8 @@ const ListViewStyles = styled.div` overflow-x: auto; } - .ant-empty { - .ant-empty-image { + .antd5-empty { + .antd5-empty-image { height: auto; } } diff --git a/superset-frontend/src/components/TableView/TableView.tsx b/superset-frontend/src/components/TableView/TableView.tsx index e5879baf6d561..ff5e00337e726 100644 --- a/superset-frontend/src/components/TableView/TableView.tsx +++ b/superset-frontend/src/components/TableView/TableView.tsx @@ -20,7 +20,7 @@ import { memo, useEffect, useRef } from 'react'; import { isEqual } from 'lodash'; import { styled, t } from '@superset-ui/core'; import { useFilters, usePagination, useSortBy, useTable } from 'react-table'; -import { Empty } from 'src/components'; +import { Empty } from 'src/components/EmptyState/Empty'; import Pagination from 'src/components/Pagination'; import TableCollection from 'src/components/TableCollection'; import { SortByType, ServerPagination } from './types'; diff --git a/superset-frontend/src/components/index.ts b/superset-frontend/src/components/index.ts index 3bde8dfc46da9..95095a4a721a5 100644 --- a/superset-frontend/src/components/index.ts +++ b/superset-frontend/src/components/index.ts @@ -34,7 +34,6 @@ export { default as Card } from './Card'; export { AutoComplete, Col, - Empty, Grid, Row, Skeleton, diff --git a/superset-frontend/src/features/home/EmptyState.tsx b/superset-frontend/src/features/home/EmptyState.tsx index 0eac712cccd80..cbcede55ecad2 100644 --- a/superset-frontend/src/features/home/EmptyState.tsx +++ b/superset-frontend/src/features/home/EmptyState.tsx @@ -18,7 +18,7 @@ */ import { Link } from 'react-router-dom'; import Button from 'src/components/Button'; -import { Empty } from 'src/components'; +import { Empty } from 'src/components/EmptyState/Empty'; import { TableTab } from 'src/views/CRUD/types'; import { styled, t } from '@superset-ui/core'; import { WelcomeTable } from './types';