Frontend/src/components/Article/ArticleParts/ArticleSubscriptionsButton.tsx
2022-08-29 13:37:46 +03:00

40 lines
1.1 KiB
TypeScript

import React, { useState } from "react";
import { Button } from "components/Button/Button";
import {
SVGFavoriteFilled,
SVGFavoriteOutlined,
SVGFolder,
} from "components/icons";
const subscriptionStyles = "fill-gray-500 stroke-gray-500 w-6";
type ArticleSubscriptionsButtonsProps = {
className?: string;
favorite?: boolean;
//Todo create tracking subscriptions and onClick props
} & Omit<React.ComponentPropsWithoutRef<"button">, "">;
export function ArticleSubscriptionsButtons({
className,
favorite = false,
}: ArticleSubscriptionsButtonsProps) {
return (
<div className="flex flex-row">
<Button emphasis="low">
<Button.Icon>
<SVGFolder className={subscriptionStyles} />
</Button.Icon>
</Button>
<Button emphasis="low" onClick={() => {}}>
<Button.Icon>
{!favorite ? (
<SVGFavoriteOutlined className={subscriptionStyles} />
) : (
<SVGFavoriteFilled className="fill-blue-600 stroke-blue-600 w-6" />
)}
</Button.Icon>
</Button>
</div>
);
}