Profile Tag

1import * as React from 'react';
2import { Badge } from '@/components/ui/badge';
3import { cn } from '@/lib/utils/deso';
4import Link from 'next/link';
5 
6export interface ProfileTagProps extends React.HTMLAttributes<HTMLDivElement> {
7  icon?: React.ReactNode;
8  children: React.ReactNode;
9  link?: string;
10  asChild?: boolean;
11}
12 
13export const ProfileTag = ({
14  icon,
15  children,
16  className,
17  link,
18  ...props
19}: ProfileTagProps) => {
20  return (
21    link ? (
22      <Link href={link || ''} className="hover:underline" target="_blank" rel="noopener noreferrer">
23      <Badge
24        variant="outline"
25        className={cn(
26          'text-xs font-medium text-muted-foreground gap-1.5',
27          className
28        )}
29        {...props}
30      >
31        {icon}
32        <span>{children}</span>
33      </Badge>
34    </Link>
35    ) : (
36    <Badge
37      variant="outline"
38      className={cn(
39        'text-xs font-medium text-muted-foreground gap-1.5',
40        className
41      )}
42      {...props}
43    >
44      {icon}
45      <span>{children}</span>
46    </Badge>
47    )
48  );
49};