services/workbench2/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 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 { CustomStyleRulesCallback } from 'common/custom-theme';
  10 import { Tooltip } from "@mui/material";
  11
  12 import { WithStyles } from '@mui/styles';
  13 import withStyles from '@mui/styles/withStyles';
  14
  15 type CssRules = "icon";
  16
  17 const styles: CustomStyleRulesCallback<CssRules> = theme => ({
  18     icon: {
  19         fontSize: "inherit"
  20     }
  21 });
  22
  23 const mapStateToProps = (state: RootState, props: { resourceUuid: string; className?: string; }) => ({
  24     ...props,
  25     isFavoriteVisible: state.favorites[props.resourceUuid],
  26     isPublicFavoriteVisible: state.publicFavorites[props.resourceUuid]
  27 });
  28
  29 export const FavoriteStar = connect(mapStateToProps)(
  30     withStyles(styles)((props: { isFavoriteVisible: boolean; className?: string; } & WithStyles<CssRules>) => {
  31         if (props.isFavoriteVisible) {
  32             return <Tooltip enterDelay={500} title="Favorite"><FavoriteIcon className={props.className || props.classes.icon} /></Tooltip>;
  33         } else {
  34             return null;
  35         }
  36     }));
  37
  38 export const PublicFavoriteStar = connect(mapStateToProps)(
  39     withStyles(styles)((props: { isPublicFavoriteVisible: boolean; className?: string; } & WithStyles<CssRules>) => {
  40         if (props.isPublicFavoriteVisible) {
  41             return <Tooltip enterDelay={500} title="Public Favorite"><PublicFavoriteIcon className={props.className || props.classes.icon} /></Tooltip>;
  42         } else {
  43             return null;
  44         }
  45     }));