kunthawat/ALwrity
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement route protection for onboarding

Browse Source 
- Create ProtectedRoute component to guard routes based on onboarding status
- Protect all non-onboarding routes (dashboard, blog-writer, seo, etc.)
- Users must complete onboarding before accessing any features
- Prevents confusion and broken functionality for new users
- Improves user experience by guiding users through proper setup
This commit is contained in:
ajaysi
2025-09-24 12:48:49 +05:30
parent 197720bea4
commit dee3e428bd
2 changed files with 138 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
frontend/src/App.tsx
View File

@@ -10,6 +10,7 @@ import ContentPlanningDashboard from './components/ContentPlanningDashboard/Cont
import FacebookWriter from './components/FacebookWriter/FacebookWriter';
import LinkedInWriter from './components/LinkedInWriter/LinkedInWriter';
import BlogWriter from './components/BlogWriter/BlogWriter';
import ProtectedRoute from './components/shared/ProtectedRoute';
import { apiClient } from './api/client';
@@ -170,9 +171,31 @@ const App: React.FC = () => {
);
}
// Check if CopilotKit API key is available
const copilotApiKey = process.env.REACT_APP_COPILOTKIT_API_KEY;
// If no CopilotKit API key, render without CopilotKit wrapper
if (!copilotApiKey) {
return (
<Router>
<Routes>
<Route path="/" element={<InitialRouteHandler />} />
<Route path="/onboarding" element={<Wizard />} />
<Route path="/dashboard" element={<ProtectedRoute><MainDashboard /></ProtectedRoute>} />
<Route path="/seo" element={<ProtectedRoute><SEODashboard /></ProtectedRoute>} />
<Route path="/seo-dashboard" element={<ProtectedRoute><SEODashboard /></ProtectedRoute>} />
<Route path="/content-planning" element={<ProtectedRoute><ContentPlanningDashboard /></ProtectedRoute>} />
<Route path="/facebook-writer" element={<ProtectedRoute><FacebookWriter /></ProtectedRoute>} />
<Route path="/linkedin-writer" element={<ProtectedRoute><LinkedInWriter /></ProtectedRoute>} />
<Route path="/blog-writer" element={<ProtectedRoute><BlogWriter /></ProtectedRoute>} />
</Routes>
</Router>
);
}
return (
<CopilotKit
publicApiKey={process.env.REACT_APP_COPILOTKIT_API_KEY}
publicApiKey={copilotApiKey}
showDevConsole={false}
onError={(e) => console.error("CopilotKit Error:", e)}
@@ -182,13 +205,13 @@ const App: React.FC = () => {
<Routes>
<Route path="/" element={<InitialRouteHandler />} />
<Route path="/onboarding" element={<Wizard />} />
<Route path="/dashboard" element={<MainDashboard />} />
<Route path="/seo" element={<SEODashboard />} />
<Route path="/seo-dashboard" element={<SEODashboard />} />
<Route path="/content-planning" element={<ContentPlanningDashboard />} />
<Route path="/facebook-writer" element={<FacebookWriter />} />
<Route path="/linkedin-writer" element={<LinkedInWriter />} />
<Route path="/blog-writer" element={<BlogWriter />} />
<Route path="/dashboard" element={<ProtectedRoute><MainDashboard /></ProtectedRoute>} />
<Route path="/seo" element={<ProtectedRoute><SEODashboard /></ProtectedRoute>} />
<Route path="/seo-dashboard" element={<ProtectedRoute><SEODashboard /></ProtectedRoute>} />
<Route path="/content-planning" element={<ProtectedRoute><ContentPlanningDashboard /></ProtectedRoute>} />
<Route path="/facebook-writer" element={<ProtectedRoute><FacebookWriter /></ProtectedRoute>} />
<Route path="/linkedin-writer" element={<ProtectedRoute><LinkedInWriter /></ProtectedRoute>} />
<Route path="/blog-writer" element={<ProtectedRoute><BlogWriter /></ProtectedRoute>} />
</Routes>
</ConditionalCopilotKit>
</Router>