chore: replace orphaned tasks/subscriptions/users pages with redirects
This commit is contained in:
@@ -1,157 +1,8 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
import { useEffect } from "react";
|
||||||
import { useQuery } from "@tanstack/react-query";
|
|
||||||
import { useRouter } from "next/navigation";
|
import { useRouter } from "next/navigation";
|
||||||
import { RefreshCw, Wifi, AlertCircle } from "lucide-react";
|
export default function SubscriptionsRedirect() {
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/Card";
|
|
||||||
import { Table, TableHead, TableBody, TableRow, Th, Td } from "@/components/ui/Table";
|
|
||||||
import { Badge } from "@/components/ui/Badge";
|
|
||||||
import { Button } from "@/components/ui/Button";
|
|
||||||
import { formatDate, formatCurrency } from "@/lib/utils";
|
|
||||||
import api from "@/lib/api";
|
|
||||||
import type { PaginatedResponse } from "@/types";
|
|
||||||
|
|
||||||
interface Subscription {
|
|
||||||
id: string;
|
|
||||||
clientId: string;
|
|
||||||
status: string;
|
|
||||||
startDate: string;
|
|
||||||
endDate?: string;
|
|
||||||
client?: { firstName: string; lastName: string; accountNumber: string };
|
|
||||||
plan?: { name: string; type: string; monthlyPrice: number };
|
|
||||||
planId?: string;
|
|
||||||
monthlyRate?: number;
|
|
||||||
mrc?: number;
|
|
||||||
type?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const statusVariant: Record<string, "success" | "warning" | "danger" | "muted"> = {
|
|
||||||
ACTIVE: "success",
|
|
||||||
active: "success",
|
|
||||||
SUSPENDED: "warning",
|
|
||||||
suspended: "warning",
|
|
||||||
CANCELLED: "danger",
|
|
||||||
cancelled: "danger",
|
|
||||||
DISCONNECTED: "danger",
|
|
||||||
disconnected: "danger",
|
|
||||||
PENDING: "muted",
|
|
||||||
pending: "muted",
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function SubscriptionsPage() {
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
useEffect(() => { router.replace("/clients"); }, [router]);
|
||||||
const { data, isLoading, isError, error, refetch, isFetching } = useQuery<PaginatedResponse<Subscription>>({
|
return <div className="p-8 text-gray-400">Redirecting to clients…</div>;
|
||||||
queryKey: ["subscriptions"],
|
|
||||||
queryFn: async () => {
|
|
||||||
const res = await api.get<PaginatedResponse<Subscription>>("/api/v1/subscriptions?page=1&limit=50");
|
|
||||||
return res.data;
|
|
||||||
},
|
|
||||||
retry: false,
|
|
||||||
});
|
|
||||||
|
|
||||||
const subscriptions = data?.data ?? [];
|
|
||||||
const meta = data?.meta;
|
|
||||||
|
|
||||||
const isNotFound =
|
|
||||||
isError &&
|
|
||||||
(error as { response?: { status?: number } })?.response?.status === 404;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div>
|
|
||||||
<h1 className="text-2xl font-bold text-gray-900">Subscriptions</h1>
|
|
||||||
<p className="text-sm text-gray-500">{meta?.total ?? 0} total subscriptions</p>
|
|
||||||
</div>
|
|
||||||
<Button size="sm" variant="outline" onClick={() => refetch()} disabled={isFetching}>
|
|
||||||
<RefreshCw className={`h-4 w-4 ${isFetching ? "animate-spin" : ""}`} />
|
|
||||||
{isFetching ? "Checking…" : "Retry"}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle>All Subscriptions</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent className="p-0">
|
|
||||||
{isLoading ? (
|
|
||||||
<div className="p-6 space-y-3">
|
|
||||||
{Array.from({ length: 4 }).map((_, i) => (
|
|
||||||
<div key={i} className="h-10 animate-pulse bg-gray-100 rounded-lg" />
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
) : isNotFound || (isError && !data) ? (
|
|
||||||
<div className="flex flex-col items-center justify-center py-16 text-center px-6">
|
|
||||||
<div className="flex h-16 w-16 items-center justify-center rounded-full bg-blue-50 mb-4">
|
|
||||||
<Wifi className="h-8 w-8 text-blue-400" />
|
|
||||||
</div>
|
|
||||||
<h3 className="text-base font-semibold text-gray-700 mb-2">Subscriptions Module Not Yet Available</h3>
|
|
||||||
<p className="text-sm text-gray-500 max-w-sm mb-4">
|
|
||||||
Subscription data will appear here once the module is deployed.
|
|
||||||
</p>
|
|
||||||
<div className="flex items-center gap-1.5 text-xs text-amber-600 bg-amber-50 px-3 py-1.5 rounded-full mb-5">
|
|
||||||
<AlertCircle className="h-3.5 w-3.5" />
|
|
||||||
<span>API endpoint not yet available</span>
|
|
||||||
</div>
|
|
||||||
<Button variant="secondary" onClick={() => refetch()} disabled={isFetching}>
|
|
||||||
<RefreshCw className={`h-4 w-4 ${isFetching ? "animate-spin" : ""}`} />
|
|
||||||
{isFetching ? "Checking…" : "Retry Now"}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
) : subscriptions.length === 0 ? (
|
|
||||||
<div className="flex flex-col items-center justify-center py-16 text-center px-6">
|
|
||||||
<div className="flex h-14 w-14 items-center justify-center rounded-full bg-gray-100 mb-3">
|
|
||||||
<Wifi className="h-7 w-7 text-gray-400" />
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-gray-500">No subscriptions yet.</p>
|
|
||||||
<Button variant="secondary" size="sm" className="mt-3" onClick={() => refetch()}>
|
|
||||||
<RefreshCw className="h-4 w-4" /> Refresh
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<Table>
|
|
||||||
<TableHead>
|
|
||||||
<TableRow>
|
|
||||||
<Th>Client</Th>
|
|
||||||
<Th>Plan</Th>
|
|
||||||
<Th>Type</Th>
|
|
||||||
<Th>Status</Th>
|
|
||||||
<Th>Start Date</Th>
|
|
||||||
<Th>MRC</Th>
|
|
||||||
</TableRow>
|
|
||||||
</TableHead>
|
|
||||||
<TableBody>
|
|
||||||
{subscriptions.map((sub) => (
|
|
||||||
<TableRow
|
|
||||||
key={sub.id}
|
|
||||||
className="hover:bg-gray-50 transition-colors cursor-pointer"
|
|
||||||
onClick={() => sub.clientId && router.push(`/clients/${sub.clientId}`)}
|
|
||||||
>
|
|
||||||
<Td>
|
|
||||||
{sub.client ? (
|
|
||||||
<div>
|
|
||||||
<p className="font-medium text-sm">{sub.client.firstName} {sub.client.lastName}</p>
|
|
||||||
<p className="text-xs text-gray-400 font-mono">{sub.client.accountNumber}</p>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<span className="text-gray-400 text-sm">—</span>
|
|
||||||
)}
|
|
||||||
</Td>
|
|
||||||
<Td className="font-medium">{sub.plan?.name ?? sub.planId ?? "—"}</Td>
|
|
||||||
<Td><Badge variant="muted">{sub.plan?.type ?? sub.type ?? "—"}</Badge></Td>
|
|
||||||
<Td>
|
|
||||||
<Badge variant={statusVariant[sub.status] ?? "muted"}>{sub.status}</Badge>
|
|
||||||
</Td>
|
|
||||||
<Td>{formatDate(sub.startDate)}</Td>
|
|
||||||
<Td>{formatCurrency(sub.plan?.monthlyPrice ?? sub.monthlyRate ?? sub.mrc ?? 0)}</Td>
|
|
||||||
</TableRow>
|
|
||||||
))}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
)}
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,123 +1,8 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
import { useEffect } from "react";
|
||||||
import { useState } from "react";
|
import { useRouter } from "next/navigation";
|
||||||
import { useQuery } from "@tanstack/react-query";
|
export default function TasksRedirect() {
|
||||||
import { ChevronLeft, ChevronRight, RefreshCw } from "lucide-react";
|
const router = useRouter();
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/Card";
|
useEffect(() => { router.replace("/tickets"); }, [router]);
|
||||||
import { Table, TableHead, TableBody, TableRow, Th, Td, EmptyState } from "@/components/ui/Table";
|
return <div className="p-8 text-gray-400">Redirecting to tickets…</div>;
|
||||||
import { Badge } from "@/components/ui/Badge";
|
|
||||||
import { Button } from "@/components/ui/Button";
|
|
||||||
import { formatDate } from "@/lib/utils";
|
|
||||||
import api from "@/lib/api";
|
|
||||||
import type { Task, PaginatedResponse } from "@/types";
|
|
||||||
|
|
||||||
const statusVariant: Record<string, "success" | "warning" | "default" | "muted"> = {
|
|
||||||
done: "success",
|
|
||||||
DONE: "success",
|
|
||||||
completed: "success",
|
|
||||||
COMPLETED: "success",
|
|
||||||
in_progress: "default",
|
|
||||||
IN_PROGRESS: "default",
|
|
||||||
pending: "warning",
|
|
||||||
PENDING: "warning",
|
|
||||||
cancelled: "muted",
|
|
||||||
CANCELLED: "muted",
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function TasksPage() {
|
|
||||||
const [page, setPage] = useState(1);
|
|
||||||
|
|
||||||
const { data, isLoading, refetch } = useQuery<PaginatedResponse<Task>>({
|
|
||||||
queryKey: ["tasks", page],
|
|
||||||
queryFn: async () => {
|
|
||||||
const res = await api.get<PaginatedResponse<Task>>(`/api/v1/manual-tasks?page=${page}&limit=20`);
|
|
||||||
return res.data;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const tasks = data?.data ?? [];
|
|
||||||
const meta = data?.meta;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div>
|
|
||||||
<h1 className="text-2xl font-bold text-gray-900">Tasks</h1>
|
|
||||||
<p className="text-sm text-gray-500">{meta?.total ?? 0} total tasks</p>
|
|
||||||
</div>
|
|
||||||
<Button size="sm" variant="outline" onClick={() => refetch()}>
|
|
||||||
<RefreshCw className="h-4 w-4" />
|
|
||||||
Refresh
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Card>
|
|
||||||
<CardHeader><CardTitle>All Tasks</CardTitle></CardHeader>
|
|
||||||
<CardContent className="p-0">
|
|
||||||
<Table>
|
|
||||||
<TableHead>
|
|
||||||
<TableRow>
|
|
||||||
<Th>Title</Th>
|
|
||||||
<Th>Type</Th>
|
|
||||||
<Th>Status</Th>
|
|
||||||
<Th>Assigned To</Th>
|
|
||||||
<Th>Due Date</Th>
|
|
||||||
<Th>Linked Ticket</Th>
|
|
||||||
</TableRow>
|
|
||||||
</TableHead>
|
|
||||||
<TableBody>
|
|
||||||
{isLoading ? (
|
|
||||||
Array.from({ length: 5 }).map((_, i) => (
|
|
||||||
<TableRow key={i}>
|
|
||||||
{Array.from({ length: 6 }).map((_, j) => (
|
|
||||||
<Td key={j}><div className="h-4 w-24 animate-pulse bg-gray-100 rounded" /></Td>
|
|
||||||
))}
|
|
||||||
</TableRow>
|
|
||||||
))
|
|
||||||
) : tasks.length === 0 ? (
|
|
||||||
<EmptyState message="No tasks yet" />
|
|
||||||
) : (
|
|
||||||
tasks.map((task) => (
|
|
||||||
<TableRow key={task.id} className="hover:bg-gray-50 transition-colors">
|
|
||||||
<Td className="font-medium">{task.type?.replace(/_/g," ")}</Td>
|
|
||||||
<Td><Badge variant="muted">{task.type}</Badge></Td>
|
|
||||||
<Td>
|
|
||||||
<Badge variant={statusVariant[task.status] ?? "muted"}>
|
|
||||||
{task.status}
|
|
||||||
</Badge>
|
|
||||||
</Td>
|
|
||||||
<Td className="text-gray-500">
|
|
||||||
{task.assignedUser
|
|
||||||
? `${task.assignedUser.firstName} ${task.assignedUser.lastName}`
|
|
||||||
: task.assignedTo ?? "—"}
|
|
||||||
</Td>
|
|
||||||
<Td className="text-gray-500">
|
|
||||||
{task.dueDate ? formatDate(task.dueDate) : "—"}
|
|
||||||
</Td>
|
|
||||||
<Td className="text-gray-400 text-xs font-mono">
|
|
||||||
{task.ticket?.subject ?? (task.ticketId ? task.ticketId.slice(0, 8) : "—")}
|
|
||||||
</Td>
|
|
||||||
</TableRow>
|
|
||||||
))
|
|
||||||
)}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
|
|
||||||
{meta && meta.totalPages > 1 && (
|
|
||||||
<div className="flex items-center justify-between px-4 py-3 border-t border-gray-100">
|
|
||||||
<p className="text-sm text-gray-500">Page {meta.page} of {meta.totalPages}</p>
|
|
||||||
<div className="flex gap-2">
|
|
||||||
<Button size="sm" variant="outline" disabled={page <= 1} onClick={() => setPage(page - 1)}>
|
|
||||||
<ChevronLeft className="h-4 w-4" />
|
|
||||||
</Button>
|
|
||||||
<Button size="sm" variant="outline" disabled={page >= meta.totalPages} onClick={() => setPage(page + 1)}>
|
|
||||||
<ChevronRight className="h-4 w-4" />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,110 +1,8 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
import { useEffect } from "react";
|
||||||
import { useQuery } from "@tanstack/react-query";
|
import { useRouter } from "next/navigation";
|
||||||
import { RefreshCw } from "lucide-react";
|
export default function UsersRedirect() {
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/Card";
|
const router = useRouter();
|
||||||
import { Table, TableHead, TableBody, TableRow, Th, Td, EmptyState } from "@/components/ui/Table";
|
useEffect(() => { router.replace("/settings"); }, [router]);
|
||||||
import { Badge } from "@/components/ui/Badge";
|
return <div className="p-8 text-gray-400">Redirecting to settings…</div>;
|
||||||
import { Button } from "@/components/ui/Button";
|
|
||||||
import { formatDate } from "@/lib/utils";
|
|
||||||
import api from "@/lib/api";
|
|
||||||
import type { User, UsersResponse } from "@/types";
|
|
||||||
|
|
||||||
export default function UsersPage() {
|
|
||||||
const { data: users, isLoading, refetch } = useQuery<UsersResponse>({
|
|
||||||
queryKey: ["users"],
|
|
||||||
queryFn: async () => {
|
|
||||||
const res = await api.get<UsersResponse>("/api/v1/users?page=1&limit=20");
|
|
||||||
// Handle both array and paginated response
|
|
||||||
const d = res.data;
|
|
||||||
if (Array.isArray(d)) return d;
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
||||||
const anyD = d as any;
|
|
||||||
if (anyD.data) return anyD.data as UsersResponse;
|
|
||||||
return [];
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const userList: User[] = users ?? [];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div>
|
|
||||||
<h1 className="text-2xl font-bold text-gray-900">Users</h1>
|
|
||||||
<p className="text-sm text-gray-500">{userList.length} total users</p>
|
|
||||||
</div>
|
|
||||||
<Button size="sm" variant="outline" onClick={() => refetch()}>
|
|
||||||
<RefreshCw className="h-4 w-4" />
|
|
||||||
Refresh
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Card>
|
|
||||||
<CardHeader><CardTitle>All Users</CardTitle></CardHeader>
|
|
||||||
<CardContent className="p-0">
|
|
||||||
<Table>
|
|
||||||
<TableHead>
|
|
||||||
<TableRow>
|
|
||||||
<Th>Name</Th>
|
|
||||||
<Th>Email</Th>
|
|
||||||
<Th>Role</Th>
|
|
||||||
<Th>Status</Th>
|
|
||||||
<Th>Last Login</Th>
|
|
||||||
<Th>Joined</Th>
|
|
||||||
</TableRow>
|
|
||||||
</TableHead>
|
|
||||||
<TableBody>
|
|
||||||
{isLoading ? (
|
|
||||||
Array.from({ length: 3 }).map((_, i) => (
|
|
||||||
<TableRow key={i}>
|
|
||||||
{Array.from({ length: 6 }).map((_, j) => (
|
|
||||||
<Td key={j}><div className="h-4 w-24 animate-pulse bg-gray-100 rounded" /></Td>
|
|
||||||
))}
|
|
||||||
</TableRow>
|
|
||||||
))
|
|
||||||
) : userList.length === 0 ? (
|
|
||||||
<EmptyState message="No users found" />
|
|
||||||
) : (
|
|
||||||
userList.map((user) => {
|
|
||||||
const roles = user.roleAssignments?.map((r) => r.role) ?? [];
|
|
||||||
return (
|
|
||||||
<TableRow key={user.id} className="hover:bg-gray-50 transition-colors">
|
|
||||||
<Td className="font-medium">{user.firstName} {user.lastName}</Td>
|
|
||||||
<Td className="text-gray-500">{user.email}</Td>
|
|
||||||
<Td>
|
|
||||||
<div className="flex gap-1 flex-wrap">
|
|
||||||
{roles.length === 0 ? (
|
|
||||||
<Badge variant="muted">No role</Badge>
|
|
||||||
) : (
|
|
||||||
roles.map((role) => (
|
|
||||||
<Badge
|
|
||||||
key={role}
|
|
||||||
variant={role === "ADMIN" ? "default" : role === "TECHNICIAN" ? "success" : "muted"}
|
|
||||||
>
|
|
||||||
{role}
|
|
||||||
</Badge>
|
|
||||||
))
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</Td>
|
|
||||||
<Td>
|
|
||||||
<Badge variant={user.isActive ? "success" : "muted"}>
|
|
||||||
{user.isActive ? "Active" : "Inactive"}
|
|
||||||
</Badge>
|
|
||||||
</Td>
|
|
||||||
<Td className="text-xs text-gray-400">
|
|
||||||
{user.lastLoginAt ? formatDate(user.lastLoginAt) : "Never"}
|
|
||||||
</Td>
|
|
||||||
<Td className="text-xs text-gray-400">{formatDate(user.createdAt)}</Td>
|
|
||||||
</TableRow>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
)}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user