Add To Cadence

A shared package that contains utils, components, and types for adding to cadence functionality.

Usage

This package is available to be imported into your module.

import { CadencePanePeople, getCadenceName, messages } from '@shared/add-to-cadence'

Exported Components

CadencePanePeople

A React component for displaying and managing people in the add to cadence flow. This component provides functionality for searching, selecting, and managing people that can be added to cadences.

import { CadencePanePeople } from '@shared/add-to-cadence'

function MyComponent() {
  return (
    <CadencePanePeople
      // Component props
    />
  )
}

CadencePane

A React component that provides the main cadence pane interface for the add to cadence functionality.

import { CadencePane } from '@shared/add-to-cadence'

function MyComponent() {
  return (
    <CadencePane
      // Component props
    />
  )
}

Exported Utils

getCadenceName

A utility function that generates a formatted cadence name based on the selected cadence step and cadence data.

import { getCadenceName } from '@shared/add-to-cadence'

const cadenceName = getCadenceName({
  selectedCadenceStep: {
    id: 1,
    name: 'Initial Email',
    day: 1,
    step_number: 1
  },
  cadenceData: {
    data: [{ name: 'My Cadence' }]
  }
})

console.log(cadenceName) // Returns formatted cadence name with step info

Exported Messages

The package exports internationalized messages for use in add to cadence functionality:

import { messages } from '@shared/add-to-cadence'

// Access localized messages
console.log(messages.addToCadenceButton) // "Add to Cadence"
console.log(messages.keepInCadenceButton) // "Keep in Cadence"
console.log(messages.doNotAddButton) // "Do not add"

Test Fixtures

The package provides test fixtures for development and testing purposes:

import { getPeopleData, getStagesData } from '@shared/add-to-cadence/src/__data__/fixtures'

const mockPeople = getPeopleData()
const mockStages = getStagesData()

// Use in tests or development