50 lines
1.1 KiB
TypeScript
50 lines
1.1 KiB
TypeScript
import { SerieIcon } from '../report-chart/common/serie-icon';
|
|
import { Tooltiper } from '../ui/tooltip';
|
|
|
|
interface Props {
|
|
country?: string;
|
|
city?: string;
|
|
os?: string;
|
|
os_version?: string;
|
|
browser?: string;
|
|
browser_version?: string;
|
|
referrer_name?: string;
|
|
referrer_type?: string;
|
|
}
|
|
|
|
export function ListPropertiesIcon({
|
|
country,
|
|
city,
|
|
os,
|
|
os_version,
|
|
browser,
|
|
browser_version,
|
|
referrer_name,
|
|
referrer_type,
|
|
}: Props) {
|
|
return (
|
|
<div className="flex gap-1.5">
|
|
{country && (
|
|
<Tooltiper content={[country, city].filter(Boolean).join(', ')}>
|
|
<SerieIcon name={country} />
|
|
</Tooltiper>
|
|
)}
|
|
{os && (
|
|
<Tooltiper content={`${os} (${os_version})`}>
|
|
<SerieIcon name={os} />
|
|
</Tooltiper>
|
|
)}
|
|
{browser && (
|
|
<Tooltiper content={`${browser} (${browser_version})`}>
|
|
<SerieIcon name={browser} />
|
|
</Tooltiper>
|
|
)}
|
|
{referrer_name && (
|
|
<Tooltiper content={`${referrer_name} (${referrer_type})`}>
|
|
<SerieIcon name={referrer_name} />
|
|
</Tooltiper>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|