admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: Favorites (#1094)

Browse Source 
* Adding the favorite button

* favorites services and resolvers

* favorites schema

* favorite ability handler

* favorite module export

* front end UI

* front end graphql additions

* server ability handlers

* server resolvers and services

* css fix

* Adding the favorite button

* favorites services and resolvers

* favorites schema

* favorite ability handler

* favorite module export

* front end UI

* front end graphql additions

* server ability handlers

* server resolvers and services

* css fix

* delete favorites handler and resolver

* removed favorite from index list

* chip avatar size props

* index list additions

* UI additions for favorites functionality

* lint fixes

* graphql codegen

* UI fixes

* favorite hook addition

* moved to ~/modules

* Favorite mapping to workspaceMember

* graphql codegen

* cosmetic changes

* camel cased methods

* graphql codegen
This commit is contained in:
Aditya Pimpalkar
2023-08-10 23:24:45 +01:00
committed by GitHub
parent d4b1153517
commit 0490c6b6ea
23 changed files with 917 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
front/src/modules/ui/button/components/IconButton.tsx
View File

@ -7,15 +7,18 @@ export type IconButtonSize = 'large' | 'medium' | 'small';
export type IconButtonFontColor = 'primary' | 'secondary' | 'tertiary';
export type IconButtonAccent = 'regular' | 'red';
export type ButtonProps = {
icon?: React.ReactNode;
variant?: IconButtonVariant;
size?: IconButtonSize;
textColor?: IconButtonFontColor;
accent?: IconButtonAccent;
} & React.ComponentProps<'button'>;
const StyledIconButton = styled.button<
Pick<ButtonProps, 'variant' | 'size' | 'textColor'>
Pick<ButtonProps, 'variant' | 'size' | 'textColor' | 'accent'>
>`
align-items: center;
background: ${({ theme, variant }) => {
@ -66,12 +69,14 @@ const StyledIconButton = styled.button<
return 'none';
}
}};
color: ${({ theme, disabled, textColor }) => {
color: ${({ theme, disabled, textColor, accent }) => {
if (disabled) {
return theme.font.color.extraLight;
}
return theme.font.color[textColor ?? 'secondary'];
return accent
? theme.color[accent]
: theme.font.color[textColor ?? 'secondary'];
}};
cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
display: flex;
@ -121,6 +126,7 @@ export function IconButton({
size = 'medium',
textColor = 'tertiary',
disabled = false,
accent = 'regular',
...props
}: ButtonProps) {
return (
@ -129,6 +135,7 @@ export function IconButton({
size={size}
disabled={disabled}
textColor={textColor}
accent={accent}
{...props}
>
{icon}