import EditModal from './Component/Edit'; import AppLayout from '@/layouts/app-layout'; import { Head, router, usePage } from '@inertiajs/react'; import { ArrowLeft, BoomBox, Calendar, Check, CheckCircle2, ClipboardList, Copy, Globe, History, Info, Pencil, Radio, XCircle, } from 'lucide-react'; import { ReactNode, useState } from 'react'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; declare const route: (...args: any[]) => string; interface ProductChannelData { id: number; uid?: string; name: string; label?: string; icon?: string; status: number; created_at: string; updated_at: string; } type ShowProps = { item: ProductChannelData; }; function Show() { const { item } = usePage().props; const [copiedField, setCopiedField] = useState(null); const [activeTab, setActiveTab] = useState('overview'); const [isEditOpen, setIsEditOpen] = useState(false); const handleCopy = (text: string, field: string) => { navigator.clipboard.writeText(text).then(() => { setCopiedField(field); setTimeout(() => setCopiedField(null), 1500); }); }; const isActive = item.status === 1; const formatDate = (dateStr: string) => new Date(dateStr).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric', }); return ( <> {/* Fixed Header */}
Overview History
{/* Scrollable Content */}
{/* Sidebar */} {/* Main Content */}

Channel Information

Channel Name

{item.name}

Status

{isActive ? 'Active' : 'Inactive'}
{item.label && (

Label

{item.label}

)} {item.icon && (

Icon

{item.icon}

)}

Created

{formatDate(item.created_at)}

Last Updated

{formatDate(item.updated_at)}

{/* Channel Info */}

About Sales Channels

Sales channels define where products are sold (e.g., Online Store, Physical Store, Wholesale). Products can be assigned to specific channels with different pricing.

Activity History

History and activity log will be displayed here.
router.reload()} /> ); } Show.layout = (page: ReactNode) => ( {page} ); export default Show;