1 files changed, 44 insertions, 5 deletions

diff --git a/app/client/dashboard/dashboard.component.js b/app/client/dashboard/dashboard.component.js
index 58808a3..5d874c8 100644
--- a/app/client/dashboard/dashboard.component.js
+++ b/app/client/dashboard/dashboard.component.js
@@ -1,5 +1,6 @@
 import { h, Component } from 'preact'
 import { bindActionCreators } from 'redux'
+import { Link } from 'react-router-dom'
 import { connect } from 'react-redux'
 
 import Player from '../common/player.component'
@@ -10,10 +11,11 @@ import Button from '../common/button.component'
 
 import DashboardHeader from './dashboardheader.component'
 import TaskList from './tasklist.component'
-import { FileList } from '../common'
+import { FolderList, FileList } from '../common'
 import Gallery from '../common/gallery.component'
 
 import * as dashboardActions from './dashboard.actions'
+import * as audioPlayerActions from '../common/audioPlayer/audioPlayer.actions'
 import modules from '../modules'
 import actions from '../actions'
 
@@ -28,16 +30,48 @@ class Dashboard extends Component {
     //   this.props.actions.list_epochs(nextProps.opt.checkpoint_name)
   }
   render(){
-    const { site, foldersByModule, queue, images } = this.props
+    const { site, foldersByModule, sampleRNNrenders, queue, images } = this.props
     const { tasks } = queue
     const folders = foldersByModule && Object.keys(modules).sort().map(key => {
       console.log(key)
       console.log(foldersByModule[key])
+      if (! foldersByModule[key]) return null
+      const path = key === 'samplernn' ? '/samplernn/datasets/' : '/' + key + '/sequences/'
+      const folders = foldersByModule[key].map(folder => {
+        return (
+          <div key={folder.id}>
+            <Link to={path + folder.id + '/'}>{folder.name}</Link>
+          </div>
+        )
+      })
+      const files = key === 'samplernn' && (
+        <FileList
+          files={sampleRNNrenders}
+          orderBy='date desc'
+          fields={'name date epoch size'}
+          onClick={(file, e) => {
+            e.preventDefault()
+            e.stopPropagation()
+            console.log('picked a file', file)
+            this.handlePick(file)
+          }}
+        />
+      )
+
       return (
-        <div>
+        <div className='dashboardModule' key={key}>
+          <div className='row moduleHeading'>
+            <h3>{key}</h3>
+            <div>
+              <Link to={'/' + key + '/new/'}>new</Link>
+            </div>
+            {folders}
+          </div>
+          {files}
         </div>
       )
-    })
+    }).filter(a => !!a)
+    console.log(sampleRNNrenders)
     return (
       <div className='app dashboard'>
         <DashboardHeader />
@@ -61,17 +95,22 @@ class Dashboard extends Component {
       </div>
     )
   }
+  handlePick(file){
+    this.props.audioPlayer.play(file)
+  }
 }
 const mapStateToProps = state => ({
   site: state.system.site,
   foldersByModule: state.dashboard.data.foldersByModule,
+  sampleRNNrenders: state.dashboard.data.sampleRNNrenders,
   images: state.dashboard.images,
   files: state.dashboard.files,
   queue: state.queue,
 })
 
 const mapDispatchToProps = (dispatch, ownProps) => ({
-  actions: bindActionCreators(dashboardActions, dispatch)
+  actions: bindActionCreators(dashboardActions, dispatch),
+  audioPlayer: bindActionCreators(audioPlayerActions, dispatch),
 })
 
 export default connect(mapStateToProps, mapDispatchToProps)(Dashboard)