@knovator/pagecreator-admin 0.8.0 → 0.8.1
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/index.cjs +12 -61
- package/index.js +12 -61
- package/package.json +1 -1
- package/src/lib/api/list.d.ts +0 -4
- package/src/lib/constants/common.d.ts +0 -2
- package/src/lib/context/WidgetContext.d.ts +1 -1
- package/src/lib/hooks/useWidget.d.ts +2 -3
- package/src/lib/types/api.d.ts +1 -5
- package/src/lib/types/context.d.ts +1 -2
package/index.cjs
CHANGED
|
@@ -1758,8 +1758,6 @@ const TRANSLATION_PAIRS_WIDGET = {
|
|
|
1758
1758
|
'widget.widgetTitleInfo': 'HTML is supported',
|
|
1759
1759
|
'widget.minPerRow': 'Value must be greater than zero',
|
|
1760
1760
|
'widget.actionsLabel': 'Actions',
|
|
1761
|
-
'widget.category': 'Category',
|
|
1762
|
-
'widget.categoryPlaceholder': 'Select Category',
|
|
1763
1761
|
'widget.tabNameRequired': 'Tab Name is required'
|
|
1764
1762
|
};
|
|
1765
1763
|
const TRANSLATION_PAIRS_ITEM = {
|
|
@@ -2694,12 +2692,6 @@ const apiList = {
|
|
|
2694
2692
|
url: `${prefix}/collection-data`,
|
|
2695
2693
|
method: 'POST'
|
|
2696
2694
|
}),
|
|
2697
|
-
CATEGORIES: ({
|
|
2698
|
-
prefix
|
|
2699
|
-
}) => ({
|
|
2700
|
-
url: `${prefix}/categories`,
|
|
2701
|
-
method: 'GET'
|
|
2702
|
-
}),
|
|
2703
2695
|
// Image Upload API
|
|
2704
2696
|
IMAGE_UPLOAD: ({
|
|
2705
2697
|
prefix
|
|
@@ -4518,7 +4510,6 @@ const useWidget = ({
|
|
|
4518
4510
|
const [formState, setFormState] = React.useState();
|
|
4519
4511
|
const [itemsTypes, setItemsTypes] = React.useState([]);
|
|
4520
4512
|
const [widgetTypes, setWidgetTypes] = React.useState([]);
|
|
4521
|
-
const [categories, setCategories] = React.useState([]);
|
|
4522
4513
|
const [collectionDataLoading, setCollectionDataLoading] = React.useState(false);
|
|
4523
4514
|
const [collectionData, setCollectionData] = React.useState([]);
|
|
4524
4515
|
const {
|
|
@@ -4697,27 +4688,6 @@ const useWidget = ({
|
|
|
4697
4688
|
}
|
|
4698
4689
|
setLoading(false);
|
|
4699
4690
|
});
|
|
4700
|
-
const getCategories = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
4701
|
-
if ((categories === null || categories === void 0 ? void 0 : categories.length) > 0) return;
|
|
4702
|
-
setLoading(true);
|
|
4703
|
-
const api = getApiType({
|
|
4704
|
-
routes,
|
|
4705
|
-
action: 'CATEGORIES',
|
|
4706
|
-
prefix: widgetRoutesPrefix
|
|
4707
|
-
});
|
|
4708
|
-
const response = yield commonApi({
|
|
4709
|
-
baseUrl,
|
|
4710
|
-
token,
|
|
4711
|
-
method: api.method,
|
|
4712
|
-
url: api.url,
|
|
4713
|
-
onError: handleError(CALLBACK_CODES.GET_ALL)
|
|
4714
|
-
});
|
|
4715
|
-
if ((response === null || response === void 0 ? void 0 : response.code) === 'SUCCESS') {
|
|
4716
|
-
setLoading(false);
|
|
4717
|
-
return setCategories(dataGatter(response));
|
|
4718
|
-
}
|
|
4719
|
-
setLoading(false);
|
|
4720
|
-
});
|
|
4721
4691
|
const getCollectionData = (collectionName, search, callback, collectionItems) => __awaiter(void 0, void 0, void 0, function* () {
|
|
4722
4692
|
setCollectionDataLoading(true);
|
|
4723
4693
|
const api = getApiType({
|
|
@@ -4820,7 +4790,6 @@ const useWidget = ({
|
|
|
4820
4790
|
if (state === 'ADD' || state === 'UPDATE') {
|
|
4821
4791
|
getWidgetsTypes();
|
|
4822
4792
|
getWidgetTypes();
|
|
4823
|
-
getCategories();
|
|
4824
4793
|
}
|
|
4825
4794
|
// get Item data if widget is updating
|
|
4826
4795
|
if (state === 'UPDATE' && data) {
|
|
@@ -4915,7 +4884,6 @@ const useWidget = ({
|
|
|
4915
4884
|
// Form
|
|
4916
4885
|
formState,
|
|
4917
4886
|
itemData,
|
|
4918
|
-
categories,
|
|
4919
4887
|
onChangeFormState,
|
|
4920
4888
|
onCloseForm,
|
|
4921
4889
|
onWidgetFormSubmit,
|
|
@@ -6025,7 +5993,6 @@ const WidgetContextProvider = ({
|
|
|
6025
5993
|
onImageRemove: _onImageRemove = id => __awaiter(void 0, void 0, void 0, function* () {}),
|
|
6026
5994
|
itemsTypes: _itemsTypes = [],
|
|
6027
5995
|
widgetTypes: _widgetTypes = [],
|
|
6028
|
-
categories: _categories = [],
|
|
6029
5996
|
getCollectionData: _getCollectionData = () => Promise.resolve(),
|
|
6030
5997
|
collectionDataLoading: _collectionDataLoading = false,
|
|
6031
5998
|
collectionData: _collectionData = [],
|
|
@@ -6073,7 +6040,6 @@ const WidgetContextProvider = ({
|
|
|
6073
6040
|
onImageRemove: _onImageRemove,
|
|
6074
6041
|
onPartialUpdateWidget: _onPartialUpdateWidget,
|
|
6075
6042
|
itemsTypes: _itemsTypes,
|
|
6076
|
-
categories: _categories,
|
|
6077
6043
|
widgetTypes: _widgetTypes,
|
|
6078
6044
|
getCollectionData: _getCollectionData,
|
|
6079
6045
|
collectionDataLoading: _collectionDataLoading,
|
|
@@ -6756,7 +6722,6 @@ const Tabs = ({
|
|
|
6756
6722
|
};
|
|
6757
6723
|
|
|
6758
6724
|
const constants = {
|
|
6759
|
-
categoryTypeAccessor: 'category',
|
|
6760
6725
|
widgetTypeAccessor: 'widgetType',
|
|
6761
6726
|
itemTypeAccessor: 'itemsType',
|
|
6762
6727
|
collectionNameAccessor: 'collectionName',
|
|
@@ -6800,7 +6765,6 @@ const WidgetForm = ({
|
|
|
6800
6765
|
canUpdate,
|
|
6801
6766
|
formState,
|
|
6802
6767
|
itemsTypes,
|
|
6803
|
-
categories,
|
|
6804
6768
|
widgetTypes,
|
|
6805
6769
|
loading,
|
|
6806
6770
|
onWidgetFormSubmit,
|
|
@@ -6824,7 +6788,8 @@ const WidgetForm = ({
|
|
|
6824
6788
|
const [tabCollectionItemsUpdated, setTabCollectionItemsUpdated] = React.useState([]);
|
|
6825
6789
|
React.useEffect(() => {
|
|
6826
6790
|
if (data && formState === 'UPDATE') {
|
|
6827
|
-
|
|
6791
|
+
const widgetType = widgetTypes.find(type => type.value === (data === null || data === void 0 ? void 0 : data.widgetType));
|
|
6792
|
+
setSelectedWidgetType(widgetType);
|
|
6828
6793
|
if ((data === null || data === void 0 ? void 0 : data.itemsType) === 'Image') {
|
|
6829
6794
|
setItemsEnabled(true);
|
|
6830
6795
|
} else {
|
|
@@ -6834,7 +6799,7 @@ const WidgetForm = ({
|
|
|
6834
6799
|
setSelectedCollectionType(itemsTypes.find(item => item.value === (data === null || data === void 0 ? void 0 : data.collectionName)));
|
|
6835
6800
|
}
|
|
6836
6801
|
}
|
|
6837
|
-
}, [data, formState, itemsTypes]);
|
|
6802
|
+
}, [data, formState, itemsTypes, widgetTypes]);
|
|
6838
6803
|
React.useEffect(() => {
|
|
6839
6804
|
if (formState === 'ADD') {
|
|
6840
6805
|
setSelectedCollectionItems([]);
|
|
@@ -6912,13 +6877,11 @@ const WidgetForm = ({
|
|
|
6912
6877
|
const getFirstWidgetTypeValue = React.useCallback(() => {
|
|
6913
6878
|
return widgetTypes[0].value;
|
|
6914
6879
|
}, [widgetTypes]);
|
|
6915
|
-
const getFirstCategoryValue = React.useCallback(() => {
|
|
6916
|
-
return categories[0].value;
|
|
6917
|
-
}, [categories]);
|
|
6918
6880
|
// Widget Form Functions
|
|
6919
6881
|
const onWidgetFormInputChange = React.useCallback((value, name) => {
|
|
6920
6882
|
if (name === 'widgetType') {
|
|
6921
|
-
|
|
6883
|
+
const widgetType = widgetTypes.find(type => type.value === value[name]);
|
|
6884
|
+
setSelectedWidgetType(widgetType);
|
|
6922
6885
|
if (value[name] === 'Tabs') {
|
|
6923
6886
|
const firstItemType = getFirstItemTypeValue(value[name]);
|
|
6924
6887
|
if (firstItemType) {
|
|
@@ -6937,13 +6900,10 @@ const WidgetForm = ({
|
|
|
6937
6900
|
} else if ((name === null || name === void 0 ? void 0 : name.includes(constants.tabsAccessor)) && Array.isArray(value[constants.tabsAccessor])) {
|
|
6938
6901
|
setTabCollectionItems(value[constants.tabsAccessor].map(tabItem => tabItem[constants.tabCollectionItemsAccessor]));
|
|
6939
6902
|
}
|
|
6940
|
-
}, [getFirstItemTypeValue, itemsTypes]);
|
|
6903
|
+
}, [getFirstItemTypeValue, itemsTypes, widgetTypes]);
|
|
6941
6904
|
const onFormSubmit = data => {
|
|
6942
6905
|
var _a, _b;
|
|
6943
6906
|
const formData = Object.assign({}, data);
|
|
6944
|
-
if (!formData[constants.categoryTypeAccessor] && categories && categories.length > 0) {
|
|
6945
|
-
formData[constants.categoryTypeAccessor] = getFirstCategoryValue();
|
|
6946
|
-
}
|
|
6947
6907
|
// setting widget type if undefined
|
|
6948
6908
|
if (!formData[constants.widgetTypeAccessor] && formState === 'ADD') {
|
|
6949
6909
|
formData[constants.widgetTypeAccessor] = getFirstWidgetTypeValue();
|
|
@@ -7061,18 +7021,11 @@ const WidgetForm = ({
|
|
|
7061
7021
|
required: t('widget.widgetTypeRequired')
|
|
7062
7022
|
},
|
|
7063
7023
|
options: widgetTypes
|
|
7064
|
-
}, {
|
|
7065
|
-
label: `${t('widget.category')}`,
|
|
7066
|
-
placeholder: t('widget.categoryPlaceholder'),
|
|
7067
|
-
accessor: 'category',
|
|
7068
|
-
type: 'select',
|
|
7069
|
-
show: categories && categories.length > 0,
|
|
7070
|
-
options: categories
|
|
7071
7024
|
}, {
|
|
7072
7025
|
label: t('widget.autoPlay'),
|
|
7073
7026
|
accessor: 'autoPlay',
|
|
7074
7027
|
type: 'checkbox',
|
|
7075
|
-
show: selectedWidgetType === 'Carousel',
|
|
7028
|
+
show: (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Carousel',
|
|
7076
7029
|
switchClass: switchClass
|
|
7077
7030
|
}, {
|
|
7078
7031
|
label: `${t('widget.itemsType')}`,
|
|
@@ -7083,7 +7036,7 @@ const WidgetForm = ({
|
|
|
7083
7036
|
validations: {
|
|
7084
7037
|
required: t('widget.itemsTypePlaceholder')
|
|
7085
7038
|
},
|
|
7086
|
-
options: selectedWidgetType === 'Tabs' ? itemsTypes.filter(item => item.label !== 'Image') : itemsTypes
|
|
7039
|
+
options: (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Tabs' || (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.collectionsOnly) ? itemsTypes.filter(item => item.label !== 'Image') : (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.imageOnly) ? itemsTypes.filter(item => item.label === 'Image') : itemsTypes
|
|
7087
7040
|
}, {
|
|
7088
7041
|
label: t('widget.color'),
|
|
7089
7042
|
accessor: 'backgroundColor',
|
|
@@ -7143,7 +7096,7 @@ const WidgetForm = ({
|
|
|
7143
7096
|
onChange: setSelectedCollectionItems,
|
|
7144
7097
|
loadOptions: onChangeSearch,
|
|
7145
7098
|
isLoading: collectionDataLoading,
|
|
7146
|
-
show: !itemsEnabled && selectedWidgetType !== 'Tabs',
|
|
7099
|
+
show: !itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs',
|
|
7147
7100
|
formatOptionLabel: formatOptionLabel,
|
|
7148
7101
|
listCode: selectedCollectionType === null || selectedCollectionType === void 0 ? void 0 : selectedCollectionType.value,
|
|
7149
7102
|
customStyles: reactSelectStyles || {},
|
|
@@ -7163,7 +7116,7 @@ const WidgetForm = ({
|
|
|
7163
7116
|
setValue: setValue,
|
|
7164
7117
|
control: control,
|
|
7165
7118
|
setError: setError
|
|
7166
|
-
}), selectedWidgetType === 'Tabs' ? /*#__PURE__*/React__default["default"].createElement(Tabs, {
|
|
7119
|
+
}), (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Tabs' ? /*#__PURE__*/React__default["default"].createElement(Tabs, {
|
|
7167
7120
|
control: control,
|
|
7168
7121
|
register: register,
|
|
7169
7122
|
deleteTitle: t('widget.tabDeleteTitle'),
|
|
@@ -7182,12 +7135,12 @@ const WidgetForm = ({
|
|
|
7182
7135
|
customStyles: reactSelectStyles || {},
|
|
7183
7136
|
activeTab: activeTab,
|
|
7184
7137
|
setActiveTab: setActiveTab
|
|
7185
|
-
}) : null, !itemsEnabled && selectedWidgetType !== 'Tabs' && /*#__PURE__*/React__default["default"].createElement(DNDItemsList, {
|
|
7138
|
+
}) : null, !itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs' && /*#__PURE__*/React__default["default"].createElement(DNDItemsList, {
|
|
7186
7139
|
items: selectedCollectionItems,
|
|
7187
7140
|
onDragEnd: onCollectionIndexChange,
|
|
7188
7141
|
formatItem: formatListItem,
|
|
7189
7142
|
listCode: selectedCollectionType === null || selectedCollectionType === void 0 ? void 0 : selectedCollectionType.value
|
|
7190
|
-
}), itemsEnabled && selectedWidgetType !== 'Tabs' && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ItemsAccordian, {
|
|
7143
|
+
}), itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs' && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ItemsAccordian, {
|
|
7191
7144
|
clearError: clearErrors,
|
|
7192
7145
|
collapseId: constants.webItems,
|
|
7193
7146
|
title: t('widget.webItems'),
|
|
@@ -7367,7 +7320,6 @@ const Widget = ({
|
|
|
7367
7320
|
onImageUpload,
|
|
7368
7321
|
onPartialUpdateWidget,
|
|
7369
7322
|
itemsTypes,
|
|
7370
|
-
categories,
|
|
7371
7323
|
widgetTypes,
|
|
7372
7324
|
getCollectionData,
|
|
7373
7325
|
collectionData,
|
|
@@ -7400,7 +7352,6 @@ const Widget = ({
|
|
|
7400
7352
|
onImageRemove: onImageRemove,
|
|
7401
7353
|
onImageUpload: onImageUpload,
|
|
7402
7354
|
onPartialUpdateWidget: onPartialUpdateWidget,
|
|
7403
|
-
categories: categories,
|
|
7404
7355
|
itemsTypes: itemsTypes,
|
|
7405
7356
|
widgetTypes: widgetTypes,
|
|
7406
7357
|
getCollectionData: getCollectionData,
|
package/index.js
CHANGED
|
@@ -1746,8 +1746,6 @@ const TRANSLATION_PAIRS_WIDGET = {
|
|
|
1746
1746
|
'widget.widgetTitleInfo': 'HTML is supported',
|
|
1747
1747
|
'widget.minPerRow': 'Value must be greater than zero',
|
|
1748
1748
|
'widget.actionsLabel': 'Actions',
|
|
1749
|
-
'widget.category': 'Category',
|
|
1750
|
-
'widget.categoryPlaceholder': 'Select Category',
|
|
1751
1749
|
'widget.tabNameRequired': 'Tab Name is required'
|
|
1752
1750
|
};
|
|
1753
1751
|
const TRANSLATION_PAIRS_ITEM = {
|
|
@@ -2682,12 +2680,6 @@ const apiList = {
|
|
|
2682
2680
|
url: `${prefix}/collection-data`,
|
|
2683
2681
|
method: 'POST'
|
|
2684
2682
|
}),
|
|
2685
|
-
CATEGORIES: ({
|
|
2686
|
-
prefix
|
|
2687
|
-
}) => ({
|
|
2688
|
-
url: `${prefix}/categories`,
|
|
2689
|
-
method: 'GET'
|
|
2690
|
-
}),
|
|
2691
2683
|
// Image Upload API
|
|
2692
2684
|
IMAGE_UPLOAD: ({
|
|
2693
2685
|
prefix
|
|
@@ -4506,7 +4498,6 @@ const useWidget = ({
|
|
|
4506
4498
|
const [formState, setFormState] = useState();
|
|
4507
4499
|
const [itemsTypes, setItemsTypes] = useState([]);
|
|
4508
4500
|
const [widgetTypes, setWidgetTypes] = useState([]);
|
|
4509
|
-
const [categories, setCategories] = useState([]);
|
|
4510
4501
|
const [collectionDataLoading, setCollectionDataLoading] = useState(false);
|
|
4511
4502
|
const [collectionData, setCollectionData] = useState([]);
|
|
4512
4503
|
const {
|
|
@@ -4685,27 +4676,6 @@ const useWidget = ({
|
|
|
4685
4676
|
}
|
|
4686
4677
|
setLoading(false);
|
|
4687
4678
|
});
|
|
4688
|
-
const getCategories = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
4689
|
-
if ((categories === null || categories === void 0 ? void 0 : categories.length) > 0) return;
|
|
4690
|
-
setLoading(true);
|
|
4691
|
-
const api = getApiType({
|
|
4692
|
-
routes,
|
|
4693
|
-
action: 'CATEGORIES',
|
|
4694
|
-
prefix: widgetRoutesPrefix
|
|
4695
|
-
});
|
|
4696
|
-
const response = yield commonApi({
|
|
4697
|
-
baseUrl,
|
|
4698
|
-
token,
|
|
4699
|
-
method: api.method,
|
|
4700
|
-
url: api.url,
|
|
4701
|
-
onError: handleError(CALLBACK_CODES.GET_ALL)
|
|
4702
|
-
});
|
|
4703
|
-
if ((response === null || response === void 0 ? void 0 : response.code) === 'SUCCESS') {
|
|
4704
|
-
setLoading(false);
|
|
4705
|
-
return setCategories(dataGatter(response));
|
|
4706
|
-
}
|
|
4707
|
-
setLoading(false);
|
|
4708
|
-
});
|
|
4709
4679
|
const getCollectionData = (collectionName, search, callback, collectionItems) => __awaiter(void 0, void 0, void 0, function* () {
|
|
4710
4680
|
setCollectionDataLoading(true);
|
|
4711
4681
|
const api = getApiType({
|
|
@@ -4808,7 +4778,6 @@ const useWidget = ({
|
|
|
4808
4778
|
if (state === 'ADD' || state === 'UPDATE') {
|
|
4809
4779
|
getWidgetsTypes();
|
|
4810
4780
|
getWidgetTypes();
|
|
4811
|
-
getCategories();
|
|
4812
4781
|
}
|
|
4813
4782
|
// get Item data if widget is updating
|
|
4814
4783
|
if (state === 'UPDATE' && data) {
|
|
@@ -4903,7 +4872,6 @@ const useWidget = ({
|
|
|
4903
4872
|
// Form
|
|
4904
4873
|
formState,
|
|
4905
4874
|
itemData,
|
|
4906
|
-
categories,
|
|
4907
4875
|
onChangeFormState,
|
|
4908
4876
|
onCloseForm,
|
|
4909
4877
|
onWidgetFormSubmit,
|
|
@@ -6013,7 +5981,6 @@ const WidgetContextProvider = ({
|
|
|
6013
5981
|
onImageRemove: _onImageRemove = id => __awaiter(void 0, void 0, void 0, function* () {}),
|
|
6014
5982
|
itemsTypes: _itemsTypes = [],
|
|
6015
5983
|
widgetTypes: _widgetTypes = [],
|
|
6016
|
-
categories: _categories = [],
|
|
6017
5984
|
getCollectionData: _getCollectionData = () => Promise.resolve(),
|
|
6018
5985
|
collectionDataLoading: _collectionDataLoading = false,
|
|
6019
5986
|
collectionData: _collectionData = [],
|
|
@@ -6061,7 +6028,6 @@ const WidgetContextProvider = ({
|
|
|
6061
6028
|
onImageRemove: _onImageRemove,
|
|
6062
6029
|
onPartialUpdateWidget: _onPartialUpdateWidget,
|
|
6063
6030
|
itemsTypes: _itemsTypes,
|
|
6064
|
-
categories: _categories,
|
|
6065
6031
|
widgetTypes: _widgetTypes,
|
|
6066
6032
|
getCollectionData: _getCollectionData,
|
|
6067
6033
|
collectionDataLoading: _collectionDataLoading,
|
|
@@ -6744,7 +6710,6 @@ const Tabs = ({
|
|
|
6744
6710
|
};
|
|
6745
6711
|
|
|
6746
6712
|
const constants = {
|
|
6747
|
-
categoryTypeAccessor: 'category',
|
|
6748
6713
|
widgetTypeAccessor: 'widgetType',
|
|
6749
6714
|
itemTypeAccessor: 'itemsType',
|
|
6750
6715
|
collectionNameAccessor: 'collectionName',
|
|
@@ -6788,7 +6753,6 @@ const WidgetForm = ({
|
|
|
6788
6753
|
canUpdate,
|
|
6789
6754
|
formState,
|
|
6790
6755
|
itemsTypes,
|
|
6791
|
-
categories,
|
|
6792
6756
|
widgetTypes,
|
|
6793
6757
|
loading,
|
|
6794
6758
|
onWidgetFormSubmit,
|
|
@@ -6812,7 +6776,8 @@ const WidgetForm = ({
|
|
|
6812
6776
|
const [tabCollectionItemsUpdated, setTabCollectionItemsUpdated] = useState([]);
|
|
6813
6777
|
useEffect(() => {
|
|
6814
6778
|
if (data && formState === 'UPDATE') {
|
|
6815
|
-
|
|
6779
|
+
const widgetType = widgetTypes.find(type => type.value === (data === null || data === void 0 ? void 0 : data.widgetType));
|
|
6780
|
+
setSelectedWidgetType(widgetType);
|
|
6816
6781
|
if ((data === null || data === void 0 ? void 0 : data.itemsType) === 'Image') {
|
|
6817
6782
|
setItemsEnabled(true);
|
|
6818
6783
|
} else {
|
|
@@ -6822,7 +6787,7 @@ const WidgetForm = ({
|
|
|
6822
6787
|
setSelectedCollectionType(itemsTypes.find(item => item.value === (data === null || data === void 0 ? void 0 : data.collectionName)));
|
|
6823
6788
|
}
|
|
6824
6789
|
}
|
|
6825
|
-
}, [data, formState, itemsTypes]);
|
|
6790
|
+
}, [data, formState, itemsTypes, widgetTypes]);
|
|
6826
6791
|
useEffect(() => {
|
|
6827
6792
|
if (formState === 'ADD') {
|
|
6828
6793
|
setSelectedCollectionItems([]);
|
|
@@ -6900,13 +6865,11 @@ const WidgetForm = ({
|
|
|
6900
6865
|
const getFirstWidgetTypeValue = useCallback(() => {
|
|
6901
6866
|
return widgetTypes[0].value;
|
|
6902
6867
|
}, [widgetTypes]);
|
|
6903
|
-
const getFirstCategoryValue = useCallback(() => {
|
|
6904
|
-
return categories[0].value;
|
|
6905
|
-
}, [categories]);
|
|
6906
6868
|
// Widget Form Functions
|
|
6907
6869
|
const onWidgetFormInputChange = useCallback((value, name) => {
|
|
6908
6870
|
if (name === 'widgetType') {
|
|
6909
|
-
|
|
6871
|
+
const widgetType = widgetTypes.find(type => type.value === value[name]);
|
|
6872
|
+
setSelectedWidgetType(widgetType);
|
|
6910
6873
|
if (value[name] === 'Tabs') {
|
|
6911
6874
|
const firstItemType = getFirstItemTypeValue(value[name]);
|
|
6912
6875
|
if (firstItemType) {
|
|
@@ -6925,13 +6888,10 @@ const WidgetForm = ({
|
|
|
6925
6888
|
} else if ((name === null || name === void 0 ? void 0 : name.includes(constants.tabsAccessor)) && Array.isArray(value[constants.tabsAccessor])) {
|
|
6926
6889
|
setTabCollectionItems(value[constants.tabsAccessor].map(tabItem => tabItem[constants.tabCollectionItemsAccessor]));
|
|
6927
6890
|
}
|
|
6928
|
-
}, [getFirstItemTypeValue, itemsTypes]);
|
|
6891
|
+
}, [getFirstItemTypeValue, itemsTypes, widgetTypes]);
|
|
6929
6892
|
const onFormSubmit = data => {
|
|
6930
6893
|
var _a, _b;
|
|
6931
6894
|
const formData = Object.assign({}, data);
|
|
6932
|
-
if (!formData[constants.categoryTypeAccessor] && categories && categories.length > 0) {
|
|
6933
|
-
formData[constants.categoryTypeAccessor] = getFirstCategoryValue();
|
|
6934
|
-
}
|
|
6935
6895
|
// setting widget type if undefined
|
|
6936
6896
|
if (!formData[constants.widgetTypeAccessor] && formState === 'ADD') {
|
|
6937
6897
|
formData[constants.widgetTypeAccessor] = getFirstWidgetTypeValue();
|
|
@@ -7049,18 +7009,11 @@ const WidgetForm = ({
|
|
|
7049
7009
|
required: t('widget.widgetTypeRequired')
|
|
7050
7010
|
},
|
|
7051
7011
|
options: widgetTypes
|
|
7052
|
-
}, {
|
|
7053
|
-
label: `${t('widget.category')}`,
|
|
7054
|
-
placeholder: t('widget.categoryPlaceholder'),
|
|
7055
|
-
accessor: 'category',
|
|
7056
|
-
type: 'select',
|
|
7057
|
-
show: categories && categories.length > 0,
|
|
7058
|
-
options: categories
|
|
7059
7012
|
}, {
|
|
7060
7013
|
label: t('widget.autoPlay'),
|
|
7061
7014
|
accessor: 'autoPlay',
|
|
7062
7015
|
type: 'checkbox',
|
|
7063
|
-
show: selectedWidgetType === 'Carousel',
|
|
7016
|
+
show: (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Carousel',
|
|
7064
7017
|
switchClass: switchClass
|
|
7065
7018
|
}, {
|
|
7066
7019
|
label: `${t('widget.itemsType')}`,
|
|
@@ -7071,7 +7024,7 @@ const WidgetForm = ({
|
|
|
7071
7024
|
validations: {
|
|
7072
7025
|
required: t('widget.itemsTypePlaceholder')
|
|
7073
7026
|
},
|
|
7074
|
-
options: selectedWidgetType === 'Tabs' ? itemsTypes.filter(item => item.label !== 'Image') : itemsTypes
|
|
7027
|
+
options: (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Tabs' || (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.collectionsOnly) ? itemsTypes.filter(item => item.label !== 'Image') : (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.imageOnly) ? itemsTypes.filter(item => item.label === 'Image') : itemsTypes
|
|
7075
7028
|
}, {
|
|
7076
7029
|
label: t('widget.color'),
|
|
7077
7030
|
accessor: 'backgroundColor',
|
|
@@ -7131,7 +7084,7 @@ const WidgetForm = ({
|
|
|
7131
7084
|
onChange: setSelectedCollectionItems,
|
|
7132
7085
|
loadOptions: onChangeSearch,
|
|
7133
7086
|
isLoading: collectionDataLoading,
|
|
7134
|
-
show: !itemsEnabled && selectedWidgetType !== 'Tabs',
|
|
7087
|
+
show: !itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs',
|
|
7135
7088
|
formatOptionLabel: formatOptionLabel,
|
|
7136
7089
|
listCode: selectedCollectionType === null || selectedCollectionType === void 0 ? void 0 : selectedCollectionType.value,
|
|
7137
7090
|
customStyles: reactSelectStyles || {},
|
|
@@ -7151,7 +7104,7 @@ const WidgetForm = ({
|
|
|
7151
7104
|
setValue: setValue,
|
|
7152
7105
|
control: control,
|
|
7153
7106
|
setError: setError
|
|
7154
|
-
}), selectedWidgetType === 'Tabs' ? /*#__PURE__*/React.createElement(Tabs, {
|
|
7107
|
+
}), (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) === 'Tabs' ? /*#__PURE__*/React.createElement(Tabs, {
|
|
7155
7108
|
control: control,
|
|
7156
7109
|
register: register,
|
|
7157
7110
|
deleteTitle: t('widget.tabDeleteTitle'),
|
|
@@ -7170,12 +7123,12 @@ const WidgetForm = ({
|
|
|
7170
7123
|
customStyles: reactSelectStyles || {},
|
|
7171
7124
|
activeTab: activeTab,
|
|
7172
7125
|
setActiveTab: setActiveTab
|
|
7173
|
-
}) : null, !itemsEnabled && selectedWidgetType !== 'Tabs' && /*#__PURE__*/React.createElement(DNDItemsList, {
|
|
7126
|
+
}) : null, !itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs' && /*#__PURE__*/React.createElement(DNDItemsList, {
|
|
7174
7127
|
items: selectedCollectionItems,
|
|
7175
7128
|
onDragEnd: onCollectionIndexChange,
|
|
7176
7129
|
formatItem: formatListItem,
|
|
7177
7130
|
listCode: selectedCollectionType === null || selectedCollectionType === void 0 ? void 0 : selectedCollectionType.value
|
|
7178
|
-
}), itemsEnabled && selectedWidgetType !== 'Tabs' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ItemsAccordian, {
|
|
7131
|
+
}), itemsEnabled && (selectedWidgetType === null || selectedWidgetType === void 0 ? void 0 : selectedWidgetType.value) !== 'Tabs' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ItemsAccordian, {
|
|
7179
7132
|
clearError: clearErrors,
|
|
7180
7133
|
collapseId: constants.webItems,
|
|
7181
7134
|
title: t('widget.webItems'),
|
|
@@ -7355,7 +7308,6 @@ const Widget = ({
|
|
|
7355
7308
|
onImageUpload,
|
|
7356
7309
|
onPartialUpdateWidget,
|
|
7357
7310
|
itemsTypes,
|
|
7358
|
-
categories,
|
|
7359
7311
|
widgetTypes,
|
|
7360
7312
|
getCollectionData,
|
|
7361
7313
|
collectionData,
|
|
@@ -7388,7 +7340,6 @@ const Widget = ({
|
|
|
7388
7340
|
onImageRemove: onImageRemove,
|
|
7389
7341
|
onImageUpload: onImageUpload,
|
|
7390
7342
|
onPartialUpdateWidget: onPartialUpdateWidget,
|
|
7391
|
-
categories: categories,
|
|
7392
7343
|
itemsTypes: itemsTypes,
|
|
7393
7344
|
widgetTypes: widgetTypes,
|
|
7394
7345
|
getCollectionData: getCollectionData,
|
package/package.json
CHANGED
package/src/lib/api/list.d.ts
CHANGED
|
@@ -87,8 +87,6 @@ declare const TRANSLATION_PAIRS_WIDGET: {
|
|
|
87
87
|
'widget.widgetTitleInfo': string;
|
|
88
88
|
'widget.minPerRow': string;
|
|
89
89
|
'widget.actionsLabel': string;
|
|
90
|
-
'widget.category': string;
|
|
91
|
-
'widget.categoryPlaceholder': string;
|
|
92
90
|
'widget.tabNameRequired': string;
|
|
93
91
|
};
|
|
94
92
|
declare const TRANSLATION_PAIRS_ITEM: {
|
|
@@ -2,6 +2,6 @@ import React from 'react';
|
|
|
2
2
|
import { WidgetContextType } from '../types';
|
|
3
3
|
interface WidgetContextProviderProps extends React.PropsWithChildren, Partial<WidgetContextType> {
|
|
4
4
|
}
|
|
5
|
-
declare const WidgetContextProvider: ({ t, list, imageBaseUrl, searchText, changeSearch, formState, closeForm, loading, onChangeFormState, onWidgetFormSubmit, updateData, canAdd, canUpdate, onDeleteItem, getWidgets, onImageUpload, onImageRemove, itemsTypes, widgetTypes,
|
|
5
|
+
declare const WidgetContextProvider: ({ t, list, imageBaseUrl, searchText, changeSearch, formState, closeForm, loading, onChangeFormState, onWidgetFormSubmit, updateData, canAdd, canUpdate, onDeleteItem, getWidgets, onImageUpload, onImageRemove, itemsTypes, widgetTypes, getCollectionData, collectionDataLoading, collectionData, formatListItem, formatOptionLabel, currentPage, limits, pageSize, setCurrentPage, setPageSize, totalPages, totalRecords, canList, canPartialUpdate, columns, data, canDelete, loader, onPartialUpdateWidget, reactSelectStyles, children, }: WidgetContextProviderProps) => JSX.Element;
|
|
6
6
|
export declare function useWidgetState(): WidgetContextType;
|
|
7
7
|
export default WidgetContextProvider;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Routes_Input, WidgetType, ItemsType
|
|
2
|
+
import { Routes_Input, WidgetType, ItemsType } from '../types';
|
|
3
3
|
import { FormActionTypes, ObjectType } from '../types/common';
|
|
4
4
|
interface UseWidgetProps {
|
|
5
5
|
canList?: boolean;
|
|
@@ -10,7 +10,7 @@ interface UseWidgetProps {
|
|
|
10
10
|
}) => Promise<boolean>;
|
|
11
11
|
imageBaseUrl?: string;
|
|
12
12
|
}
|
|
13
|
-
declare const useWidget: ({ canList, defaultLimit, routes, preConfirmDelete, imageBaseUrl
|
|
13
|
+
declare const useWidget: ({ canList, defaultLimit, routes, preConfirmDelete, imageBaseUrl }: UseWidgetProps) => {
|
|
14
14
|
list: ObjectType[];
|
|
15
15
|
getWidgets: (search?: string) => Promise<void>;
|
|
16
16
|
loading: boolean;
|
|
@@ -24,7 +24,6 @@ declare const useWidget: ({ canList, defaultLimit, routes, preConfirmDelete, ima
|
|
|
24
24
|
setPageSize: (value: number) => void;
|
|
25
25
|
formState: FormActionTypes | undefined;
|
|
26
26
|
itemData: ObjectType | null;
|
|
27
|
-
categories: Category[];
|
|
28
27
|
onChangeFormState: (state: FormActionTypes, data?: ObjectType) => Promise<void>;
|
|
29
28
|
onCloseForm: () => void;
|
|
30
29
|
onWidgetFormSubmit: (data: ObjectType) => Promise<void>;
|
package/src/lib/types/api.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export type ACTION_TYPES = 'IMAGE_UPLOAD' | 'IMAGE_REMOVE' | 'CREATE' | 'LIST' | 'DELETE' | 'UPDATE' | 'ITEM' | 'PARTIAL_UPDATE' | 'WIDGET_TYPES' | 'SELECTION_TYPES' | 'COLLECTION_DATA' | 'GET_ONE'
|
|
1
|
+
export type ACTION_TYPES = 'IMAGE_UPLOAD' | 'IMAGE_REMOVE' | 'CREATE' | 'LIST' | 'DELETE' | 'UPDATE' | 'ITEM' | 'PARTIAL_UPDATE' | 'WIDGET_TYPES' | 'SELECTION_TYPES' | 'COLLECTION_DATA' | 'GET_ONE';
|
|
2
2
|
export type API_TYPE = {
|
|
3
3
|
url: string;
|
|
4
4
|
method: string;
|
|
@@ -18,10 +18,6 @@ export type WidgetType = {
|
|
|
18
18
|
value: string;
|
|
19
19
|
label: string;
|
|
20
20
|
};
|
|
21
|
-
export type Category = {
|
|
22
|
-
value: string;
|
|
23
|
-
label: string;
|
|
24
|
-
};
|
|
25
21
|
export interface BaseAPIProps {
|
|
26
22
|
config?: any;
|
|
27
23
|
baseUrl: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { WidgetType, ItemsType
|
|
2
|
+
import { WidgetType, ItemsType } from './api';
|
|
3
3
|
import { FormActionTypes, OptionType } from './common';
|
|
4
4
|
export interface ProviderContextType {
|
|
5
5
|
baseUrl: string;
|
|
@@ -43,7 +43,6 @@ export interface WidgetContextType {
|
|
|
43
43
|
onImageRemove: (id: string) => Promise<void>;
|
|
44
44
|
itemsTypes: ItemsType[];
|
|
45
45
|
widgetTypes: WidgetType[];
|
|
46
|
-
categories: Category[];
|
|
47
46
|
getCollectionData: (collectionName: string, search?: string, callback?: (options: OptionType[]) => void, collectionItems?: string[]) => Promise<void>;
|
|
48
47
|
collectionDataLoading: boolean;
|
|
49
48
|
collectionData: any[];
|