diff --git a/components/discord-status.tsx b/components/discord-status.tsx
new file mode 100644
index 0000000..40546dd
--- /dev/null
+++ b/components/discord-status.tsx
@@ -0,0 +1,58 @@
+'use client';
+
+import cn from '@/utils/cn';
+import { useEffect, useState } from 'react';
+import Tooltip from '@/components/tooltip';
+import Link from 'next/link';
+
+type DiscordStatusProps = {
+ userId: string;
+}
+
+export default function DiscordStatus({ userId }: DiscordStatusProps) {
+ type Status = 'online' | 'offline' | 'loading' | 'error';
+
+ const [status, setStatus] = useState
('loading');
+
+ useEffect(() => {
+ async function getStatus() {
+ try {
+ const response = await fetch(`https://lantern.rest/api/v1/users/${userId}`);
+ if (!response.ok) throw new Error('Failed to fetch status');
+
+ const data = await response.json();
+
+ setStatus(data.status === 'offline' ? 'offline' : 'online');
+ } catch (error) {
+ console.error(`Something went wrong: ${error}`);
+ setStatus('error');
+ }
+ }
+
+ getStatus();
+ }, [userId]);
+
+ return (
+
+
+ span]:bg-quaternary',
+ status === 'online' && 'bg-green-500 [&>span]:bg-green-500'
+ )}
+ >
+
+
+
+ {status === 'loading' || status === 'error' || status === 'offline' ? 'Offline' : 'Online'}
+
+
+ );
+}
\ No newline at end of file