1 files changed, 53 insertions, 0 deletions
diff --git a/apps/web/components/dashboard/feeds/FeedSelector.tsx b/apps/web/components/dashboard/feeds/FeedSelector.tsx
new file mode 100644
index 00000000..db95a042
--- /dev/null
+++ b/apps/web/components/dashboard/feeds/FeedSelector.tsx
@@ -0,0 +1,53 @@
+import {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import LoadingSpinner from "@/components/ui/spinner";
+import { api } from "@/lib/trpc";
+import { cn } from "@/lib/utils";
+
+export function FeedSelector({
+  value,
+  onChange,
+  placeholder = "Select a feed",
+  className,
+}: {
+  className?: string;
+  value?: string | null;
+  onChange: (value: string) => void;
+  placeholder?: string;
+}) {
+  const { data, isPending } = api.feeds.list.useQuery(undefined, {
+    select: (data) => data.feeds,
+  });
+
+  if (isPending) {
+    return <LoadingSpinner />;
+  }
+
+  return (
+    <Select onValueChange={onChange} value={value ?? ""}>
+      <SelectTrigger className={cn("w-full", className)}>
+        <SelectValue placeholder={placeholder} />
+      </SelectTrigger>
+      <SelectContent>
+        <SelectGroup>
+          {data?.map((f) => (
+            <SelectItem key={f.id} value={f.id}>
+              {f.name}
+            </SelectItem>
+          ))}
+          {(data ?? []).length == 0 && (
+            <SelectItem value="nofeed" disabled>
+              You don&apos;t currently have any feeds.
+            </SelectItem>
+          )}
+        </SelectGroup>
+      </SelectContent>
+    </Select>
+  );
+}