fuse-importer 0.1.1-testing → 0.1.3-testing
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/esm/Importer/ImporterWithContext.d.ts +2 -0
- package/lib/esm/Importer/ImporterWithContext.js +12 -8
- package/lib/esm/Importer/Review/ReviewContextProvider.js +1 -1
- package/lib/esm/Importer/Uploader/DragAndDropImporter/ImporterDropzone.js +19 -11
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/filterMethods.js +2 -9
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/index.d.ts +2 -3
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/index.js +66 -15
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/useSpreadsheetFilter.d.ts +1 -1
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/utils.d.ts +1 -0
- package/lib/esm/Importer/common/Spreadsheet/SpreadsheetContextProvider/utils.js +7 -0
- package/lib/esm/Importer/common/Spreadsheet/components/SpreadsheetData.js +2 -2
- package/lib/esm/Importer/common/Spreadsheet/components/SpreadsheetRowCheckboxes.js +8 -8
- package/lib/esm/Importer/common/Spreadsheet/components/fields/SpreadsheetInput.js +1 -1
- package/lib/esm/Importer/common/Spreadsheet/components/fields/index.js +9 -8
- package/lib/esm/Importer/common/Spreadsheet/hooks.d.ts +1 -2
- package/lib/esm/Importer/common/Spreadsheet/hooks.js +39 -28
- package/lib/esm/Importer/common/Spreadsheet/transformation/transformators.js +1 -25
- package/lib/esm/Importer/contexts/ImporterContextProvider.d.ts +4 -2
- package/lib/esm/Importer/contexts/ImporterContextProvider.js +2 -1
- package/lib/esm/Importer/index.d.ts +4 -3
- package/lib/esm/Importer/index.js +2 -2
- package/lib/esm/common/Table/TableActions/CustomActions/CustomActions.d.ts +1 -0
- package/lib/esm/common/Table/TableActions/CustomActions/CustomActions.js +131 -0
- package/lib/esm/common/Table/TableActions/CustomActions/index.d.ts +1 -0
- package/lib/esm/common/Table/TableActions/CustomActions/index.js +1 -0
- package/lib/esm/common/Table/TableActions/DeleteSelectedRows.js +9 -1
- package/lib/esm/common/Table/TableActions/FilterByErrors/FilterByErrors.js +2 -2
- package/lib/esm/common/Table/TableActions/RowFilters.js +12 -8
- package/lib/esm/common/Table/TableActions/SearchRows.js +6 -5
- package/lib/esm/common/Table/TableActions/TableActions.js +2 -1
- package/lib/esm/common/Table/TableActions/icons.d.ts +1 -0
- package/lib/esm/common/Table/TableActions/icons.js +1 -0
- package/lib/esm/common/columnsTransformations.js +0 -8
- package/lib/esm/common/inputs/SelectMenu.d.ts +2 -1
- package/lib/esm/common/inputs/SelectMenu.js +7 -3
- package/lib/esm/common/inputs/TextInput.js +1 -1
- package/lib/esm/index.d.ts +3 -1
- package/lib/esm/index.js +9 -2
- package/lib/esm/locales/de.d.ts +8 -1
- package/lib/esm/locales/de.js +8 -1
- package/lib/esm/locales/en.d.ts +8 -1
- package/lib/esm/locales/en.js +8 -1
- package/lib/esm/locales/es.d.ts +8 -1
- package/lib/esm/locales/es.js +8 -1
- package/lib/esm/locales/fr.d.ts +8 -1
- package/lib/esm/locales/fr.js +8 -1
- package/lib/esm/types.d.ts +16 -4
- package/lib/esm/types.js +0 -1
- package/lib/main.js +4 -4
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import Fuse from "fuse.js";
|
|
2
2
|
import React from "react";
|
|
3
|
-
import { FormatRecord, ImporterOptions, Integration, OnSubmit, OnValidateRecord, Record, TemplateHeader } from "../../types";
|
|
3
|
+
import { CustomAction, FormatRecord, ImporterOptions, Integration, OnSubmit, OnValidateRecord, Record, TemplateHeader } from "../../types";
|
|
4
4
|
import { FuseApi } from "../common/FuseApi";
|
|
5
5
|
export declare const fusejsOptions: Fuse.IFuseOptions<string>;
|
|
6
6
|
export type HeaderMatchings = {
|
|
@@ -56,6 +56,7 @@ export type State = {
|
|
|
56
56
|
isUsingManualImport: React.MutableRefObject<boolean>;
|
|
57
57
|
resetImporterWhenUsingManualImport: () => void;
|
|
58
58
|
manualDataImportSelected: () => void;
|
|
59
|
+
customActions: CustomAction[];
|
|
59
60
|
};
|
|
60
61
|
export type Props = {
|
|
61
62
|
templateSlug: string;
|
|
@@ -68,6 +69,7 @@ export type Props = {
|
|
|
68
69
|
formatRecord: FormatRecord;
|
|
69
70
|
onValidateRecord?: OnValidateRecord;
|
|
70
71
|
dynamicColumns: TemplateHeader[] | null;
|
|
72
|
+
customActions: CustomAction[];
|
|
71
73
|
};
|
|
72
|
-
export declare const ImporterContextProvider: ({ templateSlug, initialRecords, apiToken, children, options, onSubmit, onClose, formatRecord, onValidateRecord, dynamicColumns, }: Props) => JSX.Element;
|
|
74
|
+
export declare const ImporterContextProvider: ({ templateSlug, initialRecords, apiToken, children, options, onSubmit, onClose, formatRecord, onValidateRecord, dynamicColumns, customActions, }: Props) => JSX.Element;
|
|
73
75
|
export declare const useImporterContext: () => State;
|
|
@@ -67,7 +67,7 @@ export var fusejsOptions = {
|
|
|
67
67
|
};
|
|
68
68
|
var ImporterContext = createContext({});
|
|
69
69
|
export var ImporterContextProvider = function (_a) {
|
|
70
|
-
var templateSlug = _a.templateSlug, initialRecords = _a.initialRecords, apiToken = _a.apiToken, children = _a.children, options = _a.options, onSubmit = _a.onSubmit, onClose = _a.onClose, formatRecord = _a.formatRecord, onValidateRecord = _a.onValidateRecord, dynamicColumns = _a.dynamicColumns;
|
|
70
|
+
var templateSlug = _a.templateSlug, initialRecords = _a.initialRecords, apiToken = _a.apiToken, children = _a.children, options = _a.options, onSubmit = _a.onSubmit, onClose = _a.onClose, formatRecord = _a.formatRecord, onValidateRecord = _a.onValidateRecord, dynamicColumns = _a.dynamicColumns, customActions = _a.customActions;
|
|
71
71
|
var _b = useState(initialRecords ? 2 : 0), currentStepIndex = _b[0], setCurrentStepIndex = _b[1];
|
|
72
72
|
var _c = useState(0), matcherSubstep = _c[0], setMatcherSubstep = _c[1];
|
|
73
73
|
var _d = useState(null), templateError = _d[0], setTemplateError = _d[1];
|
|
@@ -241,6 +241,7 @@ export var ImporterContextProvider = function (_a) {
|
|
|
241
241
|
isUsingManualImport: isUsingManualImport,
|
|
242
242
|
resetImporterWhenUsingManualImport: resetImporterWhenUsingManualImport,
|
|
243
243
|
manualDataImportSelected: manualDataImportSelected,
|
|
244
|
+
customActions: customActions,
|
|
244
245
|
};
|
|
245
246
|
return (_jsx(ImporterContext.Provider, __assign({ value: value }, { children: children })));
|
|
246
247
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FormatRecord, ImporterOptions, OnSubmit, OnValidateRecord, TemplateHeader } from "../types";
|
|
1
|
+
import { CustomAction, FormatRecord, ImporterOptions, OnSubmit, OnValidateRecord, TemplateHeader } from "../types";
|
|
2
2
|
export declare const ACCOUNT_ROUTES: {
|
|
3
3
|
TEMPLATES: string;
|
|
4
4
|
};
|
|
@@ -11,11 +11,12 @@ type ImporterProps = {
|
|
|
11
11
|
previewMode?: boolean;
|
|
12
12
|
formatRecord: FormatRecord;
|
|
13
13
|
onValidateRecord?: OnValidateRecord;
|
|
14
|
+
dynamicColumns: TemplateHeader[];
|
|
15
|
+
customActions: CustomAction[];
|
|
14
16
|
onSubmit?: OnSubmit;
|
|
15
17
|
onClose: () => void;
|
|
16
|
-
dynamicColumns: TemplateHeader[];
|
|
17
18
|
};
|
|
18
|
-
declare const Importer: ({ templateSlug, apiToken, options, formatRecord, onValidateRecord, onSubmit, onClose,
|
|
19
|
+
declare const Importer: ({ templateSlug, apiToken, options, formatRecord, onValidateRecord, dynamicColumns, customActions, onSubmit, onClose, }: ImporterProps) => JSX.Element;
|
|
19
20
|
export * from "./common/Spreadsheet";
|
|
20
21
|
export * from "./common/utils";
|
|
21
22
|
export * from "./Review/ReviewContextProvider";
|
|
@@ -19,8 +19,8 @@ export var ACCOUNT_VIEW_PATH = "/account";
|
|
|
19
19
|
var p = function (path) { return "".concat(ACCOUNT_VIEW_PATH).concat(path); };
|
|
20
20
|
export var TEMPLATES_ROUTE = p(ACCOUNT_ROUTES.TEMPLATES);
|
|
21
21
|
var Importer = function (_a) {
|
|
22
|
-
var templateSlug = _a.templateSlug, apiToken = _a.apiToken, options = _a.options, formatRecord = _a.formatRecord, onValidateRecord = _a.onValidateRecord,
|
|
23
|
-
return (_jsx(ImporterContextProvider, __assign({ initialRecords: options.records, options: options, templateSlug: templateSlug, apiToken: apiToken, formatRecord: formatRecord, onValidateRecord: onValidateRecord, onClose: onClose, onSubmit: onSubmit, dynamicColumns: dynamicColumns }, { children: _jsx(ImporterWithContext, {}) })));
|
|
22
|
+
var templateSlug = _a.templateSlug, apiToken = _a.apiToken, options = _a.options, formatRecord = _a.formatRecord, onValidateRecord = _a.onValidateRecord, dynamicColumns = _a.dynamicColumns, customActions = _a.customActions, onSubmit = _a.onSubmit, onClose = _a.onClose;
|
|
23
|
+
return (_jsx(ImporterContextProvider, __assign({ initialRecords: options.records, options: options, templateSlug: templateSlug, apiToken: apiToken, formatRecord: formatRecord, onValidateRecord: onValidateRecord, onClose: onClose, onSubmit: onSubmit, dynamicColumns: dynamicColumns, customActions: customActions }, { children: _jsx(ImporterWithContext, {}) })));
|
|
24
24
|
};
|
|
25
25
|
export * from "./common/Spreadsheet";
|
|
26
26
|
export * from "./common/utils";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const CustomActions: () => JSX.Element;
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
var __assign = (this && this.__assign) || function () {
|
|
6
|
+
__assign = Object.assign || function(t) {
|
|
7
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
8
|
+
s = arguments[i];
|
|
9
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
10
|
+
t[p] = s[p];
|
|
11
|
+
}
|
|
12
|
+
return t;
|
|
13
|
+
};
|
|
14
|
+
return __assign.apply(this, arguments);
|
|
15
|
+
};
|
|
16
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
17
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
18
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
19
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
20
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
21
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
22
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
23
|
+
});
|
|
24
|
+
};
|
|
25
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
26
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
27
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
28
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
29
|
+
function step(op) {
|
|
30
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
31
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
32
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
33
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
34
|
+
switch (op[0]) {
|
|
35
|
+
case 0: case 1: t = op; break;
|
|
36
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
37
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
38
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
39
|
+
default:
|
|
40
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
41
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
42
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
43
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
44
|
+
if (t[2]) _.ops.pop();
|
|
45
|
+
_.trys.pop(); continue;
|
|
46
|
+
}
|
|
47
|
+
op = body.call(thisArg, _);
|
|
48
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
49
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
53
|
+
import { useMemo, useState } from "react";
|
|
54
|
+
import { ActionPlus } from "../icons";
|
|
55
|
+
import { Div } from "../../../../styled";
|
|
56
|
+
import styled from "styled-components";
|
|
57
|
+
import { SelectMenu } from "../../../../common/inputs";
|
|
58
|
+
import { MenuItem, addToast } from "../../../index";
|
|
59
|
+
import { useSpreadsheetContext } from "../../../../index";
|
|
60
|
+
import { useImporterContext } from "../../../../Importer/contexts/ImporterContextProvider";
|
|
61
|
+
import { useTranslation } from "react-i18next";
|
|
62
|
+
var Container = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
63
|
+
var StyledSelectMenu = styled(SelectMenu)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n .selectMenu[data-popper-placement^=\"bottom\"] {\n width: 320px !important;\n transform: translate(-199px, 21px);\n }\n"], ["\n .selectMenu[data-popper-placement^=\"bottom\"] {\n width: 320px !important;\n transform: translate(-199px, 21px);\n }\n"])));
|
|
64
|
+
export var CustomActions = function () {
|
|
65
|
+
var customActions = useImporterContext().customActions;
|
|
66
|
+
var _a = useSpreadsheetContext(), selectedRows = _a.selectedRows, data = _a.data, updateRecord = _a.updateRecord;
|
|
67
|
+
var _b = useState(null), referenceElement = _b[0], setReferenceElement = _b[1];
|
|
68
|
+
var _c = useState(false), isMenuOpen = _c[0], setIsMenuOpen = _c[1];
|
|
69
|
+
var t = useTranslation("review").t;
|
|
70
|
+
var filteredOptions = useMemo(function () {
|
|
71
|
+
return customActions.map(function (action) { return action.name; });
|
|
72
|
+
}, [customActions]);
|
|
73
|
+
var handleCustomAction = function (actionKey) { return __awaiter(void 0, void 0, void 0, function () {
|
|
74
|
+
var recordsToRunAction, recordsAfterActions, action, i, currentRecord, newRecord, error_1;
|
|
75
|
+
return __generator(this, function (_a) {
|
|
76
|
+
switch (_a.label) {
|
|
77
|
+
case 0:
|
|
78
|
+
recordsToRunAction = data.filter(function (row) { var _a; return selectedRows.includes((_a = row === null || row === void 0 ? void 0 : row._meta) === null || _a === void 0 ? void 0 : _a.id); });
|
|
79
|
+
recordsAfterActions = [];
|
|
80
|
+
action = customActions.find(function (action) { return action.name === actionKey; });
|
|
81
|
+
if (!action || Object.keys(action).length === 0) {
|
|
82
|
+
addToast(t("table_actions.custom_actions.general_error_toast"), "error");
|
|
83
|
+
return [2 /*return*/];
|
|
84
|
+
}
|
|
85
|
+
i = 0;
|
|
86
|
+
_a.label = 1;
|
|
87
|
+
case 1:
|
|
88
|
+
if (!(i < recordsToRunAction.length)) return [3 /*break*/, 7];
|
|
89
|
+
currentRecord = recordsToRunAction[i];
|
|
90
|
+
_a.label = 2;
|
|
91
|
+
case 2:
|
|
92
|
+
_a.trys.push([2, 5, , 6]);
|
|
93
|
+
if (!(action.actionType === "record")) return [3 /*break*/, 4];
|
|
94
|
+
return [4 /*yield*/, action.handler(currentRecord)];
|
|
95
|
+
case 3:
|
|
96
|
+
newRecord = _a.sent();
|
|
97
|
+
recordsAfterActions.push(newRecord);
|
|
98
|
+
return [3 /*break*/, 6];
|
|
99
|
+
case 4: return [3 /*break*/, 6];
|
|
100
|
+
case 5:
|
|
101
|
+
error_1 = _a.sent();
|
|
102
|
+
addToast(t("table_actions.custom_actions.error_toast", {
|
|
103
|
+
actionName: action.name,
|
|
104
|
+
}), "error");
|
|
105
|
+
return [3 /*break*/, 7];
|
|
106
|
+
case 6:
|
|
107
|
+
i++;
|
|
108
|
+
return [3 /*break*/, 1];
|
|
109
|
+
case 7:
|
|
110
|
+
if (recordsAfterActions.length) {
|
|
111
|
+
addToast(t("table_actions.custom_actions.success_toast", {
|
|
112
|
+
actionName: action.name,
|
|
113
|
+
}), "success");
|
|
114
|
+
}
|
|
115
|
+
updateRecord(recordsAfterActions);
|
|
116
|
+
return [2 /*return*/];
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
}); };
|
|
120
|
+
var onSelect = function (value) {
|
|
121
|
+
setIsMenuOpen(false);
|
|
122
|
+
handleCustomAction(value);
|
|
123
|
+
};
|
|
124
|
+
var handleMenuVisibility = function () {
|
|
125
|
+
setIsMenuOpen(function (oldValue) { return !oldValue; });
|
|
126
|
+
};
|
|
127
|
+
if (!filteredOptions.length || !selectedRows.length)
|
|
128
|
+
return null;
|
|
129
|
+
return (_jsxs(_Fragment, { children: [_jsxs(Container, __assign({ onClick: handleMenuVisibility, dflex: true, alignCenter: true, minw: 152, w100: true, pl: 20, pr: 20, pt: 6, pb: 6, ref: setReferenceElement, "data-testid": "ta-custom-actions" }, { children: [_jsx(ActionPlus, {}), _jsx(Div, __assign({ pl: 4, buttonTextSmall: true }, { children: t("table_actions.custom_actions.label") }))] })), isMenuOpen && (_jsx(StyledSelectMenu, __assign({ referenceElement: referenceElement, placement: "bottom", isOpen: isMenuOpen, onClose: function () { return setIsMenuOpen(false); }, selectMenuClassName: "selectMenu" }, { children: filteredOptions.map(function (option, index) { return (_jsx(Div, __assign({ "data-test-id": "autocomplete-menu-item" }, { children: _jsx(MenuItem, __assign({ id: "custom-action-option-".concat(option), onClick: function () { return onSelect(option); } }, { children: option })) }), index)); }) })))] }));
|
|
130
|
+
};
|
|
131
|
+
var templateObject_1, templateObject_2;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./CustomActions";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./CustomActions";
|
|
@@ -23,11 +23,12 @@ import { DeleteIcon, ConfirmationDeleteIcon } from "./icons";
|
|
|
23
23
|
import { Div } from "../../../styled/utils";
|
|
24
24
|
import { ActionButton } from "./TableActions.styles";
|
|
25
25
|
import { useTranslation } from "react-i18next";
|
|
26
|
+
import { addToast } from "../../../common/Toast";
|
|
26
27
|
var StyledTooltipProvider = styled(TooltipProvider)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: fit-content;\n"], ["\n width: fit-content;\n"])));
|
|
27
28
|
export var DeleteSelectedRows = function (_a) {
|
|
28
29
|
var _b = _a.testId, testId = _b === void 0 ? "ta-delete-rows" : _b;
|
|
29
30
|
var _c = useState(false), isConfirmationModalOpen = _c[0], setIsConfirmationModalOpen = _c[1];
|
|
30
|
-
var _d = useSpreadsheetContext(), deleteRecords = _d.deleteRecords, selectedRows = _d.selectedRows, setSelectedRows = _d.setSelectedRows, setFilteredInputValue = _d.setFilteredInputValue;
|
|
31
|
+
var _d = useSpreadsheetContext(), deleteRecords = _d.deleteRecords, selectedRows = _d.selectedRows, setSelectedRows = _d.setSelectedRows, setFilteredInputValue = _d.setFilteredInputValue, spreadsheetFilter = _d.spreadsheetFilter, duplicateRecords = _d.duplicateRecords, resetSpreadsheetFilter = _d.resetSpreadsheetFilter;
|
|
31
32
|
var t = useTranslation("review").t;
|
|
32
33
|
var toggleModalVisibility = function () {
|
|
33
34
|
setIsConfirmationModalOpen(function (oldValue) { return !oldValue; });
|
|
@@ -37,6 +38,13 @@ export var DeleteSelectedRows = function (_a) {
|
|
|
37
38
|
toggleModalVisibility();
|
|
38
39
|
setFilteredInputValue("");
|
|
39
40
|
deleteRecords(selectedRows);
|
|
41
|
+
if (spreadsheetFilter.byRow === "duplicates") {
|
|
42
|
+
var selectedDuplicatesCount = Object.keys(duplicateRecords.records).filter(function (key) { return selectedRows.includes(key); }).length;
|
|
43
|
+
addToast(t("table_actions.filters_by_rows.duplicates_deleted", {
|
|
44
|
+
count: selectedDuplicatesCount,
|
|
45
|
+
}), "success");
|
|
46
|
+
resetSpreadsheetFilter();
|
|
47
|
+
}
|
|
40
48
|
};
|
|
41
49
|
var DescriptionUI = function () { return (_jsx(_Fragment, { children: _jsxs(Div, { children: [t("table_actions.delete_rows.confirmation_modal", {
|
|
42
50
|
length: selectedRows.length,
|
|
@@ -7,7 +7,7 @@ import { addToast } from "../../../../common/Toast";
|
|
|
7
7
|
import { useState } from "react";
|
|
8
8
|
export var FilterByErrors = function () {
|
|
9
9
|
var _a, _b;
|
|
10
|
-
var _c = useSpreadsheetContext(), errors = _c.errors, fields = _c.fields, spreadsheetFilter = _c.spreadsheetFilter, resetSpreadsheetFilter = _c.resetSpreadsheetFilter, filterRecordsByFieldErrors = _c.filterRecordsByFieldErrors;
|
|
10
|
+
var _c = useSpreadsheetContext(), errors = _c.errors, fields = _c.fields, spreadsheetFilter = _c.spreadsheetFilter, resetSpreadsheetFilter = _c.resetSpreadsheetFilter, filterRecordsByFieldErrors = _c.filterRecordsByFieldErrors, isTransformTooltipOpened = _c.isTransformTooltipOpened;
|
|
11
11
|
var t = useTranslation("review").t;
|
|
12
12
|
var _d = useState(false), isMenuOpened = _d[0], setIsMenuOpened = _d[1];
|
|
13
13
|
var prefix = t("table_actions.filter_by_errors.filter_by_errors");
|
|
@@ -42,6 +42,6 @@ export var FilterByErrors = function () {
|
|
|
42
42
|
: isMenuOpened
|
|
43
43
|
? search_or_select
|
|
44
44
|
: prefix;
|
|
45
|
-
var isDisabled = errorArray.length === 0;
|
|
45
|
+
var isDisabled = errorArray.length === 0 || isTransformTooltipOpened;
|
|
46
46
|
return (_jsx(S.StyledAutocomplete, { placement: "bottom", placeholder: inputText, onToggle: function (v) { return !isDisabled && setIsMenuOpened(v); }, onChange: onChange, value: selectedErrorToFilter, options: errorArray, isDisabled: isDisabled, isInputDisabled: isDisabled, inputWidth: inputWidth, "data-testid": "ta-filter-by-errors", prefix: inputText }));
|
|
47
47
|
};
|
|
@@ -21,22 +21,26 @@ import { useTranslation } from "react-i18next";
|
|
|
21
21
|
var FilterContainer = styled(Div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 6px 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n ", ";\n ", "\n"], ["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 6px 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n ", ";\n ", "\n"])), function (p) { return p.theme.css.body3; }, function (p) {
|
|
22
22
|
return p.isSelected && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n border-radius: 4px;\n "], ["\n background: ", ";\n color: ", ";\n border-radius: 4px;\n "])), function (p) { return p.theme.colors.black; }, function (p) { return p.theme.colors.white; });
|
|
23
23
|
});
|
|
24
|
-
var Container = styled(Div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n
|
|
25
|
-
var
|
|
24
|
+
var Container = styled(Div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 4px;\n display: flex;\n"], ["\n background-color: ", ";\n border-radius: 4px;\n display: flex;\n"])), function (p) { return p.theme.colors.backgroundInterface; });
|
|
25
|
+
var Wrapper = styled(Div)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
26
|
+
var isDisabled = _a.isDisabled;
|
|
27
|
+
return isDisabled && css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n cursor: not-allowed;\n\n > div:first-child {\n opacity: 0.7;\n pointer-events: none;\n }\n "], ["\n cursor: not-allowed;\n\n > div:first-child {\n opacity: 0.7;\n pointer-events: none;\n }\n "])));
|
|
28
|
+
});
|
|
29
|
+
var FilteredDataCount = styled(Div)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 6px 8px;\n margin-left: -3px;\n border-top-right-radius: 4px;\n border-bottom-right-radius: 4px;\n"], ["\n background: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 6px 8px;\n margin-left: -3px;\n border-top-right-radius: 4px;\n border-bottom-right-radius: 4px;\n"])), function (p) { return p.theme.colors.highlight01; }, function (p) { return p.theme.colors.black; });
|
|
26
30
|
var Filter = function (_a) {
|
|
27
|
-
var label = _a.label, count = _a.count, isSelected = _a.isSelected, onClick = _a.onClick;
|
|
31
|
+
var label = _a.label, count = _a.count, isSelected = _a.isSelected, onClick = _a.onClick, isDisabled = _a.isDisabled;
|
|
28
32
|
var _b = useSpreadsheetContext(), filteredInputValue = _b.filteredInputValue, filteredDataCount = _b.filteredDataCount;
|
|
29
33
|
var labelToId = function (label) {
|
|
30
34
|
return label.toLowerCase().replace(/\s/g, "_") + "_filter";
|
|
31
35
|
};
|
|
32
|
-
return (_jsxs(Div, __assign({ dflex: true, clickable: true, onClick: onClick, "data-test-id": labelToId(label) }, { children: [_jsxs(FilterContainer, __assign({ isSelected: isSelected }, { children: [label, count >= 0 && _jsxs(_Fragment, { children: ["\u00A0(", count, ")"] })] })), isSelected && filteredInputValue !== "" && (_jsx(FilteredDataCount, { children: _jsx(Div, __assign({ minw: 14, centered: true }, { children: filteredDataCount })) }))] })));
|
|
36
|
+
return (_jsxs(Div, __assign({ disabledWhen: isDisabled, dflex: true, clickable: true, onClick: function () { return !isDisabled && onClick(); }, "data-test-id": labelToId(label) }, { children: [_jsxs(FilterContainer, __assign({ isSelected: isSelected }, { children: [label, count >= 0 && _jsxs(_Fragment, { children: ["\u00A0(", count, ")"] })] })), isSelected && filteredInputValue !== "" && (_jsx(FilteredDataCount, { children: _jsx(Div, __assign({ minw: 14, centered: true }, { children: filteredDataCount })) }))] })));
|
|
33
37
|
};
|
|
34
38
|
export var RowFilters = function () {
|
|
35
|
-
var _a = useSpreadsheetContext(), spreadsheetFilter = _a.spreadsheetFilter, errors = _a.errors, filterRecordsByRowType = _a.filterRecordsByRowType, recordsWithValuesCount = _a.recordsWithValuesCount;
|
|
39
|
+
var _a = useSpreadsheetContext(), spreadsheetFilter = _a.spreadsheetFilter, errors = _a.errors, filterRecordsByRowType = _a.filterRecordsByRowType, recordsWithValuesCount = _a.recordsWithValuesCount, isTransformTooltipOpened = _a.isTransformTooltipOpened, duplicateRecords = _a.duplicateRecords;
|
|
36
40
|
var t = useTranslation("review").t;
|
|
37
41
|
var all_rows = t("table_actions.filters_by_rows.all_rows");
|
|
38
|
-
var valid_rows = t("table_actions.filters_by_rows.valid_rows");
|
|
39
42
|
var invalid_rows = t("table_actions.filters_by_rows.invalid_rows");
|
|
40
|
-
|
|
43
|
+
var duplicates = t("table_actions.filters_by_rows.duplicates");
|
|
44
|
+
return (_jsx(Wrapper, __assign({ isDisabled: isTransformTooltipOpened }, { children: _jsxs(Container, { children: [_jsx(Filter, { isSelected: spreadsheetFilter.byRow === "all", label: all_rows, count: recordsWithValuesCount, onClick: function () { return filterRecordsByRowType("all"); } }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "invalid", label: invalid_rows, count: Object.values(errors).length, onClick: function () { return filterRecordsByRowType("invalid"); } }), _jsx(Filter, { isSelected: spreadsheetFilter.byRow === "duplicates", label: duplicates, count: duplicateRecords.count, onClick: function () { return filterRecordsByRowType("duplicates"); } })] }) })));
|
|
41
45
|
};
|
|
42
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
46
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -23,7 +23,8 @@ import { colors } from "../../../styled/theme/colorPalette";
|
|
|
23
23
|
import { textStyles } from "../../../styled/theme/textStyles";
|
|
24
24
|
import { TooltipProvider } from "../../../common/TooltipProvider";
|
|
25
25
|
import { useTranslation } from "react-i18next";
|
|
26
|
-
|
|
26
|
+
import { Div } from "../../../styled";
|
|
27
|
+
var Wrapper = styled(Div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background: ", ";\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n gap: 8px;\n height: 24px;\n overflow: hidden;\n padding: 8px;\n position: relative;\n transition: width 0.25s ease-in-out;\n width: ", ";\n"], ["\n background: ", ";\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n gap: 8px;\n height: 24px;\n overflow: hidden;\n padding: 8px;\n position: relative;\n transition: width 0.25s ease-in-out;\n width: ", ";\n"])), function (_a) {
|
|
27
28
|
var isOpen = _a.isOpen;
|
|
28
29
|
return (isOpen ? colors.orange50 : "none");
|
|
29
30
|
}, function (_a) {
|
|
@@ -36,7 +37,7 @@ var Input = styled.input(templateObject_4 || (templateObject_4 = __makeTemplateO
|
|
|
36
37
|
return !isOpen && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n position: absolute;\n top: -9999px;\n "], ["\n position: absolute;\n top: -9999px;\n "])));
|
|
37
38
|
});
|
|
38
39
|
var SearchInput = function (_a) {
|
|
39
|
-
var testId = _a.testId, value = _a.value, onChange = _a.onChange;
|
|
40
|
+
var testId = _a.testId, value = _a.value, onChange = _a.onChange, isDisabled = _a.isDisabled;
|
|
40
41
|
var _b = useDebounce(value, onChange, 300), _value = _b._value, set_Value = _b.set_Value;
|
|
41
42
|
var inputRef = useRef(null);
|
|
42
43
|
var _c = useState(false), isOpen = _c[0], setIsOpen = _c[1];
|
|
@@ -59,14 +60,14 @@ var SearchInput = function (_a) {
|
|
|
59
60
|
}
|
|
60
61
|
}
|
|
61
62
|
};
|
|
62
|
-
return (_jsx(TooltipProvider, __assign({ tooltip: !isOpen ? t("table_actions.search_rows.tooltip") : "", placement: "right", flip: false, centered: true, w: "auto", "data-testid": testId }, { children: _jsxs(Wrapper, __assign({ isOpen: isOpen, onClick: handleWrapperClick }, { children: [_jsx(IconWrapper, { children: _jsx(SearchIcon, {}) }), _jsx(Input, { isOpen: isOpen, ref: inputRef, value: _value, onChange: handleInputChange, onBlur: handleInputOnBlur, type: "text", placeholder: t("table_actions.search_rows.placeholder") })] })) })));
|
|
63
|
+
return (_jsx(TooltipProvider, __assign({ tooltip: !isOpen && !isDisabled ? t("table_actions.search_rows.tooltip") : "", placement: "right", flip: false, centered: true, w: "auto", "data-testid": testId }, { children: _jsxs(Wrapper, __assign({ isOpen: isOpen, onClick: function () { return !isDisabled && handleWrapperClick(); }, disabledWhen: isDisabled }, { children: [_jsx(IconWrapper, { children: _jsx(SearchIcon, {}) }), _jsx(Input, { isOpen: isOpen, ref: inputRef, value: _value, onChange: handleInputChange, onBlur: handleInputOnBlur, type: "text", placeholder: t("table_actions.search_rows.placeholder") })] })) })));
|
|
63
64
|
};
|
|
64
65
|
export var SearchRows = function (_a) {
|
|
65
66
|
var _b = _a.testId, testId = _b === void 0 ? "ta-search-rows" : _b;
|
|
66
|
-
var _c = useSpreadsheetContext(), filteredInputValue = _c.filteredInputValue, setFilteredInputValue = _c.setFilteredInputValue;
|
|
67
|
+
var _c = useSpreadsheetContext(), filteredInputValue = _c.filteredInputValue, setFilteredInputValue = _c.setFilteredInputValue, isTransformTooltipOpened = _c.isTransformTooltipOpened;
|
|
67
68
|
var handleChangeInputValue = function (value) {
|
|
68
69
|
setFilteredInputValue(value);
|
|
69
70
|
};
|
|
70
|
-
return (_jsx(SearchInput, { testId: testId, value: filteredInputValue, onChange: handleChangeInputValue }));
|
|
71
|
+
return (_jsx(SearchInput, { testId: testId, value: filteredInputValue, onChange: handleChangeInputValue, isDisabled: isTransformTooltipOpened }));
|
|
71
72
|
};
|
|
72
73
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -29,7 +29,8 @@ import * as S from "./TableActions.styles";
|
|
|
29
29
|
import { FilterByErrors } from "./FilterByErrors/FilterByErrors";
|
|
30
30
|
import { RowFilters } from "./RowFilters";
|
|
31
31
|
import { TransformedRecordsCount } from "./TransformedRecordsCount";
|
|
32
|
+
import { CustomActions } from "./CustomActions";
|
|
32
33
|
export var TableActions = function (_a) {
|
|
33
34
|
var _b = _a.tableActionsHeight, tableActionsHeight = _b === void 0 ? defaultTableActionsHeightPx : _b, props = __rest(_a, ["tableActionsHeight"]);
|
|
34
|
-
return (_jsxs(S.TableActionsContainer, __assign({ height: tableActionsHeight }, props, { children: [_jsxs(S.TableActionsContent, { children: [_jsx(SearchRows, {}), _jsx(RowFilters, {}), _jsx(FilterByErrors, {}), _jsxs(S.ButtonActionsContainer, { children: [_jsx(DeleteSelectedRows, {}), _jsx(ExportData, {})] })] }), _jsx(S.TableActionsInformations, { children: _jsx(TransformedRecordsCount, {}) })] })));
|
|
35
|
+
return (_jsxs(S.TableActionsContainer, __assign({ height: tableActionsHeight }, props, { children: [_jsxs(S.TableActionsContent, { children: [_jsx(SearchRows, {}), _jsx(RowFilters, {}), _jsx(FilterByErrors, {}), _jsxs(S.ButtonActionsContainer, { children: [_jsx(DeleteSelectedRows, {}), _jsx(ExportData, {}), _jsx(CustomActions, {})] })] }), _jsx(S.TableActionsInformations, { children: _jsx(TransformedRecordsCount, {}) })] })));
|
|
35
36
|
};
|
|
@@ -15,3 +15,4 @@ export var ConfirmationDeleteIcon = (_jsxs("svg", __assign({ width: "68", height
|
|
|
15
15
|
export var SearchIcon = function () { return (_jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M11 20C15.9706 20 20 15.9706 20 11C20 6.02944 15.9706 2 11 2C6.02944 2 2 6.02944 2 11C2 15.9706 6.02944 20 11 20Z", stroke: "#262626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M21 21L18 18", stroke: "#262626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] }))); };
|
|
16
16
|
export var DownloadIcon = function () { return (_jsxs("svg", __assign({ width: "36", height: "36", viewBox: "0 0 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M10.0834 18C9.66675 16.75 9.66675 15.5 9.66675 14.6303C9.66675 11.7319 12.2621 8.83337 15.4637 8.83337C17.6094 8.83337 19.4828 9.99914 20.4852 11.7319H21.2607C23.6619 11.7319 25.9167 13.4167 25.9167 15.5C25.9167 16.3334 25.9167 17.1667 25.5001 18", stroke: "#262626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M14.1807 23.2764L17.5834 26.5416L20.9862 23.2764", stroke: "#262626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M17.5833 25.6827L17.5833 16.4375", stroke: "#262626", strokeWidth: "2", strokeLinecap: "round" })] }))); };
|
|
17
17
|
export var CheckIcon = function () { return (_jsxs("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "53", height: "53", viewBox: "0 0 53 53", fill: "none" }, { children: [_jsx("rect", { width: "53", height: "53", fill: "white" }), _jsx("g", __assign({ style: { mixBlendMode: "multiply" } }, { children: _jsx("path", { d: "M40.6023 5.38665C41.3381 4.56281 42.6024 4.49142 43.4263 5.22719L51.5083 12.4453C52.3321 13.181 52.4035 14.4454 51.6677 15.2692L23.539 46.7647C22.8032 47.5885 21.5389 47.6599 20.7151 46.9242L12.6331 39.7061C11.8092 38.9703 11.7378 37.706 12.4736 36.8822L40.6023 5.38665Z", fill: "url(#paint0_linear_643_341)" }) })), _jsx("g", __assign({ style: { mixBlendMode: "darken" } }, { children: _jsx("rect", { x: "32.0707", y: "37.1587", width: "14.836", height: "29.7113", rx: "2", transform: "rotate(131.582 32.0707 37.1587)", fill: "url(#paint1_linear_643_341)" }) })), _jsxs("defs", { children: [_jsxs("linearGradient", __assign({ id: "paint0_linear_643_341", x1: "15.4625", y1: "39.0861", x2: "31.139", y2: "48.4231", gradientUnits: "userSpaceOnUse" }, { children: [_jsx("stop", { stopColor: "#D0A617" }), _jsx("stop", { offset: "1", stopColor: "#FEE18F" })] })), _jsxs("linearGradient", __assign({ id: "paint1_linear_643_341", x1: "39.4887", y1: "37.1587", x2: "29.9147", y2: "74.1394", gradientUnits: "userSpaceOnUse" }, { children: [_jsx("stop", { stopColor: "#6BEEFF" }), _jsx("stop", { offset: "1", stopColor: "#08CABE" })] }))] })] }))); };
|
|
18
|
+
export var ActionPlus = function () { return (_jsx("svg", __assign({ width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsxs("g", __assign({ id: "Actions Plus" }, { children: [_jsx("path", { id: "Vector 4", d: "M8 2.91602V14.916", stroke: "#909090", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { id: "Vector 5", d: "M2 8.91602L14 8.91602", stroke: "#909090", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] })) }))); };
|
|
@@ -67,18 +67,10 @@ var integerTransformations = [
|
|
|
67
67
|
label: "Ceiling (e.g. 3.01 -> 4)",
|
|
68
68
|
},
|
|
69
69
|
];
|
|
70
|
-
var enumTransformations = [
|
|
71
|
-
{
|
|
72
|
-
value: "autodetect",
|
|
73
|
-
label: "Autodetect (e.g. 0/1 -> true/false)",
|
|
74
|
-
isDefaultTransformation: true,
|
|
75
|
-
},
|
|
76
|
-
];
|
|
77
70
|
export var transformationsByColumnType = {
|
|
78
71
|
string: stringTransformations,
|
|
79
72
|
integer: integerTransformations,
|
|
80
73
|
float: floatTransformations,
|
|
81
|
-
enum: enumTransformations,
|
|
82
74
|
url: urlTransformations,
|
|
83
75
|
date: commonDateAndTimeTransformations,
|
|
84
76
|
datetime: commonDateAndTimeTransformations,
|
|
@@ -9,6 +9,7 @@ type Props = {
|
|
|
9
9
|
children: any;
|
|
10
10
|
placement?: Placement;
|
|
11
11
|
referenceElement: any;
|
|
12
|
+
selectMenuClassName?: string;
|
|
12
13
|
} & DivCSSProps;
|
|
13
|
-
export declare const SelectMenu: ({ isOpen, onClose, placement, referenceElement, children, ...props }: Props) => JSX.Element;
|
|
14
|
+
export declare const SelectMenu: ({ isOpen, onClose, placement, referenceElement, children, selectMenuClassName, ...props }: Props) => JSX.Element;
|
|
14
15
|
export {};
|
|
@@ -35,14 +35,18 @@ export var SelectMenuScrollArea = styled(Div)(function (_a) {
|
|
|
35
35
|
var _b = _a.theme, colors = _b.colors, c = _b.css;
|
|
36
36
|
return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding: 16px;\n overflow-y: auto;\n max-height: 250px;\n ", ";\n "], ["\n padding: 16px;\n overflow-y: auto;\n max-height: 250px;\n ", ";\n "])), function (p) { return p.theme.css.scrollbarDark; });
|
|
37
37
|
});
|
|
38
|
+
var isFirefox = navigator.userAgent.indexOf("Firefox") > -1;
|
|
38
39
|
export var SelectMenu = function (_a) {
|
|
39
40
|
var _b;
|
|
40
|
-
var _c = _a.isOpen, isOpen = _c === void 0 ? false : _c, _d = _a.onClose, onClose = _d === void 0 ? null : _d, _e = _a.placement, placement = _e === void 0 ? "auto" : _e, referenceElement = _a.referenceElement, children = _a.children, props = __rest(_a, ["isOpen", "onClose", "placement", "referenceElement", "children"]);
|
|
41
|
+
var _c = _a.isOpen, isOpen = _c === void 0 ? false : _c, _d = _a.onClose, onClose = _d === void 0 ? null : _d, _e = _a.placement, placement = _e === void 0 ? "auto" : _e, referenceElement = _a.referenceElement, children = _a.children, selectMenuClassName = _a.selectMenuClassName, props = __rest(_a, ["isOpen", "onClose", "placement", "referenceElement", "children", "selectMenuClassName"]);
|
|
41
42
|
var _f = useState(null), popperElement = _f[0], setPopperElement = _f[1];
|
|
42
43
|
var _g = useState(null), width = _g[0], setWidth = _g[1];
|
|
43
44
|
var options = {
|
|
44
45
|
placement: placement,
|
|
45
|
-
|
|
46
|
+
// On Firefox we use absolute positioning because fixed positioning
|
|
47
|
+
// doesn't seem to work well with the select menu (more info in PR)
|
|
48
|
+
// may be related to https://github.com/floating-ui/floating-ui/issues/1729
|
|
49
|
+
strategy: isFirefox ? "absolute" : "fixed",
|
|
46
50
|
modifiers: [
|
|
47
51
|
{
|
|
48
52
|
name: "offset",
|
|
@@ -69,6 +73,6 @@ export var SelectMenu = function (_a) {
|
|
|
69
73
|
if (referenceElement)
|
|
70
74
|
setWidth(referenceElementWidth);
|
|
71
75
|
}, [referenceElementWidth]);
|
|
72
|
-
return (_jsx(_Fragment, { children: isOpen && (_jsxs(Div, __assign({
|
|
76
|
+
return (_jsx(_Fragment, { children: isOpen && (_jsxs(Div, __assign({}, props, { children: [_jsx(SelectMenuBackdrop, { onClick: onClose }), _jsx(SelectMenuDiv, __assign({ ref: setPopperElement, style: __assign(__assign({}, styles.popper), { width: width }), className: selectMenuClassName }, attributes.popper, { children: _jsx(SelectMenuScrollArea, { children: children }) }))] }))) }));
|
|
73
77
|
};
|
|
74
78
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -63,7 +63,7 @@ var TextInput = function (_a) {
|
|
|
63
63
|
id: id,
|
|
64
64
|
padding: padding,
|
|
65
65
|
name: name,
|
|
66
|
-
}, { type: isPasswordVisible ? "text" : type, value: _value || "", onChange: function (_a) {
|
|
66
|
+
}, { autoComplete: "off", type: isPasswordVisible ? "text" : type, value: _value || "", onChange: function (_a) {
|
|
67
67
|
var value = _a.target.value;
|
|
68
68
|
return set_Value(value);
|
|
69
69
|
}, ref: setInputRef, onBlur: function () {
|
package/lib/esm/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ColumnRequiredProps, EnvironmentType, FieldTypesAsUnion, FormatRecord, ImporterOptions, OnSubmit, OnValidateRecord, Record } from "./types";
|
|
1
|
+
import { ColumnRequiredProps, CustomAction, CustomActionTypes, EnvironmentType, FieldTypesAsUnion, FormatRecord, ImporterOptions, OnSubmit, OnValidateRecord, Record } from "./types";
|
|
2
2
|
declare class FuseImporter {
|
|
3
3
|
apiToken: string;
|
|
4
4
|
templateSlug: string;
|
|
@@ -8,6 +8,7 @@ declare class FuseImporter {
|
|
|
8
8
|
records: Record[];
|
|
9
9
|
constructor(apiToken: string, templateSlug: string, options?: ImporterOptions);
|
|
10
10
|
private dynamicColumns;
|
|
11
|
+
private customActions;
|
|
11
12
|
private cleanupIframe;
|
|
12
13
|
formatRecord: FormatRecord;
|
|
13
14
|
onValidateRecord: OnValidateRecord;
|
|
@@ -17,6 +18,7 @@ declare class FuseImporter {
|
|
|
17
18
|
close(): void;
|
|
18
19
|
show(): Promise<void>;
|
|
19
20
|
addColumn<T extends FieldTypesAsUnion>(columnData: ColumnRequiredProps<T>): void;
|
|
21
|
+
addCustomAction<T extends CustomActionTypes>(actions: CustomAction<T>[] | CustomAction<T>): void;
|
|
20
22
|
private renderImporterComponent;
|
|
21
23
|
private createDivComponent;
|
|
22
24
|
private createIframe;
|
package/lib/esm/index.js
CHANGED
|
@@ -68,6 +68,7 @@ var FuseImporter = /** @class */ (function () {
|
|
|
68
68
|
function FuseImporter(apiToken, templateSlug, options) {
|
|
69
69
|
if (options === void 0) { options = {}; }
|
|
70
70
|
this.dynamicColumns = [];
|
|
71
|
+
this.customActions = [];
|
|
71
72
|
this.cleanupIframe = null;
|
|
72
73
|
this.windowScrollPosition = {
|
|
73
74
|
x: 0,
|
|
@@ -139,6 +140,12 @@ var FuseImporter = /** @class */ (function () {
|
|
|
139
140
|
};
|
|
140
141
|
this.dynamicColumns.push(column);
|
|
141
142
|
};
|
|
143
|
+
FuseImporter.prototype.addCustomAction = function (actions) {
|
|
144
|
+
var _a;
|
|
145
|
+
if (!Array.isArray(actions))
|
|
146
|
+
actions = [actions];
|
|
147
|
+
(_a = this.customActions).push.apply(_a, actions);
|
|
148
|
+
};
|
|
142
149
|
FuseImporter.prototype.renderImporterComponent = function () {
|
|
143
150
|
var importerDiv = this.createDivComponent();
|
|
144
151
|
var importerComponent = this.createImporterComponent();
|
|
@@ -160,9 +167,9 @@ var FuseImporter = /** @class */ (function () {
|
|
|
160
167
|
};
|
|
161
168
|
FuseImporter.prototype.createImporterComponent = function () {
|
|
162
169
|
var _this = this;
|
|
163
|
-
return (_jsx(Importer, { apiToken: this.apiToken, templateSlug: this.templateSlug, options: this.options, formatRecord: this.formatRecord, onValidateRecord: this.onValidateRecord, onSubmit: this.onSubmit, onClose: function () {
|
|
170
|
+
return (_jsx(Importer, { apiToken: this.apiToken, templateSlug: this.templateSlug, options: this.options, formatRecord: this.formatRecord, onValidateRecord: this.onValidateRecord, dynamicColumns: this.dynamicColumns, customActions: this.customActions, onSubmit: this.onSubmit, onClose: function () {
|
|
164
171
|
_this.close();
|
|
165
|
-
}
|
|
172
|
+
} }));
|
|
166
173
|
};
|
|
167
174
|
FuseImporter.prototype.configureIframe = function (iframe, importerComponent) {
|
|
168
175
|
var onLoadCallback = function () {
|
package/lib/esm/locales/de.d.ts
CHANGED
|
@@ -57,8 +57,9 @@ declare const _default: {
|
|
|
57
57
|
table_actions: {
|
|
58
58
|
filters_by_rows: {
|
|
59
59
|
all_rows: string;
|
|
60
|
-
valid_rows: string;
|
|
61
60
|
invalid_rows: string;
|
|
61
|
+
duplicates: string;
|
|
62
|
+
duplicates_deleted: string;
|
|
62
63
|
};
|
|
63
64
|
search_rows: {
|
|
64
65
|
tooltip: string;
|
|
@@ -83,6 +84,12 @@ declare const _default: {
|
|
|
83
84
|
example: string;
|
|
84
85
|
auto_corrections_amount: string;
|
|
85
86
|
};
|
|
87
|
+
custom_actions: {
|
|
88
|
+
label: string;
|
|
89
|
+
general_error_toast: string;
|
|
90
|
+
error_toast: string;
|
|
91
|
+
success_toast: string;
|
|
92
|
+
};
|
|
86
93
|
};
|
|
87
94
|
};
|
|
88
95
|
general: {
|
package/lib/esm/locales/de.js
CHANGED
|
@@ -58,8 +58,9 @@ export default {
|
|
|
58
58
|
table_actions: {
|
|
59
59
|
filters_by_rows: {
|
|
60
60
|
all_rows: "Alle Zeilen",
|
|
61
|
-
valid_rows: "Gültige Zeilen",
|
|
62
61
|
invalid_rows: "Ungültige Zeilen",
|
|
62
|
+
duplicates: "Gültige",
|
|
63
|
+
duplicates_deleted: "{{count}} duplikate gelöscht",
|
|
63
64
|
},
|
|
64
65
|
search_rows: {
|
|
65
66
|
tooltip: "Etwas suchen",
|
|
@@ -84,6 +85,12 @@ export default {
|
|
|
84
85
|
example: "Beispiel",
|
|
85
86
|
auto_corrections_amount: "Wir haben {{amount}} Probleme automatisch korrigiert.",
|
|
86
87
|
},
|
|
88
|
+
custom_actions: {
|
|
89
|
+
label: "Weitere Aktionen",
|
|
90
|
+
general_error_toast: "Die Aktion konnte nicht ausgeführt werden. Bitte versuchen Sie es erneut.",
|
|
91
|
+
error_toast: 'Beim Ausführen der Aktion "{{actionName}}" auf den ausgewählten Zeilen ist ein Fehler aufgetreten. Bitte überprüfen Sie die Code-Implementierung und versuchen Sie es erneut.',
|
|
92
|
+
success_toast: 'Die Aktion "{{actionName}}" wurde erfolgreich auf den ausgewählten Zeilen ausgeführt.',
|
|
93
|
+
},
|
|
87
94
|
},
|
|
88
95
|
},
|
|
89
96
|
general: {
|
package/lib/esm/locales/en.d.ts
CHANGED
|
@@ -57,8 +57,9 @@ declare const _default: {
|
|
|
57
57
|
table_actions: {
|
|
58
58
|
filters_by_rows: {
|
|
59
59
|
all_rows: string;
|
|
60
|
-
valid_rows: string;
|
|
61
60
|
invalid_rows: string;
|
|
61
|
+
duplicates: string;
|
|
62
|
+
duplicates_deleted: string;
|
|
62
63
|
};
|
|
63
64
|
search_rows: {
|
|
64
65
|
tooltip: string;
|
|
@@ -83,6 +84,12 @@ declare const _default: {
|
|
|
83
84
|
example: string;
|
|
84
85
|
auto_corrections_amount: string;
|
|
85
86
|
};
|
|
87
|
+
custom_actions: {
|
|
88
|
+
label: string;
|
|
89
|
+
general_error_toast: string;
|
|
90
|
+
error_toast: string;
|
|
91
|
+
success_toast: string;
|
|
92
|
+
};
|
|
86
93
|
};
|
|
87
94
|
};
|
|
88
95
|
general: {
|
package/lib/esm/locales/en.js
CHANGED
|
@@ -58,8 +58,9 @@ export default {
|
|
|
58
58
|
table_actions: {
|
|
59
59
|
filters_by_rows: {
|
|
60
60
|
all_rows: "All Rows",
|
|
61
|
-
valid_rows: "Valid Rows",
|
|
62
61
|
invalid_rows: "Invalid Rows",
|
|
62
|
+
duplicates: "Duplicates",
|
|
63
|
+
duplicates_deleted: "{{count}} duplicates deleted",
|
|
63
64
|
},
|
|
64
65
|
search_rows: {
|
|
65
66
|
tooltip: "Search something",
|
|
@@ -84,6 +85,12 @@ export default {
|
|
|
84
85
|
example: "Example",
|
|
85
86
|
auto_corrections_amount: "We have auto-corrected {{amount}} issues.",
|
|
86
87
|
},
|
|
88
|
+
custom_actions: {
|
|
89
|
+
label: "More actions",
|
|
90
|
+
general_error_toast: "It was not possible to run the action. Please try again.",
|
|
91
|
+
error_toast: 'Error occurred while running action "{{actionName}} on selected rows". Please check the code implementation and try again.',
|
|
92
|
+
success_toast: 'Action "{{actionName}}" was executed successfully on the selected rows.',
|
|
93
|
+
},
|
|
87
94
|
},
|
|
88
95
|
},
|
|
89
96
|
general: {
|