diff --git a/CHANGELOG.md b/CHANGELOG.md
index d83e4694..5fe3af94 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -43,6 +43,7 @@
* [UIBULKED-367](https://issues.folio.org/browse/UIBULKED-367) Logs - Provide a link to file with identifiers of the records affected by query.
* [UIBULKED-412](https://issues.folio.org/browse/UIBULKED-412) Not all but up to 10 note types are displayed in Bulk edit.
* [UIBULKED-411](https://issues.folio.org/browse/UIBULKED-411) Refactoring of ListFilters component
+* [UIBULKED-404](https://issues.folio.org/browse/UIBULKED-404) Render preview after query executed.
## [4.0.0](https://github.com/folio-org/ui-bulk-edit/tree/v4.0.0) (2023-10-12)
@@ -95,7 +96,6 @@
* [UIBULKED-352](https://issues.folio.org/browse/UIBULKED-352) Localize numbers displayed in bulk edit
* [UIBULKED-210](https://issues.folio.org/browse/UIBULKED-210) Improve user errors for invalid data - IncorrectTokenCountException error.
-
## [3.0.5](https://github.com/folio-org/ui-bulk-edit/tree/v3.0.5) (2023-03-22)
* [UIBULKED-264](https://issues.folio.org/browse/UIBULKED-264) "Download matched records (CSV)" option is enabled on the confirmation screen
diff --git a/package.json b/package.json
index a482f117..ba2717f2 100644
--- a/package.json
+++ b/package.json
@@ -143,7 +143,8 @@
"fqm.entityTypes.item.columnValues.get",
"fqm.query.async.results.get",
"fqm.query.async.post",
- "fqm.query.async.delete"
+ "fqm.query.async.delete",
+ "bulk-operations.item.query.post"
],
"visible": true
}
diff --git a/src/components/BulkEditActionMenu/BulkEditActionMenu.js b/src/components/BulkEditActionMenu/BulkEditActionMenu.js
index 5560dee7..c813c73e 100644
--- a/src/components/BulkEditActionMenu/BulkEditActionMenu.js
+++ b/src/components/BulkEditActionMenu/BulkEditActionMenu.js
@@ -21,6 +21,7 @@ import {
BULK_VISIBLE_COLUMNS,
FILE_SEARCH_PARAMS,
FILE_TO_LINK,
+ CRITERIA,
} from '../../constants';
import {
useBulkPermissions,
@@ -43,8 +44,12 @@ const BulkEditActionMenu = ({
const perms = useBulkPermissions();
const search = new URLSearchParams(location.search);
const capability = search.get('capabilities');
+ const criteria = search.get('criteria');
+ const queryRecordType = search.get('queryRecordType');
const step = search.get('step');
+ const key = criteria === CRITERIA.QUERY ? queryRecordType : capability;
+
const [columnSearch, setColumnSearch] = useState('');
const {
@@ -60,10 +65,10 @@ const BulkEditActionMenu = ({
const [fileInfo, setFileInfo] = useState(null);
- const hasEditPerm = (hasHoldingsInventoryEdit && capability === CAPABILITIES.HOLDING)
- || (hasItemInventoryEdit && capability === CAPABILITIES.ITEM)
- || (hasUserEditInAppPerm && capability === CAPABILITIES.USER)
- || (hasInstanceInventoryEdit && capability === CAPABILITIES.INSTANCE);
+ const hasEditPerm = (hasHoldingsInventoryEdit && key === CAPABILITIES.HOLDING)
+ || (hasItemInventoryEdit && key === CAPABILITIES.ITEM)
+ || (hasUserEditInAppPerm && key === CAPABILITIES.USER)
+ || (hasInstanceInventoryEdit && key === CAPABILITIES.INSTANCE);
useFileDownload({
@@ -96,7 +101,7 @@ const BulkEditActionMenu = ({
const columnsOptions = columns.map(item => ({
...item,
- label: item.ignoreTranslation ? item.label : intl.formatMessage({ id: `ui-bulk-edit.columns.${capability}.${item.label}` }),
+ label: item.ignoreTranslation ? item.label : intl.formatMessage({ id: `ui-bulk-edit.columns.${key}.${item.label}` }),
disabled: isLastUnselectedColumn(item.value) || !countOfRecords,
}));
diff --git a/src/components/BulkEditList/BulkEditListResult/BulkEditInApp/BulkEditInApp.js b/src/components/BulkEditList/BulkEditListResult/BulkEditInApp/BulkEditInApp.js
index 3527a1b6..0f25737c 100644
--- a/src/components/BulkEditList/BulkEditListResult/BulkEditInApp/BulkEditInApp.js
+++ b/src/components/BulkEditList/BulkEditListResult/BulkEditInApp/BulkEditInApp.js
@@ -13,6 +13,7 @@ import { BulkEditInAppTitle } from './BulkEditInAppTitle/BulkEditInAppTitle';
import { ContentUpdatesForm } from './ContentUpdatesForm/ContentUpdatesForm';
import {
CAPABILITIES,
+ CRITERIA,
getHoldingsOptions,
getInstanceOptions,
getItemsOptions,
@@ -29,6 +30,9 @@ export const BulkEditInApp = ({
const intl = useIntl();
const location = useLocation();
const search = new URLSearchParams(location.search);
+ const criteria = search.get('criteria');
+ const queryRecordType = search.get('queryRecordType');
+ const key = criteria === CRITERIA.QUERY ? queryRecordType : capabilities;
const fileUploadedName = search.get('fileName');
const isItemCapability = capabilities === CAPABILITIES.ITEM;
@@ -44,7 +48,7 @@ export const BulkEditInApp = ({
[CAPABILITIES.INSTANCE]: getInstanceOptions(intl.formatMessage),
};
- const options = optionsMap[capabilities];
+ const options = optionsMap[key];
const showContentUpdatesForm = options && !isItemNotesLoading && !isHoldingsNotesLoading;
const sortedOptions = sortAlphabetically(options, intl.formatMessage({ id:'ui-bulk-edit.options.placeholder' }));
diff --git a/src/components/BulkEditList/BulkEditListResult/Preview/Preview.js b/src/components/BulkEditList/BulkEditListResult/Preview/Preview.js
index 9b4ec17c..5022bd02 100644
--- a/src/components/BulkEditList/BulkEditListResult/Preview/Preview.js
+++ b/src/components/BulkEditList/BulkEditListResult/Preview/Preview.js
@@ -1,11 +1,14 @@
+import React from 'react';
import { FormattedMessage } from 'react-intl';
+import { useLocation } from 'react-router-dom';
+import PropTypes from 'prop-types';
+
import {
Headline,
AccordionStatus,
MessageBanner,
} from '@folio/stripes/components';
-import PropTypes from 'prop-types';
-import { useLocation } from 'react-router-dom';
+
import css from './Preview.css';
import { PreviewAccordion } from './PreviewAccordion';
import { ErrorsAccordion } from './ErrorsAccordion';
@@ -14,16 +17,22 @@ import {
useErrorsPreview,
useRecordsPreview
} from '../../../../hooks/api';
-
-import { EDITING_STEPS, PAGINATION_CONFIG } from '../../../../constants';
+import {
+ CRITERIA,
+ EDITING_STEPS,
+ PAGINATION_CONFIG
+} from '../../../../constants';
import { usePagination } from '../../../../hooks/usePagination';
import { useBulkOperationStats } from '../../../../hooks/useBulkOperationStats';
+import { NoResultsMessage } from '../NoResultsMessage/NoResultsMessage';
export const Preview = ({ id, title, isInitial, bulkDetails }) => {
const location = useLocation();
const search = new URLSearchParams(location.search);
const step = search.get('step');
const capabilities = search.get('capabilities');
+ const queryRecordType = search.get('queryRecordType');
+ const criteria = search.get('criteria');
const totalRecords = step === EDITING_STEPS.COMMIT ? bulkDetails?.processedNumOfRecords : bulkDetails?.matchedNumOfRecords;
@@ -44,6 +53,8 @@ export const Preview = ({ id, title, isInitial, bulkDetails }) => {
id,
step,
capabilities,
+ criteria,
+ queryRecordType,
...pagination,
});
@@ -51,6 +62,9 @@ export const Preview = ({ id, title, isInitial, bulkDetails }) => {
const errors = data?.errors || [];
+ if (!((bulkDetails.fqlQuery && criteria === CRITERIA.QUERY) || (criteria !== CRITERIA.QUERY && !bulkDetails.fqlQuery))) {
+ return ;
+ }
return (
@@ -95,7 +109,6 @@ export const Preview = ({ id, title, isInitial, bulkDetails }) => {
/>
)}
-
);
@@ -112,5 +125,6 @@ Preview.propTypes = {
processedNumOfRecords: PropTypes.number,
matchedNumOfErrors: PropTypes.number,
committedNumOfErrors: PropTypes.number,
+ fqlQuery: PropTypes.string
}),
};
diff --git a/src/components/BulkEditList/BulkEditListResult/Preview/Preview.test.js b/src/components/BulkEditList/BulkEditListResult/Preview/Preview.test.js
index 10748007..d5c2dcd5 100644
--- a/src/components/BulkEditList/BulkEditListResult/Preview/Preview.test.js
+++ b/src/components/BulkEditList/BulkEditListResult/Preview/Preview.test.js
@@ -1,7 +1,7 @@
import { MemoryRouter } from 'react-router';
import { QueryClientProvider } from 'react-query';
-import { render, screen } from '@testing-library/react';
+import { logDOM, render, screen } from '@testing-library/react';
import { useOkapiKy } from '@folio/stripes/core';
import { runAxeTest } from '@folio/stripes-testing';
@@ -12,6 +12,7 @@ import { queryClient } from '../../../../../test/jest/utils/queryClient';
import { RootContext } from '../../../../context/RootContext';
import { Preview } from './Preview';
+import { CRITERIA } from '../../../../constants';
jest.mock('./PreviewAccordion', () => ({
PreviewAccordion: () => 'PreviewAccordion',
@@ -27,9 +28,9 @@ const defaultProps = {
id: bulkOperation.id,
};
-const renderPreview = (props = defaultProps) => {
+const renderPreview = (props = defaultProps, criteria = 'query') => {
render(
-
+
@@ -87,4 +88,17 @@ describe('Preview Query', () => {
rootNode: document.body,
});
});
+ it('should render with no axe errors', async () => {
+ renderPreview();
+
+ await runAxeTest({
+ rootNode: document.body,
+ });
+ });
+
+ it('should render no message', async () => {
+ renderPreview(defaultProps, CRITERIA.IDENTIFIER);
+
+ logDOM();
+ });
});
diff --git a/src/components/BulkEditList/BulkEditListResult/PreviewContainer/PreviewContainer.js b/src/components/BulkEditList/BulkEditListResult/PreviewContainer/PreviewContainer.js
index fa5eef26..839933c2 100644
--- a/src/components/BulkEditList/BulkEditListResult/PreviewContainer/PreviewContainer.js
+++ b/src/components/BulkEditList/BulkEditListResult/PreviewContainer/PreviewContainer.js
@@ -1,11 +1,20 @@
import React, { useMemo } from 'react';
import { useIntl } from 'react-intl';
-import { useLocation, useParams } from 'react-router';
+import {
+ useLocation,
+ useParams
+} from 'react-router';
-import { Layout, Loading } from '@folio/stripes/components';
+import {
+ Layout,
+ Loading
+} from '@folio/stripes/components';
import { useBulkOperationDetails } from '../../../../hooks/api';
-import { CRITERIA, EDITING_STEPS } from '../../../../constants';
+import {
+ CRITERIA,
+ EDITING_STEPS
+} from '../../../../constants';
import { Preview } from '../Preview/Preview';
import { NoResultsMessage } from '../NoResultsMessage/NoResultsMessage';
@@ -18,21 +27,20 @@ const PreviewContainer = () => {
const step = search.get('step');
const fileUploadedName = search.get('fileName');
const capabilities = search.get('capabilities')?.toLocaleLowerCase();
- const queryText = search.get('queryText');
const criteria = search.get('criteria');
const { id } = useParams();
const { bulkDetails, isLoading } = useBulkOperationDetails({ id, additionalQueryKeys: [step] });
const title = useMemo(() => {
- if (queryText) return intl.formatMessage({ id: 'ui-bulk-edit.preview.query.title' }, { queryText });
+ if (bulkDetails?.fqlQuery) return intl.formatMessage({ id: 'ui-bulk-edit.preview.query.title' }, { queryText: bulkDetails.fqlQuery });
return intl.formatMessage({ id: 'ui-bulk-edit.preview.file.title' }, { fileUploadedName });
- }, [queryText, fileUploadedName]);
+ }, [bulkDetails?.fqlQuery, fileUploadedName]);
const isInitial = step === EDITING_STEPS.UPLOAD;
- if (criteria !== CRITERIA.IDENTIFIER) {
+ if (criteria === CRITERIA.LOGS) {
return ;
} else if (isLoading) {
return (
diff --git a/src/components/BulkEditList/BulkEditListSidebar/QueryTab/QueryTab.js b/src/components/BulkEditList/BulkEditListSidebar/QueryTab/QueryTab.js
index 52bdc8df..ba108a46 100644
--- a/src/components/BulkEditList/BulkEditListSidebar/QueryTab/QueryTab.js
+++ b/src/components/BulkEditList/BulkEditListSidebar/QueryTab/QueryTab.js
@@ -1,5 +1,8 @@
import React, { useContext } from 'react';
-import { useHistory } from 'react-router-dom';
+import {
+ useHistory,
+ useLocation
+} from 'react-router-dom';
import { Pluggable } from '@folio/stripes/core';
import { buildSearch } from '@folio/stripes-acq-components';
@@ -8,13 +11,17 @@ import { useRecordTypes } from '../../../../hooks/api/useRecordTypes';
import { getRecordType } from '../../../../utils/getRecordType';
import { useQueryPlugin } from '../../../../hooks/api';
import { useSearchParams } from '../../../../hooks/useSearchParams';
-import { useBulkPermissions, useLocationFilters } from '../../../../hooks';
+import {
+ useBulkPermissions,
+ useLocationFilters
+} from '../../../../hooks';
import { getCapabilityOptions } from '../../../../utils/helpers';
import { CRITERIA, QUERY_FILTERS } from '../../../../constants';
import { RootContext } from '../../../../context/RootContext';
export const QueryTab = () => {
const history = useHistory();
+ const location = useLocation();
const {
queryRecordType,
criteria,
@@ -56,6 +63,7 @@ export const QueryTab = () => {
testQueryDataSource,
getParamsSource,
cancelQueryDataSource,
+ runQueryDataSource
} = useQueryPlugin(recordTypeId);
const handleCapabilityChange = (e) => {
@@ -71,6 +79,13 @@ export const QueryTab = () => {
setVisibleColumns(null);
};
+ const onQueryRunSuccess = ({ id }) => {
+ history.replace({
+ pathname: `/bulk-edit/${id}/progress`,
+ search: buildSearch({}, location.search),
+ });
+ };
+
return (
<>
@@ -91,6 +106,8 @@ export const QueryTab = () => {
queryDetailsDataSource={queryDetailsDataSource}
onQueryRunFail={() => {}}
cancelQueryDataSource={cancelQueryDataSource}
+ onQueryRunSuccess={onQueryRunSuccess}
+ runQueryDataSource={runQueryDataSource}
/>
);
diff --git a/src/hooks/api/useQueryPlugin.js b/src/hooks/api/useQueryPlugin.js
index f22ef749..eba6b283 100644
--- a/src/hooks/api/useQueryPlugin.js
+++ b/src/hooks/api/useQueryPlugin.js
@@ -38,11 +38,20 @@ export const useQueryPlugin = (recordType) => {
return ky.delete(`query/${queryId}`);
};
+ const runQueryDataSource = async ({ fqlQuery }) => {
+ const response = ky.post('bulk-operations/query', { json: {
+ entityTypeId:recordType,
+ fqlQuery: JSON.stringify(fqlQuery)
+ } });
+ return response.json();
+ };
+
return {
entityTypeDataSource,
queryDetailsDataSource,
testQueryDataSource,
getParamsSource,
cancelQueryDataSource,
+ runQueryDataSource,
};
};
diff --git a/src/hooks/api/useRecordsPreview.js b/src/hooks/api/useRecordsPreview.js
index 47c7ae1b..8923a104 100644
--- a/src/hooks/api/useRecordsPreview.js
+++ b/src/hooks/api/useRecordsPreview.js
@@ -19,6 +19,8 @@ export const useRecordsPreview = ({
capabilities,
limit,
offset,
+ criteria,
+ queryRecordType
}) => {
const intl = useIntl();
const { setVisibleColumns } = useContext(RootContext);
@@ -40,6 +42,8 @@ export const useRecordsPreview = ({
data,
intl,
capabilities,
+ criteria,
+ queryRecordType
}), [data]);
// set initial and visible columns
diff --git a/src/utils/mappers/mappers.js b/src/utils/mappers/mappers.js
index 19174665..cc90462b 100644
--- a/src/utils/mappers/mappers.js
+++ b/src/utils/mappers/mappers.js
@@ -9,6 +9,7 @@ import {
import {
CAPABILITIES,
+ CRITERIA,
CUSTOM_ENTITY_COLUMNS,
} from '../../constants';
import {
@@ -44,7 +45,7 @@ const formatData = ({ capability, column, data }) => {
}
};
-export const getMappedTableData = ({ data, capabilities, intl }) => {
+export const getMappedTableData = ({ data, capabilities, criteria, queryRecordType, intl }) => {
if (!data) {
return {
contentData: null,
@@ -53,6 +54,8 @@ export const getMappedTableData = ({ data, capabilities, intl }) => {
};
}
+ const key = criteria === CRITERIA.QUERY ? queryRecordType : capabilities;
+
const columns = data.header.map((cell) => ({
label: cell.value,
value: cell.value,
@@ -63,7 +66,7 @@ export const getMappedTableData = ({ data, capabilities, intl }) => {
}));
const columnMapping = columns.reduce((acc, { value, label, ignoreTranslation }) => {
- acc[value] = ignoreTranslation ? value : intl.formatMessage({ id: `ui-bulk-edit.columns.${capabilities}.${label}` });
+ acc[value] = ignoreTranslation ? value : intl.formatMessage({ id: `ui-bulk-edit.columns.${key}.${label}` });
return acc;
}, {});
@@ -74,7 +77,7 @@ export const getMappedTableData = ({ data, capabilities, intl }) => {
acc[column.value] = formatData({
column,
- capability: capabilities,
+ capability: key,
data: item,
});
diff --git a/test/jest/__mock__/fakeData.js b/test/jest/__mock__/fakeData.js
index 6d25e2ba..7582ea5a 100644
--- a/test/jest/__mock__/fakeData.js
+++ b/test/jest/__mock__/fakeData.js
@@ -11,6 +11,7 @@ export const bulkEditLogsData = Array(50).fill(null).map((_, index) => [
processedNumOfRecords: 55,
committedNumOfRecords: 20,
editing: 'In app',
+ fqlQuery: 'test'
},
{
id: (index + 1).toString(),