Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update CollapseDelete.tsx

This commit is contained in:
Nate Kelley 2025-04-17 13:25:57 -06:00
parent 4abfbbc223
commit f99f2bddab
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
1 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
web/src/controllers/MetricController/MetricViewChart/MetricEditController/MetricStylingApp/Common/CollapseDelete.tsx
View File

@ -1,4 +1,4 @@
import React, { useMemo, useState } from 'react';
import React, { useState } from 'react';
import { AnimatePresence, motion } from 'framer-motion';
import { ChevronRight, Trash } from '@/components/ui/icons';
import { useMemoizedFn } from '@/hooks';
@ -135,13 +135,13 @@ const DropdownIcon: React.FC<{
onClickDelete?: () => void;
isDragging?: boolean;
}> = React.memo(({ open, onToggleDropdown, onClickDelete, isDragging }) => {
const memoizedAnimation = useMemo(() => {
return {
initial: { rotate: 0 },
animate: { rotate: open ? 90 : 0 },
transition: { duration: ANIMATION_DURATION }
};
}, [open]);
// const memoizedAnimation = useMemo(() => {
// return {
// initial: { rotate: 0 },
// animate: { rotate: open ? 90 : 0 },
// transition: { duration: ANIMATION_DURATION }
// };
// }, [open]);
const onClickToggleDropdown = useMemoizedFn((e: React.MouseEvent<HTMLElement>) => {
e.stopPropagation();
@ -184,11 +184,14 @@ const DropdownIcon: React.FC<{
variant="ghost"
onClick={onClickToggleDropdown}
prefix={
<motion.div
className={cn('flex items-center justify-center', isDragging && 'hidden!')}
{...memoizedAnimation}>
<div
className={cn(
'flex items-center justify-center transition-transform duration-200',
isDragging && 'hidden!',
open && 'rotate-90'
)}>
<ChevronRight />
</motion.div>
</div>
}></Button>
</div>
);