Parcourir la source

added route for popup create content

Skylsmoi il y a 5 ans
Parent
révision
c6cfb32f2f

+ 7 - 0
dist/index.html Voir le fichier

65
       GLOBAL_renderCreateContentApp = app => {
65
       GLOBAL_renderCreateContentApp = app => {
66
         console.log('%cGLOBAL_renderCreateContentApp', 'color: #5cebeb', app)
66
         console.log('%cGLOBAL_renderCreateContentApp', 'color: #5cebeb', app)
67
 
67
 
68
+        const selectedApp = getSelectedApp(app.config.slug)
69
+
70
+        if (!selectedApp) {
71
+          console.log('Error in GLOBAL_renderCreateContentApp, selectedApp is undefined', app)
72
+          return
73
+        }
74
+
68
         getSelectedApp(app.config.slug).renderPopupCreation(app)
75
         getSelectedApp(app.config.slug).renderPopupCreation(app)
69
       }
76
       }
70
 
77
 

src/container/OpenContentApp.jsx → src/component/Workspace/OpenContentApp.jsx Voir le fichier

1
 import React from 'react'
1
 import React from 'react'
2
 import { connect } from 'react-redux'
2
 import { connect } from 'react-redux'
3
 import { withRouter } from 'react-router'
3
 import { withRouter } from 'react-router'
4
-import appFactory from '../appFactory.js'
4
+import appFactory from '../../appFactory.js'
5
 
5
 
6
 export class OpenContentApp extends React.Component {
6
 export class OpenContentApp extends React.Component {
7
   openContentApp = () => {
7
   openContentApp = () => {
8
     const { idWorkspace, appOpenedType, user, workspaceContent, contentType, renderApp, match } = this.props
8
     const { idWorkspace, appOpenedType, user, workspaceContent, contentType, renderApp, match } = this.props
9
 
9
 
10
-    if (isNaN(idWorkspace)) return
10
+    if (isNaN(idWorkspace) || idWorkspace === -1) return
11
 
11
 
12
-    if (['type', 'idcts'].every(p => p in match.params) && match.params.type !== 'contents' && workspaceContent.id !== -1 && workspaceContent.length) {
12
+    if (['type', 'idcts'].every(p => p in match.params) && match.params.type !== 'contents' && workspaceContent.length) {
13
       if (isNaN(match.params.idcts) || !contentType.map(c => c.slug).includes(match.params.type)) return
13
       if (isNaN(match.params.idcts) || !contentType.map(c => c.slug).includes(match.params.type)) return
14
 
14
 
15
       const contentToOpen = {
15
       const contentToOpen = {

+ 42 - 0
src/component/Workspace/OpenCreateContentApp.jsx Voir le fichier

1
+import React from 'react'
2
+import { connect } from 'react-redux'
3
+import { withRouter } from 'react-router'
4
+import appFactory from '../../appFactory.js'
5
+
6
+const qs = require('query-string')
7
+
8
+export class OpenCreateContentApp extends React.Component {
9
+  openCreateContentApp = () => {
10
+    const { idWorkspace, appOpenedType, user, contentType, renderCreateContentApp, match, location } = this.props
11
+
12
+    if (isNaN(idWorkspace) || idWorkspace === -1) return
13
+
14
+    if (['idws', 'type'].every(p => p in match.params) && contentType.map(c => c.slug).includes(match.params.type)) {
15
+      renderCreateContentApp(
16
+        contentType.find(ct => ct.slug === match.params.type),
17
+        user,
18
+        idWorkspace,
19
+        qs.parse(location.search).parent_id
20
+      )
21
+    }
22
+  }
23
+
24
+  componentDidMount () {
25
+    console.log('%c<OpenCreateContentApp> did Mount', 'color: #dcae84', this.props)
26
+
27
+    this.openCreateContentApp()
28
+  }
29
+
30
+  componentDidUpdate () {
31
+    console.log('%c<OpenCreateContentApp> did Update', 'color: #dcae84', this.props)
32
+
33
+    this.openCreateContentApp()
34
+  }
35
+
36
+  render () {
37
+    return null
38
+  }
39
+}
40
+
41
+const mapStateToProps = ({ user, workspaceContent, contentType }) => ({ user, workspaceContent, contentType })
42
+export default withRouter(connect(mapStateToProps)(appFactory(OpenCreateContentApp)))

+ 1 - 1
src/component/common/Input/DropdownCreateButton.jsx Voir le fichier

24
         aria-labelledby='dropdownCreateBtn'
24
         aria-labelledby='dropdownCreateBtn'
25
       >
25
       >
26
         <SubDropdownCreateButton
26
         <SubDropdownCreateButton
27
-          idFolder={null}
27
+          idFolder={props.idFolder}
28
           availableApp={props.availableApp}
28
           availableApp={props.availableApp}
29
           onClickCreateContent={props.onClickCreateContent}
29
           onClickCreateContent={props.onClickCreateContent}
30
         />
30
         />

+ 15 - 9
src/container/WorkspaceContent.jsx Voir le fichier

1
 import React from 'react'
1
 import React from 'react'
2
 import { connect } from 'react-redux'
2
 import { connect } from 'react-redux'
3
-import { withRouter } from 'react-router-dom'
3
+import { withRouter, Route } from 'react-router-dom'
4
 import appFactory from '../appFactory.js'
4
 import appFactory from '../appFactory.js'
5
 import { PAGE } from '../helper.js'
5
 import { PAGE } from '../helper.js'
6
 import Sidebar from './Sidebar.jsx'
6
 import Sidebar from './Sidebar.jsx'
11
 import PageTitle from '../component/common/layout/PageTitle.jsx'
11
 import PageTitle from '../component/common/layout/PageTitle.jsx'
12
 import PageContent from '../component/common/layout/PageContent.jsx'
12
 import PageContent from '../component/common/layout/PageContent.jsx'
13
 import DropdownCreateButton from '../component/common/Input/DropdownCreateButton.jsx'
13
 import DropdownCreateButton from '../component/common/Input/DropdownCreateButton.jsx'
14
-import OpenContentApp from './OpenContentApp.jsx'
14
+import OpenContentApp from '../component/Workspace/OpenContentApp.jsx'
15
+import OpenCreateContentApp from '../component/Workspace/OpenCreateContentApp.jsx'
15
 import {
16
 import {
16
   getAppList,
17
   getAppList,
17
   getContentTypeList,
18
   getContentTypeList,
59
         break
60
         break
60
 
61
 
61
       case 'appClosed':
62
       case 'appClosed':
63
+      case 'hide_popupCreateContent':
62
         console.log('%c<WorkspaceContent> Custom event', 'color: #28a745', type, data, this.state.workspaceIdInUrl)
64
         console.log('%c<WorkspaceContent> Custom event', 'color: #28a745', type, data, this.state.workspaceIdInUrl)
63
         this.props.history.push(PAGE.WORKSPACE.CONTENT_LIST(this.state.workspaceIdInUrl))
65
         this.props.history.push(PAGE.WORKSPACE.CONTENT_LIST(this.state.workspaceIdInUrl))
64
         this.setState({appOpenedType: false})
66
         this.setState({appOpenedType: false})
173
 
175
 
174
   handleClickCreateContent = (e, idFolder, contentType) => {
176
   handleClickCreateContent = (e, idFolder, contentType) => {
175
     e.stopPropagation()
177
     e.stopPropagation()
176
-    this.props.renderCreateContentApp(
177
-      this.props.contentType.find(ct => ct.slug === contentType),
178
-      this.props.user,
179
-      this.props.match.params.idws,
180
-      idFolder
181
-    )
178
+    this.props.history.push(`${PAGE.WORKSPACE.NEW(this.state.workspaceIdInUrl, contentType, idFolder)}?parent_id=${idFolder}`)
182
   }
179
   }
183
 
180
 
184
   handleUpdateAppOpenedType = openedAppType => this.setState({appOpenedType: openedAppType})
181
   handleUpdateAppOpenedType = openedAppType => this.setState({appOpenedType: openedAppType})
206
         <Sidebar />
203
         <Sidebar />
207
 
204
 
208
         <OpenContentApp
205
         <OpenContentApp
206
+          // automatically open the app for the idContent in url
209
           idWorkspace={this.state.workspaceIdInUrl}
207
           idWorkspace={this.state.workspaceIdInUrl}
210
           appOpenedType={this.state.appOpenedType}
208
           appOpenedType={this.state.appOpenedType}
211
           updateAppOpenedType={this.handleUpdateAppOpenedType}
209
           updateAppOpenedType={this.handleUpdateAppOpenedType}
212
         />
210
         />
213
 
211
 
212
+        <Route path={PAGE.WORKSPACE.NEW(':idws', ':type')} component={() =>
213
+          <OpenCreateContentApp
214
+            // automatically open the popup create content of the app in url
215
+            idWorkspace={this.state.workspaceIdInUrl}
216
+            appOpenedType={this.state.appOpenedType}
217
+          />
218
+        } />
219
+
214
         <PageWrapper customeClass='workspace'>
220
         <PageWrapper customeClass='workspace'>
215
           <PageTitle
221
           <PageTitle
216
             parentClass='workspace__header'
222
             parentClass='workspace__header'
219
           >
225
           >
220
             <DropdownCreateButton
226
             <DropdownCreateButton
221
               parentClass='workspace__header__btnaddworkspace'
227
               parentClass='workspace__header__btnaddworkspace'
222
-              idFolder={null}
228
+              idFolder={null} // null because it is workspace root content
223
               onClickCreateContent={this.handleClickCreateContent}
229
               onClickCreateContent={this.handleClickCreateContent}
224
               availableApp={contentType}
230
               availableApp={contentType}
225
             />
231
             />

+ 1 - 1
src/helper.js Voir le fichier

16
   HOME: '/',
16
   HOME: '/',
17
   WORKSPACE: {
17
   WORKSPACE: {
18
     DASHBOARD: (idws = ':idws') => `/workspaces/${idws}/dashboard`,
18
     DASHBOARD: (idws = ':idws') => `/workspaces/${idws}/dashboard`,
19
-    NEW: '/workspaces/new',
19
+    NEW: (idws, type) => `/workspaces/${idws}/${type}/new`,
20
     CALENDAR: (idws = ':idws') => `/workspaces/${idws}/calendar`,
20
     CALENDAR: (idws = ':idws') => `/workspaces/${idws}/calendar`,
21
     CONTENT_LIST: (idws = ':idws') => `/workspaces/${idws}/contents`,
21
     CONTENT_LIST: (idws = ':idws') => `/workspaces/${idws}/contents`,
22
     CONTENT: (idws = ':idws', type = ':type?', idcts = ':idcts?') => `/workspaces/${idws}/${type}/${idcts}`,
22
     CONTENT: (idws = ':idws', type = ':type?', idcts = ':idcts?') => `/workspaces/${idws}/${type}/${idcts}`,