BulkUpdateDialog

Installation

pnpm dlx @docyrus/cli add @docyrus/rn-bulk-update-dialog

pnpm add @tanstack/react-query @docyrus/api-client @docyrus/app-utils expo-document-picker (optional)

This is a Docyrus-connected component. It needs an authenticated RestApiClient and a QueryClientProvider above it. expo-document-picker (and expo-image-picker for image fields) are optional peers, used only when the user edits a file or image field.

The dialog:

• loads the data source schema through useDocyrusDataSourceFields while it is open (cache-first through the shared inventory, so there is no extra request after the post-sign-in warm-up)
• lists only editable fields. System slugs (id, autonumber_id, created_on, created_by, last_modified_on, last_modified_by), computed types (field-formula, field-relatedField, field-button, field-autonumber), read-only fields and fields without a native editor are left out.
• renders one row per field in a SchemaRepeater: a Select picks the field (fields already added are disabled) and DocyFieldDynamic edits its value. Enum options come from the field. User fields load the shared /v1/users list, relation fields get a searchable, paged record picker, and file / image fields upload to Docyrus storage (/v1/apps/{app}/data-sources/{ds}/files/upload).
• sends PATCH /v1/apps/{appSlug}/data-sources/{dataSourceSlug}/items/bulk with { records: [{ id, ...updates }], enableAutomation, enableChangeLogging }. Companion values (money currency, phone country, status description, …) are included.
• shows a success or error toast, calls onSuccess, resets and closes. While the request runs, the sheet cannot be dismissed.

Usage

import { useState } from 'react';

import { useDocyrusClient } from '@docyrus/signin/react-native';

import { BulkUpdateDialog } from '@/components/docyrus-native/bulk-update-dialog';
import { Button } from '@/components/docyrus-native/button';

export function BulkEditTasks({ selectedRows }: { selectedRows: Array<{ id: string }> }) {
  const client = useDocyrusClient();
  const [open, setOpen] = useState(false);

  return (
    <>
      <Button onPress={() => setOpen(true)} disabled={selectedRows.length === 0}>
        Bulk update
      </Button>
      <BulkUpdateDialog
        open={open}
        onOpenChange={setOpen}
        client={client!}
        appSlug="base"
        dataSourceSlug="task"
        records={selectedRows}
        allowedFieldSlugs={['status', 'priority', 'assignee', 'due_date']}
        onSuccess={() => refetch()} />
    </>
  );
}

API Reference

BulkUpdateDialogProps

BulkUpdateRecord

Native differences

• The dialog is a bottom-sheet AwesomeDialog (size="xl") instead of a centered modal.
• Web renders value editors through useDocyrusFormView. Native uses the lightweight useDocyrusDataSourceFields schema hook plus per-field option loaders (users, relation records, storage uploads), so only the options of the picked fields are fetched.
• Desktop-only editors (fields that map to DocyFieldReadOnlyValue on native) cannot be bulk-edited.

Translation keys

ui.bulkUpdate.title, recordUnit, description, fieldUpdates, addField, chooseField, field, alreadyAdded, cancel, submit, success, error.

Components

Type Exports