andy-stack_vaultkeeper-ai/Views/MainView.ts
Andrew Beal 4dcce63bce fix: improve mobile UI layout and interaction handling
- Add mobile-specific height constraints for input buttons
- Fix message alignment to left for better readability
- Change click to mousedown for better mobile responsiveness
- Adjust top bar grid columns for mobile layout
- Update view type identifier to 'ai-agent-main-view'
- Standardize quote style to double quotes across config files
2025-11-04 22:51:22 +00:00

66 lines
No EOL
1.5 KiB
TypeScript

import { ItemView, WorkspaceLeaf } from 'obsidian';
import { mount, unmount } from 'svelte';
import ChatWindow from 'Components/ChatWindow.svelte';
import TopBar from 'Components/TopBar.svelte';
import type { StatusBarService } from 'Services/StatusBarService';
import { Resolve } from 'Services/DependencyService';
import { Services } from 'Services/Services';
export const VIEW_TYPE_MAIN = 'ai-agent-main-view';
export class MainView extends ItemView {
private statusBarService: StatusBarService = Resolve<StatusBarService>(Services.StatusBarService);
constructor(leaf: WorkspaceLeaf) {
super(leaf);
}
topBar: ReturnType<typeof TopBar> | undefined;
input: ReturnType<typeof ChatWindow> | undefined;
getViewType() {
return VIEW_TYPE_MAIN;
}
getDisplayText() {
return "AI Agent";
}
getIcon(): string {
return 'sparkles';
}
async onOpen() {
const container = this.contentEl;
container.empty();
// Mount TopBar with reference to ChatWindow's focus function
this.topBar = mount(TopBar, {
target: container,
props: {
leaf: this.leaf,
onNewConversation: () => {
this.input?.resetChatArea();
this.input?.focusInput();
}
}
});
// Mount ChatWindow first
this.input = mount(ChatWindow, {
target: container,
props: {}
});
}
async onClose() {
if (this.topBar) {
unmount(this.topBar);
}
if (this.input) {
unmount(this.input);
}
this.statusBarService.removeStatusBarMessage();
}
}