From 396acf3bbbe00a192cb0ea0a9ccf91b1d8d2850b Mon Sep 17 00:00:00 2001
From: Fuwn <50817549+Fuwn@users.noreply.github.com>
Date: Sat, 24 Jan 2026 13:09:50 +0000
Subject: Initial commit

Created from https://vercel.com/new
---
 src/components/input/WebsiteSelect.tsx | 74 ++++++++++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 src/components/input/WebsiteSelect.tsx

(limited to 'src/components/input/WebsiteSelect.tsx')

diff --git a/src/components/input/WebsiteSelect.tsx b/src/components/input/WebsiteSelect.tsx
new file mode 100644
index 0000000..8d81eb9
--- /dev/null
+++ b/src/components/input/WebsiteSelect.tsx
@@ -0,0 +1,74 @@
+import { ListItem, Row, Select, type SelectProps, Text } from '@umami/react-zen';
+import { useState } from 'react';
+import { Empty } from '@/components/common/Empty';
+import {
+  useLoginQuery,
+  useMessages,
+  useUserWebsitesQuery,
+  useWebsiteQuery,
+} from '@/components/hooks';
+
+export function WebsiteSelect({
+  websiteId,
+  teamId,
+  onChange,
+  includeTeams,
+  ...props
+}: {
+  websiteId?: string;
+  teamId?: string;
+  includeTeams?: boolean;
+} & SelectProps) {
+  const { formatMessage, messages } = useMessages();
+  const { data: website } = useWebsiteQuery(websiteId);
+  const [name, setName] = useState<string>(website?.name);
+  const [search, setSearch] = useState('');
+  const { user } = useLoginQuery();
+  const { data, isLoading } = useUserWebsitesQuery(
+    { userId: user?.id, teamId },
+    { search, pageSize: 10, includeTeams },
+  );
+  const listItems: { id: string; name: string }[] = data?.data || [];
+
+  const handleSearch = (value: string) => {
+    setSearch(value);
+  };
+
+  const handleOpenChange = () => {
+    setSearch('');
+  };
+
+  const handleChange = (id: string) => {
+    setName(listItems.find(item => item.id === id)?.name);
+    onChange(id);
+  };
+
+  const renderValue = () => {
+    return (
+      <Row maxWidth="160px">
+        <Text truncate>{name}</Text>
+      </Row>
+    );
+  };
+
+  return (
+    <Select
+      {...props}
+      items={listItems}
+      value={websiteId}
+      isLoading={isLoading}
+      allowSearch={true}
+      searchValue={search}
+      onSearch={handleSearch}
+      onChange={handleChange}
+      onOpenChange={handleOpenChange}
+      renderValue={renderValue}
+      listProps={{
+        renderEmptyState: () => <Empty message={formatMessage(messages.noResultsFound)} />,
+        style: { maxHeight: '400px' },
+      }}
+    >
+      {({ id, name }: any) => <ListItem key={id}>{name}</ListItem>}
+    </Select>
+  );
+}
-- 
cgit v1.2.3

