Skip to content

Guided tour

FabrCore 2.0 · Release and package availability

These guides track the current 2.0 source. Stable 2.0.0 publication is pending; package commands show the release target. Until it is published, follow the source quick start or use a matching available prerelease set. Release migration · Runtime modes

MODULE 05 · LESSON 5.7

Embed SurfaceChatLink on a business page

Embed SurfaceChatLink beside a service request.

Lesson 27 of 86 · FabrCore 2.0

Overview

SurfaceChatLink places an inline launcher wherever the component is rendered and opens a chat panel for its target agent. This lets users ask about work without navigating away from a business page. Position affects the opened panel, not viewport placement of the launcher.

The link targets a workspace agent

SurfaceChatLink renders an inline launcher and opens a panel bound to its target agent/recipe. Put it next to the request details so a user can discuss the current work without navigating to a separate chat application. The panel position controls the opened panel; it does not pin the launcher to the viewport.

Creation and existing instances differ

A recipe can describe the instance to create, but an existing instance may retain its previously stored configuration. Changing a Razor parameter is not proof that a running agent changed type, model or tools. Use the supported update/reconfiguration path when that is the intent. Keep the request ID explicit when supplying page context.

Place chat beside the request

Download the Operations Desk source. The README lists project setup, package prerequisites and local ports.

  1. Place the Razor example on ServiceRequest.razor or in a layout. Set AgentHandle to assistant or an authorized full handle. Omit it only when the link should follow the workspace's selected agent.
  2. Set Title, Tooltip, Icon, WelcomeMessage, Position and InitialSize. Add explicit container CSS if you want a fixed launcher rather than an inline button.
  3. Provision the agent in trusted application code or use the explicit CreateAgent flow in the next lesson. Open the panel, send a request and try resize/minimize.
Basic Usage · reference snippet 
@using FabrCore.Surface.Components

<SurfaceChatLink AgentHandle="assistant"
                 Title="Assistant"
                 Tooltip="Open assistant"
                 OnMessageReceived="HandleAgentMessageAsync"
                 InitialSize="SurfaceChatLinkSize.Medium"
                 Position="SurfaceChatLinkPosition.BottomRight" />
OperationsDesk.Web/Components/ServiceRequest.razor · downloadable checkpoint 
@page "/"
<PageTitle>Operations Desk</PageTitle>
<main class="container py-5">
  <header class="d-flex justify-content-between"><h1>Service request SR-1042</h1><SurfaceNotify SurfacePath="/surface" /></header>
  <p>Printer unavailable · Open</p>
  <p>Choose Create in the chat panel to provision the echo assistant. <a href="/surface">Open the command center</a>.</p>
  <p role="status">@pageStatus</p>
  <SurfaceChatLink AgentHandle="assistant" Title="Request assistant" Tooltip="Ask about this request"
      WelcomeMessage="Ask about SR-1042" Position="SurfaceChatLinkPosition.BottomRight"
      InitialSize="SurfaceChatLinkSize.Medium" CreateAgent="CreateAsync"
      AllowReset="true" OnMessageReceived="ReceivedAsync" />
</main>
@code {
    private string pageStatus = "No page updates yet.";
    private Task<AgentHealthStatus> CreateAsync(SurfaceChatLinkCreateAgentContext context)
        => context.PrincipalContext.CreateAgent(new AgentConfiguration {
            Handle = context.AgentAlias, AgentType = "ops-echo", Models = "default",
            Description = "Request page assistant", ForceReconfigure = false
        });
    private Task<bool> ReceivedAsync(AgentMessage message)
    {
        if (message.MessageType == "data-changed")
        {
            pageStatus = "The agent reported a change. Reload authorized request data here.";
            StateHasChanged();
            return Task.FromResult(false);
        }
        return Task.FromResult(true);
    }
}

Compare the request page and workspace

  1. Open ServiceRequest.razor for SR-1042 and click Request assistant. If the instance is missing, use Create, then send a recognizable message.
  2. Confirm the panel targets the expected agent and that its recipe matches the intended echo or AI alias. If changing to AI, explicitly update the instance and configure the model first.
  3. Open /surface for the same principal and inspect the corresponding agent timeline. The page panel should be another view of that workspace, not an unrelated chat database.

The component provides a contextual entry point into the shared workspace. It does not automatically know which business fields your agent needs.

If the result is different

A bare handle resolves for the current principal. If the panel targets the wrong instance, inspect principal context and the configured AgentHandle before changing routing code.

Go deeper

Explore the related documentation.