61 lines
1.7 KiB
TypeScript
61 lines
1.7 KiB
TypeScript
import React from "react";
|
|
import styled from "styled-components";
|
|
import { SvgProps } from "../../../components/Svg";
|
|
import Flex from "../../../components/Box/Flex";
|
|
import Dropdown from "../../../components/Dropdown/Dropdown";
|
|
import Link from "../../../components/Link/Link";
|
|
import Text from "../../../components/Text/Text";
|
|
import * as IconModule from "../icons";
|
|
import { socials } from "../config";
|
|
import { LinkLabel } from "./MenuEntry";
|
|
import { OutLink } from "../types";
|
|
|
|
const Icons = IconModule as unknown as { [key: string]: React.FC<SvgProps> };
|
|
interface Props {
|
|
outLink?: OutLink[];
|
|
}
|
|
|
|
const Image = styled.img`
|
|
width: 30px;
|
|
height: 30px;
|
|
border-radius: 50%;
|
|
`;
|
|
|
|
const SocialLinks: React.FC<Props> = ({ outLink }) => {
|
|
// let covers = "";
|
|
// if (outLink && outLink.length > 0) {
|
|
// covers = outLink[0].icon;
|
|
// }
|
|
return (
|
|
<>
|
|
{/* {outLink && outLink.length > 1 ? (
|
|
<Dropdown position="top-right" target={<Image src={covers} />}>
|
|
{outLink && outLink.length > 0
|
|
? outLink?.map((item) => {
|
|
return (
|
|
<Link href={item.link} color="textSubtle">
|
|
<Text>{item.name}</Text>
|
|
</Link>
|
|
);
|
|
})
|
|
: ""}
|
|
</Dropdown>
|
|
) : (
|
|
<>
|
|
{outLink && outLink.length > 0
|
|
? outLink?.map((item) => {
|
|
return (
|
|
<Link href={item.link} color="textSubtle">
|
|
<Image src={covers} />
|
|
</Link>
|
|
);
|
|
})
|
|
: ""}
|
|
</>
|
|
)} */}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default React.memo(SocialLinks, () => true);
|