@thoughtbot/superglue 0.0.0 → 0.30.0

package/components/RailsTag.js

@@ -0,0 +1,71 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _htmlReactParser = _interopRequireWildcard(require("html-react-parser"));
+
+var _attributesToProps = _interopRequireDefault(require("html-react-parser/lib/attributes-to-props"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var RailsTag = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(RailsTag, _React$Component);
+
+  function RailsTag(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.replace = _this.replace.bind(_assertThisInitialized(_this));
+    return _this;
+  }
+
+  var _proto = RailsTag.prototype;
+
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+    return this.props.html !== nextProps.html;
+  };
+
+  _proto.replace = function replace(domNode) {
+    var parent = domNode.parent,
+        type = domNode.type,
+        name = domNode.name,
+        attribs = domNode.attribs,
+        children = domNode.children;
+
+    if (!parent && type === 'tag') {
+      var nextProps = Object.assign({}, this.props, (0, _attributesToProps["default"])(attribs), {
+        children: (0, _htmlReactParser.domToReact)(children)
+      });
+      delete nextProps.html;
+      return /*#__PURE__*/_react["default"].createElement(name, nextProps);
+    }
+  };
+
+  _proto.render = function render() {
+    return (0, _htmlReactParser["default"])(this.props.html, {
+      replace: this.replace
+    });
+  };
+
+  return RailsTag;
+}(_react["default"].Component);
+
+exports["default"] = RailsTag;
+RailsTag.propTypes = {
+  html: _propTypes["default"].string
+};

package/config.js

@@ -0,0 +1,9 @@
+"use strict";
+
+exports.__esModule = true;
+exports.config = void 0;
+var config = {
+  baseUrl: '',
+  maxPages: 20
+};
+exports.config = config;

package/index.js

@@ -0,0 +1,263 @@
+"use strict";
+
+exports.__esModule = true;
+exports.updateFragments = exports.superglueReducer = exports.pageReducer = exports.mapDispatchToPropsIncludingVisitAndRemote = exports.getIn = exports.fragmentMiddleware = exports.ApplicationBase = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _urlParse = _interopRequireDefault(require("url-parse"));
+
+var _reducers = require("./reducers");
+
+exports.rootReducer = _reducers.rootReducer;
+exports.superglueReducer = _reducers.superglueReducer;
+exports.pageReducer = _reducers.pageReducer;
+exports.updateFragments = _reducers.updateFragments;
+
+var _config = require("./config");
+
+var _utils = require("./utils");
+
+exports.urlToPageKey = _utils.urlToPageKey;
+
+var _action_creators = require("./action_creators");
+
+var _actions = require("./actions");
+
+var _redux = require("redux");
+
+var _reduxThunk = _interopRequireDefault(require("redux-thunk"));
+
+var _reactRedux = require("react-redux");
+
+var _history = require("history");
+
+var _Nav = _interopRequireDefault(require("./components/Nav"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react2 = require("./utils/react");
+
+exports.mapStateToProps = _react2.mapStateToProps;
+exports.mapDispatchToProps = _react2.mapDispatchToProps;
+exports.mapDispatchToPropsIncludingVisitAndRemote = _react2.mapDispatchToPropsIncludingVisitAndRemote;
+
+var _middleware = require("./middleware");
+
+exports.fragmentMiddleware = _middleware.fragmentMiddleware;
+
+var _immutability = require("./utils/immutability");
+
+exports.getIn = _immutability.getIn;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _wrapNativeSuper(Class) { var _cache = typeof Map === "function" ? new Map() : undefined; _wrapNativeSuper = function _wrapNativeSuper(Class) { if (Class === null || !_isNativeFunction(Class)) return Class; if (typeof Class !== "function") { throw new TypeError("Super expression must either be null or a function"); } if (typeof _cache !== "undefined") { if (_cache.has(Class)) return _cache.get(Class); _cache.set(Class, Wrapper); } function Wrapper() { return _construct(Class, arguments, _getPrototypeOf(this).constructor); } Wrapper.prototype = Object.create(Class.prototype, { constructor: { value: Wrapper, enumerable: false, writable: true, configurable: true } }); return _setPrototypeOf(Wrapper, Class); }; return _wrapNativeSuper(Class); }
+
+function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct; } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _isNativeFunction(fn) { return Function.toString.call(fn).indexOf("[native code]") !== -1; }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function pageToInitialState(key, page) {
+  var _pages;
+
+  return {
+    pages: (_pages = {}, _pages[key] = page, _pages)
+  };
+}
+
+function start(_ref) {
+  var initialPage = _ref.initialPage,
+      _ref$baseUrl = _ref.baseUrl,
+      baseUrl = _ref$baseUrl === void 0 ? _config.config.baseUrl : _ref$baseUrl,
+      _ref$maxPages = _ref.maxPages,
+      maxPages = _ref$maxPages === void 0 ? _config.config.maxPages : _ref$maxPages,
+      path = _ref.path;
+  var initialPageKey = (0, _utils.urlToPageKey)((0, _urlParse["default"])(path).href);
+  var csrfToken = initialPage.csrfToken;
+  var location = (0, _urlParse["default"])(path);
+  _config.config.baseUrl = baseUrl;
+  _config.config.maxPages = maxPages;
+  return {
+    reducer: _reducers.rootReducer,
+    prepareStore: function prepareStore(store) {
+      store.dispatch({
+        type: _actions.HISTORY_CHANGE,
+        payload: {
+          pathname: location.pathname,
+          search: location.query,
+          hash: location.hash
+        }
+      });
+      store.dispatch((0, _action_creators.saveAndProcessPage)(initialPageKey, initialPage));
+      store.dispatch({
+        type: _actions.SET_CSRF_TOKEN,
+        payload: {
+          csrfToken: csrfToken
+        }
+      });
+    },
+    initialState: pageToInitialState(initialPageKey, initialPage),
+    initialPageKey: initialPageKey
+  };
+}
+
+var NotImplementedError = /*#__PURE__*/function (_Error) {
+  _inheritsLoose(NotImplementedError, _Error);
+
+  function NotImplementedError(message) {
+    var _this;
+
+    _this = _Error.call(this, message) || this;
+    _this.name = _this.constructor.name;
+    return _this;
+  }
+
+  return NotImplementedError;
+}( /*#__PURE__*/_wrapNativeSuper(Error));
+
+var ApplicationBase = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(ApplicationBase, _React$Component);
+
+  function ApplicationBase(props) {
+    var _this2$history;
+
+    var _this2;
+
+    _this2 = _React$Component.call(this, props) || this;
+    _this2.hasWindow = typeof window !== 'undefined'; // Create a navigator Ref for UJS attributes and to enhance the base `visit`
+    // and `visit` thunks
+
+    _this2.navigatorRef = /*#__PURE__*/_react["default"].createRef(); // Retrieve initial values and methods to prepare the store.
+
+    var _start = start({
+      initialPage: _this2.props.initialPage,
+      baseUrl: _this2.props.baseUrl,
+      path: _this2.props.path // The max number of pages to keep in the store. Default is 20
+      // maxPages: 20
+
+    }),
+        prepareStore = _start.prepareStore,
+        initialState = _start.initialState,
+        initialPageKey = _start.initialPageKey,
+        reducer = _start.reducer;
+
+    _this2.initialPageKey = initialPageKey; // Build the store and pass Superglue's provided reducer to be combined with
+    // your reducers located at `application_reducer.js`
+
+    _this2.store = _this2.buildStore(initialState, reducer); // Fire initial events and populate the store
+
+    prepareStore(_this2.store); // Build history
+
+    _this2.history = _this2.createHistory();
+
+    (_this2$history = _this2.history).replace.apply(_this2$history, (0, _utils.argsForHistory)(_this2.props.path));
+
+    var nextMapping = Object.assign({}, _this2.mapping());
+
+    for (var key in nextMapping) {
+      var component = nextMapping[key];
+      nextMapping[key] = (0, _reactRedux.connect)(_react2.mapStateToProps, _react2.mapDispatchToProps)(component);
+    }
+
+    _this2.connectedMapping = nextMapping; // Build visit and remote thunks
+    // Your modified `visit` and `remote` will get passed below to the
+    // Nav component then to your components
+    //
+    // You can access them via `this.props.visit` or `this.props.remote`. In
+    // your page components
+
+    var _this2$visitAndRemote = _this2.visitAndRemote(_this2.navigatorRef, _this2.store),
+        visit = _this2$visitAndRemote.visit,
+        remote = _this2$visitAndRemote.remote;
+
+    _this2.visit = visit;
+    _this2.remote = remote;
+    return _this2;
+  }
+
+  var _proto = ApplicationBase.prototype;
+
+  _proto.visitAndRemote = function visitAndRemote() {
+    throw new NotImplementedError('Implement this');
+  };
+
+  _proto.componentDidMount = function componentDidMount() {
+    var appEl = this.props.appEl; // Create the ujs event handlers. You can change the ujsAttributePrefix
+    // in the event the data attribute conflicts with another.
+
+    this.ujsHandlers = (0, _utils.ujsHandlers)({
+      visit: this.visit,
+      remote: this.remote,
+      store: this.store,
+      ujsAttributePrefix: 'data-bz'
+    });
+    var _this$ujsHandlers = this.ujsHandlers,
+        onClick = _this$ujsHandlers.onClick,
+        onSubmit = _this$ujsHandlers.onSubmit;
+    appEl.addEventListener('click', onClick);
+    appEl.addEventListener('submit', onSubmit);
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    var appEl = this.props.appEl;
+    var _this$ujsHandlers2 = this.ujsHandlers,
+        onClick = _this$ujsHandlers2.onClick,
+        onSubmit = _this$ujsHandlers2.onSubmit;
+    appEl.removeEventListener('click', onClick);
+    appEl.removeEventListener('submit', onSubmit);
+  };
+
+  _proto.buildStore = function buildStore(initialState, reducer) {
+    var store = (0, _redux.createStore)((0, _redux.combineReducers)(reducer), initialState, (0, _redux.compose)((0, _redux.applyMiddleware)(_reduxThunk["default"])));
+    return store;
+  };
+
+  _proto.createHistory = function createHistory() {
+    if (this.hasWindow) {
+      // This is used for client side rendering
+      return (0, _history.createBrowserHistory)({});
+    } else {
+      // This is used for server side rendering
+      return (0, _history.createMemoryHistory)({});
+    }
+  };
+
+  _proto.mapping = function mapping() {
+    throw new NotImplementedError('Implement this');
+  };
+
+  _proto.render = function render() {
+    // The Nav component is pretty bare and can be inherited from for custom
+    // behavior or replaced with your own.
+    return /*#__PURE__*/_react["default"].createElement(_reactRedux.Provider, {
+      store: this.store
+    }, /*#__PURE__*/_react["default"].createElement(_Nav["default"], {
+      store: this.store,
+      ref: this.navigatorRef,
+      visit: this.visit,
+      remote: this.remote,
+      mapping: this.connectedMapping,
+      history: this.history,
+      initialPageKey: this.initialPageKey
+    }));
+  };
+
+  return ApplicationBase;
+}(_react["default"].Component);
+
+exports.ApplicationBase = ApplicationBase;
+ApplicationBase.propTypes = {
+  initialPage: _propTypes["default"].object,
+  baseUrl: _propTypes["default"].string,
+  path: _propTypes["default"].string,
+  appEl: _propTypes["default"].object
+};

package/middleware.js

@@ -0,0 +1,80 @@
+"use strict";
+
+exports.__esModule = true;
+exports.fragmentMiddleware = void 0;
+
+var actions = _interopRequireWildcard(require("./actions"));
+
+var _immutability = require("./utils/immutability");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var actionValues = Object.values(actions);
+
+var fragmentMiddleware = function fragmentMiddleware(store) {
+  return function (next) {
+    return function (action) {
+      var prevState = store.getState();
+      var nextAction = next(action);
+      var nextState = store.getState();
+
+      if (actionValues.includes(action.type)) {
+        return nextAction;
+      }
+
+      if (prevState.pages === nextState.pages) {
+        return nextAction;
+      }
+
+      var changedFragments = {};
+      var changedKeys = Object.keys(nextState.pages).filter(function (key) {
+        return prevState.pages[key] !== nextState.pages[key];
+      });
+
+      if (changedKeys.length === 0) {
+        return nextAction;
+      }
+
+      changedKeys.forEach(function (key) {
+        nextState.pages[key].fragments.forEach(function (fragment) {
+          var type = fragment.type,
+              path = fragment.path;
+          var nextPage = nextState.pages[key];
+          var prevPage = prevState.pages[key];
+          var nextFragment, prevFragment;
+
+          try {
+            prevFragment = (0, _immutability.getIn)(prevPage, path);
+            nextFragment = (0, _immutability.getIn)(nextPage, path);
+          } catch (err) {
+            if (err.name == 'KeyPathError') {
+              console.warn(err.message);
+            } else {
+              throw err;
+            }
+          }
+
+          if (nextFragment !== undefined && prevFragment !== undefined && nextFragment !== prevFragment && nextFragment) {
+            changedFragments[type] = nextFragment;
+          }
+        });
+      });
+
+      if (Object.keys(changedFragments).length === 0) {
+        return nextAction;
+      }
+
+      store.dispatch({
+        type: actions.UPDATE_FRAGMENTS,
+        payload: {
+          changedFragments: changedFragments
+        }
+      });
+      return nextAction;
+    };
+  };
+};
+
+exports.fragmentMiddleware = fragmentMiddleware;

package/package.json

@@ -1,12 +1,54 @@
 {
   "name": "@thoughtbot/superglue",
-  "version": "0.0.0",
-  "description": "test",
-  "main": "index.js",
+  "version": "0.30.0",
+  "description": "Use a vanilla Rails with React and Redux",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/thoughtbot/superglue.git"
+  },
   "author": "Johny Ho",
   "license": "MIT",
-  "devDependencies": {},
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+  "bugs": {
+    "url": "https://github.com/thoughtbot/superglue/issues"
+  },
+  "homepage": "https://github.com/thoughtbot/superglue#readme",
+  "devDependencies": {
+    "@babel/cli": "^7.14.3",
+    "@babel/core": "^7.14.3",
+    "@babel/preset-env": "^7.14.4",
+    "@babel/preset-react": "^7.13.13",
+    "core-js": "^2.6.12",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.6",
+    "eslint": "^7.28.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-react": "^7.24.0",
+    "fetch-headers": "^2.0.0",
+    "fetch-mock": "^9.11.0",
+    "history": "^4.7.1",
+    "html-react-parser": "^1.2.6",
+    "jest": "^27.0.4",
+    "node-fetch": "^2.6.1",
+    "prettier": "^2.3.1",
+    "prop-types": "^15.7.2",
+    "react": "^16.4.0",
+    "react-dom": "^16.4.0",
+    "react-redux": "^7.2.4",
+    "redux": "^4.1.0",
+    "redux-mock-store": "^1.5.4",
+    "redux-thunk": "^2.3.0"
+  },
+  "peerDependencies": {
+    "html-react-parser": ">=1.2.6",
+    "react": ">=16",
+    "redux": ">=4.1",
+    "history": "^4.7.1",
+    "react-redux": ">=7.2",
+    "redux-thunk": ">=2.3"
+  },
+  "dependencies": {
+    "abortcontroller-polyfill": "^1.7.3",
+    "url-parse": "^1.5.1"
   }
 }