import { Flex, Box, Icon, chakra, Image, HStack, IconButton, Link, CircularProgress, } from "@chakra-ui/react"; import { MdEmail, MdLocationOn } from "react-icons/md"; import { BsFillBriefcaseFill } from "react-icons/bs"; import { FC } from "react"; import { FaGithub } from "react-icons/fa"; import { FiTwitter } from "react-icons/fi"; import { octokit } from "configurations/ocotokit"; import useSWR from "swr"; interface UserDetailedCardProps { username: string; emoji: string; } const UserDetailedCard: FC = ({ username, emoji }) => { const { data } = useSWR(`user-${username}}`, () => octokit.users.getByUsername({ username }) ); if (!data) { return ; } return ( avatar {emoji} {data.data.name ?? data.data.login} {data.data.bio} {data.data.company && ( {data.data.company} )} {data.data.location && ( {data.data.location} )} {data.data.email && ( {data.data.email} )} } variant="link" /> {data.data.twitter_username && ( } variant="link" /> )} ); }; export default UserDetailedCard;