- Add URL utility functions for parsing and building URL state - Initialize app state from URL parameters on page load - Sync navigation changes to URL via browser history API - Handle browser back/forward navigation with popstate listener - Support deep linking to campaigns and proofs Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
type View = 'Home' | 'Analytics' | 'Campaigns' | 'WIP Reviewer' | 'CopyGenAI' | 'Settings' | 'Profile' | 'Auditing';
|
|
|
|
export interface UrlNavigationState {
|
|
view: View;
|
|
campaignName: string | null;
|
|
proofId: string | null;
|
|
}
|
|
|
|
const VALID_VIEWS: View[] = ['Home', 'Analytics', 'Campaigns', 'WIP Reviewer', 'CopyGenAI', 'Settings', 'Profile', 'Auditing'];
|
|
|
|
export function parseUrlState(): UrlNavigationState {
|
|
const params = new URLSearchParams(window.location.search);
|
|
const view = params.get('view') as View;
|
|
return {
|
|
view: VALID_VIEWS.includes(view) ? view : 'Home',
|
|
campaignName: params.get('campaign'),
|
|
proofId: params.get('proof'),
|
|
};
|
|
}
|
|
|
|
export function buildUrl(state: Partial<UrlNavigationState>): string {
|
|
const params = new URLSearchParams();
|
|
if (state.view && state.view !== 'Home') params.set('view', state.view);
|
|
if (state.campaignName) params.set('campaign', state.campaignName);
|
|
if (state.proofId) params.set('proof', state.proofId);
|
|
const query = params.toString();
|
|
return query ? `?${query}` : '/';
|
|
}
|
|
|
|
export function pushUrlState(state: Partial<UrlNavigationState>): void {
|
|
const newUrl = buildUrl(state);
|
|
// Only push if URL actually changed to avoid duplicate history entries
|
|
if (newUrl !== window.location.pathname + window.location.search) {
|
|
window.history.pushState(state, '', newUrl);
|
|
}
|
|
}
|