89 lines
3.2 KiB
TypeScript
89 lines
3.2 KiB
TypeScript
'use client';
|
|
|
|
import { useState, useEffect } from 'react';
|
|
import Link from 'next/link';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|
import { ArrowLeft, Activity, History, Calendar, Database } from 'lucide-react';
|
|
import SyncControlPanel from '@/components/admin/SyncControlPanel';
|
|
import SyncDashboard from '@/components/admin/SyncDashboard';
|
|
import SyncHistoryTable from '@/components/admin/SyncHistoryTable';
|
|
import SyncScheduler from '@/components/admin/SyncScheduler';
|
|
import { EntityType } from '@/lib/types/sync';
|
|
|
|
export default function AutotaskSyncPage() {
|
|
const [selectedEntities, setSelectedEntities] = useState<EntityType[]>([]);
|
|
const [isSyncing, setIsSyncing] = useState(false);
|
|
const [refreshKey, setRefreshKey] = useState(0);
|
|
|
|
useEffect(() => {
|
|
if (!isSyncing) return;
|
|
const interval = setInterval(async () => {
|
|
setRefreshKey(prev => prev + 1);
|
|
try {
|
|
const res = await fetch('/api/sync/status');
|
|
if (res.ok) {
|
|
const d = await res.json();
|
|
if (!d.inProgress) setIsSyncing(false);
|
|
}
|
|
} catch {}
|
|
}, 5000);
|
|
return () => clearInterval(interval);
|
|
}, [isSyncing]);
|
|
|
|
return (
|
|
<div className="container mx-auto py-4 md:py-8 px-4 space-y-6">
|
|
<div className="flex items-center gap-4">
|
|
<Link href="/admin/sync">
|
|
<Button variant="outline" size="sm" className="gap-2">
|
|
<ArrowLeft className="w-4 h-4" />
|
|
Integrations
|
|
</Button>
|
|
</Link>
|
|
<div className="flex items-center gap-3">
|
|
<div className="p-2 rounded-lg border border-blue-500/30 bg-blue-500/5">
|
|
<Database className="w-5 h-5 text-blue-500" />
|
|
</div>
|
|
<div>
|
|
<h1 className="text-2xl font-bold">PSA — Autotask</h1>
|
|
<p className="text-sm text-muted-foreground">Tickets, companies, contacts, time entries, configuration items</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<SyncControlPanel
|
|
selectedEntities={selectedEntities}
|
|
onSelectedEntitiesChange={setSelectedEntities}
|
|
onSyncStart={() => setIsSyncing(true)}
|
|
onSyncComplete={() => { setIsSyncing(false); setRefreshKey(k => k + 1); }}
|
|
isSyncing={isSyncing}
|
|
/>
|
|
|
|
<Tabs defaultValue="status" className="w-full">
|
|
<TabsList className="grid w-full max-w-lg grid-cols-3">
|
|
<TabsTrigger value="status" className="gap-2">
|
|
<Activity className="h-4 w-4" />
|
|
Status
|
|
</TabsTrigger>
|
|
<TabsTrigger value="history" className="gap-2">
|
|
<History className="h-4 w-4" />
|
|
History
|
|
</TabsTrigger>
|
|
<TabsTrigger value="schedules" className="gap-2">
|
|
<Calendar className="h-4 w-4" />
|
|
Schedules
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
<TabsContent value="status" className="mt-6">
|
|
<SyncDashboard refreshKey={refreshKey} />
|
|
</TabsContent>
|
|
<TabsContent value="history" className="mt-6">
|
|
<SyncHistoryTable refreshKey={refreshKey} />
|
|
</TabsContent>
|
|
<TabsContent value="schedules" className="mt-6">
|
|
<SyncScheduler />
|
|
</TabsContent>
|
|
</Tabs>
|
|
</div>
|
|
);
|
|
}
|