r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

✨ make sidebar close on file click

Browse source
This commit is contained in:
ghalestrilo 2020-08-07 18:48:39 -03:00
parent faaa6d2edb
commit df5ac3fb4c
4 changed files with 12 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
client/components/mobile/Explorer.jsx
View file

@ -7,7 +7,7 @@ import ConnectedFileNode from '../../modules/IDE/components/FileNode';
const Explorer = ({ id, canEdit, onPressClose }) => (
<Sidebar title="Files" onPressClose={onPressClose}>
<ConnectedFileNode id={id} canEdit={canEdit} onClickFile={onPressClose} />
<ConnectedFileNode id={id} canEdit={canEdit} onClickFile={() => onPressClose()} />
</Sidebar>
);

2
client/components/mobile/Sidebar.jsx
View file

@ -20,8 +20,6 @@ const SidebarWrapper = styled.div`
box-shadow: 0 6px 6px 0 rgba(0,0,0,0.10);
`;
// onClick={() => alert('haha')}
const Sidebar = ({ title, onPressClose, children }) => (
<SidebarWrapper>
{title &&

2
client/components/useAsModal.jsx
View file

@ -15,8 +15,6 @@ const BackgroundOverlay = styled.div`
export default (Element, hasOverlay = false) => {
const [visible, toggle, setRef] = useModalBehavior();
// const Comp = styled(() => Element).attrs({ onPressClose: toggle });
const wrapper = () => (visible &&
<div>
{hasOverlay && <BackgroundOverlay />}

13
client/modules/IDE/components/FileNode.jsx
View file

@ -108,10 +108,15 @@ export class FileNode extends React.Component {
handleFileClick = (event) => {
event.stopPropagation();
const { isDeleting } = this.state;
const { id, setSelectedFile, name } = this.props;
const {
id, setSelectedFile, name, onClickFile
} = this.props;
if (name !== 'root' && !isDeleting) {
setSelectedFile(id);
}
// debugger; // eslint-disable-line
if (onClickFile) { onClickFile(); }
}
handleFileNameChange = (event) => {
@ -214,7 +219,7 @@ export class FileNode extends React.Component {
renderChild = childId => (
<li key={childId}>
<ConnectedFileNode id={childId} parentId={this.props.id} canEdit={this.props.canEdit} />
<ConnectedFileNode id={childId} parentId={this.props.id} canEdit={this.props.canEdit} onClickFile={this.props.onClickFile} />
</li>
)
@ -382,10 +387,12 @@ FileNode.propTypes = {
hideFolderChildren: PropTypes.func.isRequired,
canEdit: PropTypes.bool.isRequired,
openUploadFileModal: PropTypes.func.isRequired,
authenticated: PropTypes.bool.isRequired
authenticated: PropTypes.bool.isRequired,
onClickFile: PropTypes.func
};
FileNode.defaultProps = {
onClickFile: null,
parentId: '0',
isSelectedFile: false,
isFolderClosed: false,