mirror of https://github.com/buster-so/buster.git
new suggestions
This commit is contained in:
Nate Kelley
parent
ae12a8981c
commit
c2416889ba
|
|
@ -53,7 +53,7 @@ type Story = StoryObj<typeof BusterChatInputBase>;
|
|||
const mockShortcuts: ListShortcutsResponse['shortcuts'] = [
|
||||
{
|
||||
id: '123e4567-e89b-12d3-a456-426614174000',
|
||||
name: 'Weekly Sales Report',
|
||||
name: 'weekly-sales-report',
|
||||
instructions: 'Generate a comprehensive weekly sales report with key metrics and trends',
|
||||
createdBy: '123e4567-e89b-12d3-a456-426614174001',
|
||||
updatedBy: null,
|
||||
|
|
@ -65,7 +65,7 @@ const mockShortcuts: ListShortcutsResponse['shortcuts'] = [
|
|||
},
|
||||
{
|
||||
id: '123e4567-e89b-12d3-a456-426614174003',
|
||||
name: 'Customer Analysis',
|
||||
name: 'customer-analysis',
|
||||
instructions: 'Analyze customer behavior patterns and provide insights',
|
||||
createdBy: '123e4567-e89b-12d3-a456-426614174001',
|
||||
updatedBy: null,
|
||||
|
|
@ -77,7 +77,7 @@ const mockShortcuts: ListShortcutsResponse['shortcuts'] = [
|
|||
},
|
||||
{
|
||||
id: '123e4567-e89b-12d3-a456-426614174004',
|
||||
name: 'Revenue Forecast',
|
||||
name: 'revenue-forecast',
|
||||
instructions: 'Create a revenue forecast for the next quarter based on current trends',
|
||||
createdBy: '123e4567-e89b-12d3-a456-426614174001',
|
||||
updatedBy: null,
|
||||
|
|
|
|||
|
|
@ -2,9 +2,8 @@ import type { ListShortcutsResponse, Shortcut } from '@buster/server-shared/shor
|
|||
import { useNavigate } from '@tanstack/react-router';
|
||||
import type { Editor } from '@tiptap/react';
|
||||
import { useMemo, useRef } from 'react';
|
||||
import { useDeleteShortcut, useGetShortcut } from '@/api/buster_rest/shortcuts/queryRequests';
|
||||
import { ErrorCard } from '@/components/ui/error/ErrorCard';
|
||||
import { Pencil, Trash } from '@/components/ui/icons';
|
||||
import { useDeleteShortcut } from '@/api/buster_rest/shortcuts/queryRequests';
|
||||
import { Trash } from '@/components/ui/icons';
|
||||
import PenWriting from '@/components/ui/icons/NucleoIconOutlined/pen-writing';
|
||||
import Plus from '@/components/ui/icons/NucleoIconOutlined/plus';
|
||||
import {
|
||||
|
|
@ -13,10 +12,11 @@ import {
|
|||
type MentionTriggerItem,
|
||||
} from '@/components/ui/inputs/MentionInput';
|
||||
import type {
|
||||
MentionInputSuggestionsDropdownItem,
|
||||
MentionInputSuggestionsProps,
|
||||
MentionInputSuggestionsRef,
|
||||
} from '@/components/ui/inputs/MentionInputSuggestions';
|
||||
import { Paragraph } from '@/components/ui/typography/Paragraph';
|
||||
import { Text } from '@/components/ui/typography/Text';
|
||||
import { ShortcutPopoverContent } from './ShortcutPopoverContent';
|
||||
|
||||
export const SHORTCUT_MENTION_TRIGGER = '/';
|
||||
|
|
@ -78,48 +78,61 @@ export const useCreateShortcutsMentionsSuggestions = (
|
|||
};
|
||||
|
||||
export const useCreateShortcutForMention = () => {
|
||||
const navigate = useNavigate();
|
||||
const { mutateAsync: deleteShortcut } = useDeleteShortcut();
|
||||
// const navigate = useNavigate();
|
||||
// const { mutateAsync: deleteShortcut } = useDeleteShortcut();
|
||||
const createShortcutForMention = (
|
||||
shortcut: Shortcut,
|
||||
editor?: Editor
|
||||
_editor?: Editor
|
||||
): MentionTriggerItem<string> => {
|
||||
console.log('shortcut', shortcut);
|
||||
return {
|
||||
value: shortcut.id,
|
||||
label: shortcut.name,
|
||||
icon: <PenWriting />,
|
||||
secondaryContent: (
|
||||
<MentionSecondaryContentDropdown
|
||||
items={[
|
||||
{
|
||||
label: 'Edit',
|
||||
icon: <PenWriting />,
|
||||
value: 'edit',
|
||||
onClick: () => {
|
||||
navigate({
|
||||
to: '/app/home/shortcuts',
|
||||
search: {
|
||||
shortcut_id: shortcut.id,
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: 'Delete',
|
||||
icon: <Trash />,
|
||||
value: 'delete',
|
||||
onClick: async () => {
|
||||
await deleteShortcut({ id: shortcut.id });
|
||||
//remove the trigger character from the editor
|
||||
editor?.commands.deleteRange({
|
||||
from: editor.state.selection.from - 1,
|
||||
to: editor.state.selection.from,
|
||||
});
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
label: (
|
||||
<div className="flex flex-col space-y-1.5 py-1.5">
|
||||
<Text>{`${SHORTCUT_MENTION_TRIGGER}${shortcut.name}`}</Text>
|
||||
<Paragraph
|
||||
size={'xs'}
|
||||
variant={'secondary'}
|
||||
className="line-clamp-2"
|
||||
style={{ lineHeight: 'normal' }}
|
||||
>
|
||||
{shortcut.instructions}
|
||||
</Paragraph>
|
||||
</div>
|
||||
),
|
||||
pillLabel: shortcut.name,
|
||||
// secondaryContent: (
|
||||
// <MentionSecondaryContentDropdown
|
||||
// items={[
|
||||
// {
|
||||
// label: 'Edit',
|
||||
// icon: <PenWriting />,
|
||||
// value: 'edit',
|
||||
// onClick: () => {
|
||||
// navigate({
|
||||
// to: '/app/home/shortcuts',
|
||||
// search: {
|
||||
// shortcut_id: shortcut.id,
|
||||
// },
|
||||
// });
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: 'Delete',
|
||||
// icon: <Trash />,
|
||||
// value: 'delete',
|
||||
// onClick: async () => {
|
||||
// await deleteShortcut({ id: shortcut.id });
|
||||
// //remove the trigger character from the editor
|
||||
// editor?.commands.deleteRange({
|
||||
// from: editor.state.selection.from - 1,
|
||||
// to: editor.state.selection.from,
|
||||
// });
|
||||
// },
|
||||
// },
|
||||
// ]}
|
||||
// />
|
||||
// ),
|
||||
};
|
||||
};
|
||||
|
||||
|
|
@ -130,7 +143,6 @@ export const useShortcutsSuggestions = (
|
|||
setOpenCreateShortcutModal: (open: boolean) => void,
|
||||
mentionInputSuggestionsRef: React.RefObject<MentionInputSuggestionsRef | null>
|
||||
): MentionInputSuggestionsProps['suggestionItems'] => {
|
||||
const createShortcutForMention = useCreateShortcutForMention();
|
||||
const navigate = useNavigate();
|
||||
return useMemo(() => {
|
||||
const shortcutsItems: MentionInputSuggestionsProps['suggestionItems'] = [
|
||||
|
|
@ -197,13 +209,3 @@ export const useShortcutsSuggestions = (
|
|||
// ];
|
||||
}, [setOpenCreateShortcutModal, mentionInputSuggestionsRef]);
|
||||
};
|
||||
|
||||
const ShortcutSuggestionsPopoverContent = ({ shortcut }: { shortcut: Shortcut }) => {
|
||||
const { isFetched, isError } = useGetShortcut({ id: shortcut.id });
|
||||
|
||||
if (!isFetched) return null;
|
||||
|
||||
if (isError) return <ErrorCard message="Error fetching shortcut" />;
|
||||
|
||||
return <ShortcutPopoverContent value={shortcut.id} />;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -13,11 +13,11 @@ const paragraphVariants = cva('', {
|
|||
lg: 'text-lg',
|
||||
},
|
||||
lineHeight: {
|
||||
none: 'leading-[1]!',
|
||||
none: 'leading-[1]',
|
||||
sm: 'leading-1.5!',
|
||||
base: 'leading-1.5!',
|
||||
md: 'leading-[1.4]!',
|
||||
lg: 'leading-[1.5]!',
|
||||
base: 'leading-1.5',
|
||||
md: 'leading-[1.4]',
|
||||
lg: 'leading-[1.5]',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue