Remove auction and description editing features from media outlet page
Removes the Auction component, related queries, and UI elements for editing media outlet descriptions. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 0fb68265-c270-4198-9584-3d9be9bddb41 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/0fb68265-c270-4198-9584-3d9be9bddb41/sXqrCAq
This commit is contained in:
4
.replit
4
.replit
@ -18,6 +18,10 @@ externalPort = 80
|
|||||||
localPort = 34047
|
localPort = 34047
|
||||||
externalPort = 3002
|
externalPort = 3002
|
||||||
|
|
||||||
|
[[ports]]
|
||||||
|
localPort = 35303
|
||||||
|
externalPort = 4200
|
||||||
|
|
||||||
[[ports]]
|
[[ports]]
|
||||||
localPort = 37531
|
localPort = 37531
|
||||||
externalPort = 3001
|
externalPort = 3001
|
||||||
|
|||||||
BIN
attached_assets/chayan asli slides_1759213492580.pptx
Normal file
BIN
attached_assets/chayan asli slides_1759213492580.pptx
Normal file
Binary file not shown.
@ -1,22 +1,20 @@
|
|||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { useQuery, useMutation } from "@tanstack/react-query";
|
import { useQuery } from "@tanstack/react-query";
|
||||||
import { useRoute, useLocation } from "wouter";
|
import { useRoute, useLocation } from "wouter";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { Card, CardContent } from "@/components/ui/card";
|
import { Card, CardContent } from "@/components/ui/card";
|
||||||
import { Badge } from "@/components/ui/badge";
|
import { Dialog, DialogContent } from "@/components/ui/dialog";
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
|
||||||
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "@/components/ui/dialog";
|
|
||||||
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
|
||||||
import { Gavel, Clock, TrendingUp, Search, Settings, User, LogOut, Grid, List, Edit, Info } from "lucide-react";
|
import { Search, Settings, User, LogOut, Grid, List, Info } from "lucide-react";
|
||||||
import { useAuth } from "@/hooks/useAuth";
|
import { useAuth } from "@/hooks/useAuth";
|
||||||
import { useToast } from "@/hooks/use-toast";
|
import { useToast } from "@/hooks/use-toast";
|
||||||
import { queryClient, apiRequest } from "@/lib/queryClient";
|
import { queryClient } from "@/lib/queryClient";
|
||||||
import ArticleCard from "@/components/ArticleCard";
|
import ArticleCard from "@/components/ArticleCard";
|
||||||
import Footer from "@/components/Footer";
|
import Footer from "@/components/Footer";
|
||||||
import LoginModal from "@/components/LoginModal";
|
import LoginModal from "@/components/LoginModal";
|
||||||
import SearchModal from "@/components/SearchModal";
|
import SearchModal from "@/components/SearchModal";
|
||||||
import type { MediaOutlet, Article, Auction } from "@shared/schema";
|
import type { MediaOutlet, Article } from "@shared/schema";
|
||||||
|
|
||||||
export default function MediaOutlet() {
|
export default function MediaOutlet() {
|
||||||
const [, params] = useRoute("/media/:slug");
|
const [, params] = useRoute("/media/:slug");
|
||||||
@ -24,10 +22,7 @@ export default function MediaOutlet() {
|
|||||||
const [viewMode, setViewMode] = useState<"grid" | "list">("grid");
|
const [viewMode, setViewMode] = useState<"grid" | "list">("grid");
|
||||||
const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
|
const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
|
||||||
const [isSearchModalOpen, setIsSearchModalOpen] = useState(false);
|
const [isSearchModalOpen, setIsSearchModalOpen] = useState(false);
|
||||||
const [isEditDescModalOpen, setIsEditDescModalOpen] = useState(false);
|
|
||||||
const [enlargedImage, setEnlargedImage] = useState<string | null>(null);
|
const [enlargedImage, setEnlargedImage] = useState<string | null>(null);
|
||||||
const [newDescription, setNewDescription] = useState("");
|
|
||||||
const [alternativeDescription, setAlternativeDescription] = useState("Partner at Type3 Capital and Non-Executive Director at TrueFi DAO with a strong background in fund management, venture capital, and digital assets");
|
|
||||||
const { user, isAuthenticated } = useAuth();
|
const { user, isAuthenticated } = useAuth();
|
||||||
const { toast } = useToast();
|
const { toast } = useToast();
|
||||||
|
|
||||||
@ -41,11 +36,6 @@ export default function MediaOutlet() {
|
|||||||
enabled: !!params?.slug
|
enabled: !!params?.slug
|
||||||
});
|
});
|
||||||
|
|
||||||
const { data: auction, isLoading: auctionLoading } = useQuery<Auction>({
|
|
||||||
queryKey: ["/api/media-outlets", params?.slug, "auction"],
|
|
||||||
enabled: !!params?.slug
|
|
||||||
});
|
|
||||||
|
|
||||||
const handleLogout = async () => {
|
const handleLogout = async () => {
|
||||||
try {
|
try {
|
||||||
const response = await fetch("/api/logout", {
|
const response = await fetch("/api/logout", {
|
||||||
@ -74,60 +64,6 @@ export default function MediaOutlet() {
|
|||||||
setLocation("/admin");
|
setLocation("/admin");
|
||||||
};
|
};
|
||||||
|
|
||||||
const updateDescriptionMutation = useMutation({
|
|
||||||
mutationFn: async (description: string) => {
|
|
||||||
await apiRequest("PATCH", `/api/media-outlets/${params?.slug}`, { description });
|
|
||||||
},
|
|
||||||
onSuccess: () => {
|
|
||||||
queryClient.invalidateQueries({ queryKey: ["/api/media-outlets", params?.slug] });
|
|
||||||
toast({
|
|
||||||
title: "Success",
|
|
||||||
description: "Description updated successfully",
|
|
||||||
});
|
|
||||||
setIsEditDescModalOpen(false);
|
|
||||||
},
|
|
||||||
onError: () => {
|
|
||||||
toast({
|
|
||||||
title: "Error",
|
|
||||||
description: "Failed to update description",
|
|
||||||
variant: "destructive",
|
|
||||||
});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const handleEditDescription = () => {
|
|
||||||
setNewDescription(outlet?.description || "");
|
|
||||||
setIsEditDescModalOpen(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSaveDescription = (useAlternative: boolean = false) => {
|
|
||||||
const descToSave = useAlternative ? alternativeDescription : newDescription;
|
|
||||||
updateDescriptionMutation.mutate(descToSave);
|
|
||||||
};
|
|
||||||
|
|
||||||
const formatCurrency = (amount: string | null) => {
|
|
||||||
if (!amount) return "$0";
|
|
||||||
return new Intl.NumberFormat('en-US', {
|
|
||||||
style: 'currency',
|
|
||||||
currency: 'USD'
|
|
||||||
}).format(parseFloat(amount));
|
|
||||||
};
|
|
||||||
|
|
||||||
const formatTimeRemaining = (endDate: Date | string) => {
|
|
||||||
const end = new Date(endDate);
|
|
||||||
const now = new Date();
|
|
||||||
const diff = end.getTime() - now.getTime();
|
|
||||||
|
|
||||||
if (diff <= 0) return "Auction Ended";
|
|
||||||
|
|
||||||
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
|
|
||||||
const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
||||||
|
|
||||||
if (days > 0) return `${days}d ${hours}h remaining`;
|
|
||||||
if (hours > 0) return `${hours}h remaining`;
|
|
||||||
return "Less than 1h remaining";
|
|
||||||
};
|
|
||||||
|
|
||||||
if (outletLoading) {
|
if (outletLoading) {
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col min-h-screen bg-gray-50">
|
<div className="flex flex-col min-h-screen bg-gray-50">
|
||||||
@ -381,129 +317,6 @@ export default function MediaOutlet() {
|
|||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main className="flex-1 max-w-7xl mx-auto px-6 py-4 pb-32 w-full">
|
<main className="flex-1 max-w-7xl mx-auto px-6 py-4 pb-32 w-full">
|
||||||
{/* Outlet Header */}
|
|
||||||
<div className="mb-4">
|
|
||||||
<div className="flex items-start space-x-4 mb-3">
|
|
||||||
{outlet.imageUrl ? (
|
|
||||||
<img
|
|
||||||
src={outlet.imageUrl}
|
|
||||||
alt={outlet.name}
|
|
||||||
className="w-16 h-16 rounded-full object-cover cursor-pointer hover:ring-2 hover:ring-blue-400 transition-all"
|
|
||||||
onClick={() => setEnlargedImage(outlet.imageUrl!)}
|
|
||||||
data-testid="image-outlet-profile"
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<div className="w-16 h-16 bg-gray-100 rounded-full flex items-center justify-center">
|
|
||||||
<span className="text-gray-600 font-bold text-xl">
|
|
||||||
{outlet.name.charAt(0)}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="flex-1">
|
|
||||||
<div className="flex items-center space-x-2 mb-2">
|
|
||||||
<h1 className="text-2xl font-bold">{outlet.name}</h1>
|
|
||||||
<Button
|
|
||||||
variant="ghost"
|
|
||||||
size="sm"
|
|
||||||
className="h-8 w-8 p-0 rounded-full hover:bg-gray-100"
|
|
||||||
onClick={() => setLocation(`/media/${params?.slug}/report`)}
|
|
||||||
data-testid="button-report"
|
|
||||||
>
|
|
||||||
<Info className="h-5 w-5 text-gray-600" />
|
|
||||||
</Button>
|
|
||||||
<Badge variant="secondary" className="capitalize">
|
|
||||||
{outlet.category}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center space-x-2 mb-2">
|
|
||||||
<p className="text-gray-600">{outlet.description}</p>
|
|
||||||
{user && (user.role === 'admin' || user.role === 'superadmin') && (
|
|
||||||
<Button
|
|
||||||
variant="ghost"
|
|
||||||
size="sm"
|
|
||||||
onClick={handleEditDescription}
|
|
||||||
data-testid="button-edit-description"
|
|
||||||
>
|
|
||||||
<Edit className="h-3 w-3" />
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
{outlet.tags && outlet.tags.length > 0 && (
|
|
||||||
<div className="flex items-center space-x-2 mb-2">
|
|
||||||
{outlet.tags.map((tag) => (
|
|
||||||
<Badge key={tag} variant="outline">
|
|
||||||
{tag}
|
|
||||||
</Badge>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* Auction Section */}
|
|
||||||
{!auctionLoading && auction ? (
|
|
||||||
<Card className="border-gray-200 bg-gray-50">
|
|
||||||
<CardContent className="p-3">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div className="flex items-center space-x-4">
|
|
||||||
<div className="flex items-center space-x-2">
|
|
||||||
<Gavel className="h-5 w-5 text-gray-600" />
|
|
||||||
<span className="font-semibold text-gray-900">Management Rights Auction</span>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center space-x-2 text-sm text-gray-700">
|
|
||||||
<TrendingUp className="h-4 w-4" />
|
|
||||||
<span>Current Highest Bid: {formatCurrency(auction.currentBid)}</span>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center space-x-2 text-sm text-gray-700">
|
|
||||||
<Clock className="h-4 w-4" />
|
|
||||||
<span>{formatTimeRemaining(auction.endDate)}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
onClick={() => setLocation(`/media/${params?.slug}/auction`)}
|
|
||||||
size="sm"
|
|
||||||
className="bg-gray-600 hover:bg-gray-700 text-white"
|
|
||||||
data-testid="button-auction"
|
|
||||||
>
|
|
||||||
Place Bid
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
) : !auctionLoading && !auction ? (
|
|
||||||
<Card className="border-gray-200 bg-gray-50">
|
|
||||||
<CardContent className="p-3">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div className="flex items-center space-x-2">
|
|
||||||
<Gavel className="h-5 w-5 text-gray-500" />
|
|
||||||
<span className="text-gray-700">No active auction currently</span>
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
disabled
|
|
||||||
data-testid="button-no-auction"
|
|
||||||
>
|
|
||||||
Auction Pending
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
) : (
|
|
||||||
<Card className="border-gray-200 bg-gray-50">
|
|
||||||
<CardContent className="p-3">
|
|
||||||
<div className="flex items-center space-x-2">
|
|
||||||
<div className="animate-pulse flex space-x-4">
|
|
||||||
<div className="rounded-full bg-gray-300 h-5 w-5"></div>
|
|
||||||
<div className="h-4 bg-gray-300 rounded w-24"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Articles Section */}
|
{/* Articles Section */}
|
||||||
<div className="mb-4">
|
<div className="mb-4">
|
||||||
<div className="flex items-center justify-between mb-3">
|
<div className="flex items-center justify-between mb-3">
|
||||||
@ -612,63 +425,6 @@ export default function MediaOutlet() {
|
|||||||
)}
|
)}
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
||||||
{/* Edit Description Modal */}
|
|
||||||
<Dialog open={isEditDescModalOpen} onOpenChange={setIsEditDescModalOpen}>
|
|
||||||
<DialogContent data-testid="modal-edit-description">
|
|
||||||
<DialogHeader>
|
|
||||||
<DialogTitle>Edit Description</DialogTitle>
|
|
||||||
<DialogDescription>
|
|
||||||
Update the description for {outlet?.name}
|
|
||||||
</DialogDescription>
|
|
||||||
</DialogHeader>
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div>
|
|
||||||
<label className="text-sm font-medium">Current Description</label>
|
|
||||||
<Textarea
|
|
||||||
value={newDescription}
|
|
||||||
onChange={(e) => setNewDescription(e.target.value)}
|
|
||||||
rows={3}
|
|
||||||
className="mt-1"
|
|
||||||
data-testid="textarea-description"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{outlet?.slug === 'krysh-parker' && (
|
|
||||||
<div className="p-3 bg-blue-50 rounded-lg border border-blue-200">
|
|
||||||
<p className="text-sm font-medium text-blue-900 mb-2">Alternative Description</p>
|
|
||||||
<p className="text-sm text-blue-700 mb-3">{alternativeDescription}</p>
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
onClick={() => handleSaveDescription(true)}
|
|
||||||
disabled={updateDescriptionMutation.isPending}
|
|
||||||
data-testid="button-use-alternative"
|
|
||||||
>
|
|
||||||
Use This Description
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="flex space-x-2">
|
|
||||||
<Button
|
|
||||||
onClick={() => handleSaveDescription(false)}
|
|
||||||
disabled={updateDescriptionMutation.isPending}
|
|
||||||
data-testid="button-save-description"
|
|
||||||
>
|
|
||||||
{updateDescriptionMutation.isPending ? "Saving..." : "Save Changes"}
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
onClick={() => setIsEditDescModalOpen(false)}
|
|
||||||
data-testid="button-cancel-edit"
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user