test
3 weeks ago
useCompleteOnboarding.js
3 weeks ago
useDateRangePicker.js
1 month ago
useEmail.ts
1 month ago
useEngagementChartData.js
1 month ago
useLicenseSettings.js
1 month ago
useLink.js
1 month ago
useMediaDetail.js
1 month ago
useMediaLibrary.js
1 month ago
useMediaList.ts
1 month ago
usePerformanceSettings.js
1 month ago
useRegisterActivePage.js
1 month ago
useSettingOption.js
1 month ago
useSimpleSettingsPage.js
1 month ago
useTopPerforming.js
1 month ago
useTopVideosPaginated.js
1 month ago
useUpgradeCTA.js
1 month ago
useUserDetail.js
1 month ago
useRegisterActivePage.js
40 lines
| 1 | import { useEffect, useRef } from 'react'; |
| 2 | |
| 3 | // Hands the active page's "is-dirty / how-to-save / how-to-discard" contract up |
| 4 | // to Settings.js's navigation guard (see pages/Settings.js). |
| 5 | // |
| 6 | // Why a ref + getter instead of re-registering on every value change: |
| 7 | // - Navigation handlers in Settings.js only need to read isDirty/save/discard |
| 8 | // at *click time* (sidebar click, tab click, back button) — not on every |
| 9 | // keystroke. Reading from a ref keeps the sidebar from re-rendering while |
| 10 | // the user types. |
| 11 | // - We wrap save/discard as arrow functions that dispatch to latestRef so the |
| 12 | // parent always invokes the *current* closure. If we registered the raw |
| 13 | // closures, Settings.js would capture whichever render's save() ran first |
| 14 | // and call it with stale `data` on next click. |
| 15 | // - The `get isDirty()` accessor means the parent reads a live value without |
| 16 | // us re-registering — critical because re-registering would retrigger the |
| 17 | // effect cleanup and briefly null out the handlers. |
| 18 | const useRegisterActivePage = ( |
| 19 | registerActivePage, |
| 20 | { isDirty, save, discard } |
| 21 | ) => { |
| 22 | const latestRef = useRef( { isDirty, save, discard } ); |
| 23 | latestRef.current = { isDirty, save, discard }; |
| 24 | |
| 25 | useEffect( () => { |
| 26 | registerActivePage?.( { |
| 27 | get isDirty() { |
| 28 | return latestRef.current.isDirty; |
| 29 | }, |
| 30 | save: () => latestRef.current.save?.(), |
| 31 | discard: () => latestRef.current.discard?.(), |
| 32 | } ); |
| 33 | // On page unmount, clear the registration so Settings.js doesn't try |
| 34 | // to invoke stale handlers belonging to a page that no longer exists. |
| 35 | return () => registerActivePage?.( null ); |
| 36 | }, [ registerActivePage ] ); |
| 37 | }; |
| 38 | |
| 39 | export default useRegisterActivePage; |
| 40 |