DocyrusDataExportMenu

Installation

pnpm dlx @docyrus/cli add @docyrus/rn-docyrus-data-export-menu

pnpm add tailwind-variants

The menu only reports what the user picked. It does not call the API. Wire onExport to useDocyrusDataExport, which POSTs to /v1/edge/run/query-export, writes the returned file into the cache directory and opens the share sheet. That hook uses the optional expo-file-system and expo-sharing peers.

Usage

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

import {
  DocyrusDataExportMenu,
  encodeDocyrusDataExportColumn,
  type DocyrusDataExportSelection
} from '@/components/docyrus-native/docyrus-data-export-menu';
import { useDocyrusDataExport } from '@/hooks/docyrus-native/use-docyrus-data-export';

export function ExportButton({ dataSourceId, fields, visibleSlugs, query }: Props) {
  const client = useDocyrusClient();
  const { exportData, isExporting } = useDocyrusDataExport({ client: client!, fileName: 'contacts' });

  const handleExport = async (selection: DocyrusDataExportSelection) => {
    const columns = selection.scope === 'all'
      ? '*'
      : selection.scope === 'visible'
        ? visibleSlugs
        : selection.columns.map(encodeDocyrusDataExportColumn);

    await exportData({ dataSourceId, columns, filters: query });
  };

  return (
    <DocyrusDataExportMenu
      onExport={handleExport}
      fields={fields.map(field => ({ slug: field.slug, name: field.name, type: field.type }))}
      visibleSlugs={visibleSlugs}
      isExporting={isExporting} />
  );
}

Behaviour

• The trigger is an outline icon button (fal download) that shows a spinner while isExporting is set.
• Pressing it opens an ActionSheet titled Export to Excel with Export visible columns, Export all columns and, when fields is non-empty, Select columns….
• Select columns… opens a large-detent sheet with a description, a search input, Select all / Clear all for the filtered list, and one checkbox row per field (name + slug). Relation, user and choice fields get a ToggleGroup with Name, ID and, for relation fields only, Autonumber ID. The header has Cancel and Export. The sheet re-seeds its selection every time it opens: visibleSlugs start checked (all fields when omitted), and variant fields start on ['name'].
• encodeDocyrusDataExportColumn turns { slug: 'country', variants: ['name', 'id'] } into country(id,name). Variants are always emitted in id, name, autonumber_id order.

API Reference

DocyrusDataExportMenuProps

DocyrusDataExportSelection

DocyrusDataExportColumn

DocyrusDataExportFieldOption

Variant fields: relation (field-relation, field-relatedField), user (field-userSelect, field-userMultiSelect) and choice (field-select, field-multiSelect, field-radioGroup, field-tagSelect, field-status, field-approvalStatus, field-enum, field-systemEnum).

Native differences

• The dropdown menu is an ActionSheet, and the column dialog is a large-detent sheet with Cancel / Export in the header.
• The column sheet opens after the menu sheet has dismissed (a short delay avoids stacking two iOS modals).
• The export file is not downloaded by the browser. useDocyrusDataExport writes it with expo-file-system and shares it with expo-sharing (shared helpers in the internal lib/native-export).

Translation keys

ui.dataGrid.export, exportLabel, exportVisibleColumns, exportAllColumns, exportSelectColumns, exportSelectColumnsTitle, exportSelectColumnsDescription, exportSelectedSuffix, exportSearchColumns, exportSelectAll, exportClearAll, exportNoColumns, exportVariantName, exportVariantId, exportVariantAutonumber, exportSubmit, exportCancel (shared with web).

Components

Helpers

Type Exports