Merge branch 'main' of https://git.coastit.co.za/caitlin/CRM_ENVR
This commit is contained in:
@@ -15,7 +15,7 @@ import {
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu"
|
||||
import {
|
||||
Search, Send, Phone, Video, MoreHorizontal, Paperclip,
|
||||
Search, Send, Phone, MoreHorizontal, Paperclip,
|
||||
Smile, Flag, Ban, Trash2, Image, FileIcon, X, Mic, Square, Play, Pause, Check, CheckCheck,
|
||||
CornerDownRight, Forward, Pencil, Download, Undo2, CalendarDays, Loader2, FolderOpen, Mail,
|
||||
} from "lucide-react"
|
||||
@@ -792,7 +792,7 @@ const formatPreviewContent = (content: string) => {
|
||||
})
|
||||
|
||||
return (
|
||||
<div className="flex h-[calc(100vh-8rem)] -m-4 lg:-m-6 rounded-lg border bg-card overflow-hidden">
|
||||
<div className="flex h-[calc(100dvh-4rem)] -m-4 lg:-m-6 rounded-lg border bg-card overflow-hidden">
|
||||
{/* Conversations list - left panel */}
|
||||
<div
|
||||
className="flex flex-col border-r shrink-0 overflow-hidden"
|
||||
@@ -923,9 +923,6 @@ const formatPreviewContent = (content: string) => {
|
||||
<Button variant="ghost" size="icon" className="h-8 w-8" onClick={() => setIsCallModalOpen(true)}>
|
||||
<Phone className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon" className="h-8 w-8" onClick={() => toast.info("Video calling coming soon")}>
|
||||
<Video className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon" className="h-8 w-8" onClick={() => setScheduleDialogOpen(true)}>
|
||||
<CalendarDays className="h-4 w-4" />
|
||||
</Button>
|
||||
|
||||
@@ -196,11 +196,11 @@ export async function GET(request: NextRequest) {
|
||||
trends,
|
||||
recentLeads: mappedLeads.slice(0, 10),
|
||||
statusDistribution: [
|
||||
{ name: "Open", value: currentCounts.open, color: "#FFFFFF" },
|
||||
{ name: "Contacted", value: currentCounts.contacted, color: "#dc2626" },
|
||||
{ name: "Pending", value: currentCounts.pending, color: "#1e3a8a" },
|
||||
{ name: "Closed", value: currentCounts.closed, color: "#60a5fa" },
|
||||
{ name: "Ignored", value: currentCounts.ignored, color: "#000000" },
|
||||
{ name: "Open", value: currentCounts.open, color: "#3b82f6" },
|
||||
{ name: "Contacted", value: currentCounts.contacted, color: "#f59e0b" },
|
||||
{ name: "Pending", value: currentCounts.pending, color: "#8b5cf6" },
|
||||
{ name: "Closed", value: currentCounts.closed, color: "#10b981" },
|
||||
{ name: "Ignored", value: currentCounts.ignored, color: "#6B7280" },
|
||||
],
|
||||
periodLabel: periodLabels[period] ?? "Selected period",
|
||||
}
|
||||
|
||||
@@ -15,11 +15,7 @@ export async function GET(request: NextRequest) {
|
||||
const pos = searchParams.get("pos") || ""
|
||||
|
||||
if (!TENOR_API_KEY) {
|
||||
return NextResponse.json({
|
||||
results: [],
|
||||
error: "TENOR_API_KEY not configured",
|
||||
noKey: true,
|
||||
})
|
||||
return NextResponse.json({ results: [], noKey: true })
|
||||
}
|
||||
|
||||
const endpoint = q
|
||||
|
||||
@@ -39,8 +39,9 @@ export default function MediaPicker({ onEmojiSelect, onMediaSelect, onClose, the
|
||||
const [gifResults, setGifResults] = useState<any[]>([])
|
||||
const [gifLoading, setGifLoading] = useState(false)
|
||||
const [gifError, setGifError] = useState("")
|
||||
const [gifNoKey, setGifNoKey] = useState(false)
|
||||
const [gifUnavailable, setGifUnavailable] = useState(false)
|
||||
const [gifNext, setGifNext] = useState("")
|
||||
const gifCache = useRef<Map<string, { results: any[]; next: string }>>(new Map())
|
||||
const [recentGifs, setRecentGifs] = useState<string[]>([])
|
||||
const [recentStickers, setRecentStickers] = useState<string[]>([])
|
||||
const [stickerPacks] = useState<StickerPack[]>(getStickerPacks)
|
||||
@@ -60,6 +61,13 @@ export default function MediaPicker({ onEmojiSelect, onMediaSelect, onClose, the
|
||||
useEffect(() => { setRecentStickers(getRecent(RECENT_STICKERS_KEY)) }, [])
|
||||
|
||||
const fetchGifs = useCallback(async (query: string, pos = "") => {
|
||||
const cacheKey = `${query}::${pos}`
|
||||
const cached = gifCache.current.get(cacheKey)
|
||||
if (cached && !pos) {
|
||||
setGifResults(cached.results)
|
||||
setGifNext(cached.next)
|
||||
return
|
||||
}
|
||||
setGifLoading(true)
|
||||
setGifError("")
|
||||
try {
|
||||
@@ -68,17 +76,18 @@ export default function MediaPicker({ onEmojiSelect, onMediaSelect, onClose, the
|
||||
const res = await fetch(`/api/gifs?${params}`)
|
||||
const data = await res.json()
|
||||
if (data.noKey) {
|
||||
setGifNoKey(true)
|
||||
setGifUnavailable(true)
|
||||
setGifResults([])
|
||||
} else if (data.results) {
|
||||
setGifResults((prev) => (pos ? [...prev, ...data.results] : data.results))
|
||||
setGifNext(data.next || "")
|
||||
setGifNoKey(false)
|
||||
setGifUnavailable(false)
|
||||
if (!pos) gifCache.current.set(cacheKey, { results: data.results, next: data.next || "" })
|
||||
} else {
|
||||
setGifError("No results found")
|
||||
}
|
||||
} catch {
|
||||
setGifError("Failed to load GIFs")
|
||||
setGifError("Could not load GIFs. Check your connection.")
|
||||
}
|
||||
setGifLoading(false)
|
||||
}, [])
|
||||
@@ -196,11 +205,10 @@ export default function MediaPicker({ onEmojiSelect, onMediaSelect, onClose, the
|
||||
<div className="flex items-center justify-center h-48">
|
||||
<Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
|
||||
</div>
|
||||
) : gifNoKey ? (
|
||||
) : gifUnavailable ? (
|
||||
<div className="flex flex-col items-center justify-center h-48 text-muted-foreground text-sm gap-2">
|
||||
<Image className="h-8 w-8 opacity-40" />
|
||||
<span>GIF search requires a Tenor API key</span>
|
||||
<span className="text-xs opacity-60">Set TENOR_API_KEY in .env.local</span>
|
||||
<span>GIFs are temporarily unavailable.</span>
|
||||
</div>
|
||||
) : gifError ? (
|
||||
<div className="flex flex-col items-center justify-center h-48 text-muted-foreground text-sm gap-2">
|
||||
|
||||
@@ -98,7 +98,7 @@ export function LeadStatusChart({ data }: LeadStatusChartProps) {
|
||||
key={i}
|
||||
d={arcPath(160, 160, oR, iR, s.start, s.end)}
|
||||
fill={`url(#chart-grad-${i})`}
|
||||
stroke="#d4d4d4"
|
||||
stroke="#000000"
|
||||
strokeWidth="1"
|
||||
opacity={hov !== null && !isH ? 0.3 : 1}
|
||||
style={{
|
||||
|
||||
@@ -9,11 +9,11 @@ import { Lead } from "@/types"
|
||||
import { ArrowRight } from "lucide-react"
|
||||
|
||||
const statusStyles: Record<string, string> = {
|
||||
open: "bg-white/40 text-gray-700 dark:text-gray-300 border-gray-300/50 dark:border-gray-600/50",
|
||||
contacted: "bg-red-500/10 text-red-600 dark:text-red-400 border-red-500/20",
|
||||
pending: "bg-blue-900/10 text-blue-900 dark:text-blue-300 border-blue-900/20",
|
||||
closed: "bg-blue-400/10 text-blue-600 dark:text-blue-300 border-blue-400/20",
|
||||
ignored: "bg-black/10 text-black dark:text-gray-300 border-black/20 dark:border-black/40",
|
||||
open: "bg-blue-500/10 text-blue-600 dark:text-blue-400 border-blue-500/20",
|
||||
contacted: "bg-amber-500/10 text-amber-600 dark:text-amber-400 border-amber-500/20",
|
||||
pending: "bg-purple-500/10 text-purple-600 dark:text-purple-400 border-purple-500/20",
|
||||
closed: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400 border-emerald-500/20",
|
||||
ignored: "bg-zinc-500/10 text-zinc-600 dark:text-zinc-400 border-zinc-500/20",
|
||||
}
|
||||
|
||||
interface RecentLeadsTableProps {
|
||||
|
||||
@@ -33,6 +33,7 @@ import {
|
||||
Trash2,
|
||||
} from "lucide-react";
|
||||
import { useWebsiteTheme } from "@/providers/website-theme-provider";
|
||||
import { CaptainAmericaShield } from "@/components/shared/captain-america-shield";
|
||||
|
||||
interface TopbarProps {
|
||||
onMenuClick: () => void;
|
||||
@@ -72,40 +73,11 @@ export function Topbar({ onMenuClick }: TopbarProps) {
|
||||
.toUpperCase();
|
||||
|
||||
return (
|
||||
<header className="sticky top-0 z-20 flex h-16 items-center gap-4 border-b bg-card dark:bg-[#141414] px-4 lg:px-6 relative overflow-hidden">
|
||||
<header className="sticky top-0 z-20 flex h-16 items-center gap-4 border-b bg-card dark:bg-sidebar px-4 lg:px-6 relative overflow-hidden">
|
||||
{/* Logo */}
|
||||
<div className="flex items-center gap-2 mr-2 shrink-0">
|
||||
{websiteTheme === "spidey" && (
|
||||
<>
|
||||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" className="dark:hidden shrink-0">
|
||||
<circle cx="14" cy="14" r="14" fill="white"/>
|
||||
<ellipse cx="14" cy="14" rx="4" ry="5" fill="#CC0000"/>
|
||||
<ellipse cx="14" cy="14" rx="2" ry="2.5" fill="#CC0000"/>
|
||||
<line x1="14" y1="9" x2="6" y2="5" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="9" x2="22" y2="5" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="12" x2="5" y2="11" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="12" x2="23" y2="11" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="19" x2="6" y2="23" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="19" x2="22" y2="23" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="16" x2="5" y2="17" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="16" x2="23" y2="17" stroke="#CC0000" strokeWidth="1.2"/>
|
||||
</svg>
|
||||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" className="hidden dark:block shrink-0">
|
||||
<circle cx="14" cy="14" r="14" fill="#1A1A1A"/>
|
||||
<ellipse cx="14" cy="14" rx="4" ry="5" fill="#FF1111"/>
|
||||
<ellipse cx="14" cy="14" rx="2" ry="2.5" fill="#FF1111"/>
|
||||
<line x1="14" y1="9" x2="6" y2="5" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="9" x2="22" y2="5" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="12" x2="5" y2="11" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="12" x2="23" y2="11" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="19" x2="6" y2="23" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="19" x2="22" y2="23" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="16" x2="5" y2="17" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
<line x1="14" y1="16" x2="23" y2="17" stroke="#FF1111" strokeWidth="1.2"/>
|
||||
</svg>
|
||||
</>
|
||||
)}
|
||||
<span className="text-[#CC0000] dark:text-[#FF1111] font-bold text-sm tracking-wide">
|
||||
{websiteTheme === "spidey" && <CaptainAmericaShield />}
|
||||
<span className="text-primary font-bold text-sm tracking-wide">
|
||||
CRM
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -7,23 +7,23 @@ import { cn } from "@/lib/utils"
|
||||
const statusConfig: Record<LeadStatus, { label: string; class: string }> = {
|
||||
open: {
|
||||
label: "Open",
|
||||
class: "bg-white/40 text-gray-700 dark:text-gray-300 border-gray-300/50 dark:border-gray-600/50",
|
||||
class: "bg-blue-500/10 text-blue-600 dark:text-blue-400 border-blue-500/20",
|
||||
},
|
||||
contacted: {
|
||||
label: "Contacted",
|
||||
class: "bg-red-500/10 text-red-600 dark:text-red-400 border-red-500/20",
|
||||
class: "bg-amber-500/10 text-amber-600 dark:text-amber-400 border-amber-500/20",
|
||||
},
|
||||
pending: {
|
||||
label: "Pending",
|
||||
class: "bg-blue-900/10 text-blue-900 dark:text-blue-300 border-blue-900/20",
|
||||
class: "bg-purple-500/10 text-purple-600 dark:text-purple-400 border-purple-500/20",
|
||||
},
|
||||
closed: {
|
||||
label: "Closed",
|
||||
class: "bg-blue-400/10 text-blue-600 dark:text-blue-300 border-blue-400/20",
|
||||
class: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400 border-emerald-500/20",
|
||||
},
|
||||
ignored: {
|
||||
label: "Ignored",
|
||||
class: "bg-black/10 text-black dark:text-gray-300 border-black/20 dark:border-black/40",
|
||||
class: "bg-zinc-500/10 text-zinc-600 dark:text-zinc-400 border-zinc-500/20",
|
||||
},
|
||||
}
|
||||
|
||||
@@ -37,11 +37,11 @@ export function LeadStatusBadge({ status, className }: LeadStatusBadgeProps) {
|
||||
return (
|
||||
<Badge variant="outline" className={cn(config.class, className)}>
|
||||
<span className={cn("mr-1.5 h-1.5 w-1.5 rounded-full", {
|
||||
"bg-white border border-gray-300 dark:border-gray-500": status === "open",
|
||||
"bg-red-500": status === "contacted",
|
||||
"bg-blue-900": status === "pending",
|
||||
"bg-blue-400": status === "closed",
|
||||
"bg-black": status === "ignored",
|
||||
"bg-blue-500": status === "open",
|
||||
"bg-amber-500": status === "contacted",
|
||||
"bg-purple-500": status === "pending",
|
||||
"bg-emerald-500": status === "closed",
|
||||
"bg-zinc-500": status === "ignored",
|
||||
})} />
|
||||
{config.label}
|
||||
</Badge>
|
||||
|
||||
@@ -8,24 +8,11 @@ export function CaptainAmericaShield() {
|
||||
viewBox="0 0 100 100"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<defs>
|
||||
<clipPath id="shield-clip">
|
||||
<polygon points="50,95 5,60 5,30 50,5 95,30 95,60" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g clipPath="url(#shield-clip)">
|
||||
<circle cx="50" cy="45" r="45" fill="#c62828" />
|
||||
<circle cx="50" cy="45" r="35" fill="#efefef" />
|
||||
<circle cx="50" cy="45" r="25" fill="#c62828" />
|
||||
<circle cx="50" cy="45" r="15" fill="#1565c0" />
|
||||
<polygon points="50,32 56,47 72,48 60,58 64,75 50,64 36,75 40,58 28,48 44,47" fill="#efefef" />
|
||||
</g>
|
||||
<polygon
|
||||
points="50,95 5,60 5,30 50,5 95,30 95,60"
|
||||
fill="none"
|
||||
stroke="#c62828"
|
||||
strokeWidth="1.5"
|
||||
/>
|
||||
<circle cx="50" cy="50" r="48" fill="#c62828" />
|
||||
<circle cx="50" cy="50" r="36" fill="#efefef" />
|
||||
<circle cx="50" cy="50" r="24" fill="#c62828" />
|
||||
<circle cx="50" cy="50" r="14" fill="#1565c0" />
|
||||
<polygon points="50,34 55,48 70,48 58,57 62,72 50,62 38,72 42,57 30,48 45,48" fill="#efefef" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
+4
-1
@@ -2,8 +2,11 @@ import { SignJWT, jwtVerify } from "jose";
|
||||
import bcrypt from "bcryptjs";
|
||||
import { query } from "@/lib/db";
|
||||
import { cookies } from "next/headers";
|
||||
import crypto from "crypto";
|
||||
|
||||
const RAW_SECRET = process.env.JWT_SECRET;
|
||||
const RAW_SECRET = process.env.NODE_ENV === "production"
|
||||
? process.env.JWT_SECRET
|
||||
: crypto.randomUUID();
|
||||
if (!RAW_SECRET) {
|
||||
throw new Error("JWT_SECRET environment variable is required");
|
||||
}
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
export const LEAD_STATUSES = {
|
||||
open: { label: "Open", color: "bg-white" },
|
||||
contacted: { label: "Contacted", color: "bg-red-500" },
|
||||
pending: { label: "Pending", color: "bg-blue-900" },
|
||||
closed: { label: "Closed", color: "bg-blue-400" },
|
||||
ignored: { label: "Ignored", color: "bg-black" },
|
||||
open: { label: "Open", color: "bg-blue-500" },
|
||||
contacted: { label: "Contacted", color: "bg-amber-500" },
|
||||
pending: { label: "Pending", color: "bg-purple-500" },
|
||||
closed: { label: "Closed", color: "bg-emerald-500" },
|
||||
ignored: { label: "Ignored", color: "bg-zinc-500" },
|
||||
} as const
|
||||
|
||||
export const LEAD_SOURCES = [
|
||||
|
||||
Reference in New Issue
Block a user