chore: phase 2 and 3 refactors

This commit is contained in:
2026-02-21 18:02:20 +01:00
parent 40892b9302
commit 87200a8ad9
24 changed files with 411 additions and 74 deletions

View File

@@ -19,6 +19,7 @@
"menu.item.selectAll": "Alles auswählen",
"menu.item.find": "Suchen",
"menu.item.replace": "Ersetzen",
"menu.item.editPreferences": "Einstellungen bearbeiten",
"menu.item.viewPosts": "Beiträge",
"menu.item.viewMedia": "Medien",
"menu.item.toggleSidebar": "Seitenleiste umschalten",

View File

@@ -19,6 +19,7 @@
"menu.item.selectAll": "Select All",
"menu.item.find": "Find",
"menu.item.replace": "Replace",
"menu.item.editPreferences": "Edit Preferences",
"menu.item.viewPosts": "Posts",
"menu.item.viewMedia": "Media",
"menu.item.toggleSidebar": "Toggle Sidebar",

View File

@@ -19,6 +19,7 @@
"menu.item.selectAll": "Seleccionar todo",
"menu.item.find": "Buscar",
"menu.item.replace": "Reemplazar",
"menu.item.editPreferences": "Editar preferencias",
"menu.item.viewPosts": "Entradas",
"menu.item.viewMedia": "Medios",
"menu.item.toggleSidebar": "Alternar barra lateral",

View File

@@ -19,6 +19,7 @@
"menu.item.selectAll": "Tout sélectionner",
"menu.item.find": "Rechercher",
"menu.item.replace": "Remplacer",
"menu.item.editPreferences": "Modifier les préférences",
"menu.item.viewPosts": "Articles",
"menu.item.viewMedia": "Médias",
"menu.item.toggleSidebar": "Basculer la barre latérale",

View File

@@ -19,6 +19,7 @@
"menu.item.selectAll": "Seleziona tutto",
"menu.item.find": "Trova",
"menu.item.replace": "Sostituisci",
"menu.item.editPreferences": "Modifica preferenze",
"menu.item.viewPosts": "Post",
"menu.item.viewMedia": "Contenuti media",
"menu.item.toggleSidebar": "Attiva/disattiva barra laterale",

View File

@@ -14,6 +14,7 @@ export type AppMenuAction =
| 'selectAll'
| 'find'
| 'replace'
| 'editPreferences'
| 'viewPosts'
| 'viewMedia'
| 'toggleSidebar'
@@ -89,6 +90,7 @@ export const APP_MENU_GROUPS: AppMenuGroupDefinition[] = [
{ label: '', action: 'edit-separator-3', separator: true },
{ label: 'menu.item.find', action: 'find', accelerator: 'CmdOrCtrl+F' },
{ label: 'menu.item.replace', action: 'replace', accelerator: 'CmdOrCtrl+H' },
{ label: 'menu.item.editPreferences', action: 'editPreferences', accelerator: 'CmdOrCtrl+,' },
],
},
{
@@ -143,6 +145,7 @@ export const APP_MENU_ACTION_EVENT_MAP: Partial<Record<AppMenuAction, string>> =
save: 'menu:save',
find: 'menu:find',
replace: 'menu:replace',
editPreferences: 'menu:editPreferences',
viewPosts: 'menu:viewPosts',
viewMedia: 'menu:viewMedia',
toggleSidebar: 'menu:toggleSidebar',

View File

@@ -2,6 +2,8 @@ import React, { useEffect } from 'react';
import { ActivityBar, Sidebar, Editor, StatusBar, Panel, TabBar, ToastContainer, showToast, ResizablePanel, WindowTitleBar } from './components';
import { useAppStore, PostData, MediaData, TaskProgress } from './store';
import { loadTabsForProject, saveTabsForProject } from './utils';
import { openSingletonToolTab } from './navigation/tabPolicy';
import { persistSiteValidationReport } from './navigation/siteValidationPersistence';
import { ensureRendererPicoThemeStylesheet, getRendererPicoTheme } from './utils/picoTheme';
import { useI18n } from './i18n';
import './App.css';
@@ -224,6 +226,12 @@ const App: React.FC = () => {
}) || (() => {})
);
unsubscribers.push(
window.electronAPI?.on('menu:editPreferences', () => {
openSingletonToolTab(openTab, 'settings');
}) || (() => {})
);
// Rebuild events - clear store on start, reload on complete
unsubscribers.push(
window.electronAPI?.on('posts:rebuildStarted', () => {
@@ -288,8 +296,7 @@ const App: React.FC = () => {
unsubscribers.push(
window.electronAPI?.on('menu:metadataDiff', () => {
// Open metadata diff tool tab
openTab({ id: 'metadata-diff', type: 'metadata-diff', title: tr('app.metadataDiff') });
openSingletonToolTab(openTab, 'metadata-diff');
}) || (() => {})
);
@@ -306,7 +313,23 @@ const App: React.FC = () => {
unsubscribers.push(
window.electronAPI?.on('menu:validateSite', () => {
openTab({ id: 'site-validation-report', type: 'site-validation', isTransient: true });
const validateAndOpen = async () => {
try {
const report = await window.electronAPI?.blog.validateSite();
const projectId = useAppStore.getState().activeProject?.id;
if (projectId && report) {
persistSiteValidationReport(projectId, report);
window.dispatchEvent(new CustomEvent('bds:site-validation-updated', {
detail: { projectId },
}));
}
openSingletonToolTab(openTab, 'site-validation');
} catch (error) {
console.error('Site validation failed:', error);
showToast.error(tr('siteValidation.error.validate'));
}
};
void validateAndOpen();
}) || (() => {})
);
@@ -331,7 +354,7 @@ const App: React.FC = () => {
unsubscribers.push(
window.electronAPI?.on('menu:openDocumentation', () => {
openTab({ id: 'documentation', type: 'documentation', isTransient: false });
openSingletonToolTab(openTab, 'documentation');
}) || (() => {})
);

View File

@@ -4,6 +4,12 @@ import { showToast } from '../Toast';
import { getContrastColor, groupPostsByStatus } from '../../utils';
import type { ChatConversation, ImportDefinitionData } from '../../types/electron';
import { GitSidebar } from '../GitSidebar/GitSidebar';
import { scrollToSettingsSection, SettingsCategory } from '../SettingsView/SettingsView';
import { scrollToTagsSection, TagsCategory } from '../TagsView';
import { activateSidebarSection } from '../../navigation/sectionActivation';
import { getPersistedSidebarSection, setPersistedSidebarSection } from '../../navigation/sidebarUiPersistence';
import { openSingletonToolTab } from '../../navigation/tabPolicy';
import type { SidebarView } from '../../navigation/sidebarViewRegistry';
import { useI18n } from '../../i18n';
import './Sidebar.css';
@@ -1218,24 +1224,27 @@ const MediaList: React.FC = () => {
);
};
import { scrollToSettingsSection, SettingsCategory } from '../SettingsView/SettingsView';
import { scrollToTagsSection, TagsCategory } from '../TagsView';
const TagsNav: React.FC = () => {
const { t } = useI18n();
const { tabs, activeTabId, openTab } = useAppStore();
const [activeSection, setActiveSection] = useState<TagsCategory | null>(null);
const [activeSection, setActiveSection] = useState<TagsCategory | null>(() => {
const persisted = getPersistedSidebarSection('tags');
if (persisted === 'cloud' || persisted === 'manage' || persisted === 'merge') {
return persisted;
}
return null;
});
const isTagsTabActive = tabs.some(t => t.type === 'tags' && t.id === activeTabId);
const handleNavClick = (category: TagsCategory) => {
if (!isTagsTabActive) {
openTab({ type: 'tags', id: 'tags', isTransient: false });
}
setActiveSection(category);
setTimeout(() => {
scrollToTagsSection(category);
}, isTagsTabActive ? 0 : 100);
setPersistedSidebarSection('tags', category);
activateSidebarSection({
isEditorTabActive: isTagsTabActive,
ensureEditorTabActive: () => openSingletonToolTab(openTab, 'tags'),
activateSection: () => scrollToTagsSection(category),
});
};
return (
@@ -1276,26 +1285,30 @@ const TagsNav: React.FC = () => {
const SettingsNav: React.FC = () => {
const { t } = useI18n();
const { tabs, activeTabId, openTab } = useAppStore();
const [activeSection, setActiveSection] = useState<SettingsCategory | null>(null);
const [activeSection, setActiveSection] = useState<SettingsCategory | null>(() => {
const persisted = getPersistedSidebarSection('settings');
if (persisted === 'project' || persisted === 'editor' || persisted === 'content' || persisted === 'ai' || persisted === 'publishing' || persisted === 'data') {
return persisted;
}
return null;
});
// Check if settings panel is currently active
const isSettingsTabActive = tabs.some(t => t.type === 'settings' && t.id === activeTabId);
const isStyleTabActive = tabs.some(t => t.type === 'style' && t.id === activeTabId);
const handleNavClick = (category: SettingsCategory) => {
// If settings panel is not open or not active, open it first
if (!isSettingsTabActive) {
openTab({ type: 'settings', id: 'settings', isTransient: false });
}
setActiveSection(category);
// Use setTimeout to allow panel to open before scrolling
setTimeout(() => {
scrollToSettingsSection(category);
}, isSettingsTabActive ? 0 : 100);
setPersistedSidebarSection('settings', category);
activateSidebarSection({
isEditorTabActive: isSettingsTabActive,
ensureEditorTabActive: () => openSingletonToolTab(openTab, 'settings'),
activateSection: () => scrollToSettingsSection(category),
});
};
const handleStyleClick = () => {
openTab({ type: 'style', id: 'style', isTransient: false });
openSingletonToolTab(openTab, 'style');
};
return (
@@ -1666,34 +1679,20 @@ export const Sidebar: React.FC = () => {
return null;
}
const sidebarViewMap: Record<SidebarView, React.ReactNode> = {
posts: <PostsList mode="posts" isActive={true} />,
pages: <PostsList mode="pages" isActive={true} />,
media: <MediaList />,
settings: <SettingsNav />,
tags: <TagsNav />,
chat: <ChatList />,
import: <ImportList />,
git: <GitSidebar />,
};
return (
<div className="sidebar">
<div
style={{
display: activeView === 'posts' ? 'flex' : 'none',
flexDirection: 'column',
flex: 1,
minHeight: 0,
}}
>
<PostsList mode="posts" isActive={activeView === 'posts'} />
</div>
<div
style={{
display: activeView === 'pages' ? 'flex' : 'none',
flexDirection: 'column',
flex: 1,
minHeight: 0,
}}
>
<PostsList mode="pages" isActive={activeView === 'pages'} />
</div>
{activeView === 'media' && <MediaList />}
{activeView === 'settings' && <SettingsNav />}
{activeView === 'tags' && <TagsNav />}
{activeView === 'chat' && <ChatList />}
{activeView === 'import' && <ImportList />}
{activeView === 'git' && <GitSidebar />}
{sidebarViewMap[activeView]}
</div>
);
};

View File

@@ -1,6 +1,8 @@
import React, { useEffect, useMemo, useState } from 'react';
import { useAppStore } from '../../store';
import { showToast } from '../Toast';
import { useI18n } from '../../i18n';
import { getPersistedSiteValidationReport } from '../../navigation/siteValidationPersistence';
import './SiteValidationView.css';
type SiteValidationReport = {
@@ -20,27 +22,43 @@ type SiteValidationApplyResult = {
export const SiteValidationView: React.FC = () => {
const { t: tr } = useI18n();
const { activeProject } = useAppStore();
const [isLoading, setIsLoading] = useState(true);
const [isApplying, setIsApplying] = useState(false);
const [report, setReport] = useState<SiteValidationReport | null>(null);
const loadReport = async () => {
const loadPersistedReport = () => {
setIsLoading(true);
try {
const result = await window.electronAPI.blog.validateSite();
setReport(result as SiteValidationReport);
} catch (error) {
console.error('Site validation failed:', error);
showToast.error(tr('siteValidation.error.validate'));
setReport(null);
const projectId = activeProject?.id;
if (!projectId) {
setReport(null);
return;
}
const persistedReport = getPersistedSiteValidationReport(projectId);
setReport(persistedReport);
} finally {
setIsLoading(false);
}
};
useEffect(() => {
void loadReport();
}, []);
loadPersistedReport();
}, [activeProject?.id]);
useEffect(() => {
const handler = (event: Event) => {
const detail = (event as CustomEvent<{ projectId?: string }>).detail;
if (!activeProject?.id || detail?.projectId !== activeProject.id) {
return;
}
loadPersistedReport();
};
window.addEventListener('bds:site-validation-updated', handler);
return () => window.removeEventListener('bds:site-validation-updated', handler);
}, [activeProject?.id]);
const canApply = useMemo(() => {
if (!report) return false;
@@ -59,7 +77,6 @@ export const SiteValidationView: React.FC = () => {
rendered: result.renderedUrlCount,
deleted: result.deletedUrlCount,
}));
await loadReport();
} catch (error) {
console.error('Applying site validation failed:', error);
showToast.error(tr('siteValidation.error.apply'));

View File

@@ -1,7 +1,7 @@
import type { Tab } from '../store/appStore';
import type { SidebarView } from './sidebarViewRegistry';
export type ActivityId = 'posts' | 'pages' | 'media' | 'tags' | 'chat' | 'import' | 'git' | 'settings';
export type SidebarView = 'posts' | 'pages' | 'media' | 'settings' | 'tags' | 'chat' | 'import' | 'git';
export interface ActivitySnapshot {
activeView: SidebarView;

View File

@@ -0,0 +1,29 @@
export interface ActivateSidebarSectionOptions {
isEditorTabActive: boolean;
ensureEditorTabActive: () => void;
activateSection: () => void;
delayWhenOpeningEditorMs?: number;
schedule?: (callback: () => void, delayMs: number) => void;
}
export function activateSidebarSection(options: ActivateSidebarSectionOptions): void {
const {
isEditorTabActive,
ensureEditorTabActive,
activateSection,
delayWhenOpeningEditorMs = 100,
schedule,
} = options;
const runLater = schedule ?? ((callback: () => void, delayMs: number) => {
window.setTimeout(callback, delayMs);
});
if (!isEditorTabActive) {
ensureEditorTabActive();
runLater(activateSection, delayWhenOpeningEditorMs);
return;
}
runLater(activateSection, 0);
}

View File

@@ -0,0 +1,24 @@
type SidebarSectionOwner = 'settings' | 'tags';
const SIDEBAR_SECTION_KEY_PREFIX = 'bds-sidebar-section';
function getStorageKey(owner: SidebarSectionOwner): string {
return `${SIDEBAR_SECTION_KEY_PREFIX}:${owner}`;
}
export function getPersistedSidebarSection(owner: SidebarSectionOwner): string | null {
try {
const value = localStorage.getItem(getStorageKey(owner));
return value || null;
} catch {
return null;
}
}
export function setPersistedSidebarSection(owner: SidebarSectionOwner, sectionId: string): void {
try {
localStorage.setItem(getStorageKey(owner), sectionId);
} catch {
// Ignore storage failures
}
}

View File

@@ -0,0 +1,18 @@
export const SIDEBAR_VIEW_REGISTRY = [
'posts',
'pages',
'media',
'settings',
'tags',
'chat',
'import',
'git',
] as const;
export type SidebarView = (typeof SIDEBAR_VIEW_REGISTRY)[number];
export const DEFAULT_SIDEBAR_VIEW: SidebarView = 'posts';
export function isSidebarView(value: string): value is SidebarView {
return (SIDEBAR_VIEW_REGISTRY as readonly string[]).includes(value);
}

View File

@@ -0,0 +1,27 @@
import type { SiteValidationReport } from '../../main/shared/electronApi';
const SITE_VALIDATION_REPORT_PREFIX = 'bds-site-validation-report';
function getStorageKey(projectId: string): string {
return `${SITE_VALIDATION_REPORT_PREFIX}:${projectId}`;
}
export function persistSiteValidationReport(projectId: string, report: SiteValidationReport): void {
try {
localStorage.setItem(getStorageKey(projectId), JSON.stringify(report));
} catch {
// Ignore persistence failures.
}
}
export function getPersistedSiteValidationReport(projectId: string): SiteValidationReport | null {
try {
const raw = localStorage.getItem(getStorageKey(projectId));
if (!raw) {
return null;
}
return JSON.parse(raw) as SiteValidationReport;
} catch {
return null;
}
}

View File

@@ -0,0 +1,35 @@
import type { TabType } from '../store/appStore';
export type SingletonToolTabKey =
| 'settings'
| 'tags'
| 'style'
| 'documentation'
| 'metadata-diff'
| 'site-validation';
export interface CanonicalTabSpec {
type: TabType;
id: string;
isTransient: boolean;
}
const SINGLETON_TOOL_TAB_REGISTRY: Record<SingletonToolTabKey, CanonicalTabSpec> = {
settings: { type: 'settings', id: 'settings', isTransient: false },
tags: { type: 'tags', id: 'tags', isTransient: false },
style: { type: 'style', id: 'style', isTransient: false },
documentation: { type: 'documentation', id: 'documentation', isTransient: false },
'metadata-diff': { type: 'metadata-diff', id: 'metadata-diff', isTransient: false },
'site-validation': { type: 'site-validation', id: 'site-validation', isTransient: false },
};
export function getSingletonToolTabSpec(key: SingletonToolTabKey): CanonicalTabSpec {
return SINGLETON_TOOL_TAB_REGISTRY[key];
}
export function openSingletonToolTab(
openTab: (tab: CanonicalTabSpec) => void,
key: SingletonToolTabKey,
): void {
openTab(getSingletonToolTabSpec(key));
}

View File

@@ -1,6 +1,7 @@
import { create } from 'zustand';
import { persist } from 'zustand/middleware';
import type { DeleteReference, ConfirmDeleteDetails } from '../components/ConfirmDeleteModal';
import type { SidebarView } from '../navigation/sidebarViewRegistry';
import type {
ProjectData,
PostData,
@@ -58,7 +59,7 @@ interface AppState {
activeTabId: string | null;
// UI State
activeView: 'posts' | 'pages' | 'media' | 'settings' | 'tags' | 'chat' | 'import' | 'git';
activeView: SidebarView;
sidebarVisible: boolean;
panelVisible: boolean;
panelActiveTab: PanelTab;
@@ -107,7 +108,7 @@ interface AppState {
restoreTabState: (state: TabState) => void;
// Actions
setActiveView: (view: 'posts' | 'pages' | 'media' | 'settings' | 'tags' | 'chat' | 'import' | 'git') => void;
setActiveView: (view: SidebarView) => void;
toggleSidebar: () => void;
togglePanel: () => void;
setPanelActiveTab: (tab: PanelTab) => void;