Web: Files: fixed selected tree node on click in row

This commit is contained in:
Artem Tarasov 2020-10-06 17:07:58 +03:00
parent 978b67f7a7
commit ef602b578f
2 changed files with 94 additions and 87 deletions

View File

@ -12,7 +12,7 @@ import {
setDragging,
setNewTreeFilesBadge,
setIsLoading,
setSelectedNode
setSelectedNode,
} from "../../../store/files/actions";
import store from "../../../store/store";
import isEqual from "lodash/isEqual";
@ -21,7 +21,6 @@ import { setDocumentTitle } from "../../../helpers/utils";
const { getCurrentModule } = initStore.auth.selectors;
class ArticleBodyContent extends React.Component {
constructor(props) {
super(props);
@ -35,7 +34,7 @@ class ArticleBodyContent extends React.Component {
this.state = {
expandedKeys: this.props.filter.treeFolders,
data: this.props.data,
showNewFilesPanel: false
showNewFilesPanel: false,
};
}
@ -77,7 +76,7 @@ class ArticleBodyContent extends React.Component {
selectedTreeNode,
setSelectedNode,
currentModuleName,
organizationName
organizationName,
} = this.props;
if (selectedTreeNode[0] !== data[0]) {
@ -95,22 +94,22 @@ class ArticleBodyContent extends React.Component {
: setDocumentTitle();
fetchFiles(data[0], newFilter, store.dispatch)
.catch(err => toastr.error(err))
.catch((err) => toastr.error(err))
.finally(() => setIsLoading(false));
}
};
onShowNewFilesPanel = folderId => {
onShowNewFilesPanel = (folderId) => {
const { showNewFilesPanel } = this.state;
this.setState({
showNewFilesPanel: !showNewFilesPanel,
newFolderId: [folderId]
newFolderId: [folderId],
});
};
setNewFilesCount = (folderPath, filesCount) => {
const data = this.state.data;
const dataItem = data.find(x => x.id === folderPath[0]);
const dataItem = data.find((x) => x.id === folderPath[0]);
dataItem.newItems = filesCount ? filesCount : dataItem.newItems - 1;
this.setState({ data });
};
@ -133,7 +132,7 @@ class ArticleBodyContent extends React.Component {
setDragging,
onTreeDrop,
selectedTreeNode,
setIsLoading
setIsLoading,
} = this.props;
const { showNewFilesPanel, expandedKeys, newFolderId } = this.state;
@ -193,7 +192,7 @@ function mapStateToProps(state) {
selection,
dragging,
updateTreeNew,
selectedTreeNode
selectedTreeNode,
} = state.files;
const currentFolderId = selectedFolder.id.toString();
@ -241,19 +240,16 @@ function mapStateToProps(state) {
updateTreeNew,
selectedTreeNode: selected,
currentModuleName: (currentModule && currentModule.title) || "",
selectedFolderTitle: (selectedFolder && selectedFolder.title) || ""
selectedFolderTitle: (selectedFolder && selectedFolder.title) || "",
};
}
export default connect(
mapStateToProps,
{
setFilter,
setTreeFolders,
setDragItem,
setDragging,
setNewTreeFilesBadge,
setIsLoading,
setSelectedNode
}
)(ArticleBodyContent);
export default connect(mapStateToProps, {
setFilter,
setTreeFolders,
setDragItem,
setDragging,
setNewTreeFilesBadge,
setIsLoading,
setSelectedNode,
})(ArticleBodyContent);

View File

@ -26,7 +26,7 @@ import {
SET_THIRD_PARTY,
SET_FILES_SETTINGS,
SET_FILES_SETTING,
SET_IS_ERROR_SETTINGS
SET_IS_ERROR_SETTINGS,
} from "./actions";
import { api } from "asc-web-common";
import { isFileSelected, skipFile, getFilesBySelected } from "./selectors";
@ -34,7 +34,7 @@ const { FilesFilter } = api;
const initialState = {
fileAction: {
type: null
type: null,
},
files: null,
filter: FilesFilter.getDefault(),
@ -61,160 +61,171 @@ const initialState = {
forceSave: false,
storeForceSave: false,
enableThirdParty: false,
isErrorSettings: false
}
isErrorSettings: false,
},
};
const filesReducer = (state = initialState, action) => {
switch (action.type) {
case SET_FOLDER:
return Object.assign({}, state, {
folders: state.folders.map(folder =>
folders: state.folders.map((folder) =>
folder.id === action.folder.id ? action.folder : folder
)
),
});
case SET_FOLDERS:
return Object.assign({}, state, {
folders: action.folders
folders: action.folders,
});
case SET_FILES:
return Object.assign({}, state, {
files: action.files
files: action.files,
});
case SET_FILE:
return Object.assign({}, state, {
files: state.files.map(file =>
files: state.files.map((file) =>
file.id === action.file.id ? action.file : file
)
),
});
case SET_SELECTION:
return Object.assign({}, state, {
selection: action.selection
selection: action.selection,
});
case SET_SELECTED:
return Object.assign({}, state, {
selected: action.selected,
selection: getFilesBySelected(state.files.concat(state.folders), action.selected)
selection: getFilesBySelected(
state.files.concat(state.folders),
action.selected
),
});
case SET_SELECTED_FOLDER:
return Object.assign({}, state, {
selectedFolder: action.selectedFolder
selectedFolder: action.selectedFolder,
selectedTreeNode: [action.selectedFolder.id.toString()],
});
case SET_TREE_FOLDERS:
return Object.assign({}, state, {
treeFolders: action.treeFolders
treeFolders: action.treeFolders,
});
case SET_FILTER:
return Object.assign({}, state, {
filter: action.filter
filter: action.filter,
});
case SET_VIEW_AS:
return Object.assign({}, state, {
viewAs: action.viewAs
viewAs: action.viewAs,
});
case SET_FILES_FILTER:
return Object.assign({}, state, {
filter: action.filter
filter: action.filter,
});
case SELECT_FILE:
if (!isFileSelected(state.selection, action.file.id, action.file.parentId)) {
if (
!isFileSelected(state.selection, action.file.id, action.file.parentId)
) {
return Object.assign({}, state, {
selection: [...state.selection, action.file]
selection: [...state.selection, action.file],
});
} else return state;
case DESELECT_FILE:
if (isFileSelected(state.selection, action.file.id, action.file.parentId)) {
if (
isFileSelected(state.selection, action.file.id, action.file.parentId)
) {
return Object.assign({}, state, {
selection: skipFile(state.selection, action.file.id)
selection: skipFile(state.selection, action.file.id),
});
} else return state;
case SET_ACTION:
return Object.assign({}, state, {
fileAction: action.fileAction
})
case SET_DRAGGING:
return Object.assign({}, state, {
dragging: action.dragging
fileAction: action.fileAction,
});
case SET_DRAG_ITEM:
case SET_DRAGGING:
return Object.assign({}, state, {
dragItem: action.dragItem
dragging: action.dragging,
});
case SET_MEDIA_VIEWER_VISIBLE:
case SET_DRAG_ITEM:
return Object.assign({}, state, {
mediaViewerData: action.mediaViewerData
dragItem: action.dragItem,
});
case SET_PROGRESS_BAR_DATA:
case SET_MEDIA_VIEWER_VISIBLE:
return Object.assign({}, state, {
progressData: action.progressData
mediaViewerData: action.mediaViewerData,
});
case SET_CONVERT_DIALOG_VISIBLE:
case SET_PROGRESS_BAR_DATA:
return Object.assign({}, state, {
convertDialogVisible: action.convertDialogVisible
progressData: action.progressData,
});
case SET_NEW_TREE_FILES:
case SET_CONVERT_DIALOG_VISIBLE:
return Object.assign({}, state, {
updateTreeNew: action.updateTreeNew
convertDialogVisible: action.convertDialogVisible,
});
case SET_NEW_ROW_ITEMS:
case SET_NEW_TREE_FILES:
return Object.assign({}, state, {
newRowItems: action.newRowItems
updateTreeNew: action.updateTreeNew,
});
case SET_SELECTED_NODE:
if ( action.node[0] ) {
case SET_NEW_ROW_ITEMS:
return Object.assign({}, state, {
newRowItems: action.newRowItems,
});
case SET_SELECTED_NODE:
if (action.node[0]) {
return Object.assign({}, state, {
selectedTreeNode: action.node
})
selectedTreeNode: action.node,
});
} else {
return state;
}
case SET_EXPAND_SETTINGS_TREE:
return Object.assign({}, state, {
settingsTree: { ...state.settingsTree , expandedSetting: action.setting }
})
settingsTree: {
...state.settingsTree,
expandedSetting: action.setting,
},
});
case SET_IS_LOADING:
return Object.assign({}, state, {
isLoading: action.isLoading
})
isLoading: action.isLoading,
});
case SET_THIRD_PARTY:
return Object.assign({}, state, {
settingsTree: { ...state.settingsTree, thirdParty: action.data }
})
settingsTree: { ...state.settingsTree, thirdParty: action.data },
});
case SET_FILES_SETTINGS:
const {
const {
storeOriginalFiles,
confirmDelete,
updateIfExist,
forcesave,
storeForcesave,
enableThirdParty
} = action.settings
enableThirdParty,
} = action.settings;
return Object.assign({}, state, {
settingsTree: { ...state.settingsTree,
settingsTree: {
...state.settingsTree,
storeOriginalFiles,
confirmDelete,
updateIfExist,
forceSave: forcesave,
storeForceSave: storeForcesave,
enableThirdParty
}
})
enableThirdParty,
},
});
case SET_FILES_SETTING:
const { setting, val } = action;
return Object.assign({}, state, {
settingsTree: {
...state.settingsTree,
[setting]: val
}
})
settingsTree: {
...state.settingsTree,
[setting]: val,
},
});
case SET_IS_ERROR_SETTINGS:
return Object.assign({}, state, {
settingsTree: {
...state.settingsTree,
isErrorSettings: action.isError
}
})
isErrorSettings: action.isError,
},
});
default:
return state;
}