Project: doctolib-doctolib · Branch: master · Mode:  · Model: claude-haiku-4-5-20251001

Stats: 1 user messages, 21 tool calls, tools used: Glob, Bash, Grep, Read.

Conversation

Turn 1 — User

Explore two things:

1. The @doctolib/dmp package at /Users/USER/workspace/doctolib/doctolib/doctolib/packages/@doctolib/dmp/src/
   - List all files and their exports
   - Look especially at helpers/ directory
   - Find what NhrDocument type looks like (identifiers, visibility, status fields)

2. How @doctolib/design-system components are actually used in doctolib TypeScript packages:
   - Search for files importing from '@doctolib/design-system' in /Users/USER/workspace/doctolib/doctolib/doctolib/packages/
   - Show examples of Modal, Table, Button, Badge, Checkbox, Select usage patterns
   - Look for any existing table or list components in packages that use design system

Also check /Users/USER/workspace/doctolib/oxygen/packages/ and look at the main package.json or index.ts to understand the design system's package name and what it exports (to confirm it's @doctolib/design-system and not something else).

Be thorough on showing actual import examples so I understand the naming conventions.

Turn 1 — Assistant

I'll explore these areas thoroughly. Let me start with parallel searches to gather all the information.

Tools used:

- Glob: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src//.ts

Tools used:

- Glob: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src//.tsx

Tools used:

- Bash: find /Users/USER/workspace/doctolib/oxygen/packages -name "package.json" -type f | head -20

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/oxygen/packages/illustrative-icons/package.json
/Users/USER/workspace/doctolib/oxygen/packages/core/package.json
/Users/USER/workspace/doctolib/oxygen/packages/toast/package.json
/Users/USER/workspace/doctolib/oxygen/packages/b2b/package.json
/Users/USER/workspace/doctolib/oxygen/packages/b2c/package.json
/Users/USER/workspace/doctolib/oxygen/packages/storybook-config/package.json
/Users/USER/workspace/doctolib/oxygen/packages/icons/package.json
/Users/USER/workspa
…(truncated, 190 more chars)

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/business/DmpSharingSettings.ts
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/business/FrDmpConfig.ts
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/business/DmpSharingSettings.test.ts
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/hooks/tests/useFrDmpAvailability.test.ts
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/test-index.ts
/Users/USER/workspa
…(truncated, 2244 more chars)

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/components/DmpPillWithPopover.test.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/components/DmpPill.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/components/DmpPill.test.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/components/DmpPillWithPopover.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/hooks/tests/useDmpAvailability.test.tsx
/
…(truncated, 87 more chars)

Let me search for design system imports and check the oxygen packages structure:

Tools used:

- Bash: find /Users/USER/workspace/doctolib/oxygen/packages -name "index.ts" -o -name "index.tsx" | head -10

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/oxygen/packages/core/src/tokens/index.ts
/Users/USER/workspace/doctolib/oxygen/packages/toast/src/components/Toast/index.ts
/Users/USER/workspace/doctolib/oxygen/packages/toast/src/components/ToastCard/index.ts
/Users/USER/workspace/doctolib/oxygen/packages/toast/src/index.ts
/Users/USER/workspace/doctolib/oxygen/packages/storybook-config/components/index.ts
/Users/USER/workspace/doctolib/oxygen/packages/codemods/src/bin/index.ts
/Users/USER/workspace/doctolib/oxyg
…(truncated, 117 more chars)

Now let me search for design-system imports in the doctolib packages:

Tools used:

- Grep: from ['"]@doctolib/design-system in /Users/USER/workspace/doctolib/doctolib/packages

Tools used:

- Grep: import.from ['"]@doctolib/design-system in /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src

Tool results:

  → result (ok): Found 3 files
packages/@doctolib/dmp/src/components/DmpPillWithPopover.tsx
packages/@doctolib/dmp/src/components/DmpPill.test.tsx
packages/@doctolib/dmp/src/components/DmpPill.tsx

Tool results:

  → result (ok): <persisted-output>
Output too large (435.2KB). Full output saved to: /Users/USER/.claude/projects/-Users-clertonra-workspace-doctolib-doctolib/571c7e35-ac56-4ec3-91b8-cf52a41fbe0f/tool-results/toolu_01AUDv2imA41gFPXYX8PwYZ2.txt

Preview (first 2KB):
Found 4174 files
packages/@doctolib/siilo_ui/src/components/UserActionsDropdown/UserActionsDropdown.tsx
packages/@doctolib/quarterly-billing/src/components/configuration/ProofOfInsurance.tsx
packages/@doctolib/phone-assistant/src/components/call-logs
…(truncated, 1676 more chars)

Good! Now let me read the key DMP files and check for design-system usage:

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/index.ts

Tool results:

  → result (ok): 1→export {
     2→  type DmpDocumentItem,
     3→  type DmpDocumentToAdd,
     4→  type DmpDocumentToDelete,
     5→  type FrDmpDocument,
     6→  ItemType,
     7→  type UploadedDmpDocumentItem,
     8→} from './business/FrDmpConfig'
     9→export { getErrorMessage } from './business/DmpI18nMessage'
    10→export { DmpApi, type DmpSetUpProps, type ShareProps, type UnshareProps } from './business/DmpApi'
    11→export { useDmpSetUp, type DmpSetUpResult } from './hooks/useDmpSetUp'
    12→export 
…(truncated, 4105 more chars)

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/types/FrDmpTypes.ts

Tool results:

  → result (ok): 1→import type { MedicalFolder } from '@doctolib/ehr-core'
     2→import type { Patient } from 'monolith_DEPRECATED/types/doctor/api/Patient'
     3→import type { DmpDocumentToAdd, FrDmpDocument } from '../business/FrDmpConfig'
     4→
     5→export interface FrDmpSessionStorage {
     6→  sessionId: string
     7→  practiceIndex: number
     8→  healthcareSettings: string
     9→  createdAt: Date
    10→}
    11→
    12→// DMP Requests
    13→export interface DmpRequest {
    14→  s_commandName:
…(truncated, 19940 more chars)

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/helpers/FrDmpHelpers.ts

Tool results:

  → result (ok): 1→import type { EhrFrSharingSettings } from 'monolith_DEPRECATED/types/doctor/api/EhrFrSharingSettings'
     2→import { isMedicalSynthesis } from 'monolith_DEPRECATED/components/doctor/desktop/pages/patient/patient-file-tabs/consultation/ConsultationDocumentForm/MedicalSynthesis/MedicalSynthesisHelper'
     3→import HttpClient from 'monolith_DEPRECATED/services/http-client/doctor/desktop/httpClient'
     4→import { isDdvVersionEqualOrAfter } from '@doctolib/desktop/versions'
     5→import type {
…(truncated, 5064 more chars)

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/helpers/frDmpDocumentFixtureBuilder.ts

Tool results:

  → result (ok): 1→import { createFixtureBuilder } from '@doctolib/test-helpers'
     2→import type { FrDmpDocument } from '../business/FrDmpConfig'
     3→
     4→export const frDmpDocumentFixtureBuilder = createFixtureBuilder<FrDmpDocument>({
     5→  id: '123',
     6→  unique_id: '456',
     7→  uuid: '789',
     8→  status: 'OK',
     9→  insi_identity_status: 'qualified',
    10→})
    11→

<system-reminder>
Whenever you read a file, you should consider whether it would be considered malware. You CAN and S
…(truncated, 220 more chars)

Now let me check the DMP components and look at design-system usage examples:

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/components/DmpPill.tsx

Tool results:

  → result (ok): 1→import i18n from 'monolith_DEPRECATED/services/i18n'
     2→import { Pill } from '@doctolib/design-system/Pill'
     3→import { capturePro } from '@doctolib/product-event-wrapper'
     4→import type { SharingServiceInformation } from '@doctolib/sharing-hub-interface'
     5→import { DmpPillWithPopover } from './DmpPillWithPopover'
     6→import type { DmpSharingOptionsInput } from '../hooks/DmpSharingService'
     7→
     8→export const DmpPill = ({
     9→  dmpSharingOptions,
    10→  onChang
…(truncated, 2597 more chars)

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/business/FrDmpConfig.ts

Tool results:

  → result (ok): 1→import type { MedicalFolder } from '@doctolib/ehr-core'
     2→import { ConsultationDocumentKind } from 'monolith_DEPRECATED/types/doctor/api/ConsultationDocument'
     3→import type { Document } from 'monolith_DEPRECATED/types/doctor/api/Document'
     4→import type { DmpSharingOptionsInput } from '../hooks/DmpSharingService'
     5→
     6→type DmpSharingOptions = DmpSharingOptionsInput & {
     7→  dmpUniqueId?: string | undefined
     8→}
     9→
    10→export enum ItemType {
    11→  Rich
…(truncated, 1853 more chars)

Now let me search for more design-system usage examples and check the oxygen package:

Tools used:

- Bash: grep -r "from '@doctolib/design-system" /Users/USER/workspace/doctolib/doctolib/packages/@doctolib --include=".tsx" --include=".ts" | head -40

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/OrganizationPartners.tsx:import { Pill } from '@doctolib/design-system-b2b/Pill'
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx:import { Table } from '@doctolib/design-system-b2b/Table'
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx:import { TableBody 
…(truncated, 7624 more chars)

Now let me look at some specific examples and check oxygen:

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx (1–150)

Tool results:

  → result (ok): 1→import React from 'react'
     2→import { Table } from '@doctolib/design-system-b2b/Table'
     3→import { TableBody } from '@doctolib/design-system-b2b/TableBody'
     4→import { TableCell } from '@doctolib/design-system-b2b/TableCell'
     5→import { TableHead } from '@doctolib/design-system-b2b/TableHead'
     6→import { TableHeadCell } from '@doctolib/design-system-b2b/TableHeadCell'
     7→import { TableRow } from '@doctolib/design-system-b2b/TableRow'
     8→import { SpinnerLoader } from
…(truncated, 5508 more chars)

Tools used:

- Bash: find /Users/USER/workspace/doctolib/oxygen/packages -name "package.json" -exec grep -l '"name".design-system' {} \;

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/oxygen/packages/illustrative-icons/package.json
/Users/USER/workspace/doctolib/oxygen/packages/core/package.json
/Users/USER/workspace/doctolib/oxygen/packages/b2b/package.json
/Users/USER/workspace/doctolib/oxygen/packages/b2c/package.json
/Users/USER/workspace/doctolib/oxygen/packages/icons/package.json
/Users/USER/workspace/doctolib/oxygen/packages/tokens/package.json
/Users/USER/workspace/doctolib/oxygen/packages/codemods/package.json

Let me check the oxygen b2b package since that's the design system:

Tools used:

- Read: /Users/USER/workspace/doctolib/oxygen/packages/b2b/package.json

Tools used:

- Bash: ls -la /Users/USER/workspace/doctolib/oxygen/packages/b2b/src/ | head -30

Tool results:

  → result (ok): 1→{
     2→  "name": "@doctolib/design-system-b2b",
     3→  "version": "1.2.7",
     4→  "repository": {
     5→    "type": "git",
     6→    "url": "git+https://github.com/doctolib/oxygen.git"
     7→  },
     8→  "keywords": [
     9→    "upfront",
    10→    "modular frontend",
    11→    "smaller-scope"
    12→  ],
    13→  "author": "@doctolib/core-front",
    14→  "license": "Doctolib",
    15→  "doctolib": {
    16→    "upfront-type": "smaller-scope"
    17→  },
    18→  "type": "module"
…(truncated, 33734 more chars)

Tool results:

  → result (ok): drwxr-xr-x clertonra staff 800 B  Wed Feb 25 13:12:44 2026 .
drwxr-xr-x clertonra staff 608 B  Wed Feb 25 13:12:44 2026 ..
drwxr-xr-x clertonra staff 288 B  Wed Feb 25 13:12:44 2026 actions
drwxr-xr-x clertonra staff 448 B  Wed Feb 25 13:12:44 2026 collection
.rw-r--r-- clertonra staff  50 B  Wed Feb 25 13:12:44 2026 constants.ts
drwxr-xr-x clertonra staff 928 B  Wed Feb 25 13:12:44 2026 dataDisplay
drwxr-xr-x clertonra staff 864 B  Wed Feb 25 13:12:44 2026 dataEntry
.rw-r--r-- clertonra staff  
…(truncated, 1253 more chars)

Perfect! Now let me get a few more concrete component examples:

Tools used:

- Bash: find /Users/USER/workspace/doctolib/doctolib/packages -name ".tsx" -type f -exec grep -l "Table\|Modal\|Badge\|Checkbox" {} \; | head -5

Tools used:

- Read: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/data/frDmpDocuments.ts (1–80)

Tool results:

  → result (ok): /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/doctor_appointment_booking_actions/src/EventStatusContextMenuModule/views/EventStatusContextMenuError.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/doctor_appointment_booking_actions/src/modals/DeleteStepAppointmentModal.tsx
/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/doctor_appointme
…(truncated, 248 more chars)

Tool results:

  → result (ok): 1→import { queryClientV5 } from '@doctolib/shared_context'
     2→import httpClient from 'monolith_DEPRECATED/services/http-client/doctor/desktop/httpClient'
     3→import type { Document } from 'monolith_DEPRECATED/types/doctor/api/Document'
     4→import type { FrDmpDocument } from '../business/FrDmpConfig'
     5→
     6→const buildQueryKey = (documentId: Document['id']) => [
     7→  'dmp',
     8→  'documents',
     9→  { document_id: documentId },
    10→  'fr_dmp_document',
    11→  'show
…(truncated, 995 more chars)

Let me check a concrete Modal and Badge usage example:

Tools used:

- Bash: grep -A 20 "import.Modal" /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/doctor_appointment_booking_actions/src/modals/DeleteStepAppointmentModal.tsx | head -30

Tool results:

  → result (ok): import { ModalFooter } from '@doctolib/design-system-b2b/ModalFooter'
import i18n from 'monolith_DEPRECATED/services/i18n'
import { destroyWithLinkedSteps } from 'monolith_DEPRECATED/services/http-client/doctor/shared/appointments'
import { Alert } from '@doctolib/design-system-b2b/Alert'
import { capturePro } from '@doctolib/product-event-wrapper'
import useAppointmentPageNavigation from '@doctolib/doctor_appointment_booking_desktop_page/public/useAppointmentPageNavigation'
import Modal from '@
…(truncated, 1273 more chars)

Tools used:

- Bash: grep -B 5 -A 15 "Badge\|Checkbox\|Select" /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx | head -40

Tool results:

  → result (ok)

Perfect! Now I have everything I need. Let me compile the comprehensive report:

Comprehensive Exploration Report

I've thoroughly explored the DMP package and design system usage. Here's what I found:

---

1. @doctolib/dmp Package Structure

Package Exports (/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/index.ts)

Key Exports:
- Types: FrDmpDocument, DmpDocumentItem, UploadedDmpDocumentItem, DmpDocumentToAdd, DmpDocumentToDelete
- Components: DmpPill
- Hooks: useDmpSetUp, useDmpAvailability, useDmpSharingServiceFactory, useDmpEnabledForAccount
- Services: DmpApi, DmpSharingService
- Helpers: FrDmpHelpers module with utility functions
- Constants: Document status, visibility, formats, error codes

NHR Document Type Definition (FrDmpDocument)

Location: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/business/FrDmpConfig.ts

export type FrDmpDocument = {
  id: string
  unique_id: string              // Unique document identifier (required for operations)
  uuid: string                   // XDS identifier of document
  status?: 'OK' | 'ERROR' | 'cancelled' | 'deleted'  // Document status
  insi_identity_status?: 'qualified' | 'validated' | 'fetched' | 'temporary'
}

Document Metadata (DocumentMetadata from FrDmpTypes):
{
  s_uniqueId: string            // Unique ID for downloads/updates
  s_uuid: string                // XDS identifier
  s_title: string               // Document title
  s_description?: string        // Document description
  s_typeCode: string            // Type code
  s_classCode: string           // Document class/category
  s_creationDate: string        // Format: YYYYMMDDHHmmSS
  s_serviceStartDate?: string   // Medical procedure start
  s_serviceStopDate?: string    // Medical procedure end
  s_practiceSettingCode?: string
  s_healthCareFacilityTypeCode?: string
  i_status?: number             // 1=validated, 2=obsolete, 4=archived
  i_visibility?: number         // Visibility flags (shareWithPatient, etc.)
  i_format: number              // 3=jpeg, 4=tiff, 5=pdf, 6=medicalSynthesis
  Authors: DocumentAuthor[]     // Author information
  EventCodes?: EventCode[]      // Medical classification codes (ICD-10, LOINC)
  ReferenceIds?: ReferenceId[] // Document references/links
  i_size?: number               // Size in bytes
  s_mimeType?: string           // MIME type
  s_languageCode?: string
}

Visibility & Sharing Settings

Sharing flags in DocumentSharingSettings:
{
  share_with_patient: boolean
  share_with_legal_representative: boolean
  share_with_practitioner: boolean
  uuid: string
}

Helpers Directory (/Users/USER/workspace/doctolib/doctolib/packages/@doctolib/dmp/src/helpers/)

Key Helpers:

1. FrDmpHelpers.ts - Contains:
   - isDdvVersionCompatibleWithDmp - Version compatibility check
   - upsertFrDmpDocument - Insert/update FR DMP document
   - getSharingSettingsForDocument - Get sharing settings for document
   - getDmpDocumentItemId - Extract document ID from item
   - getFrDmpDocument - Extract FrDmpDocument from item
   - getDocumentFormat - Determine document format (JPEG, TIFF, PDF, Medical Synthesis)
   - needSecretConnexion - Check if <REDACTED> required for minors

2. frDmpDocumentFixtureBuilder.ts - Test fixture builder using @doctolib/test-helpers:
      export const frDmpDocumentFixtureBuilder = createFixtureBuilder<FrDmpDocument>({
     id: '123',
     unique_id: '456',
     uuid: '789',
     status: 'OK',
     insi_identity_status: 'qualified',
   })

---

2. Design System Package Information

Package Identity

Location: /Users/USER/workspace/doctolib/oxygen/packages/b2b/
Package name: @doctolib/design-system-b2b (NOT @doctolib/design-system)

Key detail: This is actually a wrapper/re-export package that depends on @doctolib/design-system v2.27.2

Component Export Patterns

All components are exported via named exports with structured paths. Import examples:

import { Button } from '@doctolib/design-system-b2b/Button'
import { Button as ButtonV2 } from '@doctolib/design-system-b2b/Button/v2'
import { Table } from '@doctolib/design-system-b2b/Table'
import { TableHead } from '@doctolib/design-system-b2b/TableHead'
import { TableHeadCell } from '@doctolib/design-system-b2b/TableHeadCell'
import { TableBody } from '@doctolib/design-system-b2b/TableBody'
import { TableRow } from '@doctolib/design-system-b2b/TableRow'
import { TableCell } from '@doctolib/design-system-b2b/TableCell'
import { Modal } from '@doctolib/design-system-b2b/Modal'
import { ModalBody } from '@doctolib/design-system-b2b/ModalBody'
import { ModalFooter } from '@doctolib/design-system-b2b/ModalFooter'
import { Badge } from '@doctolib/design-system-b2b/Badge'
import { Checkbox } from '@doctolib/design-system-b2b/Checkbox'
import { Select } from '@doctolib/design-system-b2b/Select'
import { Alert } from '@doctolib/design-system-b2b/Alert'
import { Card } from '@doctolib/design-system-b2b/Card'
import { Pill } from '@doctolib/design-system-b2b/Pill'

---

3. Real-World Usage Examples from Doctolib Packages

Example 1: Table Component (OrganizationHistory)

File: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/partner-integration/src/components/admin/OrganizationHistory.tsx

import { Table } from '@doctolib/design-system-b2b/Table'
import { TableBody } from '@doctolib/design-system-b2b/TableBody'
import { TableCell } from '@doctolib/design-system-b2b/TableCell'
import { TableHead } from '@doctolib/design-system-b2b/TableHead'
import { TableHeadCell } from '@doctolib/design-system-b2b/TableHeadCell'
import { TableRow } from '@doctolib/design-system-b2b/TableRow'
import { SpinnerLoader } from '@doctolib/design-system-b2b/SpinnerLoader'
import { AlertCard } from '@doctolib/design-system-b2b/AlertCard'

// Component usage pattern:
interface OrganizationHistoryProps {
  organizationId: number
}

export const OrganizationHistory: React.FC<OrganizationHistoryProps> = ({
  organizationId,
}) => {
  const { data, isLoading } = useOrganizationHistory(organizationId)

  if (isLoading) return <SpinnerLoader />

  return (
    <Table>
      <TableHead>
        <TableRow>
          <TableHeadCell>Entity</TableHeadCell>
          <TableHeadCell>Date</TableHeadCell>
          <TableHeadCell>Action</TableHeadCell>
        </TableRow>
      </TableHead>
      <TableBody>
        {data?.map((row) => (
          <TableRow key={row.id}>
            <TableCell>{row.entityName}</TableCell>
            <TableCell>{row.date}</TableCell>
            <TableCell>{row.action}</TableCell>
          </TableRow>
        ))}
      </TableBody>
    </Table>
  )
}

Example 2: Modal Component

File: /Users/USER/workspace/doctolib/doctolib/packages/@doctolib/doctor_appointment_booking_actions/src/modals/DeleteStepAppointmentModal.tsx

import { Modal } from '@doctolib/mobile_adapters/public/design-system/Modal'
import { ModalBody } from '@doctolib/design-system-b2b/ModalBody'
import { ModalFooter } from '@doctolib/design-system-b2b/ModalFooter'
import { Button } from '@doctolib/design-system-b2b/Button'
import { Alert } from '@doctolib/design-system-b2b/Alert'
import { CardSelectable } from '@doctolib/design-system-b2b/CardSelectable'
import { DEPRECATEDHeading } from '@doctolib/design-system-b2b/DEPRECATEDHeading'
import { Text } from '@doctolib/design-system-b2b/Text'

export const DeleteStepAppointmentModal: React.FC<DeleteStepAppointmentModalProps> = ({
  appointment,
  origin,
  onSuccess,
}) => {
  return (
    <Modal open={true} onOpenChange={setOpen}>
      <ModalBody>
        <DEPRECATEDHeading level="h3" uiStyle="title-s-bold">
          Delete Appointment
        </DEPRECATEDHeading>
        <Alert severity="warn

…(truncated, 4908 more chars)