@yancyyu/openhermit 1.5.8

package/src/renderer/components/extensions/skills/skillDraftUtils.ts

@@ -0,0 +1,234 @@
+import YAML from 'yaml';
+
+import type { SkillDraftFile, SkillDraftTemplateInput } from '@shared/types/extensions';
+
+const SKILL_FRONTMATTER_PATTERN = /^---\r?\n([\s\S]*?)\r?\n---\r?\n?([\s\S]*)$/u;
+const SECTION_TITLES = ['When to use', 'Steps', 'Notes'] as const;
+
+export interface SkillDraftOptions {
+  rawContent: string;
+  includeScripts: boolean;
+  includeReferences: boolean;
+  includeAssets: boolean;
+}
+
+export interface SkillTemplateParseResult extends Partial<SkillDraftTemplateInput> {
+  bodyMarkdown?: string;
+  hasStructuredSections: boolean;
+  hasUnstructuredBody: boolean;
+}
+
+function trimTrailingWhitespace(value: string): string {
+  return value
+    .split('\n')
+    .map((line) => line.replace(/\s+$/u, ''))
+    .join('\n')
+    .trim();
+}
+
+export function buildSkillTemplate(input: SkillDraftTemplateInput): string {
+  const whenToUse = normalizeSectionContent(input.whenToUse, [
+    '- Add the conditions where this skill should be selected.',
+  ]);
+  const steps = normalizeSectionContent(input.steps, [
+    '1. Describe the first step.',
+    '2. Describe the second step.',
+  ]);
+  const notes = normalizeSectionContent(input.notes, [
+    '- Add caveats, review rules, or references.',
+  ]);
+  const lines = [
+    '---',
+    `name: ${input.name || 'New Skill'}`,
+    `description: ${input.description || 'Describe what this skill helps with.'}`,
+    ...(input.license ? [`license: ${input.license}`] : []),
+    ...(input.compatibility ? [`compatibility: ${input.compatibility}`] : []),
+    ...(input.invocationMode === 'manual-only' ? ['disable-model-invocation: true'] : []),
+    '---',
+    '',
+    `# ${input.name || 'New Skill'}`,
+    '',
+    input.description || 'Describe what this skill helps with.',
+    '',
+    '## When to use',
+    ...whenToUse,
+    '',
+    '## Steps',
+    ...steps,
+    '',
+    '## Notes',
+    ...notes,
+  ];
+
+  return trimTrailingWhitespace(lines.join('\n'));
+}
+
+export function readSkillTemplateContent(rawContent: string): SkillTemplateParseResult {
+  const content = rawContent.replace(/^\uFEFF/u, '');
+  const match = SKILL_FRONTMATTER_PATTERN.exec(content);
+  if (!match) {
+    return {
+      hasStructuredSections: false,
+      hasUnstructuredBody: content.trim().length > 0,
+      bodyMarkdown: content.trim() || undefined,
+    };
+  }
+
+  try {
+    const parsed = YAML.parse(match[1]);
+    if (!parsed || typeof parsed !== 'object' || Array.isArray(parsed)) {
+      const bodyMarkdown = (match[2] ?? '').trim() || undefined;
+      return {
+        hasStructuredSections: false,
+        hasUnstructuredBody: Boolean(bodyMarkdown),
+        bodyMarkdown,
+      };
+    }
+
+    const data = parsed as Record<string, unknown>;
+    const body = match[2] ?? '';
+    const whenToUse = extractSection(body, 'When to use');
+    const steps = extractSection(body, 'Steps');
+    const notes = extractSection(body, 'Notes');
+    const bodyMarkdown = body.trim() || undefined;
+    const hasStructuredSections = Boolean(whenToUse || steps || notes);
+    return {
+      name: typeof data.name === 'string' ? data.name : undefined,
+      description: typeof data.description === 'string' ? data.description : undefined,
+      license: typeof data.license === 'string' ? data.license : undefined,
+      compatibility: typeof data.compatibility === 'string' ? data.compatibility : undefined,
+      invocationMode: data['disable-model-invocation'] === true ? 'manual-only' : 'auto',
+      whenToUse,
+      steps,
+      notes,
+      bodyMarkdown,
+      hasStructuredSections,
+      hasUnstructuredBody: Boolean(bodyMarkdown) && !hasStructuredSections,
+    };
+  } catch {
+    const bodyMarkdown = (match[2] ?? '').trim() || undefined;
+    return {
+      hasStructuredSections: false,
+      hasUnstructuredBody: Boolean(bodyMarkdown),
+      bodyMarkdown,
+    };
+  }
+}
+
+export function readSkillTemplateInput(rawContent: string): Partial<SkillDraftTemplateInput> {
+  const {
+    bodyMarkdown: _bodyMarkdown,
+    hasStructuredSections: _hasStructuredSections,
+    hasUnstructuredBody: _hasUnstructuredBody,
+    ...input
+  } = readSkillTemplateContent(rawContent);
+  return input;
+}
+
+export function updateSkillTemplateFrontmatter(
+  rawContent: string,
+  input: SkillDraftTemplateInput
+): string {
+  const content = rawContent.replace(/^\uFEFF/u, '');
+  const match = SKILL_FRONTMATTER_PATTERN.exec(content);
+  const body = match ? (match[2] ?? '') : content;
+
+  let data: Record<string, unknown> = {};
+  if (match) {
+    try {
+      const parsed = YAML.parse(match[1]);
+      if (parsed && typeof parsed === 'object' && !Array.isArray(parsed)) {
+        data = { ...(parsed as Record<string, unknown>) };
+      }
+    } catch {
+      data = {};
+    }
+  }
+
+  data.name = input.name || 'New Skill';
+  data.description = input.description || 'Describe what this skill helps with.';
+
+  if (input.license) {
+    data.license = input.license;
+  } else {
+    delete data.license;
+  }
+
+  if (input.compatibility) {
+    data.compatibility = input.compatibility;
+  } else {
+    delete data.compatibility;
+  }
+
+  if (input.invocationMode === 'manual-only') {
+    data['disable-model-invocation'] = true;
+  } else {
+    delete data['disable-model-invocation'];
+  }
+
+  const frontmatter = YAML.stringify(data).trimEnd();
+  const normalizedBody = body.replace(/^\n+/u, '');
+  return `---\n${frontmatter}\n---${normalizedBody ? `\n\n${normalizedBody}` : '\n'}`;
+}
+
+export function buildSkillDraftFiles(options: SkillDraftOptions): SkillDraftFile[] {
+  const files: SkillDraftFile[] = [{ relativePath: 'SKILL.md', content: options.rawContent }];
+
+  if (options.includeReferences) {
+    files.push({
+      relativePath: 'references/README.md',
+      content: '# References\n\nAdd supporting docs, examples, or links for this skill.\n',
+    });
+  }
+
+  if (options.includeScripts) {
+    files.push({
+      relativePath: 'scripts/README.md',
+      content: '# Scripts\n\nAdd optional helper scripts used by this skill.\n',
+    });
+  }
+
+  if (options.includeAssets) {
+    files.push({
+      relativePath: 'assets/README.md',
+      content: '# Assets\n\nStore screenshots or other bundled assets here.\n',
+    });
+  }
+
+  return files;
+}
+
+function normalizeSectionContent(value: string, fallbackLines: string[]): string[] {
+  const lines = value
+    .split('\n')
+    .map((line) => line.trimEnd())
+    .filter(
+      (line, index, allLines) =>
+        line.length > 0 || allLines.some((candidate) => candidate.length > 0)
+    );
+
+  return lines.some((line) => line.trim().length > 0) ? lines : fallbackLines;
+}
+
+function extractSection(body: string, title: (typeof SECTION_TITLES)[number]): string | undefined {
+  const normalizedBody = body.replace(/\r\n/g, '\n');
+  const heading = `## ${title}\n`;
+  const startIndex = normalizedBody.indexOf(heading);
+  if (startIndex === -1) {
+    return undefined;
+  }
+
+  const bodyStartIndex = startIndex + heading.length;
+  const nextSectionIndex = SECTION_TITLES.map((sectionTitle) =>
+    sectionTitle === title ? -1 : normalizedBody.indexOf(`\n## ${sectionTitle}\n`, bodyStartIndex)
+  )
+    .filter((index) => index >= 0)
+    .sort((a, b) => a - b)[0];
+
+  const rawSection =
+    nextSectionIndex === undefined
+      ? normalizedBody.slice(bodyStartIndex)
+      : normalizedBody.slice(bodyStartIndex, nextSectionIndex);
+
+  return rawSection.trim() || undefined;
+}

package/src/renderer/components/extensions/skills/skillFolderNameUtils.ts

@@ -0,0 +1,19 @@
+export function toSuggestedSkillFolderName(value: string, fallback = 'new-skill'): string {
+  const normalized = value
+    .normalize('NFKD')
+    .replace(/[^\x00-\x7F]/g, '')
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, '-')
+    .replace(/^-+|-+$/g, '')
+    .slice(0, 80);
+
+  return normalized || fallback;
+}
+
+export function getSuggestedSkillFolderNameFromPath(
+  value: string,
+  fallback = 'imported-skill'
+): string {
+  const segments = value.split(/[\\/]/u).filter(Boolean);
+  return toSuggestedSkillFolderName(segments.at(-1) ?? '', fallback);
+}

package/src/renderer/components/extensions/skills/skillProjectUtils.ts

@@ -0,0 +1,13 @@
+import type { SkillScope } from '@shared/types/extensions';
+
+export function resolveSkillProjectPath(
+  scope: SkillScope,
+  currentProjectPath: string | null,
+  itemProjectRoot?: string | null
+): string | undefined {
+  if (scope !== 'project') {
+    return undefined;
+  }
+
+  return itemProjectRoot ?? currentProjectPath ?? undefined;
+}

package/src/renderer/components/extensions/skills/skillValidationUtils.ts

@@ -0,0 +1,31 @@
+const MAX_SKILL_FOLDER_NAME_LENGTH = 255;
+const INVALID_SKILL_FOLDER_NAME_CHARS = /[\x00-\x1f/\\:*?"<>|]/u;
+
+export function validateSkillImportSourceDir(value: string): string | null {
+  if (value.trim().length === 0) {
+    return 'Choose a skill folder to import.';
+  }
+
+  return null;
+}
+
+export function validateSkillFolderName(value: string): string | null {
+  const trimmed = value.trim();
+  if (trimmed.length === 0) {
+    return 'Choose a folder name for this skill.';
+  }
+
+  if (trimmed.length > MAX_SKILL_FOLDER_NAME_LENGTH) {
+    return `Folder name must be ${MAX_SKILL_FOLDER_NAME_LENGTH} characters or fewer.`;
+  }
+
+  if (trimmed === '.' || trimmed === '..') {
+    return 'Pick a simpler folder name using letters, numbers, dots, dashes, or underscores.';
+  }
+
+  if (INVALID_SKILL_FOLDER_NAME_CHARS.test(trimmed)) {
+    return 'Pick a simpler folder name using letters, numbers, dots, dashes, or underscores.';
+  }
+
+  return null;
+}

package/src/renderer/components/layout/MiddlePanel.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+import { ChatHistory } from '../chat/ChatHistory';
+import { SearchBar } from '../search/SearchBar';
+
+interface MiddlePanelProps {
+  /** Tab ID for per-tab state isolation (scroll position, etc.) */
+  tabId?: string;
+}
+
+export const MiddlePanel: React.FC<MiddlePanelProps> = ({ tabId }) => {
+  return (
+    <div className="relative flex h-full flex-col">
+      <SearchBar tabId={tabId} />
+      <ChatHistory tabId={tabId} />
+    </div>
+  );
+};

package/src/renderer/components/layout/MoreMenu.tsx

@@ -0,0 +1,243 @@
+/**
+ * MoreMenu - Dropdown menu behind a "..." icon for less-frequent toolbar actions.
+ *
+ * Groups: Notifications, Settings, Search, Export (session-only), Analyze (session-only).
+ * Closes on outside click or Escape.
+ */
+
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+
+import { Tooltip, TooltipContent, TooltipTrigger } from '@renderer/components/ui/tooltip';
+import { useStore } from '@renderer/store';
+import { triggerDownload } from '@renderer/utils/sessionExporter';
+import { formatShortcut } from '@renderer/utils/stringUtils';
+import {
+  Activity,
+  Bell,
+  Braces,
+  Calendar,
+  FileText,
+  MoreHorizontal,
+  Search,
+  Settings,
+  Type,
+} from 'lucide-react';
+import { useShallow } from 'zustand/react/shallow';
+
+import type { SessionDetail } from '@renderer/types/data';
+import type { Tab } from '@renderer/types/tabs';
+import type { ExportFormat } from '@renderer/utils/sessionExporter';
+
+interface MoreMenuProps {
+  activeTab: Tab | undefined;
+  activeTabSessionDetail: SessionDetail | null;
+  activeTabId: string | null;
+  unreadCount: number;
+}
+
+interface MenuItem {
+  id: string;
+  label: string;
+  icon: React.ComponentType<{ className?: string }>;
+  shortcut?: string;
+  onClick: () => void;
+}
+
+export const MoreMenu = ({
+  activeTab,
+  activeTabSessionDetail,
+  activeTabId,
+  unreadCount,
+}: Readonly<MoreMenuProps>): React.JSX.Element => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [buttonHover, setButtonHover] = useState(false);
+  const [hoveredId, setHoveredId] = useState<string | null>(null);
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  const { openCommandPalette, openNotificationsTab, openSessionReport, openSettingsTab } = useStore(
+    useShallow((s) => ({
+      openCommandPalette: () => s.openCommandPalette(),
+      openNotificationsTab: () => s.openNotificationsTab(),
+      openSessionReport: (tabId: string) => s.openSessionReport(tabId),
+      openSettingsTab: () => s.openSettingsTab(),
+    }))
+  );
+
+  // Close on outside click
+  useEffect(() => {
+    if (!isOpen) return;
+
+    const handleClickOutside = (event: MouseEvent): void => {
+      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {
+        setIsOpen(false);
+      }
+    };
+
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => document.removeEventListener('mousedown', handleClickOutside);
+  }, [isOpen]);
+
+  // Close on Escape
+  useEffect(() => {
+    if (!isOpen) return;
+
+    const handleEscape = (event: KeyboardEvent): void => {
+      if (event.key === 'Escape') {
+        setIsOpen(false);
+      }
+    };
+
+    document.addEventListener('keydown', handleEscape);
+    return () => document.removeEventListener('keydown', handleEscape);
+  }, [isOpen]);
+
+  const handleExport = useCallback(
+    (format: ExportFormat) => {
+      if (activeTabSessionDetail) {
+        triggerDownload(activeTabSessionDetail, format);
+      }
+      setIsOpen(false);
+    },
+    [activeTabSessionDetail]
+  );
+
+  const isSessionWithData = activeTab?.type === 'session' && activeTabSessionDetail != null;
+
+  // Build menu sections
+  const topItems: MenuItem[] = [
+    {
+      id: 'notifications',
+      label: unreadCount > 0 ? `通知 (${unreadCount > 99 ? '99+' : unreadCount})` : '通知',
+      icon: Bell,
+      onClick: () => {
+        openNotificationsTab();
+        setIsOpen(false);
+      },
+    },
+    {
+      id: 'search',
+      label: '搜索',
+      icon: Search,
+      shortcut: formatShortcut('K'),
+      onClick: () => {
+        openCommandPalette();
+        setIsOpen(false);
+      },
+    },
+    {
+      id: 'settings',
+      label: '设置',
+      icon: Settings,
+      onClick: () => {
+        openSettingsTab();
+        setIsOpen(false);
+      },
+    },
+  ];
+
+  const sessionItems: MenuItem[] = isSessionWithData
+    ? [
+        {
+          id: 'export-md',
+          label: '导出为 Markdown',
+          icon: FileText,
+          shortcut: '.md',
+          onClick: () => handleExport('markdown'),
+        },
+        {
+          id: 'export-json',
+          label: '导出为 JSON',
+          icon: Braces,
+          shortcut: '.json',
+          onClick: () => handleExport('json'),
+        },
+        {
+          id: 'export-txt',
+          label: '导出为纯文本',
+          icon: Type,
+          shortcut: '.txt',
+          onClick: () => handleExport('plaintext'),
+        },
+        {
+          id: 'analyze',
+          label: '分析会话',
+          icon: Activity,
+          onClick: () => {
+            if (activeTabId) openSessionReport(activeTabId);
+            setIsOpen(false);
+          },
+        },
+      ]
+    : [];
+
+  const renderItem = (item: MenuItem): React.JSX.Element => (
+    <button
+      key={item.id}
+      onClick={item.onClick}
+      onMouseEnter={() => setHoveredId(item.id)}
+      onMouseLeave={() => setHoveredId(null)}
+      className="flex w-full items-center gap-2.5 px-3 py-2 text-left text-xs transition-colors"
+      style={{
+        color: hoveredId === item.id ? 'var(--color-text)' : 'var(--color-text-secondary)',
+        backgroundColor: hoveredId === item.id ? 'var(--color-surface-raised)' : 'transparent',
+      }}
+    >
+      <item.icon className="size-3.5" />
+      <span className="flex-1">{item.label}</span>
+      {item.shortcut && (
+        <span className="text-[10px]" style={{ color: 'var(--color-text-muted)' }}>
+          {item.shortcut}
+        </span>
+      )}
+    </button>
+  );
+
+  const separator = (
+    <div className="my-0.5" style={{ borderBottom: '1px solid var(--color-border)' }} />
+  );
+
+  return (
+    <div ref={containerRef} className="relative">
+      {/* Trigger button */}
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <button
+            onClick={() => setIsOpen(!isOpen)}
+            onMouseEnter={() => setButtonHover(true)}
+            onMouseLeave={() => setButtonHover(false)}
+            className="rounded-md p-2 transition-colors"
+            style={{
+              color: buttonHover || isOpen ? 'var(--color-text)' : 'var(--color-text-muted)',
+              backgroundColor:
+                buttonHover || isOpen ? 'var(--color-surface-raised)' : 'transparent',
+            }}
+            aria-label="更多操作"
+          >
+            <MoreHorizontal className="size-4" />
+          </button>
+        </TooltipTrigger>
+        <TooltipContent side="bottom">更多操作</TooltipContent>
+      </Tooltip>
+
+      {/* Dropdown menu */}
+      {isOpen && (
+        <div
+          className="absolute right-0 top-full z-50 mt-1 w-64 overflow-hidden rounded-md border py-1 shadow-lg"
+          style={{
+            backgroundColor: 'var(--color-surface-overlay)',
+            borderColor: 'var(--color-border)',
+          }}
+        >
+          {topItems.map(renderItem)}
+
+          {sessionItems.length > 0 && (
+            <>
+              {separator}
+              {sessionItems.map(renderItem)}
+            </>
+          )}
+        </div>
+      )}
+    </div>
+  );
+};

package/src/renderer/components/layout/PaneContainer.tsx

@@ -0,0 +1,27 @@
+/**
+ * PaneContainer - Horizontal flex container that renders panes side by side.
+ * DndContext is owned by TabbedLayout (parent) for cross-component tab DnD.
+ */
+
+import { Fragment } from 'react';
+
+import { useStore } from '@renderer/store';
+import { useShallow } from 'zustand/react/shallow';
+
+import { PaneResizeHandle } from './PaneResizeHandle';
+import { PaneView } from './PaneView';
+
+export const PaneContainer = (): React.JSX.Element => {
+  const panes = useStore(useShallow((s) => s.paneLayout.panes));
+
+  return (
+    <div id="pane-container" className="flex flex-1 overflow-hidden">
+      {panes.map((pane, i) => (
+        <Fragment key={pane.id}>
+          {i > 0 && <PaneResizeHandle leftPaneId={panes[i - 1].id} rightPaneId={pane.id} />}
+          <PaneView paneId={pane.id} />
+        </Fragment>
+      ))}
+    </div>
+  );
+};

package/src/renderer/components/layout/PaneContent.tsx

@@ -0,0 +1,84 @@
+/**
+ * PaneContent - Renders tab content for a single pane.
+ * Uses CSS display-toggle to keep all tabs mounted (preserving state).
+ */
+
+import { TeamGraphTab } from '@features/agent-graph/renderer';
+import { TabUIProvider } from '@renderer/contexts/TabUIContext';
+
+import { DashboardView } from '../dashboard/DashboardView';
+import { ExtensionStoreView } from '../extensions/ExtensionStoreView';
+import { NotificationsView } from '../notifications/NotificationsView';
+import { SessionReportTab } from '../report/SessionReportTab';
+import { SchedulesView } from '../schedules/SchedulesView';
+import { SettingsView } from '../settings/SettingsView';
+import { TeamDetailView } from '../team/TeamDetailView';
+import { TeamListView } from '../team/TeamListView';
+
+import { SessionTabContent } from './SessionTabContent';
+
+import type { Pane } from '@renderer/types/panes';
+
+interface PaneContentProps {
+  pane: Pane;
+  isPaneFocused: boolean;
+}
+
+export const PaneContent = ({ pane, isPaneFocused }: PaneContentProps): React.JSX.Element => {
+  const activeTabId = pane.activeTabId;
+
+  // Show the team workspace by default so startup avoids dashboard background scans.
+  const showDefaultTeams = !activeTabId && pane.tabs.length === 0;
+
+  return (
+    <div className="relative flex flex-1 overflow-hidden">
+      {showDefaultTeams && (
+        <div className="absolute inset-0 flex">
+          <TeamListView />
+        </div>
+      )}
+
+      {pane.tabs.map((tab) => {
+        const isActive = tab.id === activeTabId;
+        return (
+          <div
+            key={tab.id}
+            className="absolute inset-0 flex"
+            style={{ display: isActive ? 'flex' : 'none' }}
+          >
+            {tab.type === 'dashboard' && <DashboardView />}
+            {tab.type === 'notifications' && <NotificationsView />}
+            {tab.type === 'settings' && <SettingsView />}
+            {tab.type === 'teams' && <TeamListView />}
+            {tab.type === 'team' && (
+              <TabUIProvider tabId={tab.id}>
+                <TeamDetailView teamName={tab.teamName ?? ''} isPaneFocused={isPaneFocused} />
+              </TabUIProvider>
+            )}
+            {tab.type === 'session' && (
+              <TabUIProvider tabId={tab.id}>
+                <SessionTabContent tab={tab} isActive={isActive} />
+              </TabUIProvider>
+            )}
+            {tab.type === 'report' && <SessionReportTab tab={tab} />}
+            {tab.type === 'extensions' && (
+              <TabUIProvider tabId={tab.id}>
+                <ExtensionStoreView />
+              </TabUIProvider>
+            )}
+            {tab.type === 'schedules' && <SchedulesView />}
+            {tab.type === 'graph' && (
+              <TabUIProvider tabId={tab.id}>
+                <TeamGraphTab
+                  teamName={tab.teamName ?? ''}
+                  isActive={isActive}
+                  isPaneFocused={isPaneFocused}
+                />
+              </TabUIProvider>
+            )}
+          </div>
+        );
+      })}
+    </div>
+  );
+};