Преглед изворни кода

fixed html-document slug + fixed popup create content closing + fixed translation

Skylsmoi пре 6 година
родитељ
комит
78466f7d62

+ 1 - 1
frontend/dist/appInterface.js Прегледај датотеку

@@ -3,7 +3,7 @@
3 3
 
4 4
   getSelectedApp = name => {
5 5
     switch (name) {
6
-      case 'html-documents':
6
+      case 'html-document':
7 7
         return appHtmlDocument
8 8
       case 'thread':
9 9
         return appThread

+ 2 - 1
frontend/src/appFactory.js Прегледај датотеку

@@ -24,7 +24,8 @@ export function appFactory (WrappedComponent) {
24 24
         domContainer: 'popupCreateContentContainer',
25 25
         apiUrl: FETCH_CONFIG.apiUrl,
26 26
         mockApiUrl: FETCH_CONFIG.mockApiUrl,
27
-        apiHeader: FETCH_CONFIG.headers // should this be used by app ? right now, apps have their own headers
27
+        apiHeader: FETCH_CONFIG.headers, // should this be used by app ? right now, apps have their own headers
28
+        translation: i18n.store.data
28 29
       },
29 30
       idWorkspace,
30 31
       idFolder: idFolder === 'null' ? null : idFolder

+ 1 - 1
frontend/src/component/Workspace/OpenContentApp.jsx Прегледај датотеку

@@ -22,7 +22,7 @@ export class OpenContentApp extends React.Component {
22 22
 
23 23
       if (appOpenedType === contentToOpen.type) { // app already open
24 24
         GLOBAL_dispatchEvent({
25
-          type: `${contentToOpen.type}_reloadContent`, // handled by html-documents:src/container/HtmlDocument.jsx
25
+          type: `${contentToOpen.type}_reloadContent`, // handled by html-document:src/container/HtmlDocument.jsx
26 26
           data: contentToOpen
27 27
         })
28 28
       } else { // open another app

+ 6 - 4
frontend/src/container/Header.jsx Прегледај датотеку

@@ -1,6 +1,7 @@
1 1
 import React from 'react'
2 2
 import { connect } from 'react-redux'
3 3
 import i18n from '../i18n.js'
4
+import appFactory from '../appFactory.js'
4 5
 import { translate } from 'react-i18next'
5 6
 import Cookies from 'js-cookie'
6 7
 import Logo from '../component/Header/Logo.jsx'
@@ -32,9 +33,10 @@ class Header extends React.Component {
32 33
   handleChangeInput = e => this.setState({inputSearchValue: e.target.value})
33 34
   handleClickSubmit = () => {}
34 35
 
35
-  handleChangeLang = langId => {
36
-    this.props.dispatch(setUserLang(langId))
37
-    i18n.changeLanguage(langId)
36
+  handleChangeLang = idLang => {
37
+    this.props.dispatch(setUserLang(idLang))
38
+    i18n.changeLanguage(idLang)
39
+    this.props.emitEventApp('allApp_changeLang', idLang)
38 40
   }
39 41
 
40 42
   handleClickHelp = () => {}
@@ -105,4 +107,4 @@ class Header extends React.Component {
105 107
 }
106 108
 
107 109
 const mapStateToProps = ({ lang, user }) => ({ lang, user })
108
-export default connect(mapStateToProps)(translate()(Header))
110
+export default connect(mapStateToProps)(translate()(appFactory(Header)))

+ 1 - 1
frontend_app_html-document/dist/index.html Прегледај датотеку

@@ -3,7 +3,7 @@
3 3
 <head>
4 4
   <meta charset='utf-8' />
5 5
   <meta name="viewport" content="width=device-width, user-scalable=no" />
6
-  <title>Html-documents App Tracim</title>
6
+  <title>Html-document App Tracim</title>
7 7
   <link rel='shortcut icon' href='favicon.ico'>
8 8
 
9 9
   <link rel="stylesheet" type="text/css" href="./font/font-awesome-4.7.0/css/font-awesome.css">

+ 2 - 1
frontend_app_html-document/i18next.scanner/en/translation.json Прегледај датотеку

@@ -1,3 +1,4 @@
1 1
 {
2
-  "Last version": "Last version"
2
+  "Last version": "Last version",
3
+  "Validate and create": "Validate and create"
3 4
 }

+ 2 - 1
frontend_app_html-document/i18next.scanner/fr/translation.json Прегледај датотеку

@@ -1,3 +1,4 @@
1 1
 {
2
-  "Last version": "Dernière version"
2
+  "Last version": "Dernière version",
3
+  "Validate and create": "Valider et créer"
3 4
 }

+ 1 - 1
frontend_app_html-document/package.json Прегледај датотеку

@@ -1,5 +1,5 @@
1 1
 {
2
-  "name": "tracim_app_html-documents",
2
+  "name": "tracim_app_html-document",
3 3
   "version": "1.1.2",
4 4
   "description": "",
5 5
   "main": "index.js",

+ 5 - 5
frontend_app_html-document/src/component/HtmlDocument.jsx Прегледај датотеку

@@ -4,27 +4,27 @@ import { MODE } from '../helper.js'
4 4
 
5 5
 const HtmlDocument = props => {
6 6
   return (
7
-    <div className='wsContentHtmlDocument__contentpage__textnote html-documents__contentpage__textnote'>
7
+    <div className='wsContentHtmlDocument__contentpage__textnote html-document__contentpage__textnote'>
8 8
       {(props.mode === MODE.VIEW || props.mode === MODE.REVISION) &&
9 9
         <div>
10
-          <div className='html-documents__contentpage__textnote__version'>
10
+          <div className='html-document__contentpage__textnote__version'>
11 11
             version n°
12 12
             <div dangerouslySetInnerHTML={{__html: props.mode === MODE.VIEW ? props.lastVersion : props.version}} />
13 13
             {props.mode === MODE.REVISION &&
14
-              <div className='html-documents__contentpage__textnote__lastversion'>
14
+              <div className='html-document__contentpage__textnote__lastversion'>
15 15
                 (dernière version : {props.lastVersion})
16 16
               </div>
17 17
             }
18 18
           </div>
19 19
           {/* need try to inject html in stateless component () => <span>{props.text}</span> */}
20
-          <div className='html-documents__contentpage__textnote__text' dangerouslySetInnerHTML={{__html: props.text}} />
20
+          <div className='html-document__contentpage__textnote__text' dangerouslySetInnerHTML={{__html: props.text}} />
21 21
         </div>
22 22
       }
23 23
 
24 24
       {props.mode === MODE.EDIT &&
25 25
         <TextAreaApp
26 26
           id={props.wysiwygNewVersion}
27
-          customClass={'html-documents__editionmode'}
27
+          customClass={'html-document__editionmode'}
28 28
           customColor={props.customColor}
29 29
           onClickCancelBtn={props.onClickCloseEditMode}
30 30
           onClickValidateBtn={props.onClickValidateBtn}

+ 18 - 6
frontend_app_html-document/src/container/HtmlDocument.jsx Прегледај датотеку

@@ -41,24 +41,36 @@ class HtmlDocument extends React.Component {
41 41
     }
42 42
 
43 43
     // i18n has been init, add resources from frontend
44
-    addAllResourceI18n(i18n, props.data ? props.data.config.translation : debug.config.translation)
44
+    addAllResourceI18n(i18n, this.state.config.translation)
45
+    i18n.changeLanguage(this.state.loggedUser.lang)
45 46
 
46 47
     document.addEventListener('appCustomEvent', this.customEventReducer)
47 48
   }
48 49
 
49 50
   customEventReducer = ({ detail: { type, data } }) => { // action: { type: '', data: {} }
50 51
     switch (type) {
51
-      case 'html-documents_showApp':
52
+      case 'html-document_showApp':
52 53
         console.log('%c<HtmlDocument> Custom event', 'color: #28a745', type, data)
53 54
         this.setState({isVisible: true})
54 55
         break
55
-      case 'html-documents_hideApp':
56
+      case 'html-document_hideApp':
56 57
         console.log('%c<HtmlDocument> Custom event', 'color: #28a745', type, data)
57 58
         this.setState({isVisible: false})
58 59
         break
59
-      case 'html-documents_reloadContent':
60
+      case 'html-document_reloadContent':
60 61
         console.log('%c<HtmlDocument> Custom event', 'color: #28a745', type, data)
61 62
         this.setState(prev => ({content: {...prev.content, ...data}, isVisible: true}))
63
+        break
64
+      case 'allApp_changeLang':
65
+        console.log('%c<HtmlDocument> Custom event', 'color: #28a745', type, data)
66
+        this.setState(prev => ({
67
+          loggedUser: {
68
+            ...prev.loggedUser,
69
+            lang: data
70
+          }
71
+        }))
72
+        i18n.changeLanguage(data)
73
+        break
62 74
     }
63 75
   }
64 76
 
@@ -322,7 +334,7 @@ class HtmlDocument extends React.Component {
322 334
 
323 335
               {mode === MODE.REVISION &&
324 336
                 <button
325
-                  className='wsContentGeneric__option__menu__lastversion html-documents__lastversionbtn btn'
337
+                  className='wsContentGeneric__option__menu__lastversion html-document__lastversionbtn btn'
326 338
                   onClick={this.handleClickLastVersion}
327 339
                   style={{backgroundColor: config.hexcolor, color: '#fdfdfd'}}
328 340
                 >
@@ -364,7 +376,7 @@ class HtmlDocument extends React.Component {
364 376
             lastVersion={timeline.filter(t => t.timelineType === 'revision').length}
365 377
             text={content.raw_content}
366 378
             onChangeText={this.handleChangeText}
367
-            key={'html-documents'}
379
+            key={'html-document'}
368 380
           />
369 381
 
370 382
           <Timeline

+ 27 - 7
frontend_app_html-document/src/container/PopupCreateHtmlDocument.jsx Прегледај датотеку

@@ -1,15 +1,17 @@
1 1
 import React from 'react'
2
+import { translate } from 'react-i18next'
2 3
 import {
3
-  CardPopupCreateContent, handleFetchResult
4
+  CardPopupCreateContent,
5
+  handleFetchResult,
6
+  addAllResourceI18n
4 7
 } from 'tracim_frontend_lib'
5 8
 import { postHtmlDocContent } from '../action.async.js'
6
-import {addAllResourceForI18n, addAllResourceI18n} from '../../../frontend_lib'
7 9
 import i18n from '../i18n.js'
8 10
 
9 11
 const debug = { // outdated
10 12
   config: {
11 13
     label: 'Text Document',
12
-    slug: 'html-documents',
14
+    slug: 'html-document',
13 15
     faIcon: 'file-text-o',
14 16
     hexcolor: '#3f52e3',
15 17
     creationLabel: 'Write a document',
@@ -37,7 +39,7 @@ class PopupCreateHtmlDocument extends React.Component {
37 39
   constructor (props) {
38 40
     super(props)
39 41
     this.state = {
40
-      appName: 'html-documents',
42
+      appName: 'html-document', // must remain 'html-document' because it is the name of the react built app (which contains HtmlDocument and PopupCreateHtmlDocument)
41 43
       config: props.data ? props.data.config : debug.config,
42 44
       loggedUser: props.data ? props.data.loggedUser : debug.loggedUser,
43 45
       idWorkspace: props.data ? props.data.idWorkspace : debug.idWorkspace,
@@ -46,7 +48,25 @@ class PopupCreateHtmlDocument extends React.Component {
46 48
     }
47 49
 
48 50
     // i18n has been init, add resources from frontend
49
-    addAllResourceI18n(i18n, props.data ? props.data.config.translation : debug.config.translation)
51
+    addAllResourceI18n(i18n, this.state.config.translation)
52
+    i18n.changeLanguage(this.state.loggedUser.lang)
53
+
54
+    document.addEventListener('appCustomEvent', this.customEventReducer)
55
+  }
56
+
57
+  customEventReducer = ({ detail: { type, data } }) => { // action: { type: '', data: {} }
58
+    switch (type) {
59
+      case 'allApp_changeLang':
60
+        console.log('%c<PopupCreateHtmlDocument> Custom event', 'color: #28a745', type, data)
61
+        this.setState(prev => ({
62
+          loggedUser: {
63
+            ...prev.loggedUser,
64
+            lang: data
65
+          }
66
+        }))
67
+        i18n.changeLanguage(data)
68
+        break
69
+    }
50 70
   }
51 71
 
52 72
   handleChangeNewContentName = e => this.setState({newContentName: e.target.value})
@@ -93,10 +113,10 @@ class PopupCreateHtmlDocument extends React.Component {
93 113
         faIcon={this.state.config.faIcon}
94 114
         contentName={this.state.newContentName}
95 115
         onChangeContentName={this.handleChangeNewContentName}
96
-        btnValidateLabel='Valider et créer'
116
+        btnValidateLabel={this.props.t('Validate and create')}
97 117
       />
98 118
     )
99 119
   }
100 120
 }
101 121
 
102
-export default PopupCreateHtmlDocument
122
+export default translate()(PopupCreateHtmlDocument)

+ 5 - 5
frontend_app_html-document/src/css/index.styl Прегледај датотеку

@@ -1,6 +1,6 @@
1 1
 @import "../../node_modules/tracim_frontend_lib/src/css/Variable.styl"
2 2
 
3
-.html-documents
3
+.html-document
4 4
   width 70%
5 5
   &__header
6 6
     &__editionmode
@@ -68,7 +68,7 @@
68 68
     background-color htmlColor
69 69
 
70 70
 @media (min-width: min-sm) and (max-width: max-lg)
71
-  .html-documents
71
+  .html-document
72 72
     &__contentpage
73 73
       &__content
74 74
         margin 10px
@@ -77,18 +77,18 @@
77 77
 
78 78
 @media (min-width: min-md) and (max-width: max-md)
79 79
 
80
-  .html-documents
80
+  .html-document
81 81
     top 68px
82 82
 
83 83
 @media (min-width: min-sm) and (max-width: max-sm)
84 84
 
85
-  .html-documents
85
+  .html-document
86 86
     top 68px
87 87
     width 100%
88 88
 
89 89
 @media (max-width: max-xs)
90 90
 
91
-  .html-documents
91
+  .html-document
92 92
     top 68px
93 93
     width 100%
94 94
     &__contentpage

+ 4 - 3
frontend_app_html-document/src/helper.js Прегледај датотеку

@@ -16,7 +16,7 @@ export const MODE = {
16 16
 export const debug = {
17 17
   config: {
18 18
     label: 'Text Document',
19
-    slug: 'html-documents',
19
+    slug: 'html-document',
20 20
     faIcon: 'file-text-o',
21 21
     hexcolor: '#3f52e3',
22 22
     creationLabel: 'Write a document',
@@ -71,6 +71,7 @@ export const debug = {
71 71
     firstname: 'Côme',
72 72
     lastname: 'Stoilenom',
73 73
     email: 'osef@algoo.fr',
74
+    lang: 'en',
74 75
     avatar_url: 'https://avatars3.githubusercontent.com/u/11177014?s=460&v=4',
75 76
     auth: btoa(`${'admin@admin.admin'}:${'admin@admin.admin'}`)
76 77
   },
@@ -81,7 +82,7 @@ export const debug = {
81 82
       user_id: 1 // -1 or 1 for debug
82 83
     },
83 84
     content_id: 22, // 1 or 22 for debug
84
-    content_type: 'html-documents',
85
+    content_type: 'html-document',
85 86
     created: '2018-06-18T14:59:26Z',
86 87
     current_revision_id: 11,
87 88
     is_archived: false,
@@ -98,7 +99,7 @@ export const debug = {
98 99
     show_in_ui: true,
99 100
     slug: 'current-menu',
100 101
     status: 'open',
101
-    sub_content_types: ['thread', 'html-documents', 'file', 'folder'],
102
+    sub_content_types: ['thread', 'html-document', 'file', 'folder'],
102 103
     workspace_id: 1
103 104
   },
104 105
   timeline: timelineDebugData

+ 1 - 1
frontend_app_html-document/src/index.js Прегледај датотеку

@@ -10,7 +10,7 @@ import PopupCreateHtmlDocument from './container/PopupCreateHtmlDocument.jsx'
10 10
 require('./css/index.styl')
11 11
 
12 12
 const appInterface = {
13
-  name: 'HtmlDocument',
13
+  name: 'html-document',
14 14
   isRendered: false,
15 15
   renderAppFull: data => {
16 16
     return ReactDOM.render(

+ 3 - 1
frontend_app_thread/i18next.scanner/en/translation.json Прегледај датотеку

@@ -1 +1,3 @@
1
-{}
1
+{
2
+  "Validate and create": "Validate and create"
3
+}

+ 3 - 1
frontend_app_thread/i18next.scanner/fr/translation.json Прегледај датотеку

@@ -1 +1,3 @@
1
-{}
1
+{
2
+  "Validate and create": "Valider et créer"
3
+}

+ 26 - 6
frontend_app_thread/src/container/PopupCreateThread.jsx Прегледај датотеку

@@ -1,14 +1,16 @@
1 1
 import React from 'react'
2
+import { translate } from 'react-i18next'
2 3
 import {
3 4
   addAllResourceI18n,
4 5
   CardPopupCreateContent,
5 6
   handleFetchResult
6 7
 } from 'tracim_frontend_lib'
7 8
 import { postThreadContent } from '../action.async.js'
9
+import i18n from '../i18n.js'
8 10
 
9 11
 const debug = { // outdated
10 12
   config: {
11
-    label: 'Thread',
13
+    label: 'PopupCreateThread',
12 14
     slug: 'thread',
13 15
     faIcon: 'file-text-o',
14 16
     hexcolor: '#ad4cf9',
@@ -42,11 +44,11 @@ const debug = { // outdated
42 44
   idFolder: null
43 45
 }
44 46
 
45
-class PopupCreateHtmlDocument extends React.Component {
47
+class PopupCreateThread extends React.Component {
46 48
   constructor (props) {
47 49
     super(props)
48 50
     this.state = {
49
-      appName: 'thread',
51
+      appName: 'thread', // must remain 'thread' because it is the name of the react built app (which contains Threac and PopupCreateThread)
50 52
       config: props.data ? props.data.config : debug.config,
51 53
       loggedUser: props.data ? props.data.loggedUser : debug.loggedUser,
52 54
       idWorkspace: props.data ? props.data.idWorkspace : debug.idWorkspace,
@@ -55,7 +57,25 @@ class PopupCreateHtmlDocument extends React.Component {
55 57
     }
56 58
 
57 59
     // i18n has been init, add resources from frontend
58
-    addAllResourceI18n(i18n, props.data ? props.data.config.translation : debug.config.translation)
60
+    addAllResourceI18n(i18n, this.state.config.translation)
61
+    i18n.changeLanguage(this.state.loggedUser.lang)
62
+
63
+    document.addEventListener('appCustomEvent', this.customEventReducer)
64
+  }
65
+
66
+  customEventReducer = ({ detail: { type, data } }) => { // action: { type: '', data: {} }
67
+    switch (type) {
68
+      case 'allApp_changeLang':
69
+        console.log('%c<PopupCreateThread> Custom event', 'color: #28a745', type, data)
70
+        this.setState(prev => ({
71
+          loggedUser: {
72
+            ...prev.loggedUser,
73
+            lang: data
74
+          }
75
+        }))
76
+        i18n.changeLanguage(data)
77
+        break
78
+    }
59 79
   }
60 80
 
61 81
   handleChangeNewContentName = e => this.setState({newContentName: e.target.value})
@@ -101,10 +121,10 @@ class PopupCreateHtmlDocument extends React.Component {
101 121
         faIcon={this.state.config.faIcon}
102 122
         contentName={this.state.newContentName}
103 123
         onChangeContentName={this.handleChangeNewContentName}
104
-        btnValidateLabel='Valider et créer'
124
+        btnValidateLabel={this.props.t('Validate and create')}
105 125
       />
106 126
     )
107 127
   }
108 128
 }
109 129
 
110
-export default PopupCreateHtmlDocument
130
+export default translate()(PopupCreateThread)

+ 13 - 1
frontend_app_thread/src/container/Thread.jsx Прегледај датотеку

@@ -35,7 +35,8 @@ class Thread extends React.Component {
35 35
     }
36 36
 
37 37
     // i18n has been init, add resources from frontend
38
-    addAllResourceI18n(i18n, props.data ? props.data.config.translation : debug.config.translation)
38
+    addAllResourceI18n(i18n, this.state.config.translation)
39
+    i18n.changeLanguage(this.state.loggedUser.lang)
39 40
 
40 41
     document.addEventListener('appCustomEvent', this.customEventReducer)
41 42
   }
@@ -53,6 +54,17 @@ class Thread extends React.Component {
53 54
       case 'thread_reloadContent':
54 55
         console.log('%c<Thread> Custom event', 'color: #28a745', type, data)
55 56
         this.setState(prev => ({content: {...prev.content, ...data}, isVisible: true}))
57
+        break
58
+      case 'allApp_changeLang':
59
+        console.log('%c<Thread> Custom event', 'color: #28a745', type, data)
60
+        this.setState(prev => ({
61
+          loggedUser: {
62
+            ...prev.loggedUser,
63
+            lang: data
64
+          }
65
+        }))
66
+        i18n.changeLanguage(data)
67
+        break
56 68
     }
57 69
   }
58 70
 

+ 2 - 2
frontend_app_thread/src/helper.js Прегледај датотеку

@@ -5,7 +5,7 @@ export const FETCH_CONFIG = {
5 5
   }
6 6
 }
7 7
 
8
-export const debug = { // copied from html-documents => outdated
8
+export const debug = { // copied from html-document => outdated
9 9
   config: {
10 10
     label: 'Thread',
11 11
     slug: 'thread',
@@ -78,7 +78,7 @@ export const debug = { // copied from html-documents => outdated
78 78
     show_in_ui: true,
79 79
     slug: 'current-menu',
80 80
     status: 'open',
81
-    sub_content_types: ['thread', 'html-documents', 'file', 'folder'],
81
+    sub_content_types: ['thread', 'html-document', 'file', 'folder'],
82 82
     workspace_id: 1
83 83
   },
84 84
   timeline: [] // timelineDebugData

+ 1 - 1
frontend_app_thread/src/index.js Прегледај датотеку

@@ -6,7 +6,7 @@ import PopupCreateThread from './container/PopupCreateThread.jsx'
6 6
 require('./css/index.styl')
7 7
 
8 8
 const appInterface = {
9
-  name: 'Thread',
9
+  name: 'thread',
10 10
   isRendered: false,
11 11
   renderAppFull: data => {
12 12
     return ReactDOM.render(