project-nomad/admin/inertia/pages/home.tsx
2025-06-30 01:44:42 -07:00

124 lines
3.2 KiB
TypeScript

import {
IconBook,
IconBrandWikipedia,
IconCalculator,
IconHelp,
IconMapRoute,
IconMessageCircleSearch,
IconPlus,
IconSettings,
IconWifiOff,
} from '@tabler/icons-react'
import { Head, Link } from '@inertiajs/react'
import BouncingLogo from '~/components/BouncingLogo'
import AppLayout from '~/layouts/AppLayout'
import { getServiceLink } from '~/lib/navigation'
const NAV_ITEMS = [
{
label: 'AI Chat',
to: '/ai-chat',
description: 'Chat with local AI models',
icon: <IconMessageCircleSearch size={48} />,
},
{
label: 'Calculators',
to: '/calculators',
description: 'Perform various calculations',
icon: <IconCalculator size={48} />,
},
{
label: 'Ebooks',
to: '/ebooks',
description: 'Explore our collection of eBooks',
icon: <IconBook size={48} />,
},
{
label: 'Kiwix (Offline Browser)',
to: '/kiwix',
description: 'Access offline content with Kiwix',
icon: <IconWifiOff size={48} />,
},
{
label: 'OpenStreetMap',
to: '/openstreetmap',
description: 'View maps and geospatial data',
icon: <IconMapRoute size={48} />,
},
{
label: 'Wikipedia',
to: '/wikipedia',
description: 'Browse an offline Wikipedia snapshot',
icon: <IconBrandWikipedia size={48} />,
},
]
const STATIC_ITEMS = [
{
label: 'Install Apps',
to: '/settings/apps',
target: '',
description: 'Not seeing your favorite app? Install it here!',
icon: <IconPlus size={48} />,
installed: true,
},
{
label: 'Docs',
to: '/docs/home',
target: '',
description: 'Read Project N.O.M.A.D. manuals and guides',
icon: <IconHelp size={48} />,
installed: true,
},
{
label: 'Settings',
to: '/settings/system',
target: '',
description: 'Configure your N.O.M.A.D. settings',
icon: <IconSettings size={48} />,
installed: true,
},
]
export default function Home(props: {
system: {
services: { id: number; service_name: string; installed: boolean; ui_location: string }[]
}
}) {
const items = []
props.system.services.map((service) => {
items.push({
label: service.service_name,
to: getServiceLink(service.ui_location),
target: '_blank',
description: `Access ${service.service_name} content`,
icon: <IconWifiOff size={48} />,
installed: service.installed,
})
})
items.push(...STATIC_ITEMS)
return (
<AppLayout>
<Head title="Project N.O.M.A.D Command Center" />
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
{items.map((item) => (
<a key={item.label} href={item.to} target={item.target}>
<div
key={item.label}
className="rounded border-desert-green border-2 bg-desert-green hover:bg-transparent hover:text-black text-white transition-colors shadow-sm h-48 flex flex-col items-center justify-center cursor-pointer"
>
<div className="flex items-center justify-center mb-2">{item.icon}</div>
<h3 className="font-bold text-2xl">{item.label}</h3>
<p className="text-lg mt-2">{item.description}</p>
</div>
</a>
))}
<BouncingLogo />
</div>
</AppLayout>
)
}