Merge branch '1106-contribution-editor-remember-last-data-type-select…

…ion' into 'master' ux(ContributionEditor): remember last selected data type Closes #1106 See merge request TIBHannover/orkg/orkg-frontend!902
TIBHannover · Aug 4, 2022 · 856b4d6 · 856b4d6
2 parents 71911d1 + 6a3cd69
commit 856b4d6
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 3 deletions.
diff --git a/src/components/ContributionEditor/TableCellForm/TableCellForm.js b/src/components/ContributionEditor/TableCellForm/TableCellForm.js
@@ -7,7 +7,7 @@ import DatatypeSelector from 'components/StatementBrowser/DatatypeSelector/Datat
 import { getConfigByType, getSuggestionByTypeAndValue } from 'constants/DataTypes';
 import a from 'indefinite';
 import { useDispatch } from 'react-redux';
-import { addValue } from 'slices/contributionEditorSlice';
+import { addValue, setPreviousInputDataType } from 'slices/contributionEditorSlice';
 import { useClickAway } from 'react-use';
 import ConfirmationTooltip from 'components/StatementBrowser/ConfirmationTooltip/ConfirmationTooltip';
 import Tippy from '@tippyjs/react';
@@ -137,6 +137,11 @@ const TableCellForm = ({ value, contributionId, propertyId, closeForm }) => {
         }
     }, [inputDataType, setEntityType, setInputValue, setInputFormType]);
 
+    const handleSetValueType = type => {
+        dispatch(setPreviousInputDataType(type));
+        setInputDataType(type);
+    };
+
     return (
         <div ref={refContainer} style={{ minHeight: 35 }}>
             <Tippy
@@ -241,7 +246,7 @@ const TableCellForm = ({ value, contributionId, propertyId, closeForm }) => {
                                 disableBorderRadiusLeft={true}
                                 disableBorderRadiusRight={false}
                                 valueType={inputDataType}
-                                setValueType={setInputDataType}
+                                setValueType={handleSetValueType}
                                 menuPortalTarget={document.body} // use a portal to ensure the menu isn't blocked by other elements
                             />
                         )}

diff --git a/src/components/ContributionEditor/TableCellForm/hooks/useTableCellForm.js b/src/components/ContributionEditor/TableCellForm/hooks/useTableCellForm.js
@@ -19,6 +19,7 @@ const useTableCellForm = ({ value, contributionId, propertyId }) => {
     const editMode = Boolean(value);
 
     const property = useSelector(state => state.contributionEditor.properties[propertyId]);
+    const { previousInputDataType } = useSelector(state => state.contributionEditor);
     const valueClass = useSelector(state => getValueClass(getComponentsByResourceIDAndPredicateID(state, contributionId, propertyId)));
 
     const canAddValue = useSelector(state => canAddValueAction(state, contributionId, propertyId));
@@ -38,7 +39,7 @@ const useTableCellForm = ({ value, contributionId, propertyId }) => {
     const [inputValue, setInputValue] = useState(editMode ? value.label : '');
     const [inputDataType, setInputDataType] = useState(
         !valueClass?.id
-            ? getConfigByType(isLiteralField ? (editMode ? value.datatype : MISC.DEFAULT_LITERAL_DATATYPE) : MISC.DEFAULT_LITERAL_DATATYPE).type
+            ? getConfigByType(isLiteralField ? (editMode ? value.datatype : previousInputDataType) : previousInputDataType).type
             : getConfigByClassId(valueClass.id).type,
     );
     const [disabledCreate] = useState(false);

diff --git a/src/slices/contributionEditorSlice.js b/src/slices/contributionEditorSlice.js
@@ -38,6 +38,7 @@ const initialState = {
     classes: {},
     isLoading: false,
     hasFailed: false,
+    previousInputDataType: MISC.DEFAULT_LITERAL_DATATYPE,
 };
 
 export const contributionEditorSlice = createSlice({
@@ -163,6 +164,9 @@ export const contributionEditorSlice = createSlice({
         updateContributionClasses: (state, { payload: { resourceId, classes } }) => {
             state.contributions[resourceId].classes = classes;
         },
+        setPreviousInputDataType: (state, { payload }) => {
+            state.previousInputDataType = payload;
+        },
     },
     extraReducers: {
         [LOCATION_CHANGE]: () => initialState,
@@ -189,6 +193,7 @@ export const {
     propertyDeleted,
     propertyUpdated,
     paperUpdated,
+    setPreviousInputDataType,
 } = contributionEditorSlice.actions;
 
 export default contributionEditorSlice.reducer;