FavoriteMaker API

The <FavoriteMaker> component renders a button that, when clicked, adds a specific item (specified via props) to the users favorites, or removes the item if the item is already in favorites. Using <FavoriteMaker> it's easy to build your own UI for working with favorites.

Here's a screenshot:

FavoriteMaker

Props

Name	Type	Required	Description
id	string	yes	The unique identifier for the favorite item. This must be consistent across restarts.
name	string	yes	The name of the favorite item. This will be used for display in the FavoriteShell.
category	"Workspace" \| "Application"	yes	The category of the favorite item. Currently only workspaces and launchable Finsemble applications can be favorited.
icon	Icon	No	The icon of the favorite item. This displays in the FavoriteShell. It defaults to use the initials of the `name` field as its content.

Usage

Suppose you wanted to create a component that, when clicked, added the workspace with id workspace1 to the users list of favorites. Here's the code:

import { FavoriteMaker } from "@finsemble/finsemble-ui/react/components/FavoriteMaker";
const Workspace1Favorite = () => {
	return (
		<div>
			<div>Workspace 1</div>
			<FavoriteMaker id="workspace1" name="Workspace 1" category="Workspace" icon={null} />
		</div>
	);
};