ui(deploy): router blocker + DS dialog for unsaved edits
- Add deployedConfigSnapshot field to Deployment interface (mirrors server shape) - Remove the Task 10.3 cast in handleRestore now that the type has the field - New useUnsavedChangesBlocker hook (react-router useBlocker, v7.13.1) - Wire AlertDialog into AppDeploymentPage for in-app navigation guard Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,26 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useBlocker } from 'react-router';
|
||||
|
||||
export function useUnsavedChangesBlocker(hasUnsavedChanges: boolean) {
|
||||
const blocker = useBlocker(({ currentLocation, nextLocation }) =>
|
||||
hasUnsavedChanges && currentLocation.pathname !== nextLocation.pathname
|
||||
);
|
||||
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (blocker.state === 'blocked') setDialogOpen(true);
|
||||
}, [blocker.state]);
|
||||
|
||||
return {
|
||||
dialogOpen,
|
||||
confirm: () => {
|
||||
setDialogOpen(false);
|
||||
blocker.proceed?.();
|
||||
},
|
||||
cancel: () => {
|
||||
setDialogOpen(false);
|
||||
blocker.reset?.();
|
||||
},
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user