fix: Skip onboarding calls in podcast-only demo mode
- Add demoMode utility for consistent demo mode detection - Skip onboarding API calls in OnboardingContext when in demo mode - Redirect to /podcast-maker instead of /onboarding in demo mode
This commit is contained in:
@@ -4,6 +4,7 @@ import { Box, CircularProgress, Typography } from '@mui/material';
|
|||||||
import { CopilotKit } from "@copilotkit/react-core";
|
import { CopilotKit } from "@copilotkit/react-core";
|
||||||
import { ClerkProvider, useAuth } from '@clerk/clerk-react';
|
import { ClerkProvider, useAuth } from '@clerk/clerk-react';
|
||||||
import "@copilotkit/react-ui/styles.css";
|
import "@copilotkit/react-ui/styles.css";
|
||||||
|
import { shouldSkipOnboarding } from './utils/demoMode';
|
||||||
import Wizard from './components/OnboardingWizard/Wizard';
|
import Wizard from './components/OnboardingWizard/Wizard';
|
||||||
import MainDashboard from './components/MainDashboard/MainDashboard';
|
import MainDashboard from './components/MainDashboard/MainDashboard';
|
||||||
import SEODashboard from './components/SEODashboard/SEODashboard';
|
import SEODashboard from './components/SEODashboard/SEODashboard';
|
||||||
@@ -406,6 +407,11 @@ const InitialRouteHandler: React.FC = () => {
|
|||||||
|
|
||||||
// 4. Has active subscription, check onboarding status
|
// 4. Has active subscription, check onboarding status
|
||||||
if (!isOnboardingComplete) {
|
if (!isOnboardingComplete) {
|
||||||
|
// In demo mode, skip onboarding and go directly to podcast-maker
|
||||||
|
if (shouldSkipOnboarding()) {
|
||||||
|
console.log('InitialRouteHandler: Demo mode - skipping onboarding → Podcast Maker');
|
||||||
|
return <Navigate to="/podcast-maker" replace />;
|
||||||
|
}
|
||||||
console.log('InitialRouteHandler: Subscription active but onboarding incomplete → Onboarding');
|
console.log('InitialRouteHandler: Subscription active but onboarding incomplete → Onboarding');
|
||||||
return <Navigate to="/onboarding" replace />;
|
return <Navigate to="/onboarding" replace />;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import React, { createContext, useContext, useState, useEffect, useCallback, ReactNode } from 'react';
|
import React, { createContext, useContext, useState, useEffect, useCallback, ReactNode } from 'react';
|
||||||
import { useAuth } from '@clerk/clerk-react';
|
import { useAuth } from '@clerk/clerk-react';
|
||||||
import { apiClient } from '../api/client';
|
import { apiClient } from '../api/client';
|
||||||
|
import { shouldSkipOnboarding } from '../utils/demoMode';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Onboarding Context
|
* Onboarding Context
|
||||||
@@ -102,6 +103,13 @@ export const OnboardingProvider: React.FC<OnboardingProviderProps> = ({ children
|
|||||||
setLoading(true);
|
setLoading(true);
|
||||||
setError(null);
|
setError(null);
|
||||||
|
|
||||||
|
// Skip onboarding fetch in demo mode - onboarding is disabled
|
||||||
|
if (shouldSkipOnboarding()) {
|
||||||
|
console.log('OnboardingContext: Skipping onboarding fetch in demo mode');
|
||||||
|
setLoading(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
console.log('OnboardingContext: Fetching onboarding data for authenticated user...');
|
console.log('OnboardingContext: Fetching onboarding data for authenticated user...');
|
||||||
|
|
||||||
// Call batch init endpoint
|
// Call batch init endpoint
|
||||||
@@ -159,6 +167,12 @@ export const OnboardingProvider: React.FC<OnboardingProviderProps> = ({ children
|
|||||||
// Separate effect to fetch data when explicitly requested
|
// Separate effect to fetch data when explicitly requested
|
||||||
const initializeOnboarding = useCallback(() => {
|
const initializeOnboarding = useCallback(() => {
|
||||||
if (isSignedIn && clerkLoaded) {
|
if (isSignedIn && clerkLoaded) {
|
||||||
|
// Skip onboarding initialization in demo mode
|
||||||
|
if (shouldSkipOnboarding()) {
|
||||||
|
console.log('OnboardingContext: Skipping onboarding init in demo mode');
|
||||||
|
setLoading(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
console.log('OnboardingContext: Initializing onboarding data...');
|
console.log('OnboardingContext: Initializing onboarding data...');
|
||||||
fetchOnboardingData();
|
fetchOnboardingData();
|
||||||
}
|
}
|
||||||
|
|||||||
47
frontend/src/utils/demoMode.ts
Normal file
47
frontend/src/utils/demoMode.ts
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
/**
|
||||||
|
* Demo mode detection utilities for podcast-only demo mode.
|
||||||
|
*/
|
||||||
|
|
||||||
|
const DEMO_MODE_STORAGE_KEYS = [
|
||||||
|
'app_mode',
|
||||||
|
'demo_mode',
|
||||||
|
'podcast_only_demo_mode',
|
||||||
|
];
|
||||||
|
|
||||||
|
const DEMO_MODE_ENV_KEYS = [
|
||||||
|
'REACT_APP_APP_MODE',
|
||||||
|
'REACT_APP_DEMO_MODE',
|
||||||
|
'REACT_APP_PODCAST_ONLY_DEMO_MODE',
|
||||||
|
];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Check if podcast-only demo mode is enabled.
|
||||||
|
* Checks localStorage first, then environment variables.
|
||||||
|
*/
|
||||||
|
export function isPodcastOnlyDemoMode(): boolean {
|
||||||
|
// Check localStorage
|
||||||
|
for (const key of DEMO_MODE_STORAGE_KEYS) {
|
||||||
|
const value = (localStorage.getItem(key) || '').toLowerCase();
|
||||||
|
if (value === 'true' || value === 'podcast-only' || value === 'podcast_only') {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check environment variables
|
||||||
|
for (const key of DEMO_MODE_ENV_KEYS) {
|
||||||
|
const value = (process.env[key] || '').toLowerCase();
|
||||||
|
if (value === 'true' || value === 'podcast-only' || value === 'podcast_only') {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Check if the app should skip onboarding entirely.
|
||||||
|
* Returns true in podcast-only demo mode.
|
||||||
|
*/
|
||||||
|
export function shouldSkipOnboarding(): boolean {
|
||||||
|
return isPodcastOnlyDemoMode();
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user