// app/workspaces/page.tsx
import { redirect } from "next/navigation"
import { getServerSession } from "next-auth"
import { authOptions } from "@/lib/auth/config"
import { prisma } from "@/lib/prisma"
import Link from "next/link"

export default async function WorkspacesPage() {
  const session = await getServerSession(authOptions)

  if (!session) {
    redirect("/login")
  }

  const user = await prisma.user.findUnique({
    where: { id: session.user.id },
    include: {
      workspacesAsEmployee: {
        where: { status: "ACTIVE" },
        include: {
          manager: { select: { name: true, avatar: true, email: true } }
        }
      },
      workspacesAsManager: {
        where: { status: "ACTIVE" },
        include: {
          employee: { select: { name: true, avatar: true, email: true } }
        }
      }
    }
  })

  return (
    <div style={{ minHeight: "100vh", background: "#f7fafc", padding: "2rem" }}>
      <div style={{ maxWidth: "1200px", margin: "0 auto" }}>
        <div style={{ marginBottom: "2rem" }}>
          <h1 style={{ fontSize: "2rem", fontWeight: "bold", marginBottom: "0.5rem" }}>
            Meus Workspaces
          </h1>
          <p style={{ color: "#666" }}>
            Selecione um workspace para acessar
          </p>
        </div>

        <div style={{ display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(300px, 1fr))", gap: "1.5rem" }}>
          {/* Workspaces como Funcionário */}
          {user?.workspacesAsEmployee.map((workspace) => (
            <Link
              key={workspace.id}
              href={`/workspace/${workspace.slug}`}
              style={{
                background: "white",
                padding: "1.5rem",
                borderRadius: "0.5rem",
                boxShadow: "0 1px 3px rgba(0,0,0,0.1)",
                textDecoration: "none",
                color: "inherit",
                transition: "all 0.2s",
                cursor: "pointer"
              }}
            >
              <div style={{ display: "flex", alignItems: "center", gap: "1rem", marginBottom: "1rem" }}>
                <div style={{
                  width: "48px",
                  height: "48px",
                  borderRadius: "50%",
                  background: "#667eea",
                  display: "flex",
                  alignItems: "center",
                  justifyContent: "center",
                  color: "white",
                  fontSize: "1.25rem",
                  fontWeight: "bold"
                }}>
                  {workspace.manager.name[0]}
                </div>
                <div>
                  <div style={{ fontWeight: "600", fontSize: "1.1rem" }}>
                    {workspace.manager.name}
                  </div>
                  <div style={{ fontSize: "0.875rem", color: "#666" }}>
                    Seu Gestor
                  </div>
                </div>
              </div>
              <div style={{
                padding: "0.5rem",
                background: "#e0e7ff",
                borderRadius: "0.25rem",
                fontSize: "0.875rem",
                color: "#4c51bf"
              }}>
                👤 Você é o Funcionário
              </div>
            </Link>
          ))}

          {/* Workspaces como Gestor */}
          {user?.workspacesAsManager.map((workspace) => (
            <Link
              key={workspace.id}
              href={`/workspace/${workspace.slug}`}
              style={{
                background: "white",
                padding: "1.5rem",
                borderRadius: "0.5rem",
                boxShadow: "0 1px 3px rgba(0,0,0,0.1)",
                textDecoration: "none",
                color: "inherit",
                transition: "all 0.2s",
                cursor: "pointer"
              }}
            >
              <div style={{ display: "flex", alignItems: "center", gap: "1rem", marginBottom: "1rem" }}>
                <div style={{
                  width: "48px",
                  height: "48px",
                  borderRadius: "50%",
                  background: "#10b981",
                  display: "flex",
                  alignItems: "center",
                  justifyContent: "center",
                  color: "white",
                  fontSize: "1.25rem",
                  fontWeight: "bold"
                }}>
                  {workspace.employee.name[0]}
                </div>
                <div>
                  <div style={{ fontWeight: "600", fontSize: "1.1rem" }}>
                    {workspace.employee.name}
                  </div>
                  <div style={{ fontSize: "0.875rem", color: "#666" }}>
                    Seu Mentorado
                  </div>
                </div>
              </div>
              <div style={{
                padding: "0.5rem",
                background: "#d1fae5",
                borderRadius: "0.25rem",
                fontSize: "0.875rem",
                color: "#047857"
              }}>
                🎓 Você é o Gestor
              </div>
            </Link>
          ))}
        </div>

        {/* Botão para criar novo workspace */}
        <div style={{ marginTop: "2rem", textAlign: "center" }}>
          <Link
            href="/workspace/create"
            style={{
              display: "inline-block",
              padding: "1rem 2rem",
              background: "#667eea",
              color: "white",
              borderRadius: "0.5rem",
              textDecoration: "none",
              fontWeight: "500"
            }}
          >
            + Criar Novo Workspace
          </Link>
        </div>
      </div>
    </div>
  )
}