fix(contacts): resolve Svelte 5 hydration error

- Move type exports from .svelte files to separate .types.ts files
  (FilterDropdown, CommandBar) to prevent SSR hydration issues
- Replace direct NetworkGraph component import in network store
  with TypeScript interface to avoid SSR component instantiation
- Add missing shared packages to vite.config.ts ssr.noExternal
  and optimizeDeps.exclude (splitscreen, i18n, profile-ui, etc.)

The hydration error "Cannot read properties of undefined (reading 'call')"
was caused by Svelte 5's stricter handling of component imports in
.svelte.ts files and type exports from .svelte files during SSR.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Till-JS 2025-12-14 21:13:22 +01:00
parent c4fe9ea192
commit 026c1654e3
8 changed files with 774 additions and 27 deletions

View file

@ -17,14 +17,21 @@ import type {
SimulationNode as SharedSimulationNode,
SimulationLink as SharedSimulationLink,
} from '@manacore/shared-ui';
import { NetworkGraph } from '@manacore/shared-ui';
// Re-export types from shared-ui for convenience
export type SimulationNode = SharedSimulationNode;
export type SimulationLink = SharedSimulationLink;
// Interface for NetworkGraph component zoom methods
interface NetworkGraphZoomMethods {
zoomIn(): void;
zoomOut(): void;
resetZoom(): void;
focusOnSelectedNode(): void;
}
// Graph component reference for zoom controls
let graphComponentRef: NetworkGraph | null = null;
let graphComponentRef: NetworkGraphZoomMethods | null = null;
// localStorage key for toolbar state
const TOOLBAR_STORAGE_KEY = 'network-toolbar-state';
@ -215,7 +222,7 @@ export const networkStore = {
/**
* Register graph component reference for zoom controls
*/
setGraphComponent(component: NetworkGraph | null) {
setGraphComponent(component: NetworkGraphZoomMethods | null) {
graphComponentRef = component;
},

View file

@ -23,6 +23,13 @@ export default defineConfig({
'@manacore/shared-branding',
'@manacore/shared-subscription-ui',
'@manacore/shared-utils',
'@manacore/shared-splitscreen',
'@manacore/shared-i18n',
'@manacore/shared-profile-ui',
'@manacore/shared-tags',
'@manacore/shared-help-types',
'@manacore/shared-help-content',
'@manacore/shared-help-ui',
],
},
optimizeDeps: {
@ -40,6 +47,13 @@ export default defineConfig({
'@manacore/shared-branding',
'@manacore/shared-subscription-ui',
'@manacore/shared-utils',
'@manacore/shared-splitscreen',
'@manacore/shared-i18n',
'@manacore/shared-profile-ui',
'@manacore/shared-tags',
'@manacore/shared-help-types',
'@manacore/shared-help-content',
'@manacore/shared-help-ui',
],
},
});