1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-05-22 01:16:07 +02:00

fix: favorites column visibility (#2605)

Co-authored-by: sjaanus <sellinjaanus@gmail.com>
This commit is contained in:
Tymoteusz Czech 2022-12-06 11:03:43 +01:00 committed by GitHub
parent aa20d2d418
commit 3ee2e5ae9b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 16 deletions

View File

@ -1,4 +1,4 @@
import { VFC } from 'react'; import { useState, VFC } from 'react';
import { IconButton, Tooltip } from '@mui/material'; import { IconButton, Tooltip } from '@mui/material';
import { import {
Star as StarIcon, Star as StarIcon,
@ -8,17 +8,23 @@ import { ConditionallyRender } from 'component/common/ConditionallyRender/Condit
interface IFavoriteIconHeaderProps { interface IFavoriteIconHeaderProps {
isActive: boolean; isActive: boolean;
onClick: () => void; onClick: (isPinned: boolean) => void;
} }
export const FavoriteIconHeader: VFC<IFavoriteIconHeaderProps> = ({ export const FavoriteIconHeader: VFC<IFavoriteIconHeaderProps> = ({
isActive = false, isActive = false,
onClick, onClick,
}) => { }) => {
const [internalState, setInternalState] = useState(isActive);
const onToggle = () => {
setInternalState(!internalState);
onClick(!internalState);
};
return ( return (
<Tooltip <Tooltip
title={ title={
isActive internalState
? 'Unpin favorite features from the top' ? 'Unpin favorite features from the top'
: 'Pin favorite features to the top' : 'Pin favorite features to the top'
} }
@ -31,11 +37,11 @@ export const FavoriteIconHeader: VFC<IFavoriteIconHeaderProps> = ({
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
}} }}
onClick={onClick} onClick={onToggle}
size="small" size="small"
> >
<ConditionallyRender <ConditionallyRender
condition={isActive} condition={internalState}
show={<StarIcon fontSize="small" />} show={<StarIcon fontSize="small" />}
elseShow={<StarBorderIcon fontSize="small" />} elseShow={<StarBorderIcon fontSize="small" />}
/> />

View File

@ -302,14 +302,7 @@ export const ProjectFeatureToggles = ({
disableSortBy: true, disableSortBy: true,
}, },
], ],
[ [projectId, environments, loading, onToggle, uiConfig?.flags?.favorites]
projectId,
environments,
loading,
onToggle,
isFavoritesPinned,
uiConfig?.flags?.favorites,
]
); );
const [searchValue, setSearchValue] = useState( const [searchValue, setSearchValue] = useState(

View File

@ -36,13 +36,13 @@ export const usePinnedFavorites = (initialState = false) => {
const [isFavoritesPinned, setIsFavoritesPinned] = useState(initialState); const [isFavoritesPinned, setIsFavoritesPinned] = useState(initialState);
const { trackEvent } = usePlausibleTracker(); const { trackEvent } = usePlausibleTracker();
const onChangeIsFavoritePinned = () => { const onChangeIsFavoritePinned = (newState: boolean) => {
trackEvent('favorite', { trackEvent('favorite', {
props: { props: {
eventType: `features ${isFavoritesPinned ? 'un' : ''}pinned `, eventType: `features ${!newState ? 'un' : ''}pinned `,
}, },
}); });
setIsFavoritesPinned(!isFavoritesPinned); setIsFavoritesPinned(newState);
}; };
const enhancedSortTypes = useMemo(() => { const enhancedSortTypes = useMemo(() => {