getcompanion-ai/co-mono
1
0
Fork 0
mirror of https://github.com/getcompanion-ai/co-mono.git synced 2026-04-21 22:01:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

create headerContainer for custom header (#1039)

Browse source
This commit is contained in:
Ted 2026-01-29 02:52:08 +01:00 • committed by GitHub
parent b54d689ec1
commit d88087334f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 39 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

63
packages/coding-agent/src/modes/interactive/interactive-mode.ts
View file

@ -230,6 +230,9 @@ export class InteractiveMode {
// Custom footer from extension (undefined = use built-in footer) // Custom footer from extension (undefined = use built-in footer)
private customFooter: (Component & { dispose?(): void }) | undefined = undefined; private customFooter: (Component & { dispose?(): void }) | undefined = undefined;
// Header container that holds the built-in or custom header
private headerContainer: Container;
// Built-in header (logo + keybinding hints + changelog) // Built-in header (logo + keybinding hints + changelog)
private builtInHeader: Component | undefined = undefined; private builtInHeader: Component | undefined = undefined;
@ -254,6 +257,7 @@ export class InteractiveMode {
this.session = session; this.session = session;
this.version = VERSION; this.version = VERSION;
this.ui = new TUI(new ProcessTerminal(), this.settingsManager.getShowHardwareCursor()); this.ui = new TUI(new ProcessTerminal(), this.settingsManager.getShowHardwareCursor());
this.headerContainer = new Container();
this.chatContainer = new Container(); this.chatContainer = new Container();
this.pendingMessagesContainer = new Container(); this.pendingMessagesContainer = new Container();
this.statusContainer = new Container(); this.statusContainer = new Container();
@ -379,6 +383,9 @@ export class InteractiveMode {
this.fdPath = await ensureTool("fd"); this.fdPath = await ensureTool("fd");
this.setupAutocomplete(this.fdPath); this.setupAutocomplete(this.fdPath);
// Add header container as first child
this.ui.addChild(this.headerContainer);
// Add header with keybindings from config (unless silenced) // Add header with keybindings from config (unless silenced)
if (this.options.verbose || !this.settingsManager.getQuietStartup()) { if (this.options.verbose || !this.settingsManager.getQuietStartup()) {
const logo = theme.bold(theme.fg("accent", APP_NAME)) + theme.fg("dim", ` v${this.version}`); const logo = theme.bold(theme.fg("accent", APP_NAME)) + theme.fg("dim", ` v${this.version}`);
@ -411,36 +418,39 @@ export class InteractiveMode {
this.builtInHeader = new Text(`${logo}\n${instructions}`, 1, 0); this.builtInHeader = new Text(`${logo}\n${instructions}`, 1, 0);
// Setup UI layout // Setup UI layout
this.ui.addChild(new Spacer(1)); this.headerContainer.addChild(new Spacer(1));
this.ui.addChild(this.builtInHeader); this.headerContainer.addChild(this.builtInHeader);
this.ui.addChild(new Spacer(1)); this.headerContainer.addChild(new Spacer(1));
// Add changelog if provided // Add changelog if provided
if (this.changelogMarkdown) { if (this.changelogMarkdown) {
this.ui.addChild(new DynamicBorder()); this.headerContainer.addChild(new DynamicBorder());
if (this.settingsManager.getCollapseChangelog()) { if (this.settingsManager.getCollapseChangelog()) {
const versionMatch = this.changelogMarkdown.match(/##\s+\[?(\d+\.\d+\.\d+)\]?/); const versionMatch = this.changelogMarkdown.match(/##\s+\[?(\d+\.\d+\.\d+)\]?/);
const latestVersion = versionMatch ? versionMatch[1] : this.version; const latestVersion = versionMatch ? versionMatch[1] : this.version;
const condensedText = `Updated to v${latestVersion}. Use ${theme.bold("/changelog")} to view full changelog.`; const condensedText = `Updated to v${latestVersion}. Use ${theme.bold("/changelog")} to view full changelog.`;
this.ui.addChild(new Text(condensedText, 1, 0)); this.headerContainer.addChild(new Text(condensedText, 1, 0));
} else { } else {
this.ui.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0)); this.headerContainer.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0));
this.ui.addChild(new Spacer(1)); this.headerContainer.addChild(new Spacer(1));
this.ui.addChild(new Markdown(this.changelogMarkdown.trim(), 1, 0, this.getMarkdownThemeWithSettings())); this.headerContainer.addChild(
this.ui.addChild(new Spacer(1)); new Markdown(this.changelogMarkdown.trim(), 1, 0, this.getMarkdownThemeWithSettings()),
);
this.headerContainer.addChild(new Spacer(1));
} }
this.ui.addChild(new DynamicBorder()); this.headerContainer.addChild(new DynamicBorder());
} }
} else { } else {
// Minimal header when silenced // Minimal header when silenced
this.builtInHeader = new Text("", 0, 0); this.builtInHeader = new Text("", 0, 0);
this.headerContainer.addChild(this.builtInHeader);
if (this.changelogMarkdown) { if (this.changelogMarkdown) {
// Still show changelog notification even in silent mode // Still show changelog notification even in silent mode
this.ui.addChild(new Spacer(1)); this.headerContainer.addChild(new Spacer(1));
const versionMatch = this.changelogMarkdown.match(/##\s+\[?(\d+\.\d+\.\d+)\]?/); const versionMatch = this.changelogMarkdown.match(/##\s+\[?(\d+\.\d+\.\d+)\]?/);
const latestVersion = versionMatch ? versionMatch[1] : this.version; const latestVersion = versionMatch ? versionMatch[1] : this.version;
const condensedText = `Updated to v${latestVersion}. Use ${theme.bold("/changelog")} to view full changelog.`; const condensedText = `Updated to v${latestVersion}. Use ${theme.bold("/changelog")} to view full changelog.`;
this.ui.addChild(new Text(condensedText, 1, 0)); this.headerContainer.addChild(new Text(condensedText, 1, 0));
} }
} }
@ -457,6 +467,9 @@ export class InteractiveMode {
this.setupKeyHandlers(); this.setupKeyHandlers();
this.setupEditorSubmitHandler(); this.setupEditorSubmitHandler();
// Render initial messages before starting the UI to avoid layout jump
this.renderInitialMessages();
// Start the UI // Start the UI
this.ui.start(); this.ui.start();
this.isInitialized = true; this.isInitialized = true;
@ -513,8 +526,6 @@ export class InteractiveMode {
} }
}); });
this.renderInitialMessages();
// Show startup warnings // Show startup warnings
const { migratedProviders, modelFallbackMessage, initialMessage, initialImages, initialMessages } = this.options; const { migratedProviders, modelFallbackMessage, initialMessage, initialImages, initialMessages } = this.options;
@ -1296,21 +1307,25 @@ export class InteractiveMode {
this.customHeader.dispose(); this.customHeader.dispose();
} }
// Remove current header from UI // Find the index of the current header in the header container
if (this.customHeader) { const currentHeader = this.customHeader || this.builtInHeader;
this.ui.removeChild(this.customHeader); const index = this.headerContainer.children.indexOf(currentHeader);
} else {
this.ui.removeChild(this.builtInHeader);
}
if (factory) { if (factory) {
// Create and add custom header at position 1 (after initial spacer) // Create and add custom header
this.customHeader = factory(this.ui, theme); this.customHeader = factory(this.ui, theme);
this.ui.children.splice(1, 0, this.customHeader); if (index !== -1) {
this.headerContainer.children[index] = this.customHeader;
} else {
// If not found (e.g. builtInHeader was never added), add at the top
this.headerContainer.children.unshift(this.customHeader);
}
} else { } else {
// Restore built-in header at position 1 // Restore built-in header
this.customHeader = undefined; this.customHeader = undefined;
this.ui.children.splice(1, 0, this.builtInHeader); if (index !== -1) {
this.headerContainer.children[index] = this.builtInHeader;
}
} }
this.ui.requestRender(); this.ui.requestRender();