added appFactory as HOC + improved app interface + added some trad

src/appFactory.js

@@ -0,0 +1,36 @@
+import React from 'react'
+import { FETCH_CONFIG } from './helper.js'
+
+export function appFactory (WrappedComponent) {
+  return class AppFactory extends React.Component {
+    renderApp = (user, workspace, app, content) => GLOBAL_renderApp({
+      loggedUser: user.isLoggedIn ? user : {},
+      workspace: {
+        id: workspace.id,
+        title: workspace.title
+      },
+      appConfig: {
+        ...app[content.type],
+        apiUrl: FETCH_CONFIG.apiUrl
+      },
+      content
+    })
+
+    emitEventApp = (type, data) => GLOBAL_dispatchEvent(type, data)
+
+    hideApp = appName => GLOBAL_hideApp(appName)
+
+    render () {
+      return (
+        <WrappedComponent
+          {...this.props}
+          renderApp={this.renderApp}
+          emitEventApp={this.emitEventApp}
+          hideApp={this.hideApp}
+        />
+      )
+    }
+  }
+}
+
+export default appFactory

src/container/Sidebar.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { connect } from 'react-redux'
 import { withRouter } from 'react-router'
+import { translate } from 'react-i18next'
 import WorkspaceListItem from '../component/Sidebar/WorkspaceListItem.jsx'
 import { getWorkspaceList } from '../action-creator.async.js'
 import { setWorkspaceListIsOpen } from '../action-creator.sync.js'
@@ -31,7 +32,7 @@ class Sidebar extends React.Component {
   }
 
   render () {
-    const { workspaceList } = this.props
+    const { workspaceList, t } = this.props
 
     return (
       <div className='sidebar d-none d-lg-table-cell'>
@@ -53,7 +54,7 @@ class Sidebar extends React.Component {
 
         <div className='sidebar__btnnewworkspace'>
           <button className='sidebar__btnnewworkspace__btn btn btn-success'>
-            Créer un workspace
+            {t('Sidebar.create_new_workspace')}
           </button>
         </div>
       </div>
@@ -62,4 +63,4 @@ class Sidebar extends React.Component {
 }
 
 const mapStateToProps = ({ user, workspaceList }) => ({ user, workspaceList })
-export default withRouter(connect(mapStateToProps)(Sidebar))
+export default withRouter(connect(mapStateToProps)(translate()(Sidebar)))

src/container/WorkspaceContent.jsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import { connect } from 'react-redux'
+import appFactory from '../appFactory.js'
 import Folder from '../component/Workspace/Folder.jsx'
 import FileItem from '../component/Workspace/FileItem.jsx'
 import FileItemHeader from '../component/Workspace/FileItemHeader.jsx'
@@ -7,8 +8,6 @@ import PageWrapper from '../component/common/layout/PageWrapper.jsx'
 import PageTitle from '../component/common/layout/PageTitle.jsx'
 import PageContent from '../component/common/layout/PageContent.jsx'
 import DropdownCreateButton from '../component/common/Input/DropdownCreateButton.jsx'
-import { FETCH_CONFIG } from '../helper.js'
-import { setActiveFileContentActive } from '../action-creator.sync.js'
 import {
   getAppList,
   getWorkspaceContent
@@ -44,22 +43,9 @@ class WorkspaceContent extends React.Component {
   }
 
   handleClickContentItem = content => {
-    const { user, workspace, dispatch } = this.props
-
-    GLOBAL_renderApp({
-      workspace: {
-        id: workspace.id,
-        title: workspace.title
-      },
-      appConfig: {
-        ...this.props.app[content.type],
-        apiUrl: FETCH_CONFIG.apiUrl
-      },
-      loggedUser: user.isLoggedIn ? user : {},
-      content
-    })
-
-    dispatch(setActiveFileContentActive(content))
+    this.props.renderApp(this.props.user, this.props.workspace, this.props.app, content)
+    // Côme - 2018/03/08 - line bellow is useless because we cannot call the reducer again when hiding app since the call comes from the app
+    // dispatch(setActiveFileContentActive(content))
   }
 
   render () {
@@ -106,4 +92,4 @@ class WorkspaceContent extends React.Component {
 }
 
 const mapStateToProps = ({ user, workspace, workspaceList, app }) => ({ user, workspace, workspaceList, app })
-export default connect(mapStateToProps)(WorkspaceContent)
+export default connect(mapStateToProps)(appFactory(WorkspaceContent))

src/translate/en.js

@@ -15,6 +15,9 @@ const en = {
     Folder: {
       create: 'Create',
       content_type: 'Content type'
+    },
+    Sidebar: {
+      create_new_workspace: 'Create new workspace'
     }
   }
 }

src/translate/fr.js

@@ -15,6 +15,9 @@ const fr = {
     Folder: {
       create: 'Créer',
       content_type: 'Type de contenu'
+    },
+    Sidebar: {
+      create_new_workspace: 'Créer un workspace'
     }
   }
 }