diff --git a/src/components/OutSegTemplateEditor.jsx b/src/components/OutSegTemplateEditor.jsx index 002c1c9c..70e159d3 100644 --- a/src/components/OutSegTemplateEditor.jsx +++ b/src/components/OutSegTemplateEditor.jsx @@ -2,7 +2,7 @@ import React, { memo, useState, useEffect, useCallback } from 'react'; import { useDebounce } from 'use-debounce'; import i18n from 'i18next'; import { useTranslation } from 'react-i18next'; -import { Text, Button, Alert, IconButton, TickIcon, ResetIcon } from 'evergreen-ui'; +import { Text, Button, Alert, IconButton, TickIcon, ResetIcon, Heading } from 'evergreen-ui'; import Swal from 'sweetalert2'; import withReactContent from 'sweetalert2-react-content'; @@ -12,6 +12,8 @@ import useUserSettings from '../hooks/useUserSettings'; const ReactSwal = withReactContent(Swal); +// eslint-disable-next-line no-template-curly-in-string +const extVar = '${EXT}'; const inputStyle = { flexGrow: 1, fontFamily: 'inherit', fontSize: '.8em' }; @@ -49,6 +51,9 @@ const OutSegTemplateEditor = memo(({ helpIcon, outSegTemplate, setOutSegTemplate } }, [debouncedText, generateOutSegFileNames, getOutSegError, t]); + // eslint-disable-next-line no-template-curly-in-string + const isMissingExtension = validText != null && !validText.endsWith(extVar); + const onAllSegmentsPreviewPress = () => ReactSwal.fire({ title: t('Resulting segment file names'), html: ( @@ -95,8 +100,9 @@ const OutSegTemplateEditor = memo(({ helpIcon, outSegTemplate, setOutSegTemplate -
- {error != null && {i18n.t('There is an error in the file name template:')}
{error}
} +
+ {error != null && {i18n.t('There is an error in the file name template:')}{error}} + {isMissingExtension && {i18n.t('The file name template is missing {{ext}} and will result in a file without the suggested extension. This may result in an unplayable output file.', { ext: extVar })}} {/* eslint-disable-next-line no-template-curly-in-string */}
{`${i18n.t('Variables')}`}{': '}