Initial Release help-frontend

Dr. Frontend

Agency Copilot Embed

A side-panel AI assistant that lets users select text in the main content area and ask questions about it. Demonstrates how to embed an LLM copilot alongside existing application content.

Live Demo

Select text in the content area to see the context menu. Click the chat button to open the copilot panel.

Target Assessment Report

KRAS G12C — Target Qualification

Oncology · Non-Small Cell Lung Cancer · Last updated Jan 2025

Executive Summary

KRAS G12C represents a validated therapeutic target in non-small cell lung cancer (NSCLC) with strong genetic and clinical evidence. The G12C mutation, occurring in approximately 13% of NSCLC patients, results in a constitutively active GTP-bound KRAS protein that drives oncogenic signaling through the RAF-MEK-ERK and PI3K-AKT-mTOR pathways. The unique cysteine residue at position 12 provides a druggable handle for covalent inhibitors, as demonstrated by the clinical success of sotorasib and adagrasib. Despite initial responses, acquired resistance remains a significant challenge, motivating next-generation approaches including combination therapies, tri-complex inhibitors, and degrader strategies.

Molecular Biology

KRAS belongs to the RAS family of small GTPases that act as molecular switches cycling between active GTP-bound and inactive GDP-bound states. The G12C mutation impairs intrinsic GTPase activity and reduces sensitivity to GTPase-activating proteins (GAPs), resulting in prolonged activation of downstream effector pathways. Unlike wild-type KRAS, the G12C mutant retains residual GTPase activity, allowing it to cycle through the GDP-bound state — a property exploited by covalent inhibitors that bind exclusively to the inactive conformation.

The Switch II pocket, revealed by crystallographic studies, is a shallow groove adjacent to the mutant cysteine that accommodates covalent inhibitors. Binding to this pocket locks KRAS in the GDP-bound state, preventing nucleotide exchange and blocking interaction with downstream effectors RAF and PI3K. This mechanism is distinct from traditional kinase inhibition and represents a first-in-class approach to targeting RAS proteins, which were previously considered undruggable.

Key Signaling Pathways

  • • RAF → MEK → ERK (proliferation, survival)
  • • PI3K → AKT → mTOR (growth, metabolism)
  • • RalGDS → Ral (vesicle trafficking, invasion)
  • • TIAM1 → Rac (cytoskeletal remodeling)

Medicinal Chemistry

Covalent inhibitors of KRAS G12C exploit the mutant cysteine through an electrophilic warhead — typically an acrylamide — that forms an irreversible thioether bond. The first clinical compounds, sotorasib (AMG 510) and adagrasib (MRTX849), validated this approach with objective response rates of 37% and 43% respectively in previously treated NSCLC patients. Structure-activity relationship studies have identified key pharmacophoric features: a flat aromatic core for Switch II pocket occupancy, a linker region for optimal geometry, and the electrophilic warhead positioned for cysteine engagement.

Next-generation compounds aim to address resistance through several strategies: tri-complex inhibitors that engage both KRAS and cyclophilin A to achieve higher potency, KRAS-directed molecular degraders (PROTACs) that eliminate the protein entirely, and combination approaches targeting parallel or downstream pathways. Pan-KRAS inhibitors that target multiple KRAS mutations are also in development, potentially broadening the addressable patient population beyond G12C.

Competitive Landscape

CompoundMechanismPhaseORR
SotorasibCovalent Switch IIApproved37%
AdagrasibCovalent Switch IIApproved43%
DivarasibCovalent Switch IIPhase III54%
OlomorasibCovalent Switch IIPhase III50%
RMC-6236Tri-complex (pan-RAS)Phase II38%

Features

Text Selection Context Menu

Select any text in the content area to get a context menu with actions: Explain, Summarize, Ask about, or Send to chat.

Collapsible Side Panel

The copilot lives in a right-side panel that slides in and out, keeping the main content visible and accessible.

Context-Aware Responses

Selected text is sent as context with the user's question, enabling the assistant to provide targeted answers.

Streaming Chat Interface

Chat messages appear with a streaming indicator. In production, connect to the Agenecy API for real streaming responses.

Authentication

API Key

Paste an API key from Agenecy Settings → Account. The key is validated against GET /api/models and stored in sessionStorage for the browser session.

OAuth Popup (Roche SSO)

Opens a popup to Agenecy's login page. After SSO, the popup sends the session token back via postMessage. Requires a callback page on the Agenecy origin.

Implementation

Basic Usage

import { AgencyCopilotEmbed } from '@/components/examples/AgencyCopilotEmbed';

function App() {
  return (
    <div className="flex h-screen">
      <AgencyCopilotEmbed />
    </div>
  );
}

API Client (agenecy-client.ts)

The API client handles token management, model listing, and SSE streaming. It's a standalone module you can reuse in other components:

import {
  storeToken, getStoredToken, clearToken,
  validateApiKey, authenticateViaPopup,
  listModels, streamChatCompletion,
} from './agenecy-client';

// Validate and store a key
const valid = await validateApiKey('sk-...');
if (valid) storeToken('sk-...');

// List available models
const models = await listModels(token);

// Stream a chat completion
const abort = streamChatCompletion(token, 'gpt-4o', messages, {
  onToken: (chunk) => appendToUI(chunk),
  onDone: () => setLoading(false),
  onError: (err) => showError(err.message),
});

// Cancel the stream
abort.abort();

Customizing the Content Area

Replace SampleContent with your own application content. The text selection handler works on any text within the content ref:

<div ref={contentRef} onMouseUp={handleMouseUp}>
  {/* Your application content here */}
  <YourDashboard />
  <YourReportViewer />
</div>

Architecture

The component is structured as three cooperating pieces:

  • 1.Content Area — Renders your application content with a mouseup listener that detects text selection and shows the context menu.
  • 2.Context Menu — A floating menu positioned at the selection that offers predefined actions (Explain, Summarize, Ask, Quote).
  • 3.Chat Panel — A collapsible side panel with message history, streaming indicator, and input form. Messages can carry context from text selection.

Source Files

  • src/components/examples/AgencyCopilotEmbed.tsx
  • src/components/examples/agenecy-client.ts
  • src/components/examples/ARCHITECTURE.md
  • src/pages/examples/agency-copilot.astro