1import { ChangeDetectionStrategy, Component, inject } from "@angular/core";
2import { ActivatedRoute } from "@angular/router";
3import {
4  registerRenderActivityMessage,
5  registerRenderToolCall,
6} from "@copilotkit/angular";
7import { z } from "zod";
8
9import { FeatureHeaderComponent } from "../feature-header.component";
10import { ShowcaseChatHostComponent } from "../showcase-chat-host.component";
11import {
12  asBrowseRenderer,
13  backgroundTaskActivityRendererConfig,
14  BrowseResultsToolCard,
15  observationalMemoryActivityRendererConfig,
16} from "./mastra-cards";
17
18@Component({
19  selector: "showcase-mastra-feature",
20  imports: [FeatureHeaderComponent, ShowcaseChatHostComponent],
21  changeDetection: ChangeDetectionStrategy.OnPush,
22  host: { class: "feature-page" },
23  template: `
24    <showcase-feature-header />
25    <main class="mastra-feature-page">
26      <section class="chat-surface" aria-label="Angular Mastra demonstration">
27        <showcase-chat-host />
28      </section>
29    </main>
30  `,
31})
32export class MastraFeatureComponent {
33  private readonly feature =
34    (inject(ActivatedRoute).snapshot.data["feature"] as string | undefined) ??
35    "unknown";
36
37  constructor() {
38    switch (this.feature) {
39      case "background-agents":
40        registerRenderActivityMessage(backgroundTaskActivityRendererConfig);
41        break;
42      case "observational-memory":
43        registerRenderActivityMessage(
44          observationalMemoryActivityRendererConfig,
45        );
46        break;
47      case "browser-use":
48        registerRenderToolCall({
49          name: "browse_web",
50          args: z.object({ task: z.string() }),
51          component: asBrowseRenderer(BrowseResultsToolCard),
52        });
53        break;
54    }
55  }
56}
57