perf: reduce re-renders, fix mobile keyboard handling, add chunk load recovery, and improve PATH management (#1028)

* fix: exclude file content from reverted prompt text Revert and fork now restore only the user's original prompt, not server-injected file content Uses existing isSyntheticPart helper for type-safe filtering * fix: keep scrollbar visible when hovering over thumb * fix: prevent ESC abort from triggering when terminal is focused * fix: pass directory to permission/question reply calls so approvals actually resolve * fix: default model selection not responding after Base UI migration * fix: prevent modal content from shifting and clipping footer buttons * fix: improve session switching performance and add sub-agent export with prompt collapse Defer viewport anchor saving to eliminate ~800ms UI freeze when switching sessions Add export dialog to include sub-agent tasks recursively in markdown export Add collapse chevron button for expanded user prompts in sticky header * fix: resolve sidebar scroll and TDZ crash in session sidebar * perf: reduce CPU overhead and re-renders across chat, layout, and settings * fix: position collapse button at top of message and prevent ESC abort in terminal * fix: position collapse button at top and add padding only when expanded * refactor: extract shared PATH utilities and mobile keyboard hook * refactor: import shared path-utils in electron, use module-level style constants - Electron now imports pathLooksUserConfigured/mergePathValues from shared path-utils.js instead of inline duplication - ToolPart collapsedCustomStyle moved from useMemo([]) to module const * fix: resolve remaining merge conflicts and type errors - Remove duplicate variable declarations in SessionNodeItem - Remove orphaned export callback body from conflict resolution - Fix HelpDialog description -> descriptionKey (i18n rename) * fix: resolve type-check and lint errors in session-actions.test.ts - Added missing bun:test type declarations (beforeEach, mock, mock.module) - Removed unused State import - Replaced 'as any' casts with proper OpencodeClient and ChildStoreManager types - Added eslint-disable for unused _ parameter in mock function * fix PR 1028 export and PATH edge cases * fix startup retry exhaustion state * remove opencode package lock change * fix sub-session rename cancellation --------- Co-authored-by: Bohdan Triapitsyn <artmore@protonmail.com>
2026-04-26 16:24:07 +03:00
parent 632e6cc97b
commit 4523e9c486
87 changed files with 1918 additions and 703 deletions
@@ -4,6 +4,7 @@ import { Input } from '@/components/ui/input';
 import { Textarea } from '@/components/ui/textarea';
 import { toast } from '@/components/ui';
 import { useSkillsStore, type SkillConfig, type SkillScope, type SupportingFile, type PendingFile } from '@/stores/useSkillsStore';
+import { useShallow } from 'zustand/react/shallow';
 import { RiAddLine, RiBookOpenLine, RiDeleteBinLine, RiFileLine, RiFolderLine, RiRobot2Line, RiUser3Line } from '@remixicon/react';
 import { ScrollableOverlay } from '@/components/ui/ScrollableOverlay';
 import {
@@ -39,17 +40,27 @@ const SkillsCatalogStandalone: React.FC = () => (

 const SkillsInstalledPage: React.FC = () => {
  const { t } = useI18n();
-  const { 
-    selectedSkillName, 
-    getSkillByName, 
+  const {
+    selectedSkillName,
+    getSkillByName,
    getSkillDetail,
-    createSkill, 
-    updateSkill, 
-    skills, 
-    skillDraft, 
+    createSkill,
+    updateSkill,
+    skills,
+    skillDraft,
    setSkillDraft,
    setSelectedSkill,
-  } = useSkillsStore();
+  } = useSkillsStore(useShallow((s) => ({
+    selectedSkillName: s.selectedSkillName,
+    getSkillByName: s.getSkillByName,
+    getSkillDetail: s.getSkillDetail,
+    createSkill: s.createSkill,
+    updateSkill: s.updateSkill,
+    skills: s.skills,
+    skillDraft: s.skillDraft,
+    setSkillDraft: s.setSkillDraft,
+    setSelectedSkill: s.setSelectedSkill,
+  })));

  const selectedSkill = selectedSkillName ? getSkillByName(selectedSkillName) : null;
  const isNewSkill = Boolean(skillDraft && skillDraft.name === selectedSkillName && !selectedSkill);
@@ -19,6 +19,7 @@ import {
 } from '@/components/ui/dropdown-menu';
 import { RiAddLine, RiDeleteBinLine, RiFileCopyLine, RiMore2Line, RiEditLine, RiBookOpenLine } from '@remixicon/react';
 import { useSkillsStore, type DiscoveredSkill } from '@/stores/useSkillsStore';
+import { useShallow } from 'zustand/react/shallow';
 import { cn } from '@/lib/utils';
 import { ScrollableOverlay } from '@/components/ui/ScrollableOverlay';
 import { SettingsProjectSelector } from '@/components/sections/shared/SettingsProjectSelector';
@@ -45,7 +46,15 @@ export const SkillsSidebar: React.FC<SkillsSidebarProps> = ({ onItemSelect }) =>
    createSkill,
    deleteSkill,
    getSkillDetail,
-  } = useSkillsStore();
+  } = useSkillsStore(useShallow((s) => ({
+    selectedSkillName: s.selectedSkillName,
+    skills: s.skills,
+    setSelectedSkill: s.setSelectedSkill,
+    setSkillDraft: s.setSkillDraft,
+    createSkill: s.createSkill,
+    deleteSkill: s.deleteSkill,
+    getSkillDetail: s.getSkillDetail,
+  })));

  // Skills are loaded by the Settings shell when this page is active.

@@ -79,7 +79,9 @@ interface AddCatalogDialogProps {

 export const AddCatalogDialog: React.FC<AddCatalogDialogProps> = ({ open, onOpenChange }) => {
  const { t } = useI18n();
-  const { scanRepo, loadCatalog, isScanning } = useSkillsCatalogStore();
+  const scanRepo = useSkillsCatalogStore((s) => s.scanRepo);
+  const loadCatalog = useSkillsCatalogStore((s) => s.loadCatalog);
+  const isScanning = useSkillsCatalogStore((s) => s.isScanning);
  const defaultGitIdentityId = useGitIdentitiesStore((s) => s.defaultGitIdentityId);
  const loadDefaultGitIdentityId = useGitIdentitiesStore((s) => s.loadDefaultGitIdentityId);

@@ -46,7 +46,10 @@ type IdentityOption = { id: string; name: string };

 export const InstallFromRepoDialog: React.FC<InstallFromRepoDialogProps> = ({ open, onOpenChange }) => {
  const { t } = useI18n();
-  const { scanRepo, installSkills, isScanning, isInstalling } = useSkillsCatalogStore();
+  const scanRepo = useSkillsCatalogStore((s) => s.scanRepo);
+  const installSkills = useSkillsCatalogStore((s) => s.installSkills);
+  const isScanning = useSkillsCatalogStore((s) => s.isScanning);
+  const isInstalling = useSkillsCatalogStore((s) => s.isInstalling);
  const installedSkills = useSkillsStore((s) => s.skills);
  const defaultGitIdentityId = useGitIdentitiesStore((s) => s.defaultGitIdentityId);
  const loadDefaultGitIdentityId = useGitIdentitiesStore((s) => s.loadDefaultGitIdentityId);
@@ -39,7 +39,8 @@ interface InstallSkillDialogProps {

 export const InstallSkillDialog: React.FC<InstallSkillDialogProps> = ({ open, onOpenChange, item }) => {
  const { t } = useI18n();
-  const { installSkills, isInstalling } = useSkillsCatalogStore();
+  const installSkills = useSkillsCatalogStore((s) => s.installSkills);
+  const isInstalling = useSkillsCatalogStore((s) => s.isInstalling);
  const [scope, setScope] = React.useState<'user' | 'project'>('user');
  const [targetSource, setTargetSource] = React.useState<'opencode' | 'agents'>('opencode');
  const projects = useProjectsStore((s) => s.projects);
@@ -23,6 +23,7 @@ import {
 import { RiAddLine, RiDeleteBinLine, RiRefreshLine, RiDownloadLine, RiStarLine, RiSearchLine } from '@remixicon/react';

 import { useSkillsCatalogStore } from '@/stores/useSkillsCatalogStore';
+import { useShallow } from 'zustand/react/shallow';
 import { cn } from '@/lib/utils';
 import type { SkillsCatalogItem } from '@/lib/api/types';

@@ -81,7 +82,21 @@ export const SkillsCatalogPage: React.FC<SkillsCatalogPageProps> = ({ mode, onMo
    loadedSourceIds,
    clawdhubHasMoreBySource,
    lastCatalogError,
-  } = useSkillsCatalogStore();
+  } = useSkillsCatalogStore(useShallow((s) => ({
+    sources: s.sources,
+    itemsBySource: s.itemsBySource,
+    selectedSourceId: s.selectedSourceId,
+    setSelectedSource: s.setSelectedSource,
+    loadCatalog: s.loadCatalog,
+    loadSource: s.loadSource,
+    loadMoreClawdHub: s.loadMoreClawdHub,
+    isLoadingCatalog: s.isLoadingCatalog,
+    isLoadingSource: s.isLoadingSource,
+    isLoadingMore: s.isLoadingMore,
+    loadedSourceIds: s.loadedSourceIds,
+    clawdhubHasMoreBySource: s.clawdhubHasMoreBySource,
+    lastCatalogError: s.lastCatalogError,
+  })));

  const [search, setSearch] = React.useState('');
  const [addCatalogOpen, setAddCatalogOpen] = React.useState(false);