---
import DashboardLayout from '../../layouts/DashboardLayout.astro';
import { db } from '../../db';
import { categories, members } from '../../db/schema';
import { eq } from 'drizzle-orm';

const user = Astro.locals.user;
if (!user) return Astro.redirect('/login');

// Get current team from cookie
const currentTeamId = Astro.cookies.get('currentTeamId')?.value;

const userMemberships = await db.select()
  .from(members)
  .where(eq(members.userId, user.id))
  .all();

if (userMemberships.length === 0) return Astro.redirect('/dashboard');

// Use current team or fallback to first membership
const userMembership = currentTeamId 
  ? userMemberships.find(m => m.organizationId === currentTeamId) || userMemberships[0]
  : userMemberships[0];

const allCategories = await db.select()
  .from(categories)
  .where(eq(categories.organizationId, userMembership.organizationId))
  .all();
---

<DashboardLayout title="Categories - Chronus">
  <div class="flex justify-between items-center mb-6">
    <h1 class="text-3xl font-bold">Categories</h1>
    <a href="/dashboard/categories/new" class="btn btn-primary">Add Category</a>
  </div>

  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
    {allCategories.map(category => (
      <div class="card bg-base-200 shadow-xl border border-base-300">
        <div class="card-body">
          <h2 class="card-title">
            {category.color && (
              <span class="w-4 h-4 rounded-full" style={`background-color: ${category.color}`}></span>
            )}
            {category.name}
          </h2>
          <p class="text-xs text-base-content/60">Created {category.createdAt?.toLocaleDateString() ?? 'N/A'}</p>
          <div class="card-actions justify-end mt-4">
            <a href={`/dashboard/categories/${category.id}/edit`} class="btn btn-sm btn-primary">Edit</a>
          </div>
        </div>
      </div>
    ))}
  </div>

  {allCategories.length === 0 && (
    <div class="text-center py-12">
      <p class="text-base-content/60 mb-4">No categories yet</p>
      <a href="/dashboard/categories/new" class="btn btn-primary">Add Your First Category</a>
    </div>
  )}
</DashboardLayout>