Add bundled persister

dist/client/bundledPersister.js

@@ -0,0 +1,114 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _lowdb = require('lowdb');
+
+var _lowdb2 = _interopRequireDefault(_lowdb);
+
+var _lodash = require('lodash');
+
+var _lodash2 = _interopRequireDefault(_lodash);
+
+var _database = require('../shared/database');
+
+var _database2 = _interopRequireDefault(_database);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+var StaticFilePersister = function () {
+  function StaticFilePersister(_ref) {
+    var url = _ref.url;
+
+    _classCallCheck(this, StaticFilePersister);
+
+    this.url = url;
+    this.db = null;
+    this.pending = [];
+    this._initDB();
+  }
+
+  _createClass(StaticFilePersister, [{
+    key: 'set',
+    value: function set(collection, item) {
+      return new Promise(function (resolve, reject) {
+        reject(new Error('cannot modify data on read-only database'));
+      });
+    }
+  }, {
+    key: 'get',
+    value: function get(collection, query, options) {
+      var _this = this;
+
+      if (!this.db) {
+        return this._enqueue(collection, query, options);
+      }
+      return new Promise(function (resolve, reject) {
+        var res = _this.db.get(collection, query, options.sort, options.limit);
+        resolve(res);
+      });
+    }
+  }, {
+    key: '_initDB',
+    value: function _initDB() {
+      var _this2 = this;
+
+      return fetch(this.url).then(function (res) {
+        return res.json();
+      }).then(function (data) {
+        return _this2._setData(data);
+      }).then(function () {
+        return _this2._flushQueue();
+      }).catch(function (err) {
+        return console.error(err);
+      });
+    }
+  }, {
+    key: '_setData',
+    value: function _setData(data) {
+      var db = (0, _lowdb2.default)('storybook-addon-data', {}, _lodash2.default);
+      db.defaults(data).value();
+      this.db = new _database2.default(db);
+    }
+  }, {
+    key: '_enqueue',
+    value: function _enqueue(collection, query, options) {
+      var _this3 = this;
+
+      return new Promise(function (resolve, reject) {
+        var request = { collection: collection, query: query, options: options };
+        _this3.pending.push({ request: request, resolve: resolve, reject: reject });
+      });
+    }
+  }, {
+    key: '_flushQueue',
+    value: function _flushQueue() {
+      var _this4 = this;
+
+      var pending = this.pending;
+      this.pending = [];
+      pending.forEach(function (job) {
+        var _job$request = job.request;
+        var collection = _job$request.collection;
+        var query = _job$request.query;
+        var options = _job$request.options;
+
+        _this4.get(collection, query, options).then(function (res) {
+          return job.resolve(res);
+        }).catch(function (err) {
+          return job.reject(err);
+        });
+      });
+    }
+  }]);
+
+  return StaticFilePersister;
+}();
+
+exports.default = StaticFilePersister;

dist/client/persister.js → dist/client/devServerPersister.js

@@ -8,17 +8,17 @@ var _createClass = function () { function defineProperties(target, props) { for
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-var LocalPersister = function () {
-  function LocalPersister(_ref) {
+var DevServerPersister = function () {
+  function DevServerPersister(_ref) {
     var url = _ref.url;
 
-    _classCallCheck(this, LocalPersister);
+    _classCallCheck(this, DevServerPersister);
 
     this.url = url;
     this.headers = { 'content-type': 'application/json' };
   }
 
-  _createClass(LocalPersister, [{
+  _createClass(DevServerPersister, [{
     key: 'set',
     value: function set(collection, item) {
       var body = JSON.stringify({ collection: collection, item: item });
@@ -45,7 +45,7 @@ var LocalPersister = function () {
     }
   }]);
 
-  return LocalPersister;
+  return DevServerPersister;
 }();
 
-exports.default = LocalPersister;
+exports.default = DevServerPersister;

dist/client/index.js

@@ -9,15 +9,26 @@ var _storybookDatabase = require('@kadira/storybook-database');
 
 var _storybookDatabase2 = _interopRequireDefault(_storybookDatabase);
 
-var _persister = require('./persister');
+var _bundledPersister = require('./bundledPersister');
 
-var _persister2 = _interopRequireDefault(_persister);
+var _bundledPersister2 = _interopRequireDefault(_bundledPersister);
+
+var _devServerPersister = require('./devServerPersister');
+
+var _devServerPersister2 = _interopRequireDefault(_devServerPersister);
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function createDatabase(_ref) {
   var url = _ref.url;
+  var bundled = _ref.bundled;
+
+  var persister = null;
+  if (bundled) {
+    persister = new _bundledPersister2.default({ url: url });
+  } else {
+    persister = new _devServerPersister2.default({ url: url });
+  }
 
-  var persister = new _persister2.default({ url: url });
   return new _storybookDatabase2.default({ persister: persister });
 }

dist/server/middleware.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 exports.default = function (dbPath) {
-  var db = new _database2.default(dbPath);
+  var db = new _database2.default((0, _lowdb2.default)(dbPath, { storage: _fileAsync2.default }));
 
   var router = new _express.Router();
   router.use(_bodyParser2.default.json());
@@ -41,7 +41,15 @@ var _bodyParser = require('body-parser');
 
 var _bodyParser2 = _interopRequireDefault(_bodyParser);
 
-var _database = require('./database');
+var _lowdb = require('lowdb');
+
+var _lowdb2 = _interopRequireDefault(_lowdb);
+
+var _fileAsync = require('lowdb/lib/file-async');
+
+var _fileAsync2 = _interopRequireDefault(_fileAsync);
+
+var _database = require('../shared/database');
 
 var _database2 = _interopRequireDefault(_database);
 

dist/server/database.js → dist/shared/database.js

@@ -1,34 +1,24 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _lowdb = require('lowdb');
-
-var _lowdb2 = _interopRequireDefault(_lowdb);
-
-var _fileAsync = require('lowdb/lib/file-async');
-
-var _fileAsync2 = _interopRequireDefault(_fileAsync);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 var Database = function () {
-  function Database(dbPath) {
+  function Database(db) {
     _classCallCheck(this, Database);
 
-    this.db = (0, _lowdb2.default)(dbPath, { storage: _fileAsync2.default });
+    this.db = db;
   }
 
   _createClass(Database, [{
-    key: 'get',
+    key: "get",
     value: function get(collection, query, sort, limit) {
       // if the database doesn't exist, add the document
       // and return the inserted document as the result.
@@ -52,7 +42,7 @@ var Database = function () {
       return sorted.slice(0, limit);
     }
   }, {
-    key: 'set',
+    key: "set",
     value: function set(collection, item) {
       // if the database doesn't exist, add the item
       // and return the inserted item as the result.

package.json

@@ -18,6 +18,7 @@
   "dependencies": {
     "@kadira/storybook-database": "^2.0.1",
     "body-parser": "^1.15.2",
+    "lodash": "^4.15.0",
     "lowdb": "^0.13.1"
   },
   "peerDependencies": {

src/client/bundledPersister.js

@@ -0,0 +1,60 @@
+import lowdb from 'lowdb';
+import lodash from 'lodash';
+import Database from '../shared/database';
+
+export default class StaticFilePersister {
+  constructor({ url }) {
+    this.url = url;
+    this.db = null;
+    this.pending = [];
+    this._initDB();
+  }
+
+  set(collection, item) {
+    return new Promise((resolve, reject) => {
+      reject(new Error('cannot modify data on read-only database'));
+    });
+  }
+
+  get(collection, query, options) {
+    if (!this.db) {
+      return this._enqueue(collection, query, options);
+    }
+    return new Promise((resolve, reject) => {
+      const res = this.db.get(collection, query, options.sort, options.limit);
+      resolve(res);
+    });
+  }
+
+  _initDB() {
+    return fetch(this.url)
+      .then(res => res.json())
+      .then(data => this._setData(data))
+      .then(() => this._flushQueue())
+      .catch(err => console.error(err));
+  }
+
+  _setData(data) {
+    const db = lowdb('storybook-addon-data', {}, lodash);
+    db.defaults(data).value();
+    this.db = new Database(db);
+  }
+
+  _enqueue(collection, query, options) {
+    return new Promise((resolve, reject) => {
+      const request = { collection, query, options };
+      this.pending.push({ request, resolve, reject });
+    });
+  }
+
+  _flushQueue() {
+    const pending = this.pending;
+    this.pending = [];
+    pending.forEach(job => {
+      const { collection, query, options } = job.request;
+      this.get(collection, query, options)
+        .then(res => job.resolve(res))
+        .catch(err => job.reject(err));
+    });
+  }
+}

src/client/persister.js → src/client/devServerPersister.js

@@ -1,4 +1,4 @@
-export default class LocalPersister {
+export default class DevServerPersister {
   constructor({ url }) {
     this.url = url;
     this.headers = { 'content-type': 'application/json' };

src/client/index.js

@@ -1,7 +1,14 @@
 import Database from '@kadira/storybook-database';
-import LocalPersister from './persister';
+import BundledPersister from './bundledPersister';
+import DevServerPersister from './devServerPersister';
+
+export default function createDatabase({ url, bundled }) {
+  let persister = null;
+  if (bundled) {
+    persister = new BundledPersister({ url });
+  } else {
+    persister = new DevServerPersister({ url });
+  }
 
-export default function createDatabase({ url }) {
-  const persister = new LocalPersister({ url });
   return new Database({ persister });
 }

src/server/middleware.js

@@ -1,9 +1,11 @@
 import { Router } from 'express';
 import bodyParser from 'body-parser';
-import Database from './database';
+import lowdb from 'lowdb';
+import fileAsyncStorage from 'lowdb/lib/file-async';
+import Database from '../shared/database';
 
 export default function (dbPath) {
-  const db = new Database(dbPath);
+  const db = new Database(lowdb(dbPath, { storage: fileAsyncStorage }));
 
   const router = new Router();
   router.use(bodyParser.json());

src/server/database.js → src/shared/database.js

@@ -1,9 +1,6 @@
-import lowdb from 'lowdb';
-import fileAsyncStorage from 'lowdb/lib/file-async';
-
 export default class Database {
-  constructor(dbPath) {
-    this.db = lowdb(dbPath, { storage: fileAsyncStorage });
+  constructor(db) {
+    this.db = db;
   }
 
   get(collection, query, sort, limit) {