5 min readUpdated Mar 2, 2026

DealDetailTile Documentation

Overview

The DealDetailTile is a feature designed to present detailed information about a specific deal in a Customer Relationship Management (CRM) system. It integrates with various datasets, including deals, contacts, companies, and activities, enabling users to view and manage detailed deal information, track its progress through different stages, and log activities associated with the deal.

Purpose

The primary purpose of DealDetailTile is to deliver a comprehensive view of a selected deal, allowing users to track stages, search through deals, view associated contacts and companies, and add activities. Additionally, it supports stage transitions for deals, reflecting updates in real-time.

How It Works

  1. Data Loading: The component fetches data for deals, contacts, companies, and activities on mount using the loadAllData function.
  2. State Management: It maintains multiple pieces of state to manage the loading status, selected deal, activities, and input fields for searching and adding activities.
  3. Stage Management: The component enables users to change the stage of a deal and automatically logs this change as an activity.
  4. Search Capability: Users can filter through deals using a search bar that dynamically updates based on the user's input.
  5. Real-time Updates: The component updates the view and state in real-time as the user interacts with it, maintaining an updated context.

Settings

The DealDetailTile accepts various props that determine its configuration. Below is a detailed breakdown of each setting:

Setting NameInput TypeDescriptionDefault Value
titleStringThe main title displayed at the top of the tile. This can be customized to better describe the current view.'Deal Detail'
subtitleStringAn optional subtitle beneath the title that can provide additional context about the deal.''
idStringA unique identifier for the tile to enable interaction with the state management library.N/A

Detailed Explanation of Settings

  1. Title

    • Represents the primary label of the tile.
    • Accepts a string type as input.
    • Modifying this will change the visible title of the tile, allowing users to customize the title based on their needs or contexts.
    • Default value is set to 'Deal Detail'.
  2. Subtitle

    • The secondary label that can provide context for the deal being displayed.
    • Accepts a string type.
    • This is optional and will not affect functionality if left blank. It can be tailored to enhance user understanding of the specific deal being highlighted.
    • Default value is an empty string.
  3. ID

    • A unique identifier that connects the tile to specific state management and data persistence.
    • Accepts a string input.
    • Essential for the component to correctly manage its state and retrieve the deal data associated with it.
    • There is no default value; it must be provided for proper functionality.

Use Cases & Examples

Use Case 1: Sales Management

A sales team wants to track and manage multiple deals in their pipeline. The DealDetailTile can be integrated into their dashboard, allowing team members to quickly access and update deal details, track its progress, and log activities associated with each deal.

Use Case 2: Customer Follow-Up

Customer service representatives need to follow up with clients based on ongoing deals. Using the DealDetailTile, they can view the details of each deal, contact information, and quickly log follow-up activities or meetings, ensuring all interactions are documented.

Use Case 3: Deal Performance Analysis

Managers can utilize the DealDetailTile to analyze how deals are progressing through various stages. They can monitor the overall health of deals and make strategic decisions based on real-time data.

Example Configuration

Suppose a sales manager wants to set up the DealDetailTile in their platform for monitoring a specific high-value deal. Here’s how they might configure it:

json
{
  "title": "High-Value Deal Monitoring",
  "subtitle": "Track progress and activities",
  "id": "deal-12345"
}

In this configuration:

AI Integrations

The DealDetailTile does not inherently feature AI integrations; however, it can serve as a foundation for future enhancements where AI might be employed to analyze deal performance, suggest next actions, or automate logging activities based on user interactions.

Billing Impacts

The DealDetailTile is a component of the Vantage analytics and data platform, which may have associated billing based on:

It is recommended to consult your billing administrator to understand how the use of such components might affect your plan and costs.