Decision Hub

Overview

The Decision Hub is a configurable component that provides a user interface for making decisions on ServiceRequests. It allows users to choose between different outcomes and update the status of FHIR ServiceRequests accordingly.

Layout Structure

The Decision Hub UI is organized into three sections:

• Tab Navigation Area: The component displays a tab bar containing all available outcomes. Each tab is labeled with the outcome's label property and serves as a navigation mechanism. Users can click any tab to switch between different decision paths without losing their context. The currently selected tab is visually highlighted to indicate the active outcome.

• Description Section: Below the tabs, a description area displays the description property of the currently selected outcome. This text provides clinical context and explains what will happen if the user proceeds with this particular decision. The description helps users make informed choices by clearly communicating the implications of each action.

• Action Buttons Area: On the right side of the card, action buttons corresponding to the selected outcome are displayed. These buttons are rendered from the buttons array of the current outcome.

Input Parameters

Input	Type	Required	Description
serviceRequestId	string	Yes	The ID of the ServiceRequest to update
config	{ outcomes: Outcome[], scenarioRedirectUrl: string }	Yes	Configuration object defining available outcomes

Outcome Interface

typescript interface Outcome {
    type: string;
    serviceRequestStatus: 'draft' | 'active' | 'on-hold' | 'revoked' | 'completed' | 'entered-in-error' | 'unknown';
    label: string;
    description: string;
    buttons: OutcomeButton[];
    confirmModal: {
        title: string;
        description: string;
        buttonLabel: string;
        buttonVariant: ButtonVariant;
        placeholder: string;
    };
    toast: {
        title: string;
        message: string;
        duration: number;
    };
}

OutcomeButton Interface

 interface OutcomeButton {
    label: string;
    variant: ButtonVariant;
    class?: string;
    opensModal?: boolean;
    mandatoryJustification?: boolean;
}

Service Request Status

• draft - Initial creation state
• active - Request is in progress
• on-hold - Request is temporarily suspended
• revoked - Request has been cancelled
• completed - Request has been fulfilled
• entered-in-error - Request was created in error
• unknown - Status is not known

scenarioRedirectUrl

scenarioRedirectUrl: "/scenario/0572729c-8483-4032-8aee-4593584d6ee5"

The scenarioRedirectUrl is a configuration property that specifies the URL to redirect users to after they make a decision in the Decision Hub component. After the service request status is successfully updated, the user will be automatically redirected to this URL.

Fallback: If no URL is provided, the user will be redirected to the root path (/).

User Interaction Flow

1. Outcome Selection

The Decision Hub displays tabs for each configured outcome. Users can switch between outcomes to view different decision options.

2. Action Execution

When a user clicks a button:

• If opensModal is true, a confirmation dialog opens before proceeding
• If opensModal is false, the decision is submitted immediately

If a confirmation dialog is required, it displays:

• A title explaining the action (e.g., "Confirm Approval")
• A description providing additional context
• A text input field with a placeholder for optional or mandatory notes/justification
• If mandatoryJustification is true, the input field becomes required and the confirm button remains disabled until text is entered
• If mandatoryJustification is false, the user can proceed with or without additional notes

3. FHIR Integration

The component performs the following FHIR operations:

- Status update { op: 'replace', path: '/status', value: serviceRequestStatus }
- Add note (if provided) { op: 'add', path: '/note/-', value: { text: comment, time: new Date().toISOString() } }

4. Success Feedback

After successful submission:

• The user is navigated to a new scenario view
• A toast notification appears displaying the outcome title and message
• The patient name is dynamically inserted into the message using the {patientName} placeholder
• The notification displays for the configured duration (typically 3000-5000 milliseconds)

Example: Pre-Operative Assessment Decision

This example demonstrates a Decision Hub configuration for a pre-operative assessment workflow with two clinical outcomes:

    const outcome: Outcome[] = [
     {
          type: "CLEARED",
          label: "Cleared",
          toast: {
             title: "Assessment cleared",
              message: "{patientName} is cleared for procedure.",
              duration: 3000
          },
          buttons: [
              {
               class: "mr-1",
               label: "Clear with comment",
               variant: "success",
               opensModal: true,
               mandatoryJustification: true
              },
               {
               label: "Clear",
               variant: "success",
               opensModal: false,
               mandatoryJustification: false
               },
          ],
          description: "This patient is fully cleared and ready for the scheduled procedure.",
          confirmModal: {
              title: "Clear Patient for Operation",
               buttonLabel: "Clear",
               description: "Clinical Note",
               placeholder: "e.g. additional details",
               buttonVariant: "success"
          },
          serviceRequestStatus: "completed"
    },
    {
       type: "NOT_CLEARED",
       label: "Not Cleared",
       toast: {
          title: "Patient rejected",
           message: "{patientName} is rejected for Intra-OR.",
           duration: 3000
       },
       buttons: [
           {
            label: "Reject with comment",
            variant: "destructive",
            mandatoryJustification: true,
            opensModal: true,
           }
       ],
       description" "This patient is not cleared. Please provide a reason.",
       confirmModal: {
           title: "Confirm rejection based on assessment",
            buttonLabel: "Reject",
            description: "Reason for Rejection (Required)",
            placeholder: "e.g. patient score is 4 and procedure is high risk",
            buttonVariant: "destructive"
       },
       serviceRequestStatus: "revoked"
    },
]