feat(01-code-splitting): add feature gating with ALWRITY_ENABLED_FEATURES

- Create FeatureRoute.tsx wrapper component for route-level feature gating
- Add FEATURE_KEYS constant map to demoMode.ts for type-safe feature references
- Wrap 47 feature-specific routes with <FeatureRoute> in App.tsx
- Core routes (dashboard, billing, pricing, auth callbacks) remain ungated
- Disabled features redirect to /dashboard and never load their lazy chunks
- Main bundle: +259 bytes (FeatureRoute is a lightweight component)

Closes Phase 1 Plan 01-02
This commit is contained in:
ajaysi
2026-05-08 11:31:01 +05:30
parent 8ee042bd2c
commit ab827e9ab9
3 changed files with 148 additions and 54 deletions

View File

@@ -0,0 +1,34 @@
import React from 'react';
import { Navigate } from 'react-router-dom';
import { isFeatureEnabled } from '../../utils/demoMode';
interface FeatureRouteProps {
feature: string;
children: React.ReactNode;
/** Where to redirect if feature is disabled (default: /dashboard) */
redirectTo?: string;
}
/**
* Route guard that checks if a feature is enabled via ALWRITY_ENABLED_FEATURES.
* If disabled, redirects to the fallback route and the lazy chunk never loads.
*
* Usage:
* <Route path="/blog-writer" element={
* <ProtectedRoute>
* <FeatureRoute feature="blog_writer"><BlogWriter /></FeatureRoute>
* </ProtectedRoute>
* } />
*/
const FeatureRoute: React.FC<FeatureRouteProps> = ({
feature,
children,
redirectTo = '/dashboard'
}) => {
if (!isFeatureEnabled(feature)) {
return <Navigate to={redirectTo} replace />;
}
return <>{children}</>;
};
export default FeatureRoute;