src/views-components/favorite-star/favorite-star.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from "react";
   6 import { FavoriteIcon, PublicFavoriteIcon } from "~/components/icon/icon";
   7 import { connect } from "react-redux";
   8 import { RootState } from "~/store/store";
   9 import { withStyles, StyleRulesCallback, WithStyles, Tooltip } from "@material-ui/core";
  10
  11 type CssRules = "icon";
  12
  13 const styles: StyleRulesCallback<CssRules> = theme => ({
  14     icon: {
  15         fontSize: "inherit"
  16     }
  17 });
  18
  19 const mapStateToProps = (state: RootState, props: { resourceUuid: string; className?: string; }) => ({
  20     ...props,
  21     isFavoriteVisible: state.favorites[props.resourceUuid],
  22     isPublicFavoriteVisible: state.publicFavorites[props.resourceUuid]
  23 });
  24
  25 export const FavoriteStar = connect(mapStateToProps)(
  26     withStyles(styles)((props: { isFavoriteVisible: boolean; className?: string; } & WithStyles<CssRules>) => {
  27         if (props.isFavoriteVisible) {
  28             return <Tooltip enterDelay={500} title="Favorite"><FavoriteIcon className={props.className || props.classes.icon} /></Tooltip>;
  29         } else {
  30             return null;
  31         }
  32     }));
  33
  34 export const PublicFavoriteStar = connect(mapStateToProps)(
  35     withStyles(styles)((props: { isPublicFavoriteVisible: boolean; className?: string; } & WithStyles<CssRules>) => {
  36         if (props.isPublicFavoriteVisible) {
  37             return <Tooltip enterDelay={500} title="Public Favorite"><PublicFavoriteIcon className={props.className || props.classes.icon} /></Tooltip>;
  38         } else {
  39             return null;
  40         }
  41     }));