diff --git a/client/constants.js b/client/constants.js index 13c74e0504..36155b4926 100644 --- a/client/constants.js +++ b/client/constants.js @@ -145,3 +145,5 @@ export const STOP_LOADING = 'STOP_LOADING'; export const START_SAVING_PROJECT = 'START_SAVING_PROJECT'; export const END_SAVING_PROJECT = 'END_SAVING_PROJECT'; + +export const SET_PARENT_ID = 'SET_PARENT_ID'; diff --git a/client/modules/IDE/actions/ide.js b/client/modules/IDE/actions/ide.js index 19fc12d471..9e9200dd0e 100644 --- a/client/modules/IDE/actions/ide.js +++ b/client/modules/IDE/actions/ide.js @@ -64,6 +64,13 @@ export function resetSelectedFile(previousId) { }; } +export function setParentId(parentId) { + return { + type: ActionTypes.SET_PARENT_ID, + parentId + }; +} + export function newFile(parentId) { return { type: ActionTypes.SHOW_MODAL, diff --git a/client/modules/IDE/actions/uploader.js b/client/modules/IDE/actions/uploader.js index 8cbc365a59..b11f7fac7e 100644 --- a/client/modules/IDE/actions/uploader.js +++ b/client/modules/IDE/actions/uploader.js @@ -1,7 +1,6 @@ import apiClient from '../../../utils/apiClient'; import getConfig from '../../../utils/getConfig'; import { handleCreateFile } from './files'; -import { newFile } from './ide'; import { TEXT_FILE_REGEX } from '../../../../server/utils/fileUtils'; const s3BucketHttps = @@ -136,38 +135,3 @@ export function dropzoneCompleteCallback(elementId, file) { } }; } - -export function dropzoneCompleteCallbackAid(elementId, parentId, file) { - return (dispatch) => { // eslint-disable-line - dispatch(newFile(parentId)); - if ( - (!file.name.match(TEXT_FILE_REGEX) || file.size >= MAX_LOCAL_FILE_SIZE) && - file.status !== 'error' - ) { - let inputHidden = '`; - document.getElementById(elementId).innerHTML += inputHidden; - - const formParams = { - name: file.name, - url: `${s3BucketHttps}${file.postData.key}` - }; - dispatch(handleCreateFile(formParams, false)); - } else if (file.content !== undefined) { - const formParams = { - name: file.name, - content: file.content - }; - dispatch(handleCreateFile(formParams, false)); - } - }; -} diff --git a/client/modules/IDE/components/FileNode.jsx b/client/modules/IDE/components/FileNode.jsx index 18dc7d920c..83d1c1f5b7 100644 --- a/client/modules/IDE/components/FileNode.jsx +++ b/client/modules/IDE/components/FileNode.jsx @@ -105,9 +105,26 @@ class FileNode extends React.Component { handleFileClick = (event) => { event.stopPropagation(); const { isDeleting } = this.state; - const { id, setSelectedFile, name, onClickFile } = this.props; + const { + id, + parentId, + setSelectedFile, + fileType, + setParentId, + name, + onClickFile + } = this.props; if (name !== 'root' && !isDeleting) { - setSelectedFile(id); + console.log(parentId); + console.log(id); + if (fileType !== 'folder') { + setParentId(parentId); + setSelectedFile(id); + } else { + console.log('called here'); + setParentId(id); + setSelectedFile(id); + } } // debugger; // eslint-disable-line @@ -413,6 +430,7 @@ FileNode.propTypes = { isSelectedFile: PropTypes.bool, isFolderClosed: PropTypes.bool, setSelectedFile: PropTypes.func.isRequired, + setParentId: PropTypes.func.isRequired, deleteFile: PropTypes.func.isRequired, updateFileName: PropTypes.func.isRequired, resetSelectedFile: PropTypes.func.isRequired, diff --git a/client/modules/IDE/components/FileNode.stories.jsx b/client/modules/IDE/components/FileNode.stories.jsx index 826bc6193e..da3dc091ef 100644 --- a/client/modules/IDE/components/FileNode.stories.jsx +++ b/client/modules/IDE/components/FileNode.stories.jsx @@ -15,6 +15,7 @@ export const Show = () => ( name="File name" fileType="jpeg" isSelectedFile + setParentId={action('setParentId')} isFolderClosed={false} setSelectedFile={action('setSelectedFile')} deleteFile={action('deleteFile')} diff --git a/client/modules/IDE/components/FileNode.test.jsx b/client/modules/IDE/components/FileNode.test.jsx index 3f6706a2c0..11f2eb15c3 100644 --- a/client/modules/IDE/components/FileNode.test.jsx +++ b/client/modules/IDE/components/FileNode.test.jsx @@ -33,6 +33,7 @@ describe('', () => { canEdit: true, children: [], authenticated: false, + setParentId: jest.fn(), setSelectedFile: jest.fn(), deleteFile: jest.fn(), updateFileName: jest.fn(), diff --git a/client/modules/IDE/components/Sidebar.jsx b/client/modules/IDE/components/Sidebar.jsx index 00856f8fad..c947ecaa1f 100644 --- a/client/modules/IDE/components/Sidebar.jsx +++ b/client/modules/IDE/components/Sidebar.jsx @@ -28,8 +28,7 @@ class Sidebar extends React.Component { this.onFocusComponent = this.onFocusComponent.bind(this); this.state = { - isFocused: false, - rootFile: props.files.filter((file) => file.name === 'root')[0] + isFocused: false }; } @@ -66,16 +65,14 @@ class Sidebar extends React.Component { thumbnailWidth: 200, thumbnailHeight: 200, acceptedFiles: fileExtensionsAndMimeTypes, - dictDefaultMessage: this.props.t(''), + dictDefaultMessage: this.props.t('FileUploader.DictDefaultMessage'), accept: this.props.dropzoneAcceptCallback.bind(this, userId), - complete: this.props.dropzoneCompleteCallbackAid.bind( - this, - elementId, - this.state.rootFile.id - ), - sending: this.props.dropzoneSendingCallback + sending: this.props.dropzoneSendingCallback, + complete: (file) => { + this.props.dropzoneCompleteCallback(elementId, file); + this.uploader.removeFile(file); + } }); - this.uploader.removeAllFiles(); } resetSelectedFile() { @@ -115,6 +112,7 @@ class Sidebar extends React.Component { 'sidebar--project-options': this.props.projectOptionsVisible, 'sidebar--cant-edit': !canEditProject }); + const rootFile = this.props.files.filter((file) => file.name === 'root')[0]; return (
{ - this.props.newFolder(this.state.rootFile.id); + this.props.newFolder(rootFile.id); setTimeout(this.props.closeProjectOptions, 0); }} onBlur={this.onBlurComponent} @@ -157,7 +155,7 @@ class Sidebar extends React.Component {
- +
); @@ -220,7 +215,7 @@ Sidebar.propTypes = { t: PropTypes.func.isRequired, dropzoneAcceptCallback: PropTypes.func.isRequired, dropzoneSendingCallback: PropTypes.func.isRequired, - dropzoneCompleteCallbackAid: PropTypes.func.isRequired + dropzoneCompleteCallback: PropTypes.func.isRequired }; Sidebar.defaultProps = { diff --git a/client/modules/IDE/reducers/ide.js b/client/modules/IDE/reducers/ide.js index 56eeaab6f5..4e7a6a57b7 100644 --- a/client/modules/IDE/reducers/ide.js +++ b/client/modules/IDE/reducers/ide.js @@ -45,6 +45,8 @@ const ide = (state = initialState, action) => { parentId: action.parentId, newFolderModalVisible: false }); + case ActionTypes.SET_PARENT_ID: + return Object.assign({}, state, { parentId: action.parentId }); case ActionTypes.HIDE_MODAL: return Object.assign({}, state, { modalIsVisible: false }); case ActionTypes.COLLAPSE_SIDEBAR: diff --git a/client/styles/components/_uploader.scss b/client/styles/components/_uploader.scss index be3c714a93..5a3286a93c 100644 --- a/client/styles/components/_uploader.scss +++ b/client/styles/components/_uploader.scss @@ -17,8 +17,9 @@ .uploaderAid { display: flex; - width: 100%; - height: 100%; + flex-direction: column; + flex-wrap: wrap; + height: 60%; flex-flow: column wrap; z-index: 2; opacity: 0.5;