booleanhunter · booleanhunter · Mar 9, 2018 · Mar 3, 2018 · Mar 3, 2018 · Mar 5, 2018
diff --git a/package.json b/package.json
@@ -15,31 +15,33 @@
   "main": "reactjsAdminlte.js",
   "dependencies": {
     "jquery": "^3.1.1",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1"
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0"
   },
   "devDependencies": {
-    "babel-core": "~6.5.1",
-    "babel-loader": "~6.2.2",
-    "babel-preset-es2015": "~6.5.0",
-    "babel-preset-react": "~6.5.0",
+    "babel-core": "~6.26.0",
+    "babel-loader": "~7.1.3",
+    "babel-preset-es2015": "~6.24.1",
+    "babel-preset-react": "~6.24.1",
     "body-parser": "^1.14.0",
     "bower": "^1.7.7",
-    "chai": "^3.5.0",
-    "consolidate": "^0.13.1",
-    "css-loader": "^0.23.1",
-    "expect": "^1.20.2",
-    "express": "^4.13.3",
+    "consolidate": "^0.15.0",
+    "create-react-class": "^15.6.3",
+    "express": "^4.16.2",
     "handlebars": "^4.0.3",
     "jsx-loader": "^0.13.2",
-    "mocha": "^3.1.2",
     "raphael": "^2.1.4",
-    "webpack": "^1.14.0",
-    "webpack-raphael": "^2.1.4",
-    "react-hot-loader": "^1.3.1",
-    "style-loader": "^0.13.0",
     "velocity-animate": "^1.4.0",
-    "webpack-dev-server": "~1.14.1"
+    "webpack": "^4.0.1",
+    "webpack-raphael": "^2.1.4",
+    "chai": "^4.1.2",
+    "css-loader": "^0.28.10",
+    "expect": "^1.20.2",
+    "mocha": "^5.0.1",
+    "react-hot-loader": "^4.0.0",
+    "style-loader": "^0.20.2",
+    "webpack-cli": "^2.0.10",
+    "webpack-dev-server": "~3.1.0"
   },
   "scripts": {
     "dev": "node server.js",

diff --git a/reactjsAdminlte.js b/reactjsAdminlte.js
diff --git a/reactjsAdminlte.js.map b/reactjsAdminlte.js.map
diff --git a/src/components/chat-box/chat-box.js b/src/components/chat-box/chat-box.js
@@ -1,11 +1,12 @@
 define(
     [
         'react',
+        'create-react-class',
         'react-dom',
         '../../services/common-functions'
     ],
-    function (React, ReactDOM, commonFunctions) {
-        var ChatBox = React.createClass({
+    function (React, createReactClass, ReactDOM, commonFunctions) {
+        var ChatBox = createReactClass({
             getDefaultProps: function() {
                 return {
                     headerTheme: 'box-primary',

diff --git a/src/components/chat-box/contacts.js b/src/components/chat-box/contacts.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var Contacts = React.createClass({
+    function (React, createReactClass) {
+        var Contacts = createReactClass({
             render: function() {
 
                 var contacts = this.props.contacts.map(function(contactDetails, iterator){

diff --git a/src/components/chat-box/conversations.js b/src/components/chat-box/conversations.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var Conversations = React.createClass({
+    function (React, createReactClass) {
+        var Conversations = createReactClass({
             render: function() {
 
                 var conversations = this.props.conversations.map(function(messageDetails, iterator){

diff --git a/src/components/controls-menu.js b/src/components/controls-menu.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         'jquery',
     ],
-    function(React,$){
-        var ControlsMenu = React.createClass({
+    function (React, createReactClass, $){
+        var ControlsMenu = createReactClass({
             componentDidMount:function(){
 
             },

diff --git a/src/components/custom-box/box-tool.js b/src/components/custom-box/box-tool.js
@@ -1,11 +1,12 @@
 define(
     [
         'react',
+        'create-react-class',
         'react-dom',
         './box-functions'
     ],
-    function (React, ReactDOM, boxFunctions) {
-    	var BoxTool = React.createClass({
+    function (React, createReactClass, ReactDOM, boxFunctions) {
+    	var BoxTool = createReactClass({
             toggleCollapse: function(event){
                 var box = boxFunctions.findClosestElement(event.currentTarget, this.props.containerClass),
                     boxBody = box.children[1],

diff --git a/src/components/custom-box/box.js b/src/components/custom-box/box.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         'react-dom',
     ],
-    function (React, ReactDOM) {
-        var Box = React.createClass({
+    function (React, createReactClass, ReactDOM) {
+        var Box = createReactClass({
             getDefaultProps: function() {
                 return {
                     collapsed: false,

diff --git a/src/components/header-bar/header-bar.js b/src/components/header-bar/header-bar.js
@@ -1,13 +1,14 @@
 define(
     [
         'react',
+        'create-react-class',
         'jquery',
         './header-messages/header-messages',
         './header-notifications/header-notifications',
         './header-tasks/header-tasks'
     ],
-    function (React, $, HeaderMessages, HeaderNotifications, HeaderTasks) {
-        var HeaderBar = React.createClass({
+    function (React, createReactClass, $, HeaderMessages, HeaderNotifications, HeaderTasks) {
+        var HeaderBar = createReactClass({
             pushMenu: function () {
                 var body = document.body;
                 if(body.clientWidth > 768){

diff --git a/src/components/header-bar/header-messages/header-messages.js b/src/components/header-bar/header-messages/header-messages.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         './message-item'
     ],
-    function (React, MessageItem) {
-        var HeaderMessages = React.createClass({
+    function (React, createReactClass, MessageItem) {
+        var HeaderMessages = createReactClass({
             getInitialState: function () {
                 return {
                     messages: []

diff --git a/src/components/header-bar/header-messages/message-item.js b/src/components/header-bar/header-messages/message-item.js
@@ -1,9 +1,10 @@
 define(
     [
         'react',
+        'create-react-class',
     ],
-    function (React) {
-        var MessageItem = React.createClass({
+    function (React, createReactClass) {
+        var MessageItem = createReactClass({
 
             render: function () {
 

diff --git a/src/components/header-bar/header-notifications/header-notifications.js b/src/components/header-bar/header-notifications/header-notifications.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         './notification-item'
     ],
-    function (React, NotificationItem) {
-        var HeaderNotifications = React.createClass({
+    function (React, createReactClass, NotificationItem) {
+        var HeaderNotifications = createReactClass({
             getInitialState: function () {
                 return {
                     notifications: []

diff --git a/src/components/header-bar/header-notifications/notification-item.js b/src/components/header-bar/header-notifications/notification-item.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var NotificationItem = React.createClass({
+    function (React, createReactClass) {
+        var NotificationItem = createReactClass({
 
             render: function () {
                 return (

diff --git a/src/components/header-bar/header-tasks/header-tasks.js b/src/components/header-bar/header-tasks/header-tasks.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         './task-item'
     ],
-    function (React, TaskItem) {
-        var HeaderTasks = React.createClass({
+    function (React, createReactClass, TaskItem) {
+        var HeaderTasks = createReactClass({
             getInitialState: function () {
                 return {
                     tasks: []

diff --git a/src/components/header-bar/header-tasks/task-item.js b/src/components/header-bar/header-tasks/task-item.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var TaskItem = React.createClass({
+    function (React, createReactClass) {
+        var TaskItem = createReactClass({
 
             render: function(){
                 var stylePercentage = {

diff --git a/src/components/info-tile/info-tile.js b/src/components/info-tile/info-tile.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var InfoTile = React.createClass({
+    function (React, createReactClass) {
+        var InfoTile = createReactClass({
             getDefaultProps: function() {
                 return {
                     content: '',

diff --git a/src/components/info-tile/progress-bar.js b/src/components/info-tile/progress-bar.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var ProgressBar = React.createClass({
+    function (React, createReactClass) {
+        var ProgressBar = createReactClass({
             getDefaultProps: function() {
                 return {
                     percent: 50,

diff --git a/src/components/navigation-menu.js b/src/components/navigation-menu.js
@@ -1,10 +1,11 @@
 define(
     [
         'react',
+        'create-react-class',
         'jquery',
     ],
-    function (React, $) {
-        var NavigationMenu = React.createClass({
+    function (React, createReactClass, $) {
+        var NavigationMenu = createReactClass({
             render: function () {
                 return (
                     <aside className="main-sidebar">

diff --git a/src/components/post/attachment.js b/src/components/post/attachment.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var Attachment = React.createClass({
+    function (React, createReactClass) {
+        var Attachment = createReactClass({
             render: function() {
                 return (
                     <div className="attachment-block clearfix">

diff --git a/src/components/post/comment.js b/src/components/post/comment.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var Post = React.createClass({
+    function (React, createReactClass) {
+        var Post = createReactClass({
             getDefaultProps: function() {
                 return {
                     content: 'sample comment',

diff --git a/src/components/post/post.js b/src/components/post/post.js
@@ -1,13 +1,14 @@
 define(
     [
         'react',
+        'create-react-class',
         'react-dom',
         './comment',
         './attachment',
         '../../services/common-functions'
     ],
-    function (React, ReactDOM, Comment, Attachment, commonFunctions) {
-        var Post = React.createClass({
+    function (React, createReactClass, ReactDOM, Comment, Attachment, commonFunctions) {
+        var Post = createReactClass({
             getDefaultProps: function() {
                 return {
                     displayName: 'John Doe',

diff --git a/src/components/post/social-button.js b/src/components/post/social-button.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var SocialButton = React.createClass({
+    function (React, createReactClass) {
+        var SocialButton = createReactClass({
             getDefaultProps: function() {
                 return {
                     position: '',

diff --git a/src/components/post/social-info.js b/src/components/post/social-info.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var SocialInfo = React.createClass({
+    function (React, createReactClass) {
+        var SocialInfo = createReactClass({
             getDefaultProps: function() {
                 return {
                     info: '',

diff --git a/src/components/profile-card/profile-card.js b/src/components/profile-card/profile-card.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var ProfileCard = React.createClass({
+    function (React, createReactClass) {
+        var ProfileCard = createReactClass({
             getDefaultProps: function() {
                 return {
                     pictureAlignment: 'center',

diff --git a/src/components/profile-card/profile-info-blocks.js b/src/components/profile-card/profile-info-blocks.js
@@ -1,9 +1,10 @@
 define(
     [
-        'react'
+        'react',
+        'create-react-class',
     ],
-    function (React) {
-        var ProfileInfoBlocks = React.createClass({
+    function (React, createReactClass) {
+        var ProfileInfoBlocks = createReactClass({
             render: function() {
                 var descriptionBlocks = this.props.list.map(function(info, iterator){
                     return (

diff --git a/src/components/profile-card/profile-info-list.js b/src/components/profile-card/profile-info-list.js
@@ -1,9 +1,10 @@
 define(
     [
         'react',
+        'create-react-class',
     ],
-    function (React) {
-        var ProfileInfoList = React.createClass({
+    function (React, createReactClass) {
+        var ProfileInfoList = createReactClass({
             render: function() {
                 var listItems = this.props.list.map(function(info, iterator){
                     return (