fix: Newsletter React error #310 and refactor Wishlist module
Newsletter Fix: - Move all hooks (useQuery, useMutation) before conditional returns - Add 'enabled' option to useQuery to control when it fetches - Fixes React error #310: useEffect called conditionally - Newsletter page now loads without errors at /marketing/newsletter Wishlist Module Refactoring: - Create WishlistSettings.php with 8 configurable settings: * Enable guest wishlists * Wishlist page selector * Show in header toggle * Enable sharing * Back in stock notifications * Max items per wishlist * Multiple wishlists support * Show add to cart button - Add has_settings flag to wishlist module in ModuleRegistry - Initialize WishlistSettings in woonoow.php - Update customer-spa BaseLayout to use isEnabled('wishlist') check - Wishlist page already has module check (no changes needed) Files Added (1): - includes/Modules/WishlistSettings.php Files Modified (5): - admin-spa/src/routes/Marketing/Newsletter.tsx - includes/Core/ModuleRegistry.php - woonoow.php - customer-spa/src/layouts/BaseLayout.tsx - admin-spa/dist/app.js (rebuilt) Both newsletter and wishlist now follow the same module pattern: - Settings via schema (no code required) - Module enable/disable controls feature visibility - Settings page at /settings/modules/{module_id} - Consistent user experience
This commit is contained in:
@@ -24,32 +24,14 @@ export default function NewsletterSubscribers() {
|
||||
const navigate = useNavigate();
|
||||
const { isEnabled } = useModules();
|
||||
|
||||
if (!isEnabled('newsletter')) {
|
||||
return (
|
||||
<SettingsLayout
|
||||
title="Newsletter Subscribers"
|
||||
description="Newsletter module is disabled"
|
||||
>
|
||||
<div className="bg-yellow-50 dark:bg-yellow-950/20 border border-yellow-200 dark:border-yellow-900 rounded-lg p-6 text-center">
|
||||
<Mail className="h-12 w-12 text-yellow-600 mx-auto mb-3" />
|
||||
<h3 className="font-semibold text-lg mb-2">Newsletter Module Disabled</h3>
|
||||
<p className="text-sm text-muted-foreground mb-4">
|
||||
The newsletter module is currently disabled. Enable it in Settings > Modules to use this feature.
|
||||
</p>
|
||||
<Button onClick={() => navigate('/settings/modules')}>
|
||||
Go to Module Settings
|
||||
</Button>
|
||||
</div>
|
||||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
// Always call ALL hooks before any conditional returns
|
||||
const { data: subscribersData, isLoading } = useQuery({
|
||||
queryKey: ['newsletter-subscribers'],
|
||||
queryFn: async () => {
|
||||
const response = await api.get('/newsletter/subscribers');
|
||||
return response.data;
|
||||
},
|
||||
enabled: isEnabled('newsletter'), // Only fetch when module is enabled
|
||||
});
|
||||
|
||||
const deleteSubscriber = useMutation({
|
||||
@@ -88,6 +70,26 @@ export default function NewsletterSubscribers() {
|
||||
sub.email.toLowerCase().includes(searchQuery.toLowerCase())
|
||||
);
|
||||
|
||||
if (!isEnabled('newsletter')) {
|
||||
return (
|
||||
<SettingsLayout
|
||||
title="Newsletter Subscribers"
|
||||
description="Newsletter module is disabled"
|
||||
>
|
||||
<div className="bg-yellow-50 dark:bg-yellow-950/20 border border-yellow-200 dark:border-yellow-900 rounded-lg p-6 text-center">
|
||||
<Mail className="h-12 w-12 text-yellow-600 mx-auto mb-3" />
|
||||
<h3 className="font-semibold text-lg mb-2">Newsletter Module Disabled</h3>
|
||||
<p className="text-sm text-muted-foreground mb-4">
|
||||
The newsletter module is currently disabled. Enable it in Settings > Modules to use this feature.
|
||||
</p>
|
||||
<Button onClick={() => navigate('/settings/modules')}>
|
||||
Go to Module Settings
|
||||
</Button>
|
||||
</div>
|
||||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<SettingsLayout
|
||||
title="Newsletter Subscribers"
|
||||
|
||||
Reference in New Issue
Block a user