mirror of https://github.com/buster-so/buster.git
better version selecting
This commit is contained in:
parent
1a361bf102
commit
3106198875
|
@ -2,7 +2,8 @@ import { useGetDashboard } from '@/api/buster_rest/dashboards';
|
|||
import { useGetMetric } from '@/api/buster_rest/metrics';
|
||||
import React, { useMemo } from 'react';
|
||||
import { Button } from '@/components/ui/buttons';
|
||||
import { Check3, Xmark } from '@/components/ui/icons';
|
||||
import { Xmark } from '@/components/ui/icons';
|
||||
import { Check3 } from '@/components/ui/icons/NucleoIconFilled';
|
||||
import { Text } from '@/components/ui/typography';
|
||||
import { useCloseVersionHistory } from '@/layouts/ChatLayout/FileContainer/FileContainerHeader/MetricContainerHeaderButtons/FileContainerVersionHistory';
|
||||
import { cn } from '@/lib/classMerge';
|
||||
|
@ -50,7 +51,7 @@ export const VersionHistoryPanel = React.memo(
|
|||
scrollable
|
||||
headerBorderVariant="ghost"
|
||||
headerClassName="border-l">
|
||||
<div className="my-2 flex flex-col px-1">
|
||||
<div className="mx-1.5 my-1.5 flex flex-col">
|
||||
{listItems?.map((item) => (
|
||||
<ListItem
|
||||
key={item.version_number}
|
||||
|
|
|
@ -83,22 +83,19 @@ export const DashboardThreeDotMenu = React.memo(({ dashboardId }: { dashboardId:
|
|||
DashboardThreeDotMenu.displayName = 'ThreeDotMenuButton';
|
||||
|
||||
const useVersionHistorySelectMenu = ({ dashboardId }: { dashboardId: string }) => {
|
||||
const DEFAULT_VERSION_HISTORY_ITEMS: DropdownItems = [];
|
||||
const { data } = useGetDashboard({ id: dashboardId }, (x) => ({
|
||||
versions: x?.dashboard?.versions,
|
||||
versions: x?.dashboard?.versions || [],
|
||||
version_number: x?.dashboard?.version_number
|
||||
}));
|
||||
const { versions, version_number } = data || {};
|
||||
|
||||
const versionHistoryItems: DropdownItems = useMemo(() => {
|
||||
return (
|
||||
versions?.map((x) => ({
|
||||
label: `Version ${x.version_number}`,
|
||||
secondaryLabel: timeFromNow(x.updated_at, false),
|
||||
value: x.version_number.toString(),
|
||||
selected: x.version_number === version_number
|
||||
})) || DEFAULT_VERSION_HISTORY_ITEMS
|
||||
);
|
||||
return [...(versions || [])].reverse().map((x) => ({
|
||||
label: `Version ${x.version_number}`,
|
||||
secondaryLabel: timeFromNow(x.updated_at, false),
|
||||
value: x.version_number.toString(),
|
||||
selected: x.version_number === version_number
|
||||
}));
|
||||
}, [versions, version_number]);
|
||||
|
||||
return useMemo(
|
||||
|
|
|
@ -190,7 +190,7 @@ const useVersionHistorySelectMenu = ({ metricId }: { metricId: string }) => {
|
|||
});
|
||||
|
||||
const versionHistoryItems: DropdownItems = useMemo(() => {
|
||||
return versions.map((x) => ({
|
||||
return [...versions].reverse().map((x) => ({
|
||||
label: `Version ${x.version_number}`,
|
||||
secondaryLabel: timeFromNow(x.updated_at, false),
|
||||
value: x.version_number.toString(),
|
||||
|
|
|
@ -10,19 +10,19 @@
|
|||
scroll-timeline-name: --scrollShadowContainer;
|
||||
|
||||
.scroll-header {
|
||||
@apply fixed top-[30px] right-0 left-0 h-2 w-full;
|
||||
@apply pointer-events-none absolute top-[0px] right-0 left-0 h-[0.5px] w-full border-b border-transparent;
|
||||
animation: shadowAnimation linear;
|
||||
animation-range: 0px 100px;
|
||||
animation-range: 0px 120px;
|
||||
animation-timeline: --scrollShadowContainer;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes shadowAnimation {
|
||||
from {
|
||||
box-shadow: 0px 0px 0px 0px var(--color-border) !important;
|
||||
border-color: transparent;
|
||||
}
|
||||
to {
|
||||
box-shadow: 0px 0px 0px 0.5px var(--color-border) !important;
|
||||
border-color: var(--color-border);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue