chore: syncing master to canary

.prettierignore

@@ -1,5 +1,4 @@
 node_modules
-example
 *.json
 *.yml
 *.md

CHANGELOG.md

@@ -3,9 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [0.1.2-canary.0](https://github.com/airyrooms/maleo.js/compare/v0.1.1...v0.1.2-canary.0) (2019-04-04)
+# [0.2.0](https://github.com/airyrooms/maleo.js/compare/v0.1.1...v0.2.0) (2019-04-06)
 
-**Note:** Version bump only for package airy-maleojs
+
+### Bug Fixes
+
+* **maleo-core/server:** route handler promises ([#180](https://github.com/airyrooms/maleo.js/issues/180)) ([6720332](https://github.com/airyrooms/maleo.js/commit/6720332))
+
+
+### Features
+
+* **maleo-core/render:** changed the way we render wrap ([#181](https://github.com/airyrooms/maleo.js/issues/181)) ([0e160da](https://github.com/airyrooms/maleo.js/commit/0e160da))
 
 
 

CONTRIBUTING.md

@@ -247,11 +247,11 @@ Now you need to ignore the git revision head, since if we commit amend the git r
 ```bash
 $ git checkout -- .
 ```
-
+<!-- 
 After doing all of the above, now you are good to push all this changes to upstream remote by running
 ```bash
 $ git push upstream master --follow-tags #push commits, version changes, and new tags
-```
+``` -->
 
 ---
 ⚠️**NOTICE** ⚠️

example/playground/custom-wrap.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
 import Wrap from '@airy/maleo/wrap';
 import pageWithStyles from '@airy/maleo-css-plugin/pageWithStyles';
@@ -9,20 +10,49 @@ import { makeStoreClient } from './store';
 @pageWithStyles
 @withRedux(makeStoreClient)
 export default class extends Wrap {
-  static getInitialProps = ({ store }) => {
-    console.log('\nGIP wrap store', store);
-  };
+  static getInitialProps = async ({ store, ...context }) => {
+    // const response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
+    // const data = await response.json();
+    const data = { initialData: true };
+    console.log('GIP wrap store', store);
 
-  constructor(props) {
-    super(props);
-  }
+    if (store) {
+      store.dispatch({ type: 'TEST', data: 'testttt' });
+    }
+
+    return { data, store };
+  };
 
   render() {
+    const { Container, App, containerProps, appProps } = this.props;
+
     return (
-      <div>
-        <h1>This is NAVBARRR</h1>
-        {super.render()}
-      </div>
+      <Container {...containerProps}>
+        <div>
+          <h1>This is NAVBARRR</h1>
+          <div>
+            rooms main app
+            <h1>rooms main app</h1>
+            <ul>
+              <li>
+                <Link to="/">Root</Link>
+              </li>
+              <li>
+                <Link to="/search">Search</Link>
+              </li>
+              <li>
+                <Link to="/detail">Detail</Link>
+              </li>
+              <li>
+                <Link to="/not-found">Not Found</Link>
+              </li>
+            </ul>
+            <div>
+              <App {...appProps} />
+            </div>
+          </div>
+        </div>
+      </Container>
     );
   }
-}
+}

example/playground/maleo.config.js

@@ -8,11 +8,11 @@ module.exports = tsPlugin(
     env: 'production',
     staticPages: {
       '/detail': {
-        page: './src/Detail/index.tsx'
+        page: './src/Detail/index.tsx',
       },
       '/search': {
-        page: './src/Search/index.tsx'
-      }
-    }
+        page: './src/Search/index.tsx',
+      },
+    },
   }),
 );

example/playground/package.json

@@ -16,7 +16,6 @@
     "@airy/maleo-css-plugin": "latest",
     "@airy/maleo-typescript-plugin": "latest",
     "@airy/maleo-redux-plugin": "latest",
-    "@airy/maleo": "latest",
     "react": "latest",
     "react-redux": "^5.1.1",
     "redux": "^4.0.1"

example/playground/routes.json

@@ -1,28 +1,23 @@
 [
   {
-    "page": "./src/MainApp",
+    "path": "/",
+    "page": "./src/Root",
+    "exact": true
+  },
+  {
+    "path": "/search",
+    "page": "./src/Search",
     "routes": [
       {
-        "path": "/",
-        "page": "./src/Search",
-        "exact": true
-      },
-      {
-        "path": "/search",
-        "page": "./src/Search",
-        "routes": [
-          {
-            "path": "/search/hello",
-            "page": "./src/Detail",
-            "exact": true
-          }
-        ]
-      },
-      {
-        "path": "/detail",
+        "path": "/search/hello",
         "page": "./src/Detail",
         "exact": true
       }
     ]
+  },
+  {
+    "path": "/detail",
+    "page": "./src/Detail",
+    "exact": true
   }
 ]

example/playground/src/Root/index.tsx

@@ -0,0 +1,5 @@
+import React from 'react';
+
+export default function() {
+  return <h1>Root Component</h1>;
+}

example/playground/src/Search/index.tsx

@@ -1,11 +1,5 @@
 import * as React from 'react';
-import Loadable from 'react-loadable';
-
-const DetailComponent = Loadable({
-  loading: () => <div>loading getting detail...</div>,
-  loader: () => import('src/Detail' /* webpackChunkName:"Detail" */),
-  modules: ['./src/Detail'],
-});
+import { Link } from 'react-router-dom';
 
 export class RoomsSearch extends React.Component<any, any> {
   static displayName = 'RoomsSearch';
@@ -22,18 +16,14 @@ export class RoomsSearch extends React.Component<any, any> {
     return (
       <div
         style={{
-          backgroundColor: 'blue',
+          backgroundColor: 'teal',
           display: 'inline-block',
           float: 'left',
           maxWidth: '50%',
         }}>
         <h1>Rooms Search</h1>
+        <Link to="/search/hello">Hello</Link>
         {this.props.children}
-
-        <br />
-        <br />
-        <br />
-        <DetailComponent />
       </div>
     );
   }

lerna.json

@@ -1,6 +1,6 @@
 {
   "lerna": "3.13.1",
-  "version": "0.1.2-canary.0",
+  "version": "0.2.0",
   "packages": [
     "packages/*"
   ],

package.json

@@ -46,7 +46,7 @@
     "publish:prepublish": "lerna run prepublish",
     "publish:version-canary": "lerna version prerelease --preid canary --message \"chore(release): publish canary %s [skip ci]\" --yes",
     "publish:canary": "lerna publish from-package --no-git-reset --canary --dist-tag canary --yes",
-    "publish:version-stable": "lerna version --message \"chore(release): publish stable %s\"",
+    "publish:version-stable": "lerna version --message \"chore(release): publish stable %s\" --git-remote upstream",
     "publish:stable": "lerna publish from-package --no-git-reset --yes"
   },
   "husky": {

packages/Maleo.js/CHANGELOG.md

@@ -3,9 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [0.1.2-canary.0](https://github.com/airyrooms/maleo.js/compare/v0.1.1...v0.1.2-canary.0) (2019-04-04)
+# [0.2.0](https://github.com/airyrooms/maleo.js/compare/v0.1.1...v0.2.0) (2019-04-06)
 
-**Note:** Version bump only for package @airy/maleo
+
+### Bug Fixes
+
+* **maleo-core/server:** route handler promises ([#180](https://github.com/airyrooms/maleo.js/issues/180)) ([6720332](https://github.com/airyrooms/maleo.js/commit/6720332))
+
+
+### Features
+
+* **maleo-core/render:** changed the way we render wrap ([#181](https://github.com/airyrooms/maleo.js/issues/181)) ([0e160da](https://github.com/airyrooms/maleo.js/commit/0e160da))
 
 
 

packages/Maleo.js/README.md

@@ -353,7 +353,8 @@ import { Wrap } from '@airy/maleo/wrap';
 import { withRedux } from '@airy/maleo-redux-plugin';
 
 // Custom Wrapper that will be rendered for the whole Application
-import CustomWrapper from './component/CustomWrapper';
+import Content from './component/Content';
+import NavigationBar from './component/NavigationBar';
 
 import { createStore } from './store';
 
@@ -368,10 +369,15 @@ export default class extends Wrap {
   }
 
   render() {
+    const { Container, containerProps, App, appProps } = this.props
+
     return (
-      <CustomWrapper>
-        {super.render()}
-      </CustomWrapper>
+      <Container {...containerProps}>
+        <NavigationBar />
+        <Content>
+          <App {...appProps}/>
+        </Content>
+      </Container>
     )
   }
 }

packages/Maleo.js/__test__/server/loadInitialProps.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { matchingRoutes } from '@airy/maleo/lib/server/routeHandler';
+import { matchingRoutes } from '@airy/maleo/lib/routes/matching-routes';
 import { loadInitialProps, loadComponentProps } from '@airy/maleo/lib/server/loadInitialProps';
 import { MimickLoadable } from '../test-utils/mimick-loadable';
 

packages/Maleo.js/__test__/server/routeHandler.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { matchingRoutes } from '@airy/maleo/lib/server/routeHandler';
+import { matchingRoutes } from '@airy/maleo/lib/routes/matching-routes';
 import { MimickLoadable } from '../test-utils/mimick-loadable';
 
 const NotMatchedComponent = MimickLoadable(() => <h1>Not Matched</h1>);

packages/Maleo.js/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@airy/maleo",
-    "version": "0.1.2-canary.0",
+    "version": "0.2.0",
     "description": "Un-opinionated Universal Rendering Javascript Framework",
     "repository": {
         "type": "git",

packages/Maleo.js/src/client/client.tsx

@@ -5,8 +5,9 @@ import Loadable from 'react-loadable';
 import { loadInitialProps, loadComponentProps } from '@server/loadInitialProps';
 import { InitialProps } from '@interfaces/render/IRender';
 import { SERVER_INITIAL_DATA, DIV_MALEO_ID } from '@constants/index';
-import { matchingRoutes } from '@server/routeHandler';
+import { matchingRoutes } from '@routes/matching-routes';
 import { RegisterEntry } from './registerEntry';
+import { ContainerComponent } from '@render/_container';
 
 export const init = async () => {
   try {
@@ -19,12 +20,25 @@ export const init = async () => {
     const { data } = await ensureReady(routes, location.pathname, {});
 
     const wrapProps = await loadComponentProps(Wrap);
-    const appProps = await loadComponentProps(App);
+    const appInitialProps = await loadComponentProps(App);
+
+    const appProps = {
+      data,
+      routes,
+      location,
+      ...appInitialProps,
+      ...wrapProps,
+    };
+    const containerProps = {};
 
     const RenderApp = () => (
-      <Wrap {...wrapProps}>
-        <App data={data} routes={routes} location={location} {...appProps} {...wrapProps} />
-      </Wrap>
+      <Wrap
+        App={App}
+        Container={ContainerComponent}
+        appProps={appProps}
+        containerProps={containerProps}
+        {...wrapProps}
+      />
     );
 
     hydrate(RenderApp);