@strapi/content-manager 5.60.0 → 5.61.0

package/dist/admin/pages/ListView/ListViewPage.js

@@ -11,6 +11,8 @@ var reactIntl = require('react-intl');
 var reactRouterDom = require('react-router-dom');
 var styledComponents = require('styled-components');
 var InjectionZone = require('../../components/InjectionZone.js');
+var collections = require('../../constants/collections.js');
+var customOrder = require('../../constants/customOrder.js');
 var hooks = require('../../constants/hooks.js');
 var plugin = require('../../constants/plugin.js');
 var DocumentRBAC = require('../../features/DocumentRBAC.js');
@@ -25,6 +27,7 @@ var translations = require('../../utils/translations.js');
 var users = require('../../utils/users.js');
 var DocumentStatus = require('../EditView/components/DocumentStatus.js');
 var Actions = require('./components/BulkActions/Actions.js');
+var CustomOrder = require('./components/CustomOrder.js');
 var Filters = require('./components/Filters.js');
 var TableActions = require('./components/TableActions.js');
 var CellContent = require('./components/TableCells/CellContent.js');
@@ -63,6 +66,16 @@ const NON_LINKABLE_TYPES = new Set([
  * -----------------------------------------------------------------------------------------------*/ const LayoutsHeaderCustom = styledComponents.styled(strapiAdmin.Layouts.Header)`
   overflow-wrap: anywhere;
 `;
+/**
+ * When the entries of the collection type follow a custom order, that order is
+ * what the list shows unless the user sorts on a column.
+ */ const hasCustomOrderEnabled = (collectionType, settings)=>collectionType === collections.COLLECTION_TYPES && settings.customOrder === true && customOrder.isCustomOrderFeatureEnabled();
+const getDefaultSort = (settings, hasCustomOrder)=>{
+    if (hasCustomOrder) {
+        return customOrder.CUSTOM_ORDER_SORT;
+    }
+    return settings.defaultSortBy ? `${settings.defaultSortBy}:${settings.defaultSortOrder}` : '';
+};
 const ListViewPage = ()=>{
     const { trackUsage } = strapiAdmin.useTracking();
     const navigate = reactRouterDom.useNavigate();
@@ -178,11 +191,26 @@ const ListViewPage = ()=>{
         schema?.attributes,
         schema?.uid
     ]);
+    const hasCustomOrder = hasCustomOrderEnabled(collectionType, list.settings);
     const [{ query }, setQuery] = strapiAdmin.useQueryParams({
         page: '1',
         pageSize: list.settings.pageSize.toString(),
-        sort: list.settings.defaultSortBy ? `${list.settings.defaultSortBy}:${list.settings.defaultSortOrder}` : ''
+        sort: getDefaultSort(list.settings, hasCustomOrder)
     });
+    // A sort on the custom order can be left over in the URL or in the saved view
+    // after the setting has been turned off.
+    React__namespace.useEffect(()=>{
+        if (!isLoadingLayout && !hasCustomOrder && typeof query.sort === 'string' && query.sort.startsWith(`${customOrder.CUSTOM_ORDER_FIELD}:`)) {
+            setQuery(strapiAdmin.withEncodedUserParams(query, {
+                sort: undefined
+            }), 'push', true);
+        }
+    }, [
+        hasCustomOrder,
+        isLoadingLayout,
+        query,
+        setQuery
+    ]);
     React__namespace.useEffect(()=>{
         if (!configurationReady || !schema?.attributes || schema.uid !== model) {
             return;
@@ -247,7 +275,7 @@ const ListViewPage = ()=>{
         query,
         setQuery
     ]);
-    const { data, error, isLoading, isFetching } = documents.useGetAllDocumentsQuery({
+    const { data, error, isLoading, isFetching, fulfilledTimeStamp } = documents.useGetAllDocumentsQuery({
         model,
         params
     }, {
@@ -285,10 +313,19 @@ const ListViewPage = ()=>{
         query,
         navigate
     ]);
-    const { canCreate, isLoadingActionsRBAC } = DocumentRBAC.useDocumentRBAC('ListViewPage', ({ canCreate, isLoading })=>({
+    const { canCreate, canUpdate, isLoadingActionsRBAC } = DocumentRBAC.useDocumentRBAC('ListViewPage', ({ canCreate, canUpdate, isLoading })=>({
             canCreate,
+            canUpdate,
             isLoadingActionsRBAC: isLoading
         }));
+    const customOrder$1 = CustomOrder.useCustomOrder({
+        model,
+        isAvailable: hasCustomOrder,
+        canUpdate: canUpdate === true,
+        sort: query.sort,
+        params,
+        results,
+        pagination});
     const runHookWaterfall = strapiAdmin.useStrapiApp('ListViewPage', ({ runHookWaterfall })=>runHookWaterfall);
     /**
    * Run the waterfall and then inject our additional table headers.
@@ -327,10 +364,26 @@ const ListViewPage = ()=>{
                 sortable: !hasStatusFilter
             });
         }
+        if (hasCustomOrder) {
+            // Sorting on this column is how the user comes back to the custom order
+            formattedHeaders.unshift({
+                attribute: {
+                    type: 'custom'
+                },
+                name: customOrder.CUSTOM_ORDER_FIELD,
+                label: formatMessage({
+                    id: translations.getTranslation('containers.list.table-headers.order'),
+                    defaultMessage: 'order'
+                }),
+                searchable: false,
+                sortable: true
+            });
+        }
         return formattedHeaders;
     }, [
         displayedHeaders,
         formatMessage,
+        hasCustomOrder,
         hasStatusFilter,
         list,
         runHookWaterfall,
@@ -368,7 +421,7 @@ const ListViewPage = ()=>{
    * Only genuinely interactive cells are skipped: relations, media, components,
    * dynamic zones (they embed their own links/menus), plugin-formatted columns
    * (`cellFormatter`), and the synthetic `status` column.
-   */ const linkCandidates = tableHeaders.filter(({ name, attribute, cellFormatter })=>name !== 'status' && typeof cellFormatter !== 'function' && attribute && !NON_LINKABLE_TYPES.has(attribute.type));
+   */ const linkCandidates = tableHeaders.filter(({ name, attribute, cellFormatter })=>name !== 'status' && name !== customOrder.CUSTOM_ORDER_FIELD && typeof cellFormatter !== 'function' && attribute && !NON_LINKABLE_TYPES.has(attribute.type));
     // The link column for a given row: the first candidate that actually has a
     // value (uses CellContent's own hasContent so it matches the "-" the cell
     // would otherwise render). documentId is checked directly (its own cell).
@@ -483,141 +536,152 @@ const ListViewPage = ()=>{
                             direction: "column",
                             alignItems: "stretch",
                             children: [
-                                /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Root, {
-                                    rows: results,
-                                    headers: tableHeaders,
-                                    isLoading: isFetching,
-                                    children: [
-                                        /*#__PURE__*/ jsxRuntime.jsx(TableActionsBar, {}),
-                                        /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Content, {
-                                            children: [
-                                                /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Head, {
-                                                    children: [
-                                                        /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.HeaderCheckboxCell, {}),
-                                                        tableHeaders.map((header)=>/*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.HeaderCell, {
-                                                                ...header
-                                                            }, header.name))
-                                                    ]
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Loading, {}),
-                                                /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Empty, {
-                                                    action: canCreate ? /*#__PURE__*/ jsxRuntime.jsx(CreateButton, {
-                                                        variant: "secondary"
-                                                    }) : null
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Body, {
-                                                    children: results.map((row)=>{
-                                                        const rowLinkField = getRowLinkField(row);
-                                                        return /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Row, {
-                                                            cursor: "pointer",
-                                                            onClick: handleRowClick(row.documentId),
-                                                            children: [
-                                                                /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.CheckboxCell, {
-                                                                    id: row.id
-                                                                }),
-                                                                tableHeaders.map(({ cellFormatter, ...header })=>{
-                                                                    if (header.name === 'status') {
-                                                                        const { status } = row;
-                                                                        return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
-                                                                            children: /*#__PURE__*/ jsxRuntime.jsx(DocumentStatus.DocumentStatus, {
-                                                                                status: status,
-                                                                                maxWidth: 'min-content'
-                                                                            })
-                                                                        }, header.name);
-                                                                    }
-                                                                    if ([
-                                                                        'createdBy',
-                                                                        'updatedBy'
-                                                                    ].includes(header.name.split('.')[0])) {
-                                                                        // Display the users full name
-                                                                        // Some entries doesn't have a user assigned as creator/updater (ex: entries created through content API)
-                                                                        // In this case, we display a dash
-                                                                        return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
-                                                                            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                                                textColor: "neutral800",
-                                                                                children: row[header.name.split('.')[0]] ? users.getDisplayName(row[header.name.split('.')[0]]) : '-'
-                                                                            })
-                                                                        }, header.name);
-                                                                    }
-                                                                    if (header.name === 'documentId') {
-                                                                        // When documentId is the primary link column, only its
-                                                                        // id text becomes the link; the copy button stays outside.
-                                                                        const isDocumentIdLink = header.name === rowLinkField && Boolean(row.documentId);
-                                                                        return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
-                                                                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                                                                gap: 2,
-                                                                                alignItems: "center",
-                                                                                width: "100%",
-                                                                                minWidth: 0,
-                                                                                children: [
-                                                                                    isDocumentIdLink ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                                                        tag: reactRouterDom.Link,
-                                                                                        to: {
-                                                                                            pathname: row.documentId,
-                                                                                            search: qs.stringify({
-                                                                                                plugins: query.plugins
-                                                                                            })
-                                                                                        },
-                                                                                        onClick: (e)=>e.stopPropagation(),
-                                                                                        textColor: "neutral800",
-                                                                                        maxWidth: "30rem",
-                                                                                        ellipsis: true,
-                                                                                        children: row.documentId
-                                                                                    }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                                                        textColor: "neutral800",
-                                                                                        maxWidth: "30rem",
-                                                                                        ellipsis: true,
-                                                                                        children: row.documentId || '-'
-                                                                                    }),
-                                                                                    row.documentId && /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
-                                                                                        variant: "ghost",
-                                                                                        size: "S",
-                                                                                        label: formatMessage({
-                                                                                            id: 'content-manager.actions.copy-documentId.label',
-                                                                                            defaultMessage: 'Copy'
+                                /*#__PURE__*/ jsxRuntime.jsx(CustomOrder.CustomOrder.Root, {
+                                    state: customOrder$1,
+                                    children: /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Root, {
+                                        rows: customOrder$1.rows,
+                                        headers: tableHeaders,
+                                        isLoading: isFetching && !customOrder$1.isMoving,
+                                        children: [
+                                            /*#__PURE__*/ jsxRuntime.jsx(TableActionsBar, {}),
+                                            /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Content, {
+                                                children: [
+                                                    /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Table.Head, {
+                                                        children: [
+                                                            /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.HeaderCheckboxCell, {}),
+                                                            tableHeaders.map((header)=>/*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.HeaderCell, {
+                                                                    ...header
+                                                                }, header.name))
+                                                        ]
+                                                    }),
+                                                    /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Loading, {}),
+                                                    /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Empty, {
+                                                        action: canCreate ? /*#__PURE__*/ jsxRuntime.jsx(CreateButton, {
+                                                            variant: "secondary"
+                                                        }) : null
+                                                    }),
+                                                    /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Body, {
+                                                        children: customOrder$1.rows.map((row, index)=>{
+                                                            const rowLinkField = getRowLinkField(row);
+                                                            return /*#__PURE__*/ jsxRuntime.jsxs(CustomOrder.CustomOrder.Row, {
+                                                                cursor: "pointer",
+                                                                documentId: row.documentId,
+                                                                onClick: handleRowClick(row.documentId),
+                                                                children: [
+                                                                    /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.CheckboxCell, {
+                                                                        id: row.id
+                                                                    }),
+                                                                    tableHeaders.map(({ cellFormatter, ...header })=>{
+                                                                        if (header.name === customOrder.CUSTOM_ORDER_FIELD) {
+                                                                            return /*#__PURE__*/ jsxRuntime.jsx(CustomOrder.CustomOrder.PositionCell, {
+                                                                                documentId: row.documentId,
+                                                                                position: ((pagination?.page ?? 1) - 1) * (pagination?.pageSize ?? 0) + index + 1,
+                                                                                total: pagination?.total ?? customOrder$1.rows.length
+                                                                            }, header.name);
+                                                                        }
+                                                                        if (header.name === 'status') {
+                                                                            const { status } = row;
+                                                                            return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
+                                                                                children: /*#__PURE__*/ jsxRuntime.jsx(DocumentStatus.DocumentStatus, {
+                                                                                    status: status,
+                                                                                    maxWidth: 'min-content'
+                                                                                })
+                                                                            }, header.name);
+                                                                        }
+                                                                        if ([
+                                                                            'createdBy',
+                                                                            'updatedBy'
+                                                                        ].includes(header.name.split('.')[0])) {
+                                                                            // Display the users full name
+                                                                            // Some entries doesn't have a user assigned as creator/updater (ex: entries created through content API)
+                                                                            // In this case, we display a dash
+                                                                            return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
+                                                                                children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                                                                    textColor: "neutral800",
+                                                                                    children: row[header.name.split('.')[0]] ? users.getDisplayName(row[header.name.split('.')[0]]) : '-'
+                                                                                })
+                                                                            }, header.name);
+                                                                        }
+                                                                        if (header.name === 'documentId') {
+                                                                            // When documentId is the primary link column, only its
+                                                                            // id text becomes the link; the copy button stays outside.
+                                                                            const isDocumentIdLink = header.name === rowLinkField && Boolean(row.documentId);
+                                                                            return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
+                                                                                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                                                                                    gap: 2,
+                                                                                    alignItems: "center",
+                                                                                    width: "100%",
+                                                                                    minWidth: 0,
+                                                                                    children: [
+                                                                                        isDocumentIdLink ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                                                                            tag: reactRouterDom.Link,
+                                                                                            to: {
+                                                                                                pathname: row.documentId,
+                                                                                                search: qs.stringify({
+                                                                                                    plugins: query.plugins
+                                                                                                })
+                                                                                            },
+                                                                                            onClick: (e)=>e.stopPropagation(),
+                                                                                            textColor: "neutral800",
+                                                                                            maxWidth: "30rem",
+                                                                                            ellipsis: true,
+                                                                                            children: row.documentId
+                                                                                        }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                                                                            textColor: "neutral800",
+                                                                                            maxWidth: "30rem",
+                                                                                            ellipsis: true,
+                                                                                            children: row.documentId || '-'
                                                                                         }),
-                                                                                        onClick: (e)=>handleCopyDocumentId(e, row.documentId),
-                                                                                        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Duplicate, {})
-                                                                                    })
-                                                                                ]
-                                                                            })
-                                                                        }, header.name);
-                                                                    }
-                                                                    if (typeof cellFormatter === 'function') {
+                                                                                        row.documentId && /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                                                                            variant: "ghost",
+                                                                                            size: "S",
+                                                                                            label: formatMessage({
+                                                                                                id: 'content-manager.actions.copy-documentId.label',
+                                                                                                defaultMessage: 'Copy'
+                                                                                            }),
+                                                                                            onClick: (e)=>handleCopyDocumentId(e, row.documentId),
+                                                                                            children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Duplicate, {})
+                                                                                        })
+                                                                                    ]
+                                                                                })
+                                                                            }, header.name);
+                                                                        }
+                                                                        if (typeof cellFormatter === 'function') {
+                                                                            return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
+                                                                                children: cellFormatter(row, header, {
+                                                                                    collectionType,
+                                                                                    model
+                                                                                })
+                                                                            }, header.name);
+                                                                        }
                                                                         return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
-                                                                            children: cellFormatter(row, header, {
-                                                                                collectionType,
-                                                                                model
+                                                                            children: /*#__PURE__*/ jsxRuntime.jsx(CellContent.CellContent, {
+                                                                                content: row[header.name.split('.')[0]],
+                                                                                rowId: row.documentId,
+                                                                                ...header,
+                                                                                linkTo: header.name === rowLinkField ? {
+                                                                                    pathname: row.documentId,
+                                                                                    search: qs.stringify({
+                                                                                        plugins: query.plugins
+                                                                                    })
+                                                                                } : undefined
                                                                             })
                                                                         }, header.name);
-                                                                    }
-                                                                    return /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Table.Cell, {
-                                                                        children: /*#__PURE__*/ jsxRuntime.jsx(CellContent.CellContent, {
-                                                                            content: row[header.name.split('.')[0]],
-                                                                            rowId: row.documentId,
-                                                                            ...header,
-                                                                            linkTo: header.name === rowLinkField ? {
-                                                                                pathname: row.documentId,
-                                                                                search: qs.stringify({
-                                                                                    plugins: query.plugins
-                                                                                })
-                                                                            } : undefined
+                                                                    }),
+                                                                    /*#__PURE__*/ jsxRuntime.jsx(ActionsCell, {
+                                                                        onClick: (e)=>e.stopPropagation(),
+                                                                        children: /*#__PURE__*/ jsxRuntime.jsx(TableActions.TableActions, {
+                                                                            document: row
                                                                         })
-                                                                    }, header.name);
-                                                                }),
-                                                                /*#__PURE__*/ jsxRuntime.jsx(ActionsCell, {
-                                                                    onClick: (e)=>e.stopPropagation(),
-                                                                    children: /*#__PURE__*/ jsxRuntime.jsx(TableActions.TableActions, {
-                                                                        document: row
                                                                     })
-                                                                })
-                                                            ]
-                                                        }, row.id);
+                                                                ]
+                                                            }, row.id);
+                                                        })
                                                     })
-                                                })
-                                            ]
-                                        })
-                                    ]
+                                                ]
+                                            })
+                                        ]
+                                    })
                                 }),
                                 /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Pagination.Root, {
                                     ...pagination,