diff --git a/src/client/components/AddToThreadModal.tsx b/src/client/components/AddToThreadModal.tsx
index b4e687e..934ef66 100644
--- a/src/client/components/AddToThreadModal.tsx
+++ b/src/client/components/AddToThreadModal.tsx
@@ -7,6 +7,7 @@ import { useGlobalItem } from "../hooks/useGlobalItems";
 import { useCreateThread, useThreads } from "../hooks/useThreads";
 import { apiPost } from "../lib/api";
 import { useUIStore } from "../stores/uiStore";
+import { CategoryPicker } from "./CategoryPicker";
 
 export function AddToThreadModal() {
 	const { t } = useTranslation(["threads", "common"]);
@@ -228,26 +229,13 @@ export function AddToThreadModal() {
 							</div>
 
 							<div>
-								<label
-									htmlFor="new-thread-category"
-									className="block text-sm font-medium text-gray-700 mb-1"
-								>
+								<label className="block text-sm font-medium text-gray-700 mb-1">
 									{t("create.category")}
 								</label>
-								<select
-									id="new-thread-category"
-									value={newThreadCategoryId ?? ""}
-									onChange={(e) =>
-										setNewThreadCategoryId(Number(e.target.value))
-									}
-									className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent bg-white"
-								>
-									{categories?.map((cat) => (
-										<option key={cat.id} value={cat.id}>
-											{cat.name}
-										</option>
-									))}
-								</select>
+								<CategoryPicker
+									value={newThreadCategoryId ?? 0}
+									onChange={setNewThreadCategoryId}
+								/>
 							</div>
 
 							{activeThreads.length > 0 && (