MDK Logo

Assign pool

Modal dialog for bulk-assigning selected miners to a pool configuration

@tetherto/mdk-react-devkit/foundation

AssignPoolModal opens from the miner explorer to let operators assign a configured pool to one or more selected miners. It shows the selected miner list, a pool selector with live metadata, an endpoints preview, and an optional credential template preview. Submission is async; the modal stays open with a loading state until the parent resolves.

For the miner selection surface see Miner explorer. For pool authoring see Pools.

Prerequisites

Components

ComponentDescription
AssignPoolModalModal dialog for assigning a pool to selected miners

AssignPoolModal

Dialog that lists available pools and assigns the selected one to a set of miners via the MDK adapter store.

Import

import { AssignPoolModal } from '@tetherto/mdk-react-devkit/foundation'
import type { AssignPoolModalProps, PoolConfigData, PoolSummary } from '@tetherto/mdk-react-devkit/foundation'

Props

PropStatusTypeDefaultDescription
isOpenRequiredbooleannoneControls dialog visibility
onCloseRequiredfunctionnoneCalled when the user cancels or closes the dialog
onSubmitRequiredfunctionnoneAsync handler called on form submission; modal stays open with a loading state until the promise resolves
minersRequiredDevice[]noneSelected miners to assign; displayed in the miner summary table
poolConfigRequiredPoolConfigData[]nonePool configuration data from your API layer

PoolConfigData type

The input shape passed to poolConfig. Each entry maps to one option in the pool selector.

type PoolConfigData = {
  id: string
  poolConfigName: string
  description: string
  poolUrls: Array<{
    url: string
    pool: string
    workerName?: string
    workerPassword?: string
  }>
  miners: number
  containers: number
  updatedAt: string | number  // Unix timestamp (ms) or ISO string
}

PoolSummary type

The resolved pool object passed back through onSubmit.

type PoolSummary = {
  id: string
  name: string
  description: string
  units: number
  miners: number
  workerName: string | undefined
  workerPassword: string | undefined
  endpoints: PoolEndpoint[]
  validation?: { status: string }
  updatedAt: Date
}

type PoolEndpoint = {
  role?: string   // Primary, Failover, etc.
  host: string
  port: string
  pool: string
  url?: string
}

Basic usage

import { useState } from 'react'
import { AssignPoolModal } from '@tetherto/mdk-react-devkit/foundation'
import type { Device, PoolConfigData, PoolSummary } from '@tetherto/mdk-react-devkit/foundation'

const poolConfig: PoolConfigData[] = [
  {
    id: 'pool-1',
    poolConfigName: 'Alpha Pool',
    description: 'Primary pool with failover',
    poolUrls: [
      { url: 'stratum+tcp://pool-primary.example.com:3333', pool: 'pool1', workerName: 'wn-1', workerPassword: 'x' },
      { url: 'stratum+tcp://pool-failover.example.com:3333', pool: 'pool1', workerName: 'wn-1', workerPassword: 'x' },
    ],
    miners: 120,
    containers: 4,
    updatedAt: Date.now(),
  },
]

export const AssignPoolExample = () => {
  const [isOpen, setIsOpen] = useState(false)
  const [selectedMiners, setSelectedMiners] = useState<Device[]>([])

  const handleSubmit = async ({ pool }: { pool: PoolSummary }) => {
    await yourApi.assignMinersToPool(selectedMiners.map(m => m.id), pool.id)
    setIsOpen(false)
  }

  return (
    <>
      <button onClick={() => setIsOpen(true)}>Assign Pool</button>
      <AssignPoolModal
        isOpen={isOpen}
        onClose={() => setIsOpen(false)}
        onSubmit={handleSubmit}
        miners={selectedMiners}
        poolConfig={poolConfig}
      />
    </>
  )
}

Behaviour

The modal renders three sections:

  1. Selected miners — a DataTable showing each miner's short code, unit, current pool assignment, and status. Row count is shown in the section header.
  2. Choose pool — a FormSelect dropdown built from poolConfig. On selection, a metadata row appears showing unit count, miner count, and last-updated time (displayed as a relative string via intlFormatDistance). Below the metadata, an Endpoints Preview lists each endpoint with its role label (Primary, Failover), host, and port.
  3. Credential template preview (optional) — shown only when the SHOW_CREDENTIAL_TEMPLATE feature flag is enabled.

The Assign button is disabled during submission and shows "Assigning…" while the onSubmit promise is pending. The form resets automatically after a successful submission.

A Loader replaces the form body while pool configs are loading; a CoreAlert error is shown if pool config loading fails.

Styling

  • .mdk-pm-assign-pool-modal: Root dialog element
  • .mdk-pm-assign-pool-modal__body: Form body container
  • .mdk-pm-assign-pool-modal__section: Each labelled content section
  • .mdk-pm-assign-pool-modal__section-header: Section header row (title + optional value)
  • .mdk-pm-assign-pool-modal__section-title: Section label text
  • .mdk-pm-assign-pool-modal__section-value: Section summary value (e.g. "3 miners selected")
  • .mdk-pm-assign-pool-modal__pool-meta: Metadata row shown after a pool is selected
  • .mdk-pm-assign-pool-modal__endpoints-list: Endpoints preview list container
  • .mdk-pm-assign-pool-modal__endpoint: Single endpoint row
  • .mdk-pm-assign-pool-modal__endpoint-role: Endpoint role label wrapper
  • .mdk-pm-assign-pool-modal__endpoint-role-name: Role label text
  • .mdk-pm-assign-pool-modal__endpoint-fields: Host and port fields wrapper
  • .mdk-pm-assign-pool-modal__endpoint-host: Endpoint hostname
  • .mdk-pm-assign-pool-modal__endpoint-port: Endpoint port
  • .mdk-pm-assign-pool-modal__credential-template: Credential template preview section
  • .mdk-pm-assign-pool-modal__footer: Dialog footer containing Cancel and Assign buttons

On this page