hover states

This commit is contained in:
Nate Kelley 2025-09-30 09:25:41 -06:00
parent d0e3b811e5
commit 71b795abc1
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 33 additions and 28 deletions

View File

@ -26,6 +26,7 @@ export const useCreateShortcutsMentionsSuggestions = (
setOpenCreateShortcutModal: (open: boolean) => void setOpenCreateShortcutModal: (open: boolean) => void
) => { ) => {
const navigate = useNavigate(); const navigate = useNavigate();
const createShortcutForMention = useCreateShortcutForMention();
return useMemo( return useMemo(
() => () =>
@ -68,7 +69,8 @@ export const useCreateShortcutsMentionsSuggestions = (
); );
}; };
const createShortcutForMention = (shortcut: Shortcut): MentionTriggerItem<string> => { export const useCreateShortcutForMention = () => {
const createShortcutForMention = (shortcut: Shortcut): MentionTriggerItem<string> => {
return { return {
value: shortcut.id, value: shortcut.id,
label: shortcut.name, label: shortcut.name,
@ -96,12 +98,16 @@ const createShortcutForMention = (shortcut: Shortcut): MentionTriggerItem<string
/> />
), ),
}; };
};
return createShortcutForMention;
}; };
export const useShortcutsSuggestions = ( export const useShortcutsSuggestions = (
shortcuts: ListShortcutsResponse['shortcuts'], shortcuts: ListShortcutsResponse['shortcuts'],
setOpenCreateShortcutModal: (open: boolean) => void, setOpenCreateShortcutModal: (open: boolean) => void,
mentionInputSuggestionsRef: React.RefObject<MentionInputSuggestionsRef | null> mentionInputSuggestionsRef: React.RefObject<MentionInputSuggestionsRef | null>
): MentionInputSuggestionsProps['suggestionItems'] => { ): MentionInputSuggestionsProps['suggestionItems'] => {
const createShortcutForMention = useCreateShortcutForMention();
return useMemo(() => { return useMemo(() => {
const shortcutsItems = shortcuts.map<MentionInputSuggestionsDropdownItem>((shortcut) => { const shortcutsItems = shortcuts.map<MentionInputSuggestionsDropdownItem>((shortcut) => {
return { return {

View File

@ -17,7 +17,7 @@ export const MentionSecondaryContentDropdown = ({
<Button <Button
variant={'ghost'} variant={'ghost'}
className={cn( className={cn(
'hover:bg-item-active hidden group-data-[selected=true]/mention-list-item:flex -mr-1.5', 'hover:bg-item-active hidden group-hover/mention-list-item:flex group-data-[selected=true]/mention-list-item:flex -mr-1.5',
open && 'flex!' open && 'flex!'
)} )}
prefix={<Dots />} prefix={<Dots />}

View File

@ -1,6 +1,5 @@
import { Command, useCommandState } from 'cmdk'; import { Command } from 'cmdk';
import type React from 'react'; import type React from 'react';
import { useMount } from '@/hooks/useMount';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { Popover } from '../../popover'; import { Popover } from '../../popover';
import type { import type {