import { Channel } from "revolt-api";
import { Card, CardDescription, CardHeader, CardTitle } from "../ui/card";
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
import { AUTUMN_URL } from "@/lib/constants";

export function ChannelCard({
  channel,
  subtitle,
}: {
  channel: Channel;
  subtitle: string;
}) {
  if (channel.channel_type === "SavedMessages")
    return <div>Refusing to render.</div>;

  const name =
    channel.channel_type === "DirectMessage" ? "Direct Message" : channel.name;

  return (
    <Card>
      <CardHeader>
        <CardTitle>
          <Avatar>
            {channel.channel_type !== "DirectMessage" && (
              <AvatarImage src={`${AUTUMN_URL}/icons/${channel.icon?._id}`} />
            )}
            <AvatarFallback>
              {name
                .split(" ")
                .slice(0, 2)
                .map((x) => String.fromCodePoint(x.codePointAt(0) ?? 32) ?? "")
                .join("")}
            </AvatarFallback>
          </Avatar>
          {name}
        </CardTitle>
        <CardDescription>{subtitle}</CardDescription>
      </CardHeader>
    </Card>
  );
}