Refactor admin vendors page to use client-side fetching and pagination
Migrates the admin vendors page to use client-side data fetching with pagination, search, and improved loading states. Updates the vendor table to show last login, status, and admin badges. Also, optimizes the broadcast dialog by lazy-loading the ReactMarkdown component for preview rendering.
This commit is contained in:
@@ -1,15 +1,16 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useRef } from "react";
|
||||
import { useState, useRef, lazy, Suspense } from "react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
|
||||
import { Send, Bold, Italic, Code, Link as LinkIcon, Image as ImageIcon, X, Eye, EyeOff, Package } from "lucide-react";
|
||||
import { toast } from "sonner";
|
||||
import { clientFetch } from "@/lib/api";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
import ProductSelector from "./product-selector";
|
||||
|
||||
const ReactMarkdown = lazy(() => import('react-markdown'));
|
||||
|
||||
interface BroadcastDialogProps {
|
||||
open: boolean;
|
||||
setOpen: (open: boolean) => void;
|
||||
@@ -265,7 +266,9 @@ __italic text__
|
||||
{showPreview && broadcastMessage.trim() && (
|
||||
<div className="border rounded-lg p-4 bg-background/50">
|
||||
<div className="prose prose-sm dark:prose-invert max-w-none">
|
||||
<ReactMarkdown>{broadcastMessage}</ReactMarkdown>
|
||||
<Suspense fallback={<div className="text-sm text-muted-foreground">Loading preview...</div>}>
|
||||
<ReactMarkdown>{broadcastMessage}</ReactMarkdown>
|
||||
</Suspense>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user