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

fix a few more scroll areas

This commit is contained in:
Nate Kelley 2025-03-31 17:25:40 -06:00
parent 59e898edeb
commit c51fe65868
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
4 changed files with 7 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/controllers/MetricController/MetricViewChart/MetricEditController/MetricStylingApp/MetricStylingApp.tsx
View File

@ -177,7 +177,7 @@ export const MetricStylingApp: React.FC<{
)} )}
{segment === MetricStylingAppSegments.COLORS && ( {segment === MetricStylingAppSegments.COLORS && (
<StylingAppColors className="mb-12 px-4" colors={colors} /> <StylingAppColors className="px-4" colors={colors} />
)} )}
</ScrollArea> </ScrollArea>
</div> </div>

8
web/src/controllers/MetricController/MetricViewChart/MetricEditController/MetricStylingApp/StylingAppColors/ColorsApp/ColorStyleSegments.tsx
View File

@ -28,14 +28,12 @@ const options: SegmentedItem<ColorAppSegments>[] = [
export const ColorStyleSegments: React.FC<{ export const ColorStyleSegments: React.FC<{
setSelectedSegment: (value: ColorAppSegments) => void; setSelectedSegment: (value: ColorAppSegments) => void;
initialSelectedSegment: ColorAppSegments; selectedSegment: ColorAppSegments;
}> = React.memo(({ initialSelectedSegment, setSelectedSegment }) => { }> = React.memo(({ selectedSegment, setSelectedSegment }) => {
const onChange = useMemoizedFn((value: SegmentedItem<ColorAppSegments>) => { const onChange = useMemoizedFn((value: SegmentedItem<ColorAppSegments>) => {
setSelectedSegment(value.value); setSelectedSegment(value.value);
}); });
return ( return <AppSegmented block options={options} value={selectedSegment} onChange={onChange} />;
<AppSegmented block options={options} value={initialSelectedSegment} onChange={onChange} />
);
}); });
ColorStyleSegments.displayName = 'PaletteSegments'; ColorStyleSegments.displayName = 'PaletteSegments';

2
web/src/controllers/MetricController/MetricViewChart/MetricEditController/MetricStylingApp/StylingAppColors/ColorsApp/ColorsApp.tsx
View File

@ -29,7 +29,7 @@ export const ColorsApp: React.FC<{
return ( return (
<div className="flex flex-col space-y-2"> <div className="flex flex-col space-y-2">
<ColorStyleSegments <ColorStyleSegments
initialSelectedSegment={initialSelectedSegment} selectedSegment={selectedSegment}
setSelectedSegment={setSelectedSegment} setSelectedSegment={setSelectedSegment}
/> />

3
web/src/controllers/MetricController/MetricViewChart/MetricEditController/MetricStylingApp/StylingAppColors/StylingAppColors.tsx
View File

@ -8,6 +8,7 @@ import { ColorsApp } from './ColorsApp';
import { IBusterMetricChartConfig } from '@/api/asset_interfaces'; import { IBusterMetricChartConfig } from '@/api/asset_interfaces';
import { useMemoizedFn, useUnmount } from '@/hooks'; import { useMemoizedFn, useUnmount } from '@/hooks';
import { useUpdateMetricChart } from '@/context/Metrics'; import { useUpdateMetricChart } from '@/context/Metrics';
import { cn } from '@/lib/classMerge';
export const StylingAppColors: React.FC<{ export const StylingAppColors: React.FC<{
className: string; className: string;
@ -27,7 +28,7 @@ export const StylingAppColors: React.FC<{
<SelectColorApp selectedTab={selectedTab} onChange={setSelectedTab} /> <SelectColorApp selectedTab={selectedTab} onChange={setSelectedTab} />
</div> </div>
<div className={className}> <div className={cn(className, 'mb-12')}>
<AnimatePresence mode="wait" initial={false}> <AnimatePresence mode="wait" initial={false}>
<motion.div <motion.div
key={selectedTab} key={selectedTab}