Remove "mode" from followup

Removed mode from followup asset content. It was logically impossible to have a mode with a metric. Falling back to just asset type.
This commit is contained in:
Nate Kelley 2025-07-25 15:24:07 -06:00
parent 523a6921b1
commit e6d4628a5f
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
6 changed files with 35 additions and 63 deletions

View File

@ -2,10 +2,11 @@ import React, { useMemo } from 'react';
import { useGetMetric } from '@/api/buster_rest/metrics'; import { useGetMetric } from '@/api/buster_rest/metrics';
import { useChatLayoutContextSelector } from '@/layouts/ChatLayout'; import { useChatLayoutContextSelector } from '@/layouts/ChatLayout';
import { DropdownContent, DropdownItems, type DropdownItem } from '@/components/ui/dropdown'; import { DropdownContent, DropdownItems, type DropdownItem } from '@/components/ui/dropdown';
import { History, Star } from '@/components/ui/icons'; import { History, Star, WandSparkle } from '@/components/ui/icons';
import { Star as StarFilled } from '@/components/ui/icons/NucleoIconFilled'; import { Star as StarFilled } from '@/components/ui/icons/NucleoIconFilled';
import { useListVersionDropdownItems } from '../versionHistory/useListVersionDropdownItems'; import { useListVersionDropdownItems } from '../versionHistory/useListVersionDropdownItems';
import { useFavoriteStar } from '../list'; import { useFavoriteStar } from '../list';
import { FollowUpWithAssetContent } from '../popups/FollowUpWithAsset';
export const useVersionHistorySelectMenu = ({ metricId }: { metricId: string }): DropdownItem => { export const useVersionHistorySelectMenu = ({ metricId }: { metricId: string }): DropdownItem => {
const chatId = useChatLayoutContextSelector((x) => x.chatId); const chatId = useChatLayoutContextSelector((x) => x.chatId);
@ -69,3 +70,23 @@ export const useFavoriteMetricSelectMenu = ({ metricId }: { metricId: string })
return item; return item;
}; };
export const useMetricDrilldownItem = ({ metricId }: { metricId: string }): DropdownItem => {
return useMemo(
() => ({
value: 'drilldown',
label: 'Drill down & filter',
items: [
<FollowUpWithAssetContent
key="drilldown-and-filter"
assetType="metric"
assetId={metricId}
placeholder="Describe how you want to drill down or filter..."
buttonText="Submit request"
/>
],
icon: <WandSparkle />
}),
[metricId]
);
};

View File

@ -1,25 +0,0 @@
import React, { useMemo } from 'react';
import type { DropdownItem } from '@/components/ui/dropdown';
import { WandSparkle } from '@/components/ui/icons';
import { FollowUpWithAssetContent } from '@/components/features/popups/FollowUpWithAsset';
export const useMetricDrilldownItem = ({ metricId }: { metricId: string }): DropdownItem => {
return useMemo(
() => ({
value: 'drilldown',
label: 'Drill down & filter',
items: [
<FollowUpWithAssetContent
key="drilldown-and-filter"
assetType="metric"
assetId={metricId}
placeholder="Describe how you want to drill down or filter..."
buttonText="Submit request"
mode="drilldown"
/>
],
icon: <WandSparkle />
}),
[metricId]
);
};

View File

@ -3,12 +3,10 @@ import { Popover, type PopoverProps } from '../../ui/popover';
import { InputCard } from '../../ui/card/InputCard'; import { InputCard } from '../../ui/card/InputCard';
import type { ShareAssetType } from '@buster/server-shared/share'; import type { ShareAssetType } from '@buster/server-shared/share';
import { useMemoizedFn } from '../../../hooks'; import { useMemoizedFn } from '../../../hooks';
import { useStartChatFromAsset } from '../../../api/buster_rest/chats'; import { useStartChatFromAsset } from '@/api/buster_rest/chats';
import { AppTooltip } from '../../ui/tooltip'; import { AppTooltip } from '../../ui/tooltip';
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout'; import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
import { assetParamsToRoute } from '../../../lib/assets'; import { assetParamsToRoute } from '@/lib/assets';
type FollowUpMode = 'filter' | 'drilldown';
type FollowUpWithAssetProps = { type FollowUpWithAssetProps = {
assetType: Exclude<ShareAssetType, 'chat' | 'collection'>; assetType: Exclude<ShareAssetType, 'chat' | 'collection'>;
@ -18,7 +16,6 @@ type FollowUpWithAssetProps = {
align?: PopoverProps['align']; align?: PopoverProps['align'];
placeholder?: string; placeholder?: string;
buttonText?: string; buttonText?: string;
mode?: FollowUpMode;
}; };
export const FollowUpWithAssetContent: React.FC<{ export const FollowUpWithAssetContent: React.FC<{
@ -26,26 +23,22 @@ export const FollowUpWithAssetContent: React.FC<{
assetId: string; assetId: string;
placeholder?: string; placeholder?: string;
buttonText?: string; buttonText?: string;
mode?: FollowUpMode;
}> = React.memo( }> = React.memo(
({ ({
assetType, assetType,
assetId, assetId,
placeholder = 'Describe the filter you want to apply', placeholder = 'Describe the filter you want to apply',
buttonText = 'Apply custom filter', buttonText = 'Apply custom filter'
mode
}) => { }) => {
const { mutateAsync: startChatFromAsset, isPending } = useStartChatFromAsset(); const { mutateAsync: startChatFromAsset, isPending } = useStartChatFromAsset();
const onChangePage = useAppLayoutContextSelector((x) => x.onChangePage); const onChangePage = useAppLayoutContextSelector((x) => x.onChangePage);
const transformPrompt = useMemoizedFn((userPrompt: string): string => { const transformPrompt = useMemoizedFn((userPrompt: string): string => {
if (!mode) return userPrompt; if (assetType === 'dashboard') {
if (mode === 'filter') {
return `Hey Buster. Please recreate this dashboard applying this filter to the metrics on the dashboard: ${userPrompt}`; return `Hey Buster. Please recreate this dashboard applying this filter to the metrics on the dashboard: ${userPrompt}`;
} }
if (mode === 'drilldown') { if (assetType === 'metric') {
return `Hey Buster. Can you filter or drill down into this metric based on the following request: ${userPrompt}`; return `Hey Buster. Can you filter or drill down into this metric based on the following request: ${userPrompt}`;
} }
@ -55,12 +48,10 @@ export const FollowUpWithAssetContent: React.FC<{
const onSubmit = useMemoizedFn(async (prompt: string) => { const onSubmit = useMemoizedFn(async (prompt: string) => {
if (!prompt || !assetId || !assetType || isPending) return; if (!prompt || !assetId || !assetType || isPending) return;
const transformedPrompt = transformPrompt(prompt);
const res = await startChatFromAsset({ const res = await startChatFromAsset({
asset_id: assetId, asset_id: assetId,
asset_type: assetType, asset_type: assetType,
prompt: transformedPrompt prompt: transformPrompt(prompt)
}); });
const link = assetParamsToRoute({ const link = assetParamsToRoute({
assetId, assetId,
@ -85,16 +76,7 @@ export const FollowUpWithAssetContent: React.FC<{
FollowUpWithAssetContent.displayName = 'FollowUpWithAssetContent'; FollowUpWithAssetContent.displayName = 'FollowUpWithAssetContent';
export const FollowUpWithAssetPopup: React.FC<FollowUpWithAssetProps> = React.memo( export const FollowUpWithAssetPopup: React.FC<FollowUpWithAssetProps> = React.memo(
({ ({ assetType, assetId, side = 'bottom', align = 'end', children, placeholder, buttonText }) => {
assetType,
assetId,
side = 'bottom',
align = 'end',
children,
placeholder,
buttonText,
mode
}) => {
return ( return (
<Popover <Popover
side={side} side={side}
@ -106,7 +88,6 @@ export const FollowUpWithAssetPopup: React.FC<FollowUpWithAssetProps> = React.me
assetId={assetId} assetId={assetId}
placeholder={placeholder} placeholder={placeholder}
buttonText={buttonText} buttonText={buttonText}
mode={mode}
/> />
}> }>
<AppTooltip title="Apply custom filter">{children}</AppTooltip> <AppTooltip title="Apply custom filter">{children}</AppTooltip>

View File

@ -24,9 +24,9 @@ import { useStartChatFromAsset } from '@/api/buster_rest/chats';
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout'; import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
import { import {
useFavoriteMetricSelectMenu, useFavoriteMetricSelectMenu,
useVersionHistorySelectMenu useVersionHistorySelectMenu,
useMetricDrilldownItem
} from '@/components/features/metrics/ThreeDotMenu'; } from '@/components/features/metrics/ThreeDotMenu';
import { useMetricDrilldownItem } from '@/components/features/metrics/hooks/useMetricDrilldownItem';
export const MetricItemCardThreeDotMenu: React.FC<{ export const MetricItemCardThreeDotMenu: React.FC<{
dashboardId: string; dashboardId: string;

View File

@ -84,7 +84,7 @@ AddContentToDashboardButton.displayName = 'AddContentToDashboardButton';
const FollowUpWithAssetButton = React.memo(({ dashboardId }: { dashboardId: string }) => { const FollowUpWithAssetButton = React.memo(({ dashboardId }: { dashboardId: string }) => {
return ( return (
<FollowUpWithAssetPopup assetId={dashboardId} assetType="dashboard" mode="filter"> <FollowUpWithAssetPopup assetId={dashboardId} assetType="dashboard">
<Button variant="ghost" prefix={<BarsFilter />} /> <Button variant="ghost" prefix={<BarsFilter />} />
</FollowUpWithAssetPopup> </FollowUpWithAssetPopup>
); );

View File

@ -15,12 +15,10 @@ import {
import { ASSET_ICONS } from '@/components/features/config/assetIcons'; import { ASSET_ICONS } from '@/components/features/config/assetIcons';
import { useSaveToCollectionsDropdownContent } from '@/components/features/dropdowns/SaveToCollectionsDropdown'; import { useSaveToCollectionsDropdownContent } from '@/components/features/dropdowns/SaveToCollectionsDropdown';
import { useSaveToDashboardDropdownContent } from '@/components/features/dropdowns/SaveToDashboardDropdown'; import { useSaveToDashboardDropdownContent } from '@/components/features/dropdowns/SaveToDashboardDropdown';
import { useFavoriteStar } from '@/components/features/list/FavoriteStar';
import { StatusBadgeIndicator } from '@/components/features/metrics/StatusBadgeIndicator'; import { StatusBadgeIndicator } from '@/components/features/metrics/StatusBadgeIndicator';
import { useStatusDropdownContent } from '@/components/features/metrics/StatusBadgeIndicator/useStatusDropdownContent'; import { useStatusDropdownContent } from '@/components/features/metrics/StatusBadgeIndicator/useStatusDropdownContent';
import { getShareAssetConfig } from '@/components/features/ShareMenu/helpers'; import { getShareAssetConfig } from '@/components/features/ShareMenu/helpers';
import { ShareMenuContent } from '@/components/features/ShareMenu/ShareMenuContent'; import { ShareMenuContent } from '@/components/features/ShareMenu/ShareMenuContent';
import { useListVersionDropdownItems } from '@/components/features/versionHistory/useListVersionDropdownItems';
import { Button } from '@/components/ui/buttons'; import { Button } from '@/components/ui/buttons';
import { import {
Dropdown, Dropdown,
@ -32,17 +30,14 @@ import {
ArrowUpRight, ArrowUpRight,
Dots, Dots,
Download4, Download4,
History,
Pencil, Pencil,
ShareRight, ShareRight,
SquareChart, SquareChart,
SquareChartPen, SquareChartPen,
SquareCode, SquareCode,
Star,
Table, Table,
Trash Trash
} from '@/components/ui/icons'; } from '@/components/ui/icons';
import { Star as StarFilled } from '@/components/ui/icons/NucleoIconFilled';
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout'; import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
import { useBusterNotifications } from '@/context/BusterNotifications'; import { useBusterNotifications } from '@/context/BusterNotifications';
import { useUserConfigContextSelector } from '@/context/Users'; import { useUserConfigContextSelector } from '@/context/Users';
@ -57,13 +52,13 @@ import {
import { timeout } from '@/lib'; import { timeout } from '@/lib';
import { downloadElementToImage, exportJSONToCSV } from '@/lib/exportUtils'; import { downloadElementToImage, exportJSONToCSV } from '@/lib/exportUtils';
import { canEdit, getIsEffectiveOwner, getIsOwner } from '@/lib/share'; import { canEdit, getIsEffectiveOwner, getIsOwner } from '@/lib/share';
import { BusterRoutes, createBusterRoute } from '@/routes'; import { BusterRoutes } from '@/routes';
import { assetParamsToRoute } from '@/lib/assets'; import { assetParamsToRoute } from '@/lib/assets';
import { import {
useFavoriteMetricSelectMenu, useFavoriteMetricSelectMenu,
useVersionHistorySelectMenu useVersionHistorySelectMenu,
useMetricDrilldownItem
} from '@/components/features/metrics/ThreeDotMenu'; } from '@/components/features/metrics/ThreeDotMenu';
import { useMetricDrilldownItem } from '@/components/features/metrics/hooks/useMetricDrilldownItem';
export const ThreeDotMenuButton = React.memo( export const ThreeDotMenuButton = React.memo(
({ ({