page-complete component added

Author: ShMcK

lib/components/page/page.js

@@ -51,6 +51,7 @@ var TaskCheckbox = function (_a) {
 var material_ui_2 = require('material-ui');
 var content_1 = require('./content');
 var hint_1 = require('./hint');
+var page_complete_1 = require('./page-complete');
 var Info = require(iconPath + 'action/info');
 var InfoOutline = require(iconPath + 'action/info-outline');
 var style = {
@@ -120,11 +121,7 @@ var default_1 = (function (_super) {
                     ));
                 }), 
                 React.createElement(hint_1.TaskHints, {task: currentTask, hintPosition: hintPosition}), 
-                page.completed && !!page.onPageComplete ? React.createElement(material_ui_1.ListItem, {className: 'cr-task-onComplete', ref: 'onPageComplete'}, 
-                    React.createElement("div", {className: 'cr-task-onComplete-description'}, 
-                        React.createElement(_components_1.MarkdownText, {text: page.onPageComplete})
-                    )
-                ) : null, 
+                React.createElement(page_complete_1.PageCompleteMessage, {page: page}), 
                 React.createElement("div", {ref: 'listEnd'})), 
             React.createElement("section", {className: 'cr-page-toolbar'}, 
                 React.createElement(material_ui_2.LinearProgress, {mode: 'determinate', value: taskProgress(taskPosition, tasks.length), style: { height: '6px' }}), 

src/components/page/page.tsx

@@ -48,6 +48,7 @@ import {Paper, LinearProgress, Toolbar, ToolbarGroup, RaisedButton, FlatButton}
 
 import PageContent from './content';
 import {TaskHints} from './hint';
+import {PageCompleteMessage} from './page-complete';
 // import PageToolbar from './toolbar';
 
 let Info = require(iconPath + 'action/info');
@@ -154,11 +155,7 @@ render() {
         })
       }
       <TaskHints task={currentTask} hintPosition={hintPosition} />
-      {page.completed && !!page.onPageComplete ? <ListItem className='cr-task-onComplete' ref='onPageComplete'>
-        <div className='cr-task-onComplete-description'>
-          <MarkdownText text={page.onPageComplete} />
-        </div>
-      </ListItem> : null}
+      <PageCompleteMessage page={page} />
       <div ref='listEnd'></div>
     </List>