mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-23 08:31:12 -05:00
Refactor Novu registration to frontend
This commit is contained in:
gpt-engineer-app[bot]
196
src/components/admin/NovuMigrationUtility.tsx
Normal file
196
src/components/admin/NovuMigrationUtility.tsx
Normal file
@@ -0,0 +1,196 @@
|
||||
import { useState } from 'react';
|
||||
import { supabase } from '@/integrations/supabase/client';
|
||||
import { notificationService } from '@/lib/notificationService';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Progress } from '@/components/ui/progress';
|
||||
import { Alert, AlertDescription } from '@/components/ui/alert';
|
||||
import { CheckCircle2, XCircle, AlertCircle, Loader2 } from 'lucide-react';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
|
||||
interface MigrationResult {
|
||||
userId: string;
|
||||
email: string;
|
||||
success: boolean;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
export function NovuMigrationUtility() {
|
||||
const { toast } = useToast();
|
||||
const [isRunning, setIsRunning] = useState(false);
|
||||
const [progress, setProgress] = useState(0);
|
||||
const [results, setResults] = useState<MigrationResult[]>([]);
|
||||
const [totalUsers, setTotalUsers] = useState(0);
|
||||
|
||||
const runMigration = async () => {
|
||||
setIsRunning(true);
|
||||
setResults([]);
|
||||
setProgress(0);
|
||||
|
||||
try {
|
||||
// Fetch users without Novu subscriber IDs
|
||||
const { data: users, error: fetchError } = await supabase
|
||||
.from('profiles')
|
||||
.select('user_id, users:user_id(email)')
|
||||
.not('user_id', 'in',
|
||||
supabase
|
||||
.from('user_notification_preferences')
|
||||
.select('user_id')
|
||||
.not('novu_subscriber_id', 'is', null)
|
||||
);
|
||||
|
||||
if (fetchError) throw fetchError;
|
||||
|
||||
if (!users || users.length === 0) {
|
||||
toast({
|
||||
title: "No users to migrate",
|
||||
description: "All users are already registered with Novu.",
|
||||
});
|
||||
setIsRunning(false);
|
||||
return;
|
||||
}
|
||||
|
||||
setTotalUsers(users.length);
|
||||
const migrationResults: MigrationResult[] = [];
|
||||
|
||||
// Process users one by one
|
||||
for (let i = 0; i < users.length; i++) {
|
||||
const user = users[i];
|
||||
const email = (user.users as any)?.email;
|
||||
|
||||
if (!email) {
|
||||
migrationResults.push({
|
||||
userId: user.user_id,
|
||||
email: 'No email found',
|
||||
success: false,
|
||||
error: 'User email not found',
|
||||
});
|
||||
continue;
|
||||
}
|
||||
|
||||
try {
|
||||
const result = await notificationService.createSubscriber({
|
||||
subscriberId: user.user_id,
|
||||
email,
|
||||
data: { userId: user.user_id },
|
||||
});
|
||||
|
||||
migrationResults.push({
|
||||
userId: user.user_id,
|
||||
email,
|
||||
success: result.success,
|
||||
error: result.error,
|
||||
});
|
||||
|
||||
// Small delay to avoid overwhelming the API
|
||||
await new Promise(resolve => setTimeout(resolve, 100));
|
||||
} catch (error: any) {
|
||||
migrationResults.push({
|
||||
userId: user.user_id,
|
||||
email,
|
||||
success: false,
|
||||
error: error.message,
|
||||
});
|
||||
}
|
||||
|
||||
setProgress(((i + 1) / users.length) * 100);
|
||||
setResults([...migrationResults]);
|
||||
}
|
||||
|
||||
const successCount = migrationResults.filter(r => r.success).length;
|
||||
const failureCount = migrationResults.filter(r => !r.success).length;
|
||||
|
||||
toast({
|
||||
title: "Migration completed",
|
||||
description: `Successfully migrated ${successCount} users. ${failureCount} failures.`,
|
||||
});
|
||||
} catch (error: any) {
|
||||
toast({
|
||||
variant: "destructive",
|
||||
title: "Migration failed",
|
||||
description: error.message,
|
||||
});
|
||||
} finally {
|
||||
setIsRunning(false);
|
||||
}
|
||||
};
|
||||
|
||||
const successCount = results.filter(r => r.success).length;
|
||||
const failureCount = results.filter(r => !r.success).length;
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Novu User Migration</CardTitle>
|
||||
<CardDescription>
|
||||
Register existing users with Novu notification service
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<Alert>
|
||||
<AlertCircle className="h-4 w-4" />
|
||||
<AlertDescription>
|
||||
This utility will register all existing users who don't have a Novu subscriber ID.
|
||||
The process is non-blocking and will continue even if individual registrations fail.
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
|
||||
<Button
|
||||
onClick={runMigration}
|
||||
disabled={isRunning}
|
||||
className="w-full"
|
||||
>
|
||||
{isRunning && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
{isRunning ? 'Migrating Users...' : 'Start Migration'}
|
||||
</Button>
|
||||
|
||||
{isRunning && totalUsers > 0 && (
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between text-sm text-muted-foreground">
|
||||
<span>Progress</span>
|
||||
<span>{Math.round(progress)}%</span>
|
||||
</div>
|
||||
<Progress value={progress} />
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Processing {results.length} of {totalUsers} users
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{results.length > 0 && (
|
||||
<div className="space-y-2">
|
||||
<div className="flex gap-4 text-sm">
|
||||
<div className="flex items-center gap-2 text-green-600">
|
||||
<CheckCircle2 className="h-4 w-4" />
|
||||
<span>{successCount} succeeded</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 text-red-600">
|
||||
<XCircle className="h-4 w-4" />
|
||||
<span>{failureCount} failed</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="max-h-60 overflow-y-auto border rounded-md p-2 space-y-1">
|
||||
{results.map((result, idx) => (
|
||||
<div
|
||||
key={idx}
|
||||
className="flex items-center justify-between text-xs p-2 rounded bg-muted/50"
|
||||
>
|
||||
<span className="truncate flex-1">{result.email}</span>
|
||||
{result.success ? (
|
||||
<CheckCircle2 className="h-3 w-3 text-green-600 ml-2" />
|
||||
) : (
|
||||
<div className="flex items-center gap-1 ml-2">
|
||||
<XCircle className="h-3 w-3 text-red-600" />
|
||||
<span className="text-red-600">{result.error}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user