Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2026-07-20 23:13:23 +10:00
Code Issues Packages Projects Releases Wiki Activity

Feature: Create a new useFormBlocker hook to block the user from closing a dialog or navigating away from a page if the form is dirty (#2654)

Browse Source 
* feat: add useFormBlocker hook for dialog dirty state protection

* feat: add useFormBlocker hook for dialog dirty state protection

- Create useFormBlocker hook that blocks dialog closing when forms have unsaved changes
- Use onPointerDownOutside and onEscapeKeyDown to intercept close attempts
- Show confirmation dialog with Leave/Stay options using useConfirm
- Integrate with CreateResumeDialog, UpdateResumeDialog, and DuplicateResumeDialog
- All strings are translatable via Lingui

* Feature: Create a new `useFormBlocker` hook to block the user from closing a dialog or navigating away from a page if the form is dirty.
This commit is contained in:
Amruth Pillai
2026-01-31 01:13:38 +01:00
committed by GitHub
parent f6fcbdcad0
commit 3d1c2d1fb6
81 changed files with 1800 additions and 1032 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/builder/$resumeId/route.tsx
+3 -3
View File
@@ -94,7 +94,7 @@ function BuilderLayout({ initialLayout, ...props }: BuilderLayoutProps) {
<div className="flex h-svh flex-col" {...props}>
<BuilderHeader />
<ResizableGroup orientation="horizontal" onLayoutChange={onLayoutChange} className="mt-14 flex-1">
<ResizableGroup orientation="horizontal" className="mt-14 flex-1" onLayoutChange={onLayoutChange}>
<ResizablePanel
collapsible
id="left"
@@ -107,11 +107,11 @@ function BuilderLayout({ initialLayout, ...props }: BuilderLayoutProps) {
>
<BuilderSidebarLeft />
</ResizablePanel>
<ResizableSeparator withHandle className="z-20 border-r" />
<ResizableSeparator withHandle className="z-20 border-s" />
<ResizablePanel id="artboard" defaultSize={artboardSize} className="h-[calc(100svh-3.5rem)]">
<Outlet />
</ResizablePanel>
<ResizableSeparator withHandle className="z-20 border-l" />
<ResizableSeparator withHandle className="z-20 border-e" />
<ResizablePanel
collapsible
id="right"