github/filestash
4
0
Fork 0
mirror of https://github.com/mickael-kerjean/filestash.git synced 2024-04-21 12:32:08 +00:00
Code Issues Releases Wiki Activity

perf (filebrowse): optimise frontend client on hot path

Browse Source
This commit is contained in:
Mickael KERJEAN
2019-03-08 00:10:45 +11:00
parent 581b89f700
commit 20bf336a1b
2 changed files with 17 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/pages/filespage.js
+8 -8
View File
@@ -114,14 +114,14 @@ export class FilesPage extends React.Component {
this._cleanupListeners();
const observer = Files.ls(path).subscribe((res) => {
if(res.status === 'ok'){
let files = res.results;
files = files.map((file) => {
let path = this.state.path+file.name;
file.link = file.type === "file" ? "/view"+path : "/files"+path+"/";
return file;
});
if(this.state.show_hidden === false){
files = files.filter((file) => file.name[0] === "." ? false : true);
let files = new Array(res.results.length);
for(let i=0,l=res.results.length; i<l; i++){
let path = this.state.path+res.results[i].name;
if(this.state.show_hidden === false && path[0] === "."){
continue;
}
files[i] = res.results[i];
files[i].link = res.results[i].type === "file" ? "/view"+path : "/files"+path+"/";
}
this.setState({
metadata: res.metadata,
client/pages/filespage/filesystem.js
+9 -11
View File
@@ -15,18 +15,12 @@ import { FileZone } from './filezone';
connectDropFile: connect.dropTarget(),
fileIsOver: monitor.isOver()
}))
export class FileSystem extends React.Component {
constructor(props){
super(props);
}
export class FileSystem extends React.PureComponent {
render() {
const metadata = this.props.metadata || {};
// TODO: https://reactjs.org/docs/higher-order-components.html#dont-use-hocs-inside-the-render-method
return this.props.connectDropFile(
<div className="component_filesystem">
<Container>
<NewThing path={this.props.path} sort={this.props.sort} view={this.props.view} onViewUpdate={(value) => this.props.onView(value)} onSortUpdate={(value) => {this.props.onSort(value);}} accessRight={metadata}></NewThing>
<NewThing path={this.props.path} sort={this.props.sort} view={this.props.view} onViewUpdate={(value) => this.props.onView(value)} onSortUpdate={(value) => {this.props.onSort(value);}} accessRight={this.props.metadata || {}}></NewThing>
<NgIf cond={this.props.fileIsOver}>
<FileZone path={this.props.path} />
</NgIf>
@@ -35,7 +29,7 @@ export class FileSystem extends React.Component {
{
this.props.files.map((file, index) => {
if(file.type === 'directory' || file.type === 'file' || file.type === 'link' || file.type === 'bucket'){
return ( <ExistingThing view={this.props.view} key={file.name+file.path+(file.icon || '')} file={file} path={this.props.path} metadata={metadata} /> );
return ( <ExistingThing view={this.props.view} key={file.name+file.path+(file.icon || '')} file={file} path={this.props.path} metadata={this.props.metadata || {}} /> );
}
})
}
@@ -56,5 +50,9 @@ export class FileSystem extends React.Component {
FileSystem.propTypes = {
path: PropTypes.string.isRequired,
files: PropTypes.array.isRequired,
metadata: PropTypes.object.isRequired
}
metadata: PropTypes.object.isRequired,
sort: PropTypes.string.isRequired,
view: PropTypes.string.isRequired,
onView: PropTypes.func.isRequired,
onSort: PropTypes.func.isRequired
};