feat(plugin-import-export): adds limit and page fields to export options

packages/plugin-import-export/src/components/Page/index.scss

@@ -0,0 +1,4 @@
+.page-field {
+  display: block;
+  width: 180px;
+}

packages/plugin-import-export/src/components/Page/index.tsx

@@ -0,0 +1,41 @@
+'use client'
+
+import type { NumberFieldClientComponent } from 'payload'
+
+import { NumberField, useField } from '@payloadcms/ui'
+import React, { useEffect } from 'react'
+
+import './index.scss'
+
+const baseClass = 'page-field'
+
+export const Page: NumberFieldClientComponent = (props) => {
+  const { setValue } = useField<number>()
+  const { value: limitValue } = useField<number>({ path: 'limit' })
+
+  // Effect to reset page to 1 if limit is removed
+  useEffect(() => {
+    if (!limitValue) {
+      setValue(1) // Reset page to 1
+    }
+  }, [limitValue, setValue])
+
+  return (
+    <div className={baseClass}>
+      <NumberField
+        field={{
+          name: props.field.name,
+          admin: {
+            autoComplete: undefined,
+            placeholder: undefined,
+            step: 1,
+          },
+          label: props.field.label,
+          min: 1,
+        }}
+        onChange={(value) => setValue(value ?? 1)} // Update the page value on change
+        path={props.path}
+      />
+    </div>
+  )
+}

packages/plugin-import-export/src/components/Preview/index.tsx

@@ -28,6 +28,7 @@ export const Preview = () => {
   const { collection } = useImportExport()
   const { config } = useConfig()
   const { value: where } = useField({ path: 'where' })
+  const { value: page } = useField({ path: 'page' })
   const { value: limit } = useField<number>({ path: 'limit' })
   const { value: fields } = useField<string[]>({ path: 'fields' })
   const { value: sort } = useField({ path: 'sort' })
@@ -71,6 +72,7 @@ export const Preview = () => {
             format,
             limit,
             locale,
+            page,
             sort,
             where,
           }),
@@ -168,6 +170,7 @@ export const Preview = () => {
     i18n,
     limit,
     locale,
+    page,
     sort,
     where,
   ])

packages/plugin-import-export/src/export/createExport.ts

@@ -23,8 +23,10 @@ export type Export = {
   format: 'csv' | 'json'
   globals?: string[]
   id: number | string
+  limit?: number
   locale?: string
   name: string
+  page?: number
   slug: string
   sort: Sort
   user: string
@@ -57,6 +59,8 @@ export const createExport = async (args: CreateExportArgs) => {
       locale: localeInput,
       sort,
       user,
+      page,
+      limit,
       where,
     },
     req: { locale: localeArg, payload },
@@ -87,11 +91,13 @@ export const createExport = async (args: CreateExportArgs) => {
     req.payload.logger.debug({ message: 'Export configuration:', name, isCSV, locale })
   }
 
+  let documentsFetched = 0 // Keep track of the number of documents fetched
+
   const findArgs = {
     collection: collectionSlug,
     depth: 1,
     draft: drafts === 'yes',
-    limit: 100,
+    limit: limit || 100,
     locale,
     overrideAccess: false,
     page: 0,
@@ -160,7 +166,10 @@ export const createExport = async (args: CreateExportArgs) => {
 
     if (isCSV) {
       const allColumnsSet = new Set<string>()
-      let scanPage = 1
+
+      // Use the incoming page value here, defaulting to 1 if undefined
+      let scanPage = page || 1
+
       let hasMore = true
 
       while (hasMore) {
@@ -177,7 +186,13 @@ export const createExport = async (args: CreateExportArgs) => {
         })
 
         hasMore = result.hasNextPage
-        scanPage += 1
+        scanPage += 1 // Increment page for next batch
+
+        documentsFetched += result.docs.length // Increment total documents fetched
+
+        if (limit && documentsFetched >= limit) {
+          break
+        } // Stop if limit reached
       }
 
       if (debug) {
@@ -187,7 +202,9 @@ export const createExport = async (args: CreateExportArgs) => {
 
     const encoder = new TextEncoder()
     let isFirstBatch = true
-    let streamPage = 1
+
+    // Use the incoming page value here, defaulting to 1 if undefined
+    let streamPage = page || 1
 
     const stream = new Readable({
       async read() {
@@ -241,7 +258,19 @@ export const createExport = async (args: CreateExportArgs) => {
         }
 
         isFirstBatch = false
-        streamPage += 1
+        streamPage += 1 // Increment stream page for the next batch
+
+        // Check if the total fetched documents have reached the limit
+        documentsFetched += result.docs.length
+        if (limit && documentsFetched >= limit) {
+          if (debug) {
+            req.payload.logger.debug('Limit reached, stopping stream')
+          }
+          if (!isCSV) {
+            this.push(encoder.encode(']'))
+          }
+          this.push(null) // End the stream
+        }
 
         if (!result.hasNextPage) {
           if (debug) {
@@ -272,18 +301,21 @@ export const createExport = async (args: CreateExportArgs) => {
   const rows: Record<string, unknown>[] = []
   const columnsSet = new Set<string>()
   const columns: string[] = []
-  let page = 1
+
+  // Start from the incoming page value, defaulting to 1 if undefined
+  let currentPage = page || 1
+
   let hasNextPage = true
 
   while (hasNextPage) {
     const result = await payload.find({
       ...findArgs,
-      page,
+      page: currentPage,
     })
 
     if (debug) {
       req.payload.logger.debug(
-        `Processing batch ${findArgs.page} with ${result.docs.length} documents`,
+        `Processing batch ${currentPage} with ${result.docs.length} documents`,
       )
     }
 
@@ -309,9 +341,16 @@ export const createExport = async (args: CreateExportArgs) => {
     }
 
     hasNextPage = result.hasNextPage
-    page += 1
+    currentPage += 1
+
+    // Stop once limit is reached
+    documentsFetched += result.docs.length
+    if (limit && documentsFetched >= limit) {
+      break
+    }
   }
 
+  // Prepare final output
   if (isCSV) {
     const paddedRows = rows.map((row) => {
       const fullRow: Record<string, unknown> = {}

packages/plugin-import-export/src/export/getFields.ts

@@ -11,7 +11,7 @@ export const getFields = (config: Config, pluginConfig?: ImportExportPluginConfi
       name: 'locale',
       type: 'select',
       admin: {
-        width: '33%',
+        width: '180px',
       },
       defaultValue: 'all',
       // @ts-expect-error - this is not correctly typed in plugins right now
@@ -49,7 +49,7 @@ export const getFields = (config: Config, pluginConfig?: ImportExportPluginConfi
               admin: {
                 // Hide if a forced format is set via plugin config
                 condition: () => !pluginConfig?.format,
-                width: '33%',
+                width: '180px',
               },
               defaultValue: (() => {
                 // Default to plugin-defined format, otherwise 'csv'
@@ -74,11 +74,27 @@ export const getFields = (config: Config, pluginConfig?: ImportExportPluginConfi
               type: 'number',
               admin: {
                 placeholder: 'No limit',
-                width: '33%',
+                width: '180px',
               },
               // @ts-expect-error - this is not correctly typed in plugins right now
               label: ({ t }) => t('plugin-import-export:field-limit-label'),
             },
+            {
+              name: 'page',
+              type: 'number',
+              admin: {
+                components: {
+                  Field: '@payloadcms/plugin-import-export/rsc#Page',
+                },
+                condition: ({ limit }) => {
+                  // Show the page field only if limit is set
+                  return typeof limit === 'number' && limit !== 0
+                },
+              },
+              defaultValue: 1,
+              // @ts-expect-error - this is not correctly typed in plugins right now
+              label: ({ t }) => t('plugin-import-export:field-page-label'),
+            },
             {
               name: 'sort',
               type: 'text',
@@ -109,7 +125,7 @@ export const getFields = (config: Config, pluginConfig?: ImportExportPluginConfi
                       collectionConfig?.versions?.drafts,
                   )
                 },
-                width: '33%',
+                width: '180px',
               },
               defaultValue: 'yes',
               // @ts-expect-error - this is not correctly typed in plugins right now
@@ -163,6 +179,7 @@ export const getFields = (config: Config, pluginConfig?: ImportExportPluginConfi
               value: 'all',
             },
           ],
+          virtual: true,
         },
         {
           name: 'fields',

packages/plugin-import-export/src/exports/rsc.ts

@@ -3,6 +3,7 @@ export { ExportListMenuItem } from '../components/ExportListMenuItem/index.js'
 export { ExportSaveButton } from '../components/ExportSaveButton/index.js'
 export { FieldsToExport } from '../components/FieldsToExport/index.js'
 export { ImportExportProvider } from '../components/ImportExportProvider/index.js'
+export { Page } from '../components/Page/index.js'
 export { Preview } from '../components/Preview/index.js'
 export { SelectionToUseField } from '../components/SelectionToUseField/index.js'
 export { SortBy } from '../components/SortBy/index.js'

packages/plugin-import-export/src/index.ts

@@ -63,7 +63,7 @@ export const importExportPlugin =
         path: '@payloadcms/plugin-import-export/rsc#ExportListMenuItem',
       })
 
-      // // Find fields explicitly marked as disabled for import/export
+      // Find fields explicitly marked as disabled for import/export
       const disabledFieldAccessors = collectDisabledFieldPaths(collection.fields)
 
       // Store disabled field accessors in the admin config for use in the UI
@@ -90,13 +90,14 @@ export const importExportPlugin =
       handler: async (req) => {
         await addDataAndFileToRequest(req)
 
-        const { collectionSlug, draft, fields, limit, locale, sort, where } = req.data as {
+        const { collectionSlug, draft, fields, limit, locale, page, sort, where } = req.data as {
           collectionSlug: string
           draft?: 'no' | 'yes'
           fields?: string[]
           format?: 'csv' | 'json'
           limit?: number
           locale?: string
+          page?: number
           sort?: any
           where?: any
         }
@@ -118,6 +119,7 @@ export const importExportPlugin =
           limit: limit && limit > 10 ? 10 : limit,
           locale,
           overrideAccess: false,
+          page,
           req,
           select,
           sort,

packages/plugin-import-export/src/translations/languages/ar.ts

@@ -12,6 +12,7 @@ export const arTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'حد',
     'field-locale-label': 'موقع',
     'field-name-label': 'اسم الملف',
+    'field-page-label': 'صفحة',
     'field-selectionToUse-label': 'اختيار للاستخدام',
     'field-sort-label': 'ترتيب حسب',
     'selectionToUse-allDocuments': 'استخدم جميع الوثائق',

packages/plugin-import-export/src/translations/languages/az.ts

@@ -12,6 +12,7 @@ export const azTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Hədd',
     'field-locale-label': 'Yerli',
     'field-name-label': 'Fayl adı',
+    'field-page-label': 'Səhifə',
     'field-selectionToUse-label': 'İstifadə etmək üçün seçim',
     'field-sort-label': 'Sırala',
     'selectionToUse-allDocuments': 'Bütün sənədlərdən istifadə edin',

packages/plugin-import-export/src/translations/languages/bg.ts

@@ -12,6 +12,7 @@ export const bgTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Лимит',
     'field-locale-label': 'Регион',
     'field-name-label': 'Име на файла',
+    'field-page-label': 'Страница',
     'field-selectionToUse-label': 'Избор за използване',
     'field-sort-label': 'Сортирай по',
     'selectionToUse-allDocuments': 'Използвайте всички документи',

packages/plugin-import-export/src/translations/languages/ca.ts

@@ -12,6 +12,7 @@ export const caTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Límit',
     'field-locale-label': 'Local',
     'field-name-label': 'Nom del fitxer',
+    'field-page-label': 'Pàgina',
     'field-selectionToUse-label': 'Selecció per utilitzar',
     'field-sort-label': 'Ordena per',
     'selectionToUse-allDocuments': 'Utilitzeu tots els documents',

packages/plugin-import-export/src/translations/languages/cs.ts

@@ -12,6 +12,7 @@ export const csTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Limita',
     'field-locale-label': 'Místní',
     'field-name-label': 'Název souboru',
+    'field-page-label': 'Stránka',
     'field-selectionToUse-label': 'Výběr k použití',
     'field-sort-label': 'Seřadit podle',
     'selectionToUse-allDocuments': 'Použijte všechny dokumenty',

packages/plugin-import-export/src/translations/languages/da.ts

@@ -12,6 +12,7 @@ export const daTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Begrænsning',
     'field-locale-label': 'Lokale',
     'field-name-label': 'Filnavn',
+    'field-page-label': 'Side',
     'field-selectionToUse-label': 'Valg til brug',
     'field-sort-label': 'Sorter efter',
     'selectionToUse-allDocuments': 'Brug alle dokumenter',

packages/plugin-import-export/src/translations/languages/de.ts

@@ -12,6 +12,7 @@ export const deTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Grenze',
     'field-locale-label': 'Ort',
     'field-name-label': 'Dateiname',
+    'field-page-label': 'Seite',
     'field-selectionToUse-label': 'Auswahl zur Verwendung',
     'field-sort-label': 'Sortieren nach',
     'selectionToUse-allDocuments': 'Verwenden Sie alle Dokumente.',

packages/plugin-import-export/src/translations/languages/en.ts

@@ -11,6 +11,7 @@ export const enTranslations = {
     'field-limit-label': 'Limit',
     'field-locale-label': 'Locale',
     'field-name-label': 'File name',
+    'field-page-label': 'Page',
     'field-selectionToUse-label': 'Selection to use',
     'field-sort-label': 'Sort by',
     'selectionToUse-allDocuments': 'Use all documents',

packages/plugin-import-export/src/translations/languages/es.ts

@@ -12,6 +12,7 @@ export const esTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Límite',
     'field-locale-label': 'Localidad',
     'field-name-label': 'Nombre del archivo',
+    'field-page-label': 'Página',
     'field-selectionToUse-label': 'Selección para usar',
     'field-sort-label': 'Ordenar por',
     'selectionToUse-allDocuments': 'Utilice todos los documentos',

packages/plugin-import-export/src/translations/languages/et.ts

@@ -12,6 +12,7 @@ export const etTranslations: PluginDefaultTranslationsObject = {
     'field-limit-label': 'Piirang',
     'field-locale-label': 'Lokaal',
     'field-name-label': 'Faili nimi',
+    'field-page-label': 'Leht',
     'field-selectionToUse-label': 'Valiku kasutamine',
     'field-sort-label': 'Sorteeri järgi',
     'selectionToUse-allDocuments': 'Kasutage kõiki dokumente',