diff --git a/src/components/accountStatus.tsx b/src/components/accountStatus.tsx new file mode 100644 index 0000000..e7baa79 --- /dev/null +++ b/src/components/accountStatus.tsx @@ -0,0 +1,51 @@ +'use client'; + +import { PlatformKind } from '@/utils'; +import { Card, CardContent, CardHeader, CardTitle } from './ui/card'; +import { PlatformIcon } from './icons'; + +export default function AccountStatus({ + accounts, +}: { + accounts: { platform: PlatformKind; name: string; ok: boolean }[]; +}) { + return ( + + + Account status + + + + {accounts.map((account, i) => ( + + { + + } + + {account.ok ? ( + {account.name} + ) : ( + + {account.name} + + )} + + {/*RG version*/} + {/* {account.ok ? ( + {account.name} + ) : ( + + {account.name} + + )} */} + + ))} + + + ); +} diff --git a/src/components/icons.tsx b/src/components/icons.tsx new file mode 100644 index 0000000..19eaf38 --- /dev/null +++ b/src/components/icons.tsx @@ -0,0 +1,77 @@ +import { PlatformKind } from '@/utils'; + +export function XMark() { + return ( + + + + ); +} + +export function Check() { + return ( + + + + ); +} + +interface PlatformProps extends React.SVGProps { + platform: PlatformKind; +} + +export function PlatformIcon({ platform, ...props }: PlatformProps) { + switch (platform) { + case 'x': + return ( + + + + + + ); + + case 'linkedin': + return ( + + + + ); + } +}
{account.name}
+ {account.name} +