implement-auth-and-customer-session-flows

Implement login, register, logout, and session invalidation for storefront-data apps.

2|Updated Dec 2, 2024
One-click install
npx skills add https://github.com/TechsioCZ/new-engine --skill implement-auth-and-customer-session-flows
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: implement-auth-and-customer-session-flows
Source: https://github.com/TechsioCZ/new-engine/tree/main/libs/storefront-data/skills/implement-auth-and-customer-session-flows
Command: npx skills add https://github.com/TechsioCZ/new-engine --skill implement-auth-and-customer-session-flows

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Load this skill when using @techsio/storefront-data for customer auth and session state through storefront.hooks.auth.useAuth, useLogin, useRegister, useLogout, and invalidateOnAuthChange. Use it for login/register flows, session-aware rendering, cross-domain invalidation, and app-level callbacks for toasts, analytics, or redirects.

Core Features & Use Cases

  • Centralized auth service and session management
  • Support for login, register, logout, and invalidateOnAuthChange
  • App-layer callbacks for toasts, analytics, and redirects
  • Cross-domain session invalidation and UX consistency

Quick Start

Install the storefront-auth preset in your app and wire the auth hooks to manage login, registration, and logout.

Frequently Asked Questions about implement-auth-and-customer-session-flows

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement storefront authentication and customer session management in Next.js?▼

Storefront authentication and customer session management is implemented by wiring auth hooks like useAuth, useLogin, useRegister, and useLogout to provide centralized login, registration, and logout workflows.

How does cross-domain session invalidation work when auth state changes?▼

Cross-domain session invalidation works through the invalidateOnAuthChange hook, which automatically triggers query invalidations across domains to ensure UX consistency when a customer's authentication state changes.

Can I use this auth workflow with Medusa and storefront-data?▼

Yes, this auth workflow is designed specifically for apps using storefront-data and depends on setup-storefront-platform-in-next-app along with Medusa service modules, query keys, and Medusa presets.

What's the best way to add app-level callbacks for login and registration flows?▼

App-level callbacks for login and registration flows are added by wiring auth hooks to manage toasts, analytics, or redirects, providing consistent UX across customer authentication and session state changes.

Do I need to install a preset to start managing customer login and logout flows?▼

Yes, you need to install the storefront-auth preset in your app and wire the auth hooks to manage customer login, registration, and logout flows effectively.

Why is session-aware rendering not working after customer login?▼

Session-aware rendering fails after customer login if invalidateOnAuthChange is not properly wired to trigger cross-domain invalidations, causing stale session state across the storefront.