services: add nextcloud service

app/page.tsx

@@ -29,13 +29,13 @@ export default function Home() {
     },
     {
       title: "Music",
-      description: "Coming soon. Host your music on our community server and stream it everywhere",
+      description: "Coming soon. Host your music on our community server and stream it everywhere.",
       iconName: "Disc3",
     },
     {
-      title: "Support",
+      title: "Files",
-      description: "Administrators are standing by most of the day via our various support channels.",
+      description: "Store, share, edit, and synchronize files with our private Nextcloud instance.",
-      iconName: "Headset",
+      iconName: "SiNextcloud",
     },
   ] as const
 

components/pages/dashboard/ServicesTab.tsx

@@ -1,12 +1,11 @@
 import Link from "next/link"
 import { Mail, Key, ExternalLink } from "lucide-react"
-import { SiGitea, SiAuthentik } from "react-icons/si";
+import { SiGitea, SiAuthentik, SiNextcloud } from "react-icons/si";
 import { Card, CardFooter, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 import { Button } from "@/components/ui/button"
 
 export const ServicesTab = () => (
   <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
-    {/* TODO: move to component */}
     <Card>
       <CardHeader>
         <CardTitle className="flex items-center">
@@ -78,6 +77,24 @@ export const ServicesTab = () => (
         </Button>
       </CardFooter>
     </Card>
+
+    <Card>
+      <CardHeader>
+        <CardTitle className="flex items-center">
+          <SiNextcloud className="mr-2 h-4 w-4" />
+          Files
+        </CardTitle>
+        <CardDescription className="pt-4">Store, share, edit, and synchronize files with Nextcloud.</CardDescription>
+      </CardHeader>
+      <CardFooter>
+        <Button>
+          <ExternalLink className="h-4 w-4" />
+          <Link href="https://files.librecloud.cc/">
+            Open App
+          </Link>
+        </Button>
+      </CardFooter>
+    </Card>
   </div>
 )
 

components/pages/main/AnimatedIcon.tsx

@@ -2,14 +2,14 @@
 
 import React from "react"
 import { motion } from "motion/react"
-import { Mail, Lock, Disc3, Headset } from "lucide-react"
+import { Mail, Lock, Disc3 } from "lucide-react"
-import { SiGitea, SiAuthentik } from "react-icons/si"
+import { SiGitea, SiAuthentik, SiNextcloud } from "react-icons/si"
 
 const iconMap = {
   Mail,
   Lock,
   Disc3,
-  Headset,
+  SiNextcloud,
   SiGitea,
   SiAuthentik,
 } as const