category select; publish article form part

src/components/category/category-select.tsx

@@ -0,0 +1,34 @@
+"use client";
+import { api } from "@/trpc/react";
+import React from "react";
+import { Combobox } from "../combobox";
+
+function CategorySelect({
+  initialValue,
+  onSelect,
+}: {
+  initialValue?: string;
+  onSelect: (category?: string) => void;
+}) {
+  const { data: categories } = api.category.getAll.useQuery();
+  return (
+    <div>
+      <Combobox
+        data={
+          categories?.map(({ name, id }) => ({ label: name!, value: id! })) ??
+          []
+        }
+        initialValue={initialValue}
+        onSelect={onSelect}
+        className="w-full"
+        messageUi={{
+          select: "Kategorie auswählen...",
+          placeholder: "Kategorie suchen...",
+          empty: "Keine Kategorien gefunden",
+        }}
+      />
+    </div>
+  );
+}
+
+export default CategorySelect;