BulkAddSparePartsModal

Modal for bulk-adding spare parts from a CSV file. Provides a CSV template download, file selection with client-side parsing, and submits the parsed records.…

Modal for bulk-adding spare parts from a CSV file. Provides a CSV template download, file selection with client-side parsing, and submits the parsed records. Receives the submit handler as a prop; CSV parsing and validation helpers are exported alongside the component.

import { BulkAddSparePartsModal } from "@tetherto/mdk-react-devkit";

Prop	Status	Type	Default	Description
`isOpen`	Required	`boolean`	—	—
`onClose`	Required	`VoidFunction`	—	—
`onSubmit`	Required	`(records: CSVRecord[]) => Promise<void \| { error?: string \| undefined; }>`	—	—
`isLoading`	Optional	`boolean \| undefined`	—	—

Usage

Modal for bulk-adding spare parts from a CSV file. Provides a CSV template download, file selection with client-side parsing, and submits the parsed records. CSV parsing and validation helpers (parseCsvText, validateCSVRecords, mapRawRowToRecord, downloadCsvTemplate, CSVRecord) are exported alongside the component for use in the consuming submit handler.

When to use

Use this when operators need to register many spare parts at once. Validate the parsed records in your onSubmit with validateCSVRecords (location/status/model checks, duplicate detection) and return an { error } to surface a message in the modal.

CSV format

Template headers (downloadable from the modal): part, model, miner model, serial num, mac, status, location, comment. Max MAX_CSV_ITEMS (50) rows per upload. validateCSVRecords enforces valid part types, miner models, statuses, locations, per-part-type model subtypes, and duplicate serial/MAC detection (the latter only for controllers).

Example

import { useState } from "react";import { BulkAddSparePartsModal, Button } from "@tetherto/mdk-react-devkit";export const BulkAddSparePartsModalExample = () => {  const [isOpen, setIsOpen] = useState(false);  return (    <div>      <Button variant="primary" onClick={() => setIsOpen(true)}>        Bulk Add Parts      </Button>      <BulkAddSparePartsModal        isOpen={isOpen}        onClose={() => setIsOpen(false)}        onSubmit={async () => {          setIsOpen(false);        }}      />    </div>  );};