Centralize localStorage access to fix SSR hydration warnings & improve type-safety#412
Centralize localStorage access to fix SSR hydration warnings & improve type-safety#412abhijit9040 wants to merge 9 commits into
Conversation
…ors and improve type safety
|
@abhijit9040 is attempting to deploy a commit to the shopstr-eng Team on Vercel. A member of the Team first needs to authorize it. |
|
This is a good start, but needs to be applied across all instances of localStorage across the codebase. |
Thanks for the feedback! I’ll go through the codebase and apply this consistently across all localStorage usages. |
…GE_KEYS. Resolve technical debt by replacing direct localStorage/sessionStorage calls and legacy constants.
…age. Integrated upstream discount validation with centralized storage manager.
|
@calvadev , have a look on the changes. |
|
@calvadev @abhijit9040 i am trying to review these changes. one of my observations is that most of the places where access is guarded by I like the idea of having typed keys though. |
|
@theAnuragMishra the guards were there because otherwise the local storage data would often be attemped to be fetched before the windo element loaded, causing breaks. The useEffect alone wasn't a safe enough guard. |
|
"Thanks for the review! You're right — I'll extend the refactor to cover all remaining localStorage/sessionStorage calls across the full codebase. I'll keep the isBrowser guards inside the StorageManager so the API is safe by default regardless of call context. Update incoming soon!" |
- mint-button.tsx: migrate tokens/history writes to storage.setJson() - claim-button.tsx: migrate tokens/mints/history writes to storage.setJson() - shopstr-slider.tsx: migrate wot write to storage.setItem() - storefront-theme-wrapper.tsx: migrate sf_seller_pubkey, sf_shop_slug, cart reads to storage; sessionStorage calls to storage.setSessionItem() - preferences.tsx: migrate theme get/set to storage.getItem/setItem() - onboarding/wallet.tsx: migrate nwcInfo write to storage.setJson() - nostr-helper-functions.ts: migrate migrationComplete to storage.setItem(); fix stray brace from prior merge conflict All production localStorage/sessionStorage calls now go through StorageManager, ensuring SSR-safety and type-safe key management via STORAGE_KEYS constants.
|
@calvadev , @theAnuragMishra I've extended the migration to cover all remaining localStorage and sessionStorage calls across the codebase. Every production storage access now goes through StorageManager using typed STORAGE_KEYS constants. Files updated in this pass: mint-button.tsx — tokens, history The isBrowser guard lives inside StorageManager, so the API is SSR-safe by default regardless of call context. Test files are left as-is since they mock localStorage directly by design. Ready for re-review! |
|
@abhijit9040 can you solve the conflicts please? |
… legacy getLocalStorageData - Remove getLocalStorageData() and getLocalStorageJson() helpers entirely - Migrate all internal calls in nostr-helper-functions.ts, fetch-service.ts, encryption-migration.ts, wallet-recovery.ts, pending-mint-operations.ts, nav-top.tsx, product-invoice-card.tsx, cart-invoice-card.tsx, _app.tsx, wallet/index.tsx, and transactions.tsx to storage.getJson/getItem - Add PENDING_MINT_QUOTES to STORAGE_KEYS enum - Update all affected tests to seed localStorage directly instead of mocking the legacy helper (transactions, receive-button, wallet-recovery, local-storage-data) - Ensure SSR safety across all storage operations via StorageManager singleton
|
@GautamBytes , resloved the conflicts . have a review . |
4 participants
Description
This PR resolves the
localStoragearchitectural debt raised in #[ReplaceWithYourIssueNumber]. It introduces a central abstraction layer for handling client-side persistence safely across the Next.js lifecycle.Key Changes:
utils/storage.ts: Created a centralizedStorageManagerclass and instantiated a globalstoragesingleton.STORAGE_KEYS: Added a canonicalSTORAGE_KEYScatalog, effectively removing Magic Strings for storageissue reference - #410