diff --git a/src/entities/file/constants.ts b/src/entities/file/constants.ts index 4e2cb0a2..1857d828 100644 --- a/src/entities/file/constants.ts +++ b/src/entities/file/constants.ts @@ -1,4 +1,4 @@ -import { FileSizeUnit } from './types'; +import { FileColumnDelimiter, FileLineSeparator, FileSizeUnit } from './types'; export const FILE_SIZE_UNIT_DISPLAY = { [FileSizeUnit.B]: 'b', @@ -6,3 +6,17 @@ export const FILE_SIZE_UNIT_DISPLAY = { [FileSizeUnit.MiB]: 'mib', [FileSizeUnit.GiB]: 'gib', } as const; + +export const FILE_LINE_SEPARATOR_VALUES: Record = { + [FileLineSeparator.WIN]: '\r\n', + [FileLineSeparator.UNIX]: '\n', + [FileLineSeparator.MAC]: '\r', +} as const; + +export const FILE_COLUMN_DELIMITER_VALUES: Record = { + [FileColumnDelimiter.TAB]: '\t', + [FileColumnDelimiter.SPACE]: ' ', + [FileColumnDelimiter.COMMA]: ',', + [FileColumnDelimiter.SEMICOLON]: ';', + [FileColumnDelimiter.PIPE]: '|', +} as const; diff --git a/src/entities/file/types.ts b/src/entities/file/types.ts index cd1283d5..e43e9680 100644 --- a/src/entities/file/types.ts +++ b/src/entities/file/types.ts @@ -22,6 +22,20 @@ export enum FileCompression { DEFLATE = 'deflate', } +export enum FileLineSeparator { + WIN = 'win', + UNIX = 'unix', + MAC = 'mac', +} + +export enum FileColumnDelimiter { + TAB = 'tab', + SPACE = 'space', + COMMA = 'comma', + SEMICOLON = 'semicolon', + PIPE = 'pipe', +} + export enum FileFormatType { CSV = 'csv', EXCEL = 'excel', diff --git a/src/entities/file/ui/FileFormatParams/components/FileCompression/index.tsx b/src/entities/file/ui/FileFormatParams/components/FileCompression/index.tsx index 4f84940d..a54cd802 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileCompression/index.tsx +++ b/src/entities/file/ui/FileFormatParams/components/FileCompression/index.tsx @@ -1,58 +1,23 @@ -import React from 'react'; -import { Form, Switch } from 'antd'; -import { Select } from '@shared/ui'; -import { Typography } from 'antd'; -import clsx from 'clsx'; +import { Form, Radio } from 'antd'; import { useTranslation } from 'react-i18next'; +import { FileCompression as FileCompressionType } from '@entities/file/types'; import { FileCompressionProps } from './types'; -import classes from './styles.module.less'; - -const { Text } = Typography; export const FileCompression = ({ name, options }: FileCompressionProps) => { const { t } = useTranslation('file'); const fieldName = [...name, 'compression']; - /* useWatch takes a value from Form.Item, but useFormInstance takes one from general form state - * useWatch returns undefined when Form.Item has not rendered yet - * https://github.com/ant-design/ant-design/issues/49010 - */ - Form.useWatch(fieldName); - const formInstance = Form.useFormInstance(); - - const toggleCompression = (value: boolean) => { - if (value) { - formInstance.setFieldValue(fieldName, undefined); - } else { - formInstance.setFieldValue(fieldName, 'none'); - } - }; - - const switchChecked = formInstance.getFieldValue(fieldName) !== 'none'; - - const selectClassNames = clsx({ - nodrag: true, - [classes.hidden]: !switchChecked, - }); - return ( -
-
- {t('compression')} - -
- - - - - + + + {t('includeHeader')} - - + + + + {CSV_DELIMITER_SELECT_OPTIONS.map((option) => ( + + {t(`delimiters.${option.label as FileColumnDelimiter}`)} + + ))} + - + + + + - {t('yes', { ns: 'shared' })} - {t('no', { ns: 'shared' })} + {CSV_QUOTE_SELECT_OPTIONS.map((option) => ( + + {option.label} + + ))} + {t('no', { ns: 'shared' })} - - + + + + {CSV_ESCAPE_SELECT_OPTIONS.map((option) => ( + + {option.label} + + ))} + + ); diff --git a/src/entities/file/ui/FileFormatParams/components/FileFormatExcel/index.tsx b/src/entities/file/ui/FileFormatParams/components/FileFormatExcel/index.tsx index 5dee6c20..5b41c318 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileFormatExcel/index.tsx +++ b/src/entities/file/ui/FileFormatParams/components/FileFormatExcel/index.tsx @@ -1,5 +1,4 @@ -import { Form, Input, Radio } from 'antd'; -import React from 'react'; +import { Checkbox, Form, Input } from 'antd'; import { useTranslation } from 'react-i18next'; import { FileFormatExcelProps } from './types'; @@ -9,12 +8,10 @@ export const FileFormatExcel = ({ name }: FileFormatExcelProps) => { return ( <> - - - {t('yes', { ns: 'shared' })} - {t('no', { ns: 'shared' })} - + + {t('includeHeader')} + diff --git a/src/entities/file/ui/FileFormatParams/components/FileFormatJson/constants.ts b/src/entities/file/ui/FileFormatParams/components/FileFormatJson/constants.ts index f1b51344..99fbe6c1 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileFormatJson/constants.ts +++ b/src/entities/file/ui/FileFormatParams/components/FileFormatJson/constants.ts @@ -1,6 +1,7 @@ import { prepareOptionsForSelect } from '@shared/ui'; +import { FILE_LINE_SEPARATOR_VALUES } from '@entities/file/constants'; -import { FileCompression, Json } from '../../../../types'; +import { Csv, FileCompression, FileLineSeparator, Json } from '../../../../types'; export const JSON_COMPRESSION_SELECT_OPTIONS = prepareOptionsForSelect({ data: [ @@ -13,3 +14,9 @@ export const JSON_COMPRESSION_SELECT_OPTIONS = prepareOptionsForSelect data, renderValue: (data) => data, }); + +export const JSON_SEPARATOR_SELECT_OPTIONS = prepareOptionsForSelect({ + data: Object.values([FileLineSeparator.WIN, FileLineSeparator.UNIX, FileLineSeparator.MAC]), + renderLabel: (data) => data, + renderValue: (data) => FILE_LINE_SEPARATOR_VALUES[data as FileLineSeparator], +}); diff --git a/src/entities/file/ui/FileFormatParams/components/FileFormatJson/index.tsx b/src/entities/file/ui/FileFormatParams/components/FileFormatJson/index.tsx index c3b40d2a..3e9b2d77 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileFormatJson/index.tsx +++ b/src/entities/file/ui/FileFormatParams/components/FileFormatJson/index.tsx @@ -1,10 +1,10 @@ -import React from 'react'; import { Form, Input } from 'antd'; import { useTranslation } from 'react-i18next'; import { FileCompression } from '../FileCompression'; +import { FileLineSeparator } from '../FileLineSeparator'; -import { JSON_COMPRESSION_SELECT_OPTIONS } from './constants'; +import { JSON_COMPRESSION_SELECT_OPTIONS, JSON_SEPARATOR_SELECT_OPTIONS } from './constants'; import { FileFormatJsonProps } from './types'; export const FileFormatJson = ({ name }: FileFormatJsonProps) => { @@ -15,9 +15,9 @@ export const FileFormatJson = ({ name }: FileFormatJsonProps) => { - - - + + + ); diff --git a/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/constants.ts b/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/constants.ts index 7ebb686b..e88c9aa8 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/constants.ts +++ b/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/constants.ts @@ -1,6 +1,7 @@ import { prepareOptionsForSelect } from '@shared/ui'; +import { FILE_LINE_SEPARATOR_VALUES } from '@entities/file/constants'; -import { FileCompression, JsonLine } from '../../../../types'; +import { Csv, FileCompression, FileLineSeparator, JsonLine } from '../../../../types'; export const JSON_LINE_COMPRESSION_SELECT_OPTIONS = prepareOptionsForSelect({ data: [ @@ -13,3 +14,9 @@ export const JSON_LINE_COMPRESSION_SELECT_OPTIONS = prepareOptionsForSelect data, renderValue: (data) => data, }); + +export const JSON_LINE_SEPARATOR_SELECT_OPTIONS = prepareOptionsForSelect({ + data: Object.values([FileLineSeparator.WIN, FileLineSeparator.UNIX, FileLineSeparator.MAC]), + renderLabel: (data) => data, + renderValue: (data) => FILE_LINE_SEPARATOR_VALUES[data as FileLineSeparator], +}); diff --git a/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/index.tsx b/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/index.tsx index 68da6fb9..e2122a0a 100644 --- a/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/index.tsx +++ b/src/entities/file/ui/FileFormatParams/components/FileFormatJsonLine/index.tsx @@ -1,10 +1,10 @@ -import React from 'react'; import { Form, Input } from 'antd'; import { useTranslation } from 'react-i18next'; import { FileCompression } from '../FileCompression'; +import { FileLineSeparator } from '../FileLineSeparator'; -import { JSON_LINE_COMPRESSION_SELECT_OPTIONS } from './constants'; +import { JSON_LINE_COMPRESSION_SELECT_OPTIONS, JSON_LINE_SEPARATOR_SELECT_OPTIONS } from './constants'; import { FileFormatJsonLineProps } from './types'; export const FileFormatJsonLine = ({ name }: FileFormatJsonLineProps) => { @@ -15,9 +15,9 @@ export const FileFormatJsonLine = ({ name }: FileFormatJsonLineProps) => { - - - + + + ); diff --git a/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/index.tsx b/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/index.tsx new file mode 100644 index 00000000..eae1b2e9 --- /dev/null +++ b/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/index.tsx @@ -0,0 +1,22 @@ +import { Form, Radio } from 'antd'; +import { useTranslation } from 'react-i18next'; +import { FileLineSeparator as FileLineSeparatorType } from '@entities/file/types'; + +import { FileLineSeparatorProps } from './types'; + +export const FileLineSeparator = ({ name, options }: FileLineSeparatorProps) => { + const { t } = useTranslation('file'); + const fieldName = [...name, 'line_sep']; + + return ( + + + {options.map((option) => ( + + {t(`lineSeparators.${option.label as FileLineSeparatorType}`)} + + ))} + + + ); +}; diff --git a/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/types.ts b/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/types.ts new file mode 100644 index 00000000..11196336 --- /dev/null +++ b/src/entities/file/ui/FileFormatParams/components/FileLineSeparator/types.ts @@ -0,0 +1,7 @@ +import { OptionItem } from '@shared/ui'; + +import { FileFormatFieldName } from '../types'; + +export interface FileLineSeparatorProps extends FileFormatFieldName { + options: OptionItem[]; +} diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionsDefault/index.tsx b/src/features/transfer/MutateTransferForm/components/TransferConnectionsDefault/index.tsx index d26aad84..f761751e 100644 --- a/src/features/transfer/MutateTransferForm/components/TransferConnectionsDefault/index.tsx +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionsDefault/index.tsx @@ -17,7 +17,7 @@ export const TransferConnectionsDefault = ({ groupId }: TransferConnectionsDefau const filters = useMemo( () => Object.entries(FILTER_TYPES_CONFIG) - .filter(([key]) => supportedTransformationTypes.includes(key as TransformationType)) + .filter(([key]) => supportedTransformationTypes?.includes(key as TransformationType)) .map(([key, { title, filter }]) => (
{filter} diff --git a/src/shared/config/i18n/translations/en.json b/src/shared/config/i18n/translations/en.json index 8dc26acd..204c97b8 100644 --- a/src/shared/config/i18n/translations/en.json +++ b/src/shared/config/i18n/translations/en.json @@ -114,13 +114,34 @@ "fileFormat": "File format", "selectFileFormat": "Select file format", "compression": "Compression", + "compressions": { + "none": "None", + "bzip2": "BZip2", + "gzip": "GZip", + "lz4": "LZ4", + "snappy": "Snappy", + "zlib": "ZLib", + "deflate": "Deflate" + }, "selectCompression": "Select compression type", "delimiter": "Delimiter", + "delimiters": { + "tab": "Tab", + "space": "Space", + "comma": "Comma ,", + "semicolon": "Semicolon ;", + "pipe": "Pipe |" + }, "encoding": "Encoding", - "quote": "Quote", - "escape": "Escape", + "quote": "Wrap text in quotes", + "escape": "Escape quotes with character", "includeHeader": "Include header", "lineSeparator": "Line separator", + "lineSeparators": { + "win": "Windows (CRLF, \\r\\n)", + "unix": "Unix (LF, \\n)", + "mac": "MacOS (CR, \\r)" + }, "startCell": "Start cell", "rootTag": "Root tag", "rowTag": "Row tag", diff --git a/src/shared/config/i18n/translations/ru.json b/src/shared/config/i18n/translations/ru.json index 8933b68a..a5b70f6e 100644 --- a/src/shared/config/i18n/translations/ru.json +++ b/src/shared/config/i18n/translations/ru.json @@ -112,13 +112,34 @@ "fileFormat": "Формат файла", "selectFileFormat": "Выбрать формат файла", "compression": "Сжатие", + "compressions": { + "none": "Нет", + "bzip2": "BZip2", + "gzip": "GZip", + "lz4": "LZ4", + "snappy": "Snappy", + "zlib": "ZLib", + "deflate": "Deflate" + }, "selectCompression": "Выберите тип сжатия", "delimiter": "Разделитель", + "delimiters": { + "tab": "Табуляция", + "space": "Пробел", + "comma": "Запятая ,", + "semicolon": "Точка с запятой ;", + "pipe": "Вертикальная черта |" + }, "encoding": "Кодировка", - "quote": "Кавычки", - "escape": "Экранирование", + "quote": "Оборачивать текст в кавычки", + "escape": "Экранировать кавычки символом", "includeHeader": "Включить заголовок", "lineSeparator": "Разделитель строк", + "lineSeparators": { + "win": "Windows (CRLF, \\r\\n)", + "unix": "Unix (LF, \\n)", + "mac": "MacOS (CR, \\r)" + }, "startCell": "Начальная ячейка", "rootTag": "Корневой тег", "rowTag": "Тег строки",