- updated zustand and react libraries;

- added 'put in draft' btn;
This commit is contained in:
Vitalii Kiiko
2025-04-10 12:36:19 +02:00
parent 44ba9036cb
commit 7dcf932819
90 changed files with 677 additions and 587 deletions

View File

@@ -14,7 +14,7 @@ const BuilderDropzone = () => {
return item;
},
hover(item, monitor) {
storeSet.main.moveElement(-1, 0, item);
storeSet('moveElement', -1, 0, item);
item.index = 0;
}
});

View File

@@ -6,7 +6,7 @@ import { head, isEmpty, pathOr } from 'ramda';
import { klona } from 'klona';
// store
import { storeSet, useStore } from '../../../../store';
import { storeSet, useStoreValue } from '../../../../store';
// tools
import uniqid from '../../../../helpers/uniqid';
@@ -17,10 +17,10 @@ import { Tag } from 'primereact/tag';
import BuilderElementProperLabel from '../BuilderElementProperLabel';
const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
const draggingElementId = useStore().main.draggingElementId();
const selectedElement = useStore().main.selectedElement();
const draggingElementId = useStoreValue('draggingElementId');
const selectedElement = useStoreValue('selectedElement');
const ref = useRef(null);
const elements = useStore().main.formElements();
const elements = useStoreValue('formElements');
const element = head(elements.filter(o => o.id === id));
const elementSettings = pathOr([], ['settings'], element);
const [isVariable, setIsVariable] = useState('secondary');
@@ -38,7 +38,7 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
}
},
drop(item, monitor) {
storeSet.main.draggingElementId(0);
storeSet('draggingElementId', 0);
return item;
},
hover(item, monitor) {
@@ -98,15 +98,15 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
});
const move = (dragIndex, hoverIndex, item) => {
storeSet.main.moveElement(dragIndex, hoverIndex, item);
storeSet('moveElement', dragIndex, hoverIndex, item);
}
const openSettings = () => {
storeSet.main.activeElement(id);
storeSet('activeElement', id);
}
const selectElement = () => {
storeSet.main.selectedElement(id);
storeSet('selectedElement', id);
}
const duplicateElement = useCallback(() => {
@@ -123,12 +123,12 @@ const BuilderElement = ({ id, name, label, index, bandoStatus }) => {
copyElement.id = uniqid();
const originalIndex = elements.map(o => o.id).indexOf(id);
const newElements = [...elements].toSpliced(originalIndex + 1, 0, copyElement);
storeSet.main.formElements(newElements);
storeSet('formElements', newElements);
}
}, [elements]);
const remove = () => {
storeSet.main.removeElement(id);
storeSet('removeElement', id);
}
const opacity = isDragging ? 0 : 1;

View File

@@ -12,7 +12,7 @@ const BuilderElementItem = ({ dbId, name, label, description = '' }) => {
type: ItemTypes.FIELD,
item: () => {
const newId = uniqid();
storeSet.main.draggingElementId(newId);
storeSet('draggingElementId', newId);
return { name, dbId, id: newId, index: -1 }
},
end: (item, monitor) => {
@@ -23,8 +23,8 @@ const BuilderElementItem = ({ dbId, name, label, description = '' }) => {
return item;
}
} else {
storeSet.main.removeElement(item.id);
storeSet.main.draggingElementId(0);
storeSet('removeElement', item.id);
storeSet('draggingElementId', 0);
}
},
collect: (monitor) => ({

View File

@@ -2,11 +2,11 @@ import { useState, useEffect } from 'react'
import { head, pathOr } from 'ramda';
// store
import { useStore } from '../../../../store';
import { useStoreValue } from '../../../../store';
import renderHtmlContent from '../../../../helpers/renderHtmlContent';
const BuilderElementProperLabel = ({ id, defaultLabel }) => {
const elements = useStore().main.formElements();
const elements = useStoreValue('formElements');
const element = head(elements.filter(o => o.id === id));
const [label, setLabel] = useState('');
const isRequired = pathOr(false, ['validators', 'isRequired'], element);

View File

@@ -3,7 +3,7 @@ import { __ } from '@wordpress/i18n';
import { head, is, isEmpty, isNil, uniq } from 'ramda';
// store
import { storeGet, useStore } from '../../../../../../store';
import { storeGet, useStoreValue } from '../../../../../../store';
// tools
import renderHtmlContent from '../../../../../../helpers/renderHtmlContent';
@@ -23,7 +23,7 @@ import { mimeTypes } from '../../../../../../configData';
const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
const [existingVars, setExistingVars] = useState([]);
const documentCategories = useStore().main.documentCategories();
const documentCategories = useStoreValue('documentCategories');
const settingLabels = {
label: __('Label', 'gepafin'),
@@ -131,8 +131,8 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus }) => {
}
useEffect(() => {
const elements = storeGet.main.formElements();
const activeElement = storeGet.main.activeElement();
const elements = storeGet('formElements');
const activeElement = storeGet('activeElement');
const vars = elements
.filter(o => o.id !== activeElement)
// eslint-disable-next-line

View File

@@ -5,7 +5,7 @@ import { klona } from 'klona';
import { wrap } from 'object-path-immutable';
// store
import { storeGet, storeSet, useStore } from '../../../../store';
import { storeGet, storeSet, useStoreValue } from '../../../../store';
// components
import { InputText } from 'primereact/inputtext';
@@ -20,9 +20,9 @@ import { MultiSelect } from 'primereact/multiselect';
import { dynamicDataOptions } from '../../../../configData';
const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
const elements = useStore().main.formElements();
const activeElement = useStore().main.activeElement();
const criteriaOptions = useStore().main.bandoCriteria();
const elements = useStoreValue('formElements');
const activeElement = useStoreValue('activeElement');
const criteriaOptions = useStoreValue('bandoCriteria');
const [activeElementData, setActiveElementData] = useState({});
const [settings, setSettings] = useState([]);
const [validators, setValidators] = useState({});
@@ -77,7 +77,7 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
newActiveElementData = wrap(newActiveElementData).set(['criteria'], criteria).value();
const newElements = elements.map(o => o.id === newActiveElementData.id ? newActiveElementData : o);
storeSet.main.formElements(newElements);
storeSet('formElements', newElements);
closeSettingsFn();
}
@@ -113,7 +113,7 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
useEffect(() => {
const chosen = head(elements.filter(o => o.id === activeElement));
const elementItems = storeGet.main.elementItems();
const elementItems = storeGet('elementItems');
const chosenElementItemCfg = head(elementItems.filter(o => o.name === chosen.name));
let settings = [];

View File

@@ -3,7 +3,7 @@ import { __ } from '@wordpress/i18n';
import { isEmpty } from 'ramda';
// store
import { storeSet, useStore } from '../../../../store';
import { storeSet, useStoreValue } from '../../../../store';
// components
import BuilderElement from '../BuilderElement';
@@ -14,10 +14,10 @@ import BuilderDropzone from '../BuilderDropzone';
import BlockingOverlay from '../../../../components/BlockingOverlay';
const FormBuilder = ({ callStatus, context }) => {
const elements = useStore().main.formElements();
const elementItems = useStore().main.elementItems();
const activeElement = useStore().main.activeElement();
const isAsyncRequest = useStore().main.isAsyncRequest();
const elements = useStoreValue('formElements');
const elementItems = useStoreValue('elementItems');
const activeElement = useStoreValue('activeElement');
const isAsyncRequest = useStoreValue('isAsyncRequest');
const renderField = useCallback((field, index) => {
return (
@@ -45,12 +45,12 @@ const FormBuilder = ({ callStatus, context }) => {
}, []);
const closeSettings = () => {
storeSet.main.activeElement('');
storeSet('activeElement', '');
}
useEffect(() => {
return () => {
storeSet.main.activeElement('');
storeSet('activeElement', '');
}
}, []);

View File

@@ -7,7 +7,7 @@ import { klona } from 'klona';
import { isEmpty, pathOr } from 'ramda';
// store
import { storeSet, storeGet, useStore } from '../../store';
import { storeSet, storeGet, useStoreValue } from '../../store';
// components
import FormBuilder from './components/FormBuilder';
@@ -18,14 +18,16 @@ import { Toast } from 'primereact/toast';
import { ConfirmDialog } from 'primereact/confirmdialog';
import { Messages } from 'primereact/messages';
// tools
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
// api
import FormsService from '../../service/forms-service';
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
import BandoService from '../../service/bando-service';
import DocumentCategoryService from '../../service/document-category-service';
// TODO temp data
import { elementItems } from '../../tempData';
import DocumentCategoryService from '../../service/document-category-service';
//import { elementItems } from '../../tempData';
const BandoFormsEdit = () => {
const { id, formId } = useParams();
@@ -33,7 +35,7 @@ const BandoFormsEdit = () => {
const [formName, setFormName] = useState('');
const [visibleConfirmation, setVisibleConfirmation] = useState(false);
const [bandoStatus, setBandoStatus] = useState('');
const isAsyncRequest = useStore().main.isAsyncRequest();
const isAsyncRequest = useStoreValue('isAsyncRequest');
const formMsgs = useRef(null);
const toast = useRef(null);
@@ -52,7 +54,7 @@ const BandoFormsEdit = () => {
formMsgs.current.clear();
}
const content = storeGet.main.formElements();
const content = storeGet('formElements');
if (isEmpty(formName) || isEmpty(content)) {
if (isEmpty(formName)) {
@@ -90,7 +92,7 @@ const BandoFormsEdit = () => {
content
}
storeSet.main.setAsyncRequest();
storeSet('setAsyncRequest');
if (bandoFormId === 0) {
FormsService.createFormForCall(
bandoId,
@@ -127,11 +129,11 @@ const BandoFormsEdit = () => {
});
}
}
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const errFormCreateCallback = (data) => {
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
if (data.status === 'BAD_REQUEST') {
setVisibleConfirmation(true);
} else {
@@ -146,7 +148,7 @@ const BandoFormsEdit = () => {
}
const acceptModification = () => {
const content = storeGet.main.formElements();
const content = storeGet('formElements');
const parsedFormId = parseInt(formId);
const bandoFormId = !isNaN(parsedFormId) ? parsedFormId : 0;
const formData = {
@@ -154,7 +156,7 @@ const BandoFormsEdit = () => {
content
}
storeSet.main.setAsyncRequest();
storeSet('setAsyncRequest');
FormsService.updateForm(
bandoFormId,
@@ -198,7 +200,7 @@ const BandoFormsEdit = () => {
}*/
const doDelete = () => {
storeSet.main.setAsyncRequest();
storeSet('setAsyncRequest');
FormsService.deleteForm(formId, formDeleteCallback, errFormDeleteCallback)
}
@@ -207,42 +209,42 @@ const BandoFormsEdit = () => {
const bandoId = getBandoId();
navigate(`/bandi/${bandoId}/forms`);
}
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const errFormDeleteCallback = (data) => {
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const getElementItemsCallback = (data) => {
if (data.status === 'SUCCESS') {
storeSet.main.elementItems(elementItems.sort((a, b) => a.sortOrder - b.sortOrder));
/*storeSet.main.elementItems(data.data
//storeSet('elementItems', elementItems.sort((a, b) => a.sortOrder - b.sortOrder));
storeSet('elementItems', data.data
.filter(o => o.id !== 22)
.sort((a, b) => a.sortOrder - b.sortOrder));*/
.sort((a, b) => a.sortOrder - b.sortOrder));
}
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const errGetElementItemsCallback = () => {
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const getFormCallback = (data) => {
if (data.status === 'SUCCESS') {
storeSet.main.formId(data.data.id);
storeSet.main.formLabel(data.data.label);
storeSet('formId', data.data.id);
storeSet('formLabel', data.data.label);
setFormName(data.data.label);
setBandoStatus(data.data.callStatus);
const elements = klona(data.data.content);
storeSet.main.formElements(elements);
storeSet('formElements', elements);
}
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const errGetFormCallbacks = (data) => {
set404FromErrorResponse(data);
storeSet.main.unsetAsyncRequest();
storeSet('unsetAsyncRequest');
}
const getBandoCallback = (data) => {
@@ -250,7 +252,7 @@ const BandoFormsEdit = () => {
setBandoStatus(data.data.status);
const criteria = pathOr([], ['data', 'criteria'], data);
const criteriaOptions = criteria.map(o => ({value: o.id, label: o.value}));
storeSet.main.bandoCriteria(criteriaOptions);
storeSet('bandoCriteria', criteriaOptions);
}
}
@@ -260,7 +262,7 @@ const BandoFormsEdit = () => {
const getCategories = (resp) => {
if (resp.status === 'SUCCESS') {
storeSet.main.documentCategories(resp.data.map(o => ({value: o.id, label: o.description})));
storeSet('documentCategories', resp.data.map(o => ({value: o.id, label: o.description})));
}
}
@@ -272,11 +274,11 @@ const BandoFormsEdit = () => {
const parsedFormId = parseInt(formId)
const bandoFormId = !isNaN(parsedFormId) ? parsedFormId : 0;
storeSet.main.setAsyncRequest();
storeSet('setAsyncRequest');
FormsService.getElementItems(getElementItemsCallback, errGetElementItemsCallback);
if (bandoFormId) {
storeSet.main.setAsyncRequest();
storeSet('setAsyncRequest');
FormsService.getFormById(bandoFormId, getFormCallback, errGetFormCallbacks);
}
if (bandoId) {
@@ -284,12 +286,12 @@ const BandoFormsEdit = () => {
}
return () => {
storeSet.main.formId(0);
storeSet.main.formLabel('');
storeSet.main.formElements([]);
storeSet.main.bandoCriteria([]);
storeSet.main.activeElement('');
storeSet.main.selectedElement('');
storeSet('formId', 0);
storeSet('formLabel', '');
storeSet('formElements', []);
storeSet('bandoCriteria', []);
storeSet('activeElement', '');
storeSet('selectedElement', '');
}
}, [id, formId]);