diff --git a/packages/core/admin/admin/src/content-manager/components/DynamicTable/index.js b/packages/core/admin/admin/src/content-manager/components/DynamicTable/index.js
new file mode 100644
index 0000000000..c2eada9575
--- /dev/null
+++ b/packages/core/admin/admin/src/content-manager/components/DynamicTable/index.js
@@ -0,0 +1,54 @@
+import React, { useMemo } from 'react';
+import PropTypes from 'prop-types';
+import { DynamicTable as Table, useStrapiApp } from '@strapi/helper-plugin';
+import { INJECT_COLUMN_IN_TABLE } from '../../../exposedHooks';
+
+const DynamicTable = ({ canDelete, contentTypeName, isLoading, layout, rows }) => {
+ const { runHookWaterfall } = useStrapiApp();
+
+ const tableHeaders = useMemo(() => {
+ const headers = runHookWaterfall(INJECT_COLUMN_IN_TABLE, {
+ displayedHeaders: layout.contentType.layouts.list,
+ layout,
+ });
+
+ return headers.displayedHeaders;
+ }, [runHookWaterfall, layout]);
+
+ return (
+
+ );
+};
+
+DynamicTable.propTypes = {
+ canDelete: PropTypes.bool.isRequired,
+ contentTypeName: PropTypes.string.isRequired,
+ isLoading: PropTypes.bool.isRequired,
+ layout: PropTypes.exact({
+ components: PropTypes.object.isRequired,
+ contentType: PropTypes.shape({
+ attributes: PropTypes.object.isRequired,
+ metadatas: PropTypes.object.isRequired,
+ info: PropTypes.shape({ label: PropTypes.string.isRequired }).isRequired,
+ layouts: PropTypes.shape({
+ list: PropTypes.array.isRequired,
+ editRelations: PropTypes.array,
+ }).isRequired,
+ options: PropTypes.object.isRequired,
+ settings: PropTypes.object.isRequired,
+ }).isRequired,
+ }).isRequired,
+ rows: PropTypes.array.isRequired,
+};
+
+export default DynamicTable;
diff --git a/packages/core/admin/admin/src/content-manager/pages/ListView/index.js b/packages/core/admin/admin/src/content-manager/pages/ListView/index.js
index 78b201bc4e..b2ac498ea3 100644
--- a/packages/core/admin/admin/src/content-manager/pages/ListView/index.js
+++ b/packages/core/admin/admin/src/content-manager/pages/ListView/index.js
@@ -1,4 +1,4 @@
-import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react';
+import React, { memo, useCallback, useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators, compose } from 'redux';
@@ -12,7 +12,7 @@ import { useHistory, useLocation } from 'react-router-dom';
import isEqual from 'react-fast-compare';
import { stringify } from 'qs';
import {
- DynamicTable,
+ // DynamicTable,
NoPermissions,
// CheckPermissions,
// PopUpWarning,
@@ -20,7 +20,6 @@ import {
useQueryParams,
useNotification,
useRBACProvider,
- useStrapiApp,
useTracking,
} from '@strapi/helper-plugin';
import { Main } from '@strapi/parts/Main';
@@ -31,7 +30,7 @@ import Add from '@strapi/icons/Add';
import axios from 'axios';
import { axiosInstance } from '../../../core/utils';
// import { InjectionZone } from '../../../shared/components';
-import { INJECT_COLUMN_IN_TABLE } from '../../../exposedHooks';
+import DynamicTable from '../../components/DynamicTable';
// import permissions from '../../../permissions';
import {
// formatFiltersFromQuery,
@@ -92,7 +91,6 @@ function ListView({
// toggleModalDelete,
// toggleModalDeleteAll,
data,
- displayedHeaders,
getData,
getDataSucceeded,
isLoading,
@@ -109,7 +107,7 @@ function ListView({
// // settings: { bulkable: isBulkable, filterable: isFilterable, searchable: isSearchable },
// },
// } = layout;
- console.log({ data });
+
const toggleNotification = useNotification();
const { trackUsage } = useTracking();
const { refetchPermissions } = useRBACProvider();
@@ -119,13 +117,13 @@ function ListView({
useFocusWhenNavigate();
- const { runHookWaterfall } = useStrapiApp();
+ // const { runHookWaterfall } = useStrapiApp();
- const tableHeaders = useMemo(() => {
- const headers = runHookWaterfall(INJECT_COLUMN_IN_TABLE, { displayedHeaders, layout });
+ // const tableHeaders = useMemo(() => {
+ // const headers = runHookWaterfall(INJECT_COLUMN_IN_TABLE, { displayedHeaders, layout });
- return headers.displayedHeaders;
- }, [runHookWaterfall, displayedHeaders, layout]);
+ // return headers.displayedHeaders;
+ // }, [runHookWaterfall, displayedHeaders, layout]);
// const [{ query }, setQuery] = useQueryParams();
const [{ query }] = useQueryParams();
@@ -139,6 +137,7 @@ function ListView({
// const [idToDelete, setIdToDelete] = useState(null);
const contentType = layout.contentType;
const hasDraftAndPublish = get(contentType, 'options.draftAndPublish', false);
+ // TODO
// const allAllowedHeaders = useMemo(() => getAllAllowedHeaders(attributes), [attributes]);
// const filters = useMemo(() => {
@@ -148,10 +147,6 @@ function ListView({
// const sort = query.sort;
// const _q = query._q || '';
- // const firstSortableHeader = useMemo(() => getFirstSortableHeader(displayedHeaders), [
- // displayedHeaders,
- // ]);
-
// Using a ref to avoid requests being fired multiple times on slug on change
// We need it because the hook as mulitple dependencies so it may run before the permissions have checked
const requestUrlRef = useRef('');
@@ -399,13 +394,12 @@ function ListView({
{canRead ? (
{/* TODO */}
@@ -568,7 +562,6 @@ ListView.propTypes = {
canDelete: PropTypes.bool.isRequired,
canRead: PropTypes.bool.isRequired,
// canUpdate: PropTypes.bool.isRequired,
- displayedHeaders: PropTypes.array.isRequired,
data: PropTypes.array.isRequired,
// didDeleteData: PropTypes.bool.isRequired,
// entriesToDelete: PropTypes.array.isRequired,