+
+
+
-
-
-
-
- setNewServer((prev) => ({ ...prev, name: e.target.value }))
- }
- placeholder="Voxa Server"
- />
-
-
-
-
- setNewServer((prev) => ({ ...prev, ip: e.target.value }))
- }
- placeholder="192.168.1.5"
- />
-
+ {servers.map(
+ ([ip, name]) =>
+ ip && (
+
+ )
+ )}
+
+
-
-
-
-
-
-
-
-
-
+ {/* Right column */}
+
+ {server ? (
+
+
{server.name}
+
+ ) : (
+
+
+
+
+ )}
+
+
+ {server ? (
+ <>
+ {server.channels.map((channel) => (
+
+ ))}
+
+ ) : (
+ <>
+
+
+
+
+ )}
+
+
+
+
-
-
-
-
-
-
-
-
- {server.name}
-
-
-
-
-
- {servers.map((s, i) => (
-
- {s[1] || s[0]}
-
- ))}
-
-
- Add Server
-
-
-
-
-
-
-
-
- {server.channels.map((channel) => (
-
- {channel.kind === "voice" ? : }
- {channel.name}
-
- ))}
-
-
- {children}
-
-
- ) : (
- children
+ {children}
+
);
}
+
+function DMItem({ name, status }: { name: string; status: string }) {
+ return (
+
+
+ {name[0]}
+
+
+ {name}
+ {status}
+
+
+ );
+}
+
+function ChannelProp(channel: Channel) {
+ return (
+
+
+ {channel.name}
+
+ );
+}
+
+function ChannelIcon({ kind }: { kind: "text" | "voice" }) {
+ switch (kind) {
+ case "text":
+ return
;
+ case "voice":
+ return
;
+ default:
+ return null;
+ }
+}
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
new file mode 100644
index 0000000..71e428b
--- /dev/null
+++ b/src/components/ui/avatar.tsx
@@ -0,0 +1,53 @@
+"use client"
+
+import * as React from "react"
+import * as AvatarPrimitive from "@radix-ui/react-avatar"
+
+import { cn } from "@/lib/utils"
+
+function Avatar({
+ className,
+ ...props
+}: React.ComponentProps
) {
+ return (
+
+ )
+}
+
+function AvatarImage({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+ )
+}
+
+function AvatarFallback({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+ )
+}
+
+export { Avatar, AvatarImage, AvatarFallback }
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
new file mode 100644
index 0000000..d05bbc6
--- /dev/null
+++ b/src/components/ui/card.tsx
@@ -0,0 +1,92 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Card({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+export {
+ Card,
+ CardHeader,
+ CardFooter,
+ CardTitle,
+ CardAction,
+ CardDescription,
+ CardContent,
+}
diff --git a/src/components/ui/scroll-area.tsx b/src/components/ui/scroll-area.tsx
new file mode 100644
index 0000000..8e4fa13
--- /dev/null
+++ b/src/components/ui/scroll-area.tsx
@@ -0,0 +1,58 @@
+"use client"
+
+import * as React from "react"
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
+
+import { cn } from "@/lib/utils"
+
+function ScrollArea({
+ className,
+ children,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+ {children}
+
+
+
+
+ )
+}
+
+function ScrollBar({
+ className,
+ orientation = "vertical",
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+ )
+}
+
+export { ScrollArea, ScrollBar }