import { useState } from 'react'; import { Head, usePage, router } from '@inertiajs/react'; import { useTranslation } from 'react-i18next'; import AuthenticatedLayout from "@/layouts/authenticated-layout"; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader } from "@/components/ui/card"; import { Package, Plus, Power, PowerOff, Eye, MoreVertical } from "lucide-react"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; import { SearchInput } from "@/components/ui/search-input"; import NoRecordsFound from '@/components/no-records-found'; import { ModulesIndexProps, Module } from './types'; import { getPackageFavicon, getPackageAlias } from '@/utils/helpers'; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from "@/components/ui/dialog"; export default function Index() { const { modules, auth } = usePage().props; const { t } = useTranslation(); const [searchTerm, setSearchTerm] = useState(''); const [selectedModule, setSelectedModule] = useState(null); const [isDetailsOpen, setIsDetailsOpen] = useState(false); const filteredModules = modules.filter(module => module.display !== false && (module.alias.toLowerCase().includes(searchTerm.toLowerCase()) || module.description.toLowerCase().includes(searchTerm.toLowerCase())) ); const handleToggleModule = (moduleName: string, isEnabled: boolean) => { router.post(route('add-on.enable', moduleName), {}, { preserveState: true, }); }; const handleViewDetails = (module: Module) => { setSelectedModule(module); setIsDetailsOpen(true); }; return ( {auth.user?.permissions?.includes('manage-add-on') && (

{t('Upload Add-ons')}

)} } > {}} placeholder={t('Search add-ons...')} className="w-full" /> {filteredModules.length > 0 ? (

{filteredModules.map((module) => (

{ const target = e.target as HTMLImageElement; target.style.display = 'none'; target.nextElementSibling?.classList.remove('hidden'); }} />

v{parseFloat(module.version).toFixed(1)} {module.is_enabled ? t('Active') : t('Inactive')}

{module.alias}

{module.description}

{auth.user?.permissions?.includes('manage-actions') && (

{module.is_enabled ? t('Disable Module') : t('Enable Module')}

)}

))}

) : ( setSearchTerm('')} /> )} ); }