import { Head, Link, usePage } from '@inertiajs/react'; import { Server } from '@/types/server'; import Container from '@/components/container'; import HeaderContainer from '@/components/header-container'; import Heading from '@/components/heading'; import { Button } from '@/components/ui/button'; import ServerLayout from '@/layouts/server/layout'; import { MoreVerticalIcon } from 'lucide-react'; import { Card, CardContent, CardDescription, CardHeader, CardRow, CardTitle } from '@/components/ui/card'; import React from 'react'; import { Site, SiteFeature } from '@/types/site'; import { Separator } from '@/components/ui/separator'; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'; import FeatureAction from '@/pages/site-features/components/feature-action'; export default function SiteFeatures() { const page = usePage<{ server: Server; site: Site; features: { [key: string]: SiteFeature; }; }>(); return (

Site features Here you can see the list of features and their actions

{Object.entries(page.props.features).length > 0 ? ( Object.entries(page.props.features).map(([key, feature], index) => (

{feature.label}

{feature.description}

{Object.entries(feature.actions || {}).map(([actionKey, action]) => ( e.preventDefault()} disabled={!action.active}> {action.label} ))}

{index < Object.entries(page.props.features).length - 1 && }

)) ) : ( No available features )} ); }