implement authentik auth

src/app/page.tsx

@@ -13,8 +13,9 @@ import { addEvent, deleteEvent, getAllEvents, clearEvents, getDB } from '@/lib/d
 import { parseICS, generateICS } from '@/lib/ical'
 import type { CalendarEvent } from '@/lib/types'
 import { Textarea } from '@/components/ui/textarea'
+import { auth } from '@/auth'
 
-export default function HomePage() {
+export default async function HomePage() {
   const [events, setEvents] = useState<CalendarEvent[]>([])
   const [dialogOpen, setDialogOpen] = useState(false)
   const [editingId, setEditingId] = useState<string | null>(null)
@@ -43,6 +44,8 @@ export default function HomePage() {
     })()
   }, [])
 
+  const session = await auth()
+
   const resetForm = () => {
     setTitle('')
     setDescription('')
@@ -218,23 +221,30 @@ export default function HomePage() {
 
   return (
     <div onDragOver={handleDragOver} onDragLeave={handleDragLeave} onDrop={handleDrop}
-      className={`p-4 min-h-[80vh] rounded border-2 border-dashed transition ${isDragOver ? 'border-blue-500 bg-blue-50' : 'border-gray-300'
+      className={`p-4 min-h-[80vh] relative rounded border-2 border-dashed transition ${isDragOver ? 'border-blue-500 bg-blue-50' : 'border-gray-300'
         }`}
     >
+      <div className='absolute bottom-0 w-full pb-4 text-gray-400'>
+        <div className='max-w-fit m-auto'> Drag & Drop *.ics here</div>
+      </div>
       {/* AI Toolbar */}
       <div className="flex flex-row gap-4 mb-4 items-start">
-        <div className='w-full'>
-          <Textarea
-            className="wrap-anywhere min-h-12"
-            placeholder='Describe event for AI to create'
-            value={aiPrompt}
-            onChange={e => setAiPrompt(e.target.value)}
-          />
-        </div>
+        {session?.user && (
+          <div className='w-full'>
+            <Textarea
+              className="wrap-anywhere min-h-12"
+              placeholder='Describe event for AI to create'
+              value={aiPrompt}
+              onChange={e => setAiPrompt(e.target.value)}
+            />
+          </div>
+        )}
         <div className='flex flex-row gap-2 pt-1.5'>
-          <Button onClick={handleAiCreate} disabled={aiLoading}>
-            {aiLoading ? 'Thinking...' : 'AI Create'}
-          </Button>
+          {session?.user && (
+            <Button onClick={handleAiCreate} disabled={aiLoading}>
+              {aiLoading ? 'Thinking...' : 'AI Create'}
+            </Button>
+          )}
           <Button variant="secondary" onClick={handleAiSummarize} disabled={aiLoading}>
             {aiLoading ? 'Summarizing...' : 'AI Summarize'}
           </Button>