umami/components/input/WebsiteSelect.js

29 lines
794 B
JavaScript
Raw Normal View History

2023-02-15 11:27:18 +01:00
import { useIntl } from 'react-intl';
import { Dropdown, Item } from 'react-basics';
import { labels } from 'components/messages';
import useApi from 'hooks/useApi';
export default function WebsiteSelect({ websiteId, onSelect }) {
const { formatMessage } = useIntl();
const { get, useQuery } = useApi();
const { data } = useQuery(['websites:me'], () => get('/me/websites'));
const renderValue = value => {
return data?.find(({ id }) => id === value)?.name;
};
return (
<Dropdown
items={data}
value={websiteId}
renderValue={renderValue}
onChange={onSelect}
alignment="end"
placeholder={formatMessage(labels.selectWebsite)}
style={{ width: 200 }}
>
2023-02-24 11:41:02 +01:00
{({ id, name }) => <Item key={id}>{name}</Item>}
2023-02-15 11:27:18 +01:00
</Dropdown>
);
}