diff --git a/.github/workflows/build-npm.yml b/.github/workflows/build-npm.yml
index bdd2d405..d6473eb3 100644
--- a/.github/workflows/build-npm.yml
+++ b/.github/workflows/build-npm.yml
@@ -93,7 +93,7 @@ jobs:
comment_title: Jest Unit Test Statistics
- name: Publish Jest coverage report
- uses: actions/upload-artifact@v2
+ uses: actions/upload-artifact@v4
if: always()
with:
name: jest-coverage-report
@@ -101,7 +101,7 @@ jobs:
retention-days: 30
- name: Publish yarn.lock
- uses: actions/upload-artifact@v2
+ uses: actions/upload-artifact@v4
if: failure()
with:
name: yarn.lock
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 833a0e1b..398cc5c6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@
* [UIPQB-112](https://folio-org.atlassian.net/browse/UIPQB-112) Query builder: Accessibility: Not equal operator value is not read by screenreader
* [UIPQB-119](https://folio-org.atlassian.net/browse/UIPQB-119) Filter column names
* [UIPQB-79](https://folio-org.atlassian.net/browse/UIPQB-79) Update available operators for arrays
+* [UIPQB-131](https://folio-org.atlassian.net/browse/UIPQB-131) Columns and empty area display in the list details page, when we refresh the page 1st time or duplicate the list
## [1.1.4](https://github.com/folio-org/ui-plugin-query-builder/tree/v1.1.4) (2024-04-02)
diff --git a/src/QueryBuilder/ResultViewer/ResultViewer.js b/src/QueryBuilder/ResultViewer/ResultViewer.js
index f400c7a1..73d5b3dd 100644
--- a/src/QueryBuilder/ResultViewer/ResultViewer.js
+++ b/src/QueryBuilder/ResultViewer/ResultViewer.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import { Col, Row, Accordion, MultiColumnList, Headline, Layout, Icon } from '@folio/stripes/components';
import { PrevNextPagination } from '@folio/stripes-acq-components';
import { useIntl } from 'react-intl';
+import { isEmpty } from 'lodash';
import { QueryLoader } from './QueryLoader';
import { useAsyncDataSource } from '../../hooks/useAsyncDataSource';
import { usePagination } from '../../hooks/usePagination';
@@ -116,31 +117,36 @@ export const ResultViewer = ({
);
};
- const emptyResultMessage = isListLoading ?
-
- :
- intl.formatMessage({ id: 'ui-plugin-query-builder.result.emptyMessage' });
+ const emptyResultMessage = intl.formatMessage(
+ { id: 'ui-plugin-query-builder.result.emptyMessage' },
+ );
const renderTable = () => {
+ const showSpinner = isListLoading && isEmpty(contentData);
+
return (
-
+ {showSpinner ? (
+
+ ) : (
+
+ )}
{showPagination && (
{renderHeader()}
{renderAdditionalControls()}
- {!!Object.keys(columnMapping).length && renderTable()}
+ {!isEmpty(columnMapping) && renderTable()}
>
);
};