Merge pull request #73 from sharetribe/same-sdk

Don't use two different SDKs on runtime

server/dataLoader.js

@@ -1,19 +1,6 @@
 const url = require('url');
-const { types } = require('sharetribe-sdk');
 const { matchPathname, configureStore } = require('./importer');
 
-// Currently the SDK serialisation doesn't work with mixed types from
-// client bundle and server imports. To fix this temporarily, we wrap
-// the id param here for the server side instead of doing the same in
-// the loadData handler.
-// TODO: remove this once the SDK serialisation works
-const fixParams = params => {
-  if (params.id) {
-    return Object.assign({}, params, { id: new types.UUID(params.id) });
-  }
-  return params;
-};
-
 exports.loadData = function(requestUrl, sdk) {
   const { pathname, query } = url.parse(requestUrl, true);
   const matchedRoutes = matchPathname(pathname);

src/Routes.js

@@ -2,7 +2,6 @@ import React, { Component, PropTypes } from 'react';
 import { compose } from 'redux';
 import { connect } from 'react-redux';
 import { Switch, Route, withRouter } from 'react-router-dom';
-import { types } from 'sharetribe-sdk';
 import { NotFoundPage } from './containers';
 import { NamedRedirect } from './components';
 import { withFlattenedRoutes } from './util/routes';
@@ -10,18 +9,6 @@ import * as propTypes from './util/propTypes';
 
 const { bool, arrayOf, object, func, shape, string, any } = PropTypes;
 
-// Currently the SDK serialisation doesn't work with mixed types from
-// client bundle and server imports. To fix this temporarily, we wrap
-// the id param here for the client side instead of doing the same in
-// the loadData handler.
-// TODO: remove this once the SDK serialisation works
-const fixParams = params => {
-  if (params.id) {
-    return { ...params, id: new types.UUID(params.id) };
-  }
-  return params;
-};
-
 class RouteComponentRenderer extends Component {
   constructor(props) {
     super(props);
@@ -33,7 +20,7 @@ class RouteComponentRenderer extends Component {
     const shouldLoadData = typeof loadData === 'function' && this.canShowComponent();
 
     if (shouldLoadData) {
-      dispatch(loadData(fixParams(match.params), {}))
+      dispatch(loadData(match.params, {}))
         .then(() => {
           // eslint-disable-next-line no-console
           console.log(`loadData success for ${name} route`);

src/containers/EditListingPage/EditListingPage.js

@@ -1,7 +1,7 @@
 import React, { Component, PropTypes } from 'react';
 import { intlShape, injectIntl } from 'react-intl';
 import { connect } from 'react-redux';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { NamedRedirect, PageLayout } from '../../components';
 import { EditListingForm } from '../../containers';
 import { getListingsById } from '../../ducks/sdk.duck';

src/containers/ListingPage/ListingPage.js

@@ -1,7 +1,7 @@
 import React, { Component, PropTypes } from 'react';
 import { intlShape, injectIntl } from 'react-intl';
 import { connect } from 'react-redux';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { NamedLink, PageLayout } from '../../components';
 import { getListingsById } from '../../ducks/sdk.duck';
 import { showListing } from './ListingPage.duck';
@@ -167,10 +167,7 @@ const mapStateToProps = state => ({
 const ListingPage = connect(mapStateToProps)(injectIntl(ListingPageComponent));
 
 ListingPage.loadData = params => {
-  // TODO: wrap with UUID when the universal serialisation works with
-  // SDK and types from the client bundle and the server import don't
-  // differ
-  const id = params.id;
+  const id = new UUID(params.id);
   return showListing(id);
 };
 

src/containers/ListingPage/ListingPage.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { createListing } from '../../util/test-data';
 import { fakeIntl, renderShallow } from '../../util/test-helpers';
 import { ListingPageComponent } from './ListingPage';

src/containers/SearchPage/SearchPage.duck.js

@@ -5,7 +5,7 @@
  */
 import { unionWith, isEqual } from 'lodash';
 import { call, put, takeEvery } from 'redux-saga/effects';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { createRequestTypes } from '../../util/sagaHelpers';
 
 const { LatLng } = types;

src/containers/SearchPage/SearchPage.js

@@ -1,7 +1,7 @@
 import React, { Component, PropTypes } from 'react';
 import classNames from 'classnames';
 import { connect } from 'react-redux';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { searchListings, getListingsById } from '../../ducks/sdk.duck';
 import {
   FilterPanel,

src/containers/SearchPage/SearchPage.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { renderShallow } from '../../util/test-helpers';
 import { call, put, fork, takeEvery } from 'redux-saga/effects';
-import { types } from 'sharetribe-sdk';
+import { types } from '../../util/sdkLoader';
 import { SearchPageComponent } from './SearchPage';
 import reducer, {
   ADD_FILTER,

src/index.js

@@ -14,7 +14,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { bindActionCreators } from 'redux';
-import { createInstance, types } from 'sharetribe-sdk';
+import { createInstance, types } from './util/sdkLoader';
 import { ClientApp, renderApp } from './app';
 import configureStore from './store';
 import { matchPathname } from './util/routes';

src/util/data.test.js

@@ -1,4 +1,4 @@
-import { types } from 'sharetribe-sdk';
+import { types } from './sdkLoader';
 import {
   combinedRelationships,
   combinedResourceObjects,

src/util/googleMaps.js

@@ -1,4 +1,4 @@
-import { types } from 'sharetribe-sdk';
+import { types } from '../util/sdkLoader';
 
 const { LatLng: SDKLatLng, LatLngBounds: SDKLatLngBounds } = types;
 

src/util/propTypes.js

@@ -18,7 +18,7 @@
  * specific place and avoid duplicate errros.
  */
 import { PropTypes } from 'react';
-import { types as sdkTypes } from 'sharetribe-sdk';
+import { types as sdkTypes } from './sdkLoader';
 
 const { UUID, LatLng, LatLngBounds } = sdkTypes;
 const { arrayOf, bool, func, instanceOf, number, oneOf, shape, string } = PropTypes;

src/util/sample.js

@@ -1,4 +1,4 @@
-import { types } from 'sharetribe-sdk';
+import { types } from './sdkLoader';
 
 export const marketplaceId = new types.UUID('16c6a4b8-88ee-429b-835a-6725206cd08c');
 export const userJoeId = new types.UUID('3c073fae-6172-4e75-8b92-f560d58cd47c');

src/util/sdkLoader.js

@@ -0,0 +1,20 @@
+import * as importedSdk from 'sharetribe-sdk';
+
+let exportSdk;
+
+const isServer = () => typeof window === 'undefined';
+
+if (isServer()) {
+  // Use eval to skip webpack from bundling SDK in Node
+  // eslint-disable-next-line no-eval
+  exportSdk = eval('require')('sharetribe-sdk');
+} else {
+  exportSdk = importedSdk;
+}
+
+const {
+  createInstance,
+  types,
+} = exportSdk;
+
+export { createInstance, types };

src/util/test-data.js

@@ -1,4 +1,4 @@
-import { types } from 'sharetribe-sdk';
+import { types } from './sdkLoader';
 
 const { UUID, LatLng } = types;