import { useCallback, useMemo } from 'react' import { useTranslation } from 'react-i18next' import { Alert, Button, Modal } from 'react-bootstrap' import Icon from '../../../shared/components/icon' import Tooltip from '../../../shared/components/tooltip' import useAsync from '../../../shared/hooks/use-async' import { postJSON } from '../../../infrastructure/fetch-json' import ignoredWords from '../ignored-words' import BetaBadge from '../../../shared/components/beta-badge' type DictionaryModalContentProps = { handleHide: () => void } const wordsSortFunction = (a: string, b: string) => a.localeCompare(b) export default function DictionaryModalContent({ handleHide, }: DictionaryModalContentProps) { const { t } = useTranslation() const { isError, runAsync } = useAsync() const handleRemove = useCallback( word => { ignoredWords.remove(word) runAsync( postJSON('/spelling/unlearn', { body: { word, }, }) ).catch(console.error) }, [runAsync] ) const betaBadgeTooltipProps = useMemo(() => { return { id: 'dictionary-modal-tooltip', placement: 'bottom', className: 'tooltip-wide', text: ( <> We are testing the dictionary manager.
Click to give feedback ), } }, []) return ( <> {t('edit_dictionary')}{' '} {isError ? ( {t('generic_something_went_wrong')} ) : null} {ignoredWords.learnedWords?.size > 0 ? ( ) : (

{t('edit_dictionary_empty')}

)}
) }