@veeqo/custom-views - npm Package Compare versions

Comparing version 1.1.1 to 1.1.2

dist/index.cjs.js

@@ -7,8 +7,10 @@ 'use strict';
 
+var veeqoComponents = require('veeqo-components');
 var React = require('react');
 var React__default = _interopDefault(React);
+var mobxReact = require('mobx-react');
 var mobx = require('mobx');
 var nanoid = _interopDefault(require('nanoid'));
 
-var customViewPersistenceModes = {
+var customViewPostModes = {
   localStorage: 'localStorage',
@@ -103,43 +105,3 @@ api: 'api'
 
-function _initializerDefineProperty(target, property, descriptor, context) {
-  if (!descriptor) return;
-  Object.defineProperty(target, property, {
-    enumerable: descriptor.enumerable,
-    configurable: descriptor.configurable,
-    writable: descriptor.writable,
-    value: descriptor.initializer ? descriptor.initializer.call(context) : void 0
-  });
-}
-
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object.keys(descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
-
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
-  }
-
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
-
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
-
-  if (desc.initializer === void 0) {
-    Object.defineProperty(target, property, desc);
-    desc = null;
-  }
-
-  return desc;
-}
-
-var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _temp;
-var Tab = (_dec = mobx.action.bound, _dec2 = mobx.action.bound, _dec3 = mobx.action.bound, _dec4 = mobx.action.bound, _dec5 = mobx.action.bound, _dec6 = mobx.action.bound, _dec7 = mobx.action.bound, (_class = (_temp = class Tab {
+class Tab {
   constructor(_ref) {
@@ -158,12 +120,26 @@ var {
 
-    _initializerDefineProperty(this, "key", _descriptor, this);
+    _defineProperty(this, "key", null);
 
-    _initializerDefineProperty(this, "label", _descriptor2, this);
+    _defineProperty(this, "label", null);
 
-    _initializerDefineProperty(this, "type", _descriptor3, this);
+    _defineProperty(this, "type", null);
 
-    _initializerDefineProperty(this, "count", _descriptor4, this);
+    _defineProperty(this, "count", null);
 
-    _initializerDefineProperty(this, "filters", _descriptor5, this);
+    _defineProperty(this, "filters", {});
 
+    mobx.makeObservable(this, {
+      key: mobx.observable,
+      label: mobx.observable,
+      type: mobx.observable,
+      count: mobx.observable,
+      filters: mobx.observable,
+      setLabel: mobx.action.bound,
+      setFilters: mobx.action.bound,
+      setField: mobx.action.bound,
+      post: mobx.action.bound,
+      patch: mobx.action.bound,
+      delete: mobx.action.bound,
+      initialize: mobx.action.bound
+    });
     this.initialize(tab);
@@ -186,3 +162,3 @@ this.customViewModelType = customViewModelType;
 
-  persist() {
+  post() {
     var {
@@ -193,3 +169,3 @@ apiHandlers,
     if (this.type === 'saved') return this.patch();
-    return apiHandlers.persist({
+    return apiHandlers.post({
       type: 'custom_view',
@@ -245,41 +221,5 @@ attributes: {
 
-}, _temp), (_descriptor = _applyDecoratedDescriptor(_class.prototype, "key", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "label", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "type", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "count", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "filters", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return {};
-  }
-}), _applyDecoratedDescriptor(_class.prototype, "setLabel", [_dec], Object.getOwnPropertyDescriptor(_class.prototype, "setLabel"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setFilters", [_dec2], Object.getOwnPropertyDescriptor(_class.prototype, "setFilters"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setField", [_dec3], Object.getOwnPropertyDescriptor(_class.prototype, "setField"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "persist", [_dec4], Object.getOwnPropertyDescriptor(_class.prototype, "persist"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "patch", [_dec5], Object.getOwnPropertyDescriptor(_class.prototype, "patch"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "delete", [_dec6], Object.getOwnPropertyDescriptor(_class.prototype, "delete"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "initialize", [_dec7], Object.getOwnPropertyDescriptor(_class.prototype, "initialize"), _class.prototype)), _class));
+}
 
-var _dec$1, _dec2$1, _dec3$1, _dec4$1, _dec5$1, _dec6$1, _dec7$1, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _class$1, _descriptor$1, _descriptor2$1, _descriptor3$1, _descriptor4$1, _descriptor5$1, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _temp$1;
-var TabsStore = (_dec$1 = mobx.action.bound, _dec2$1 = mobx.action.bound, _dec3$1 = mobx.action.bound, _dec4$1 = mobx.action.bound, _dec5$1 = mobx.action.bound, _dec6$1 = mobx.action.bound, _dec7$1 = mobx.action.bound, _dec8 = mobx.action.bound, _dec9 = mobx.action.bound, _dec10 = mobx.action.bound, _dec11 = mobx.action.bound, _dec12 = mobx.action.bound, _dec13 = mobx.action.bound, (_class$1 = (_temp$1 = class TabsStore {
+class TabsStore {
   get tabs() {
@@ -346,4 +286,4 @@ return [...this.fixedTabs, ...this.customTabs];
 
-  setPersistenceMode(mode) {
-    this.persistenceMode = mode;
+  setPostMode(mode) {
+    this.postMode = mode;
   }
@@ -354,3 +294,3 @@
       customViewModelType,
-      persistenceMode,
+      postMode,
       apiHandlers,
@@ -360,27 +300,57 @@ fixedViews
 
-    _initializerDefineProperty(this, "customViewModelType", _descriptor$1, this);
+    _defineProperty(this, "customViewModelType", null);
 
-    _initializerDefineProperty(this, "apiHandlers", _descriptor2$1, this);
+    _defineProperty(this, "apiHandlers", null);
 
-    _initializerDefineProperty(this, "fixedViews", _descriptor3$1, this);
+    _defineProperty(this, "fixedViews", null);
 
-    _defineProperty(this, "customTabPersistenceModes", customViewPersistenceModes);
+    _defineProperty(this, "customTabPostModes", customViewPostModes);
 
-    _initializerDefineProperty(this, "isLoading", _descriptor4$1, this);
+    _defineProperty(this, "isLoading", true);
 
-    _initializerDefineProperty(this, "persistenceMode", _descriptor5$1, this);
+    _defineProperty(this, "postMode", null);
 
-    _initializerDefineProperty(this, "activeTabKey", _descriptor6, this);
+    _defineProperty(this, "activeTabKey", null);
 
-    _initializerDefineProperty(this, "fixedTabs", _descriptor7, this);
+    _defineProperty(this, "fixedTabs", []);
 
-    _initializerDefineProperty(this, "customTabs", _descriptor8, this);
+    _defineProperty(this, "customTabs", []);
 
-    _initializerDefineProperty(this, "fetchedCustomTabs", _descriptor9, this);
+    _defineProperty(this, "fetchedCustomTabs", []);
 
+    mobx.makeObservable(this, {
+      customViewModelType: mobx.observable,
+      apiHandlers: mobx.observable,
+      fixedViews: mobx.observable,
+      isLoading: mobx.observable,
+      postMode: mobx.observable,
+      activeTabKey: mobx.observable,
+      fixedTabs: mobx.observable,
+      customTabs: mobx.observable,
+      fetchedCustomTabs: mobx.observable,
+      tabs: mobx.computed,
+      fixedTabKeys: mobx.computed,
+      customTabKeys: mobx.computed,
+      setIsLoading: mobx.action.bound,
+      initializeTabs: mobx.action.bound,
+      setPostMode: mobx.action,
+      setField: mobx.action.bound,
+      setCustomTabs: mobx.action.bound,
+      setFixedTabs: mobx.action.bound,
+      setFetchedTabs: mobx.action.bound,
+      createCustomTab: mobx.action.bound,
+      duplicateCustomTab: mobx.action.bound,
+      deleteCustomTab: mobx.action.bound,
+      saveCustomTab: mobx.action.bound,
+      setLabelAndSave: mobx.action.bound,
+      savedTabs: mobx.computed,
+      setActiveTabKey: mobx.action.bound,
+      postTabs: mobx.action.bound
+    });
     this.setField('customViewModelType', customViewModelType);
-    this.setField('persistenceMode', persistenceMode);
+    this.setField('postMode', postMode);
     this.setField('apiHandlers', apiHandlers);
     this.setField('fixedViews', fixedViews);
-    this.setPersistenceMode(persistenceMode);
+    this.setPostMode(postMode);
+    this.initializeTabs();
   }
@@ -417,3 +387,3 @@
     this.setActiveTabKey(draftTab.key);
-    this.persistTabs();
+    this.postTabs();
   }
@@ -423,3 +393,3 @@
     var {
-      persistenceMode
+      postMode
     } = this;
@@ -440,9 +410,9 @@ var targetTab = this.customTabs.find(i => i.key === tabKey);
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.setItem(draftTab.key, localStorage.getItem(tabKey));
       this.customTabs.push(draftTab);
-      this.persistTabs();
+      this.postTabs();
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs.push(draftTab);
@@ -455,10 +425,10 @@ }
     var {
-      persistenceMode
+      postMode
     } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.removeItem(tabKey);
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs[pos].delete();
@@ -468,3 +438,3 @@ }
     this.customTabs.splice(pos, 1);
-    this.persistTabs();
+    this.postTabs();
   }
@@ -474,12 +444,12 @@
     var {
-      persistenceMode
+      postMode
     } = this;
     var tab = this.customTabs.find(i => i.key === tabKey);
 
-    if (persistenceMode === customViewPersistenceModes.api) {
-      tab.persist();
+    if (postMode === customViewPostModes.api) {
+      tab.post();
     }
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      this.persistTabs();
+    if (postMode === customViewPostModes.localStorage) {
+      this.postTabs();
       tab.setField('type', 'saved');
@@ -506,79 +476,14 @@ }
 
-  persistTabs() {
+  postTabs() {
     var {
-      persistenceMode
+      postMode,
+      customViewModelType
     } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      var {
-        pathname
-      } = this.configStore;
-      localStorage.setItem("".concat(pathname, ":customTabs"), JSON.stringify(this.savedTabs));
+    if (postMode === customViewPostModes.localStorage) {
+      localStorage.setItem("".concat(customViewModelType, ":customTabs"), JSON.stringify(this.savedTabs));
     }
   }
 
-}, _temp$1), (_descriptor$1 = _applyDecoratedDescriptor(_class$1.prototype, "customViewModelType", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor2$1 = _applyDecoratedDescriptor(_class$1.prototype, "apiHandlers", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor3$1 = _applyDecoratedDescriptor(_class$1.prototype, "fixedViews", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor4$1 = _applyDecoratedDescriptor(_class$1.prototype, "isLoading", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return true;
-  }
-}), _descriptor5$1 = _applyDecoratedDescriptor(_class$1.prototype, "persistenceMode", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor6 = _applyDecoratedDescriptor(_class$1.prototype, "activeTabKey", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor7 = _applyDecoratedDescriptor(_class$1.prototype, "fixedTabs", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _descriptor8 = _applyDecoratedDescriptor(_class$1.prototype, "customTabs", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _descriptor9 = _applyDecoratedDescriptor(_class$1.prototype, "fetchedCustomTabs", [mobx.observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _applyDecoratedDescriptor(_class$1.prototype, "tabs", [mobx.computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "tabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "fixedTabKeys", [mobx.computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "fixedTabKeys"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "customTabKeys", [mobx.computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "customTabKeys"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setIsLoading", [_dec$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setIsLoading"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "initializeTabs", [_dec2$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "initializeTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setPersistenceMode", [mobx.action], Object.getOwnPropertyDescriptor(_class$1.prototype, "setPersistenceMode"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setField", [_dec3$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setField"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setCustomTabs", [_dec4$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setCustomTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setFixedTabs", [_dec5$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setFixedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setFetchedTabs", [_dec6$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setFetchedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "createCustomTab", [_dec7$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "createCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "duplicateCustomTab", [_dec8], Object.getOwnPropertyDescriptor(_class$1.prototype, "duplicateCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "deleteCustomTab", [_dec9], Object.getOwnPropertyDescriptor(_class$1.prototype, "deleteCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "saveCustomTab", [_dec10], Object.getOwnPropertyDescriptor(_class$1.prototype, "saveCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setLabelAndSave", [_dec11], Object.getOwnPropertyDescriptor(_class$1.prototype, "setLabelAndSave"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "savedTabs", [mobx.computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "savedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setActiveTabKey", [_dec12], Object.getOwnPropertyDescriptor(_class$1.prototype, "setActiveTabKey"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "persistTabs", [_dec13], Object.getOwnPropertyDescriptor(_class$1.prototype, "persistTabs"), _class$1.prototype)), _class$1));
+}
 
@@ -602,4 +507,43 @@ var CustomViewsContext = /*#__PURE__*/React.createContext();
 
+var {
+  Views
+} = veeqoComponents.VeeqoUI;
+var ViewsComponent = mobxReact.observer((_ref) => {
+  var {
+    includedFilters,
+    hasUnsavedChanges,
+    handleChangeActiveTab: _handleChangeActiveTab,
+    handleDiscardUnsavedChanges,
+    handleCreateCustomView: _handleCreateCustomView
+  } = _ref;
+  var tabsStore = useCustomViewsStore();
+  return /*#__PURE__*/React__default.createElement(Views, {
+    isLoading: tabsStore.isLoading,
+    tabs: tabsStore.tabs,
+    fixedTabs: tabsStore.fixedTabs,
+    customTabs: tabsStore.customTabs,
+    activeTabKey: tabsStore.activeTabKey,
+    includedFilters: includedFilters,
+    hasUnsavedChanges: hasUnsavedChanges,
+    onSave: tabsStore.setLabelAndSave,
+    onDelete: tabsStore.deleteCustomTab,
+    handleDuplicateTab: tabsStore.duplicateCustomTab,
+    handleChangeActiveTab: id => {
+      tabsStore.setActiveTabKey(id);
+
+      _handleChangeActiveTab(id);
+    },
+    handleCreateCustomView: () => {
+      tabsStore.createCustomTab();
+
+      _handleCreateCustomView();
+    },
+    handleDiscardUnsavedChanges: handleDiscardUnsavedChanges,
+    handleSaveToCurrentView: tabsStore.saveCustomTab
+  });
+});
+
+exports.CustomViews = ViewsComponent;
 exports.CustomViewsProviderFactory = CustomViewsProviderFactory;
-exports.persistenceModes = customViewPersistenceModes;
+exports.postModes = customViewPostModes;
 exports.useCustomViewsStore = useCustomViewsStore;

dist/index.esm.js

@@ -0,6 +1,8 @@
+import { VeeqoUI } from 'veeqo-components';
 import React, { useContext, Children, createContext } from 'react';
-import { action, observable, computed } from 'mobx';
+import { observer } from 'mobx-react';
+import { makeObservable, observable, action, computed } from 'mobx';
 import nanoid from 'nanoid';
 
-var customViewPersistenceModes = {
+var customViewPostModes = {
   localStorage: 'localStorage',
@@ -95,43 +97,3 @@ api: 'api'
 
-function _initializerDefineProperty(target, property, descriptor, context) {
-  if (!descriptor) return;
-  Object.defineProperty(target, property, {
-    enumerable: descriptor.enumerable,
-    configurable: descriptor.configurable,
-    writable: descriptor.writable,
-    value: descriptor.initializer ? descriptor.initializer.call(context) : void 0
-  });
-}
-
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object.keys(descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
-
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
-  }
-
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
-
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
-
-  if (desc.initializer === void 0) {
-    Object.defineProperty(target, property, desc);
-    desc = null;
-  }
-
-  return desc;
-}
-
-var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _temp;
-var Tab = (_dec = action.bound, _dec2 = action.bound, _dec3 = action.bound, _dec4 = action.bound, _dec5 = action.bound, _dec6 = action.bound, _dec7 = action.bound, (_class = (_temp = class Tab {
+class Tab {
   constructor(_ref) {
@@ -150,12 +112,26 @@ var {
 
-    _initializerDefineProperty(this, "key", _descriptor, this);
+    _defineProperty(this, "key", null);
 
-    _initializerDefineProperty(this, "label", _descriptor2, this);
+    _defineProperty(this, "label", null);
 
-    _initializerDefineProperty(this, "type", _descriptor3, this);
+    _defineProperty(this, "type", null);
 
-    _initializerDefineProperty(this, "count", _descriptor4, this);
+    _defineProperty(this, "count", null);
 
-    _initializerDefineProperty(this, "filters", _descriptor5, this);
+    _defineProperty(this, "filters", {});
 
+    makeObservable(this, {
+      key: observable,
+      label: observable,
+      type: observable,
+      count: observable,
+      filters: observable,
+      setLabel: action.bound,
+      setFilters: action.bound,
+      setField: action.bound,
+      post: action.bound,
+      patch: action.bound,
+      delete: action.bound,
+      initialize: action.bound
+    });
     this.initialize(tab);
@@ -178,3 +154,3 @@ this.customViewModelType = customViewModelType;
 
-  persist() {
+  post() {
     var {
@@ -185,3 +161,3 @@ apiHandlers,
     if (this.type === 'saved') return this.patch();
-    return apiHandlers.persist({
+    return apiHandlers.post({
       type: 'custom_view',
@@ -237,41 +213,5 @@ attributes: {
 
-}, _temp), (_descriptor = _applyDecoratedDescriptor(_class.prototype, "key", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "label", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "type", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "count", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "filters", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return {};
-  }
-}), _applyDecoratedDescriptor(_class.prototype, "setLabel", [_dec], Object.getOwnPropertyDescriptor(_class.prototype, "setLabel"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setFilters", [_dec2], Object.getOwnPropertyDescriptor(_class.prototype, "setFilters"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setField", [_dec3], Object.getOwnPropertyDescriptor(_class.prototype, "setField"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "persist", [_dec4], Object.getOwnPropertyDescriptor(_class.prototype, "persist"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "patch", [_dec5], Object.getOwnPropertyDescriptor(_class.prototype, "patch"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "delete", [_dec6], Object.getOwnPropertyDescriptor(_class.prototype, "delete"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "initialize", [_dec7], Object.getOwnPropertyDescriptor(_class.prototype, "initialize"), _class.prototype)), _class));
+}
 
-var _dec$1, _dec2$1, _dec3$1, _dec4$1, _dec5$1, _dec6$1, _dec7$1, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _class$1, _descriptor$1, _descriptor2$1, _descriptor3$1, _descriptor4$1, _descriptor5$1, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _temp$1;
-var TabsStore = (_dec$1 = action.bound, _dec2$1 = action.bound, _dec3$1 = action.bound, _dec4$1 = action.bound, _dec5$1 = action.bound, _dec6$1 = action.bound, _dec7$1 = action.bound, _dec8 = action.bound, _dec9 = action.bound, _dec10 = action.bound, _dec11 = action.bound, _dec12 = action.bound, _dec13 = action.bound, (_class$1 = (_temp$1 = class TabsStore {
+class TabsStore {
   get tabs() {
@@ -338,4 +278,4 @@ return [...this.fixedTabs, ...this.customTabs];
 
-  setPersistenceMode(mode) {
-    this.persistenceMode = mode;
+  setPostMode(mode) {
+    this.postMode = mode;
   }
@@ -346,3 +286,3 @@
       customViewModelType,
-      persistenceMode,
+      postMode,
       apiHandlers,
@@ -352,27 +292,57 @@ fixedViews
 
-    _initializerDefineProperty(this, "customViewModelType", _descriptor$1, this);
+    _defineProperty(this, "customViewModelType", null);
 
-    _initializerDefineProperty(this, "apiHandlers", _descriptor2$1, this);
+    _defineProperty(this, "apiHandlers", null);
 
-    _initializerDefineProperty(this, "fixedViews", _descriptor3$1, this);
+    _defineProperty(this, "fixedViews", null);
 
-    _defineProperty(this, "customTabPersistenceModes", customViewPersistenceModes);
+    _defineProperty(this, "customTabPostModes", customViewPostModes);
 
-    _initializerDefineProperty(this, "isLoading", _descriptor4$1, this);
+    _defineProperty(this, "isLoading", true);
 
-    _initializerDefineProperty(this, "persistenceMode", _descriptor5$1, this);
+    _defineProperty(this, "postMode", null);
 
-    _initializerDefineProperty(this, "activeTabKey", _descriptor6, this);
+    _defineProperty(this, "activeTabKey", null);
 
-    _initializerDefineProperty(this, "fixedTabs", _descriptor7, this);
+    _defineProperty(this, "fixedTabs", []);
 
-    _initializerDefineProperty(this, "customTabs", _descriptor8, this);
+    _defineProperty(this, "customTabs", []);
 
-    _initializerDefineProperty(this, "fetchedCustomTabs", _descriptor9, this);
+    _defineProperty(this, "fetchedCustomTabs", []);
 
+    makeObservable(this, {
+      customViewModelType: observable,
+      apiHandlers: observable,
+      fixedViews: observable,
+      isLoading: observable,
+      postMode: observable,
+      activeTabKey: observable,
+      fixedTabs: observable,
+      customTabs: observable,
+      fetchedCustomTabs: observable,
+      tabs: computed,
+      fixedTabKeys: computed,
+      customTabKeys: computed,
+      setIsLoading: action.bound,
+      initializeTabs: action.bound,
+      setPostMode: action,
+      setField: action.bound,
+      setCustomTabs: action.bound,
+      setFixedTabs: action.bound,
+      setFetchedTabs: action.bound,
+      createCustomTab: action.bound,
+      duplicateCustomTab: action.bound,
+      deleteCustomTab: action.bound,
+      saveCustomTab: action.bound,
+      setLabelAndSave: action.bound,
+      savedTabs: computed,
+      setActiveTabKey: action.bound,
+      postTabs: action.bound
+    });
     this.setField('customViewModelType', customViewModelType);
-    this.setField('persistenceMode', persistenceMode);
+    this.setField('postMode', postMode);
     this.setField('apiHandlers', apiHandlers);
     this.setField('fixedViews', fixedViews);
-    this.setPersistenceMode(persistenceMode);
+    this.setPostMode(postMode);
+    this.initializeTabs();
   }
@@ -409,3 +379,3 @@
     this.setActiveTabKey(draftTab.key);
-    this.persistTabs();
+    this.postTabs();
   }
@@ -415,3 +385,3 @@
     var {
-      persistenceMode
+      postMode
     } = this;
@@ -432,9 +402,9 @@ var targetTab = this.customTabs.find(i => i.key === tabKey);
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.setItem(draftTab.key, localStorage.getItem(tabKey));
       this.customTabs.push(draftTab);
-      this.persistTabs();
+      this.postTabs();
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs.push(draftTab);
@@ -447,10 +417,10 @@ }
     var {
-      persistenceMode
+      postMode
     } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.removeItem(tabKey);
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs[pos].delete();
@@ -460,3 +430,3 @@ }
     this.customTabs.splice(pos, 1);
-    this.persistTabs();
+    this.postTabs();
   }
@@ -466,12 +436,12 @@
     var {
-      persistenceMode
+      postMode
     } = this;
     var tab = this.customTabs.find(i => i.key === tabKey);
 
-    if (persistenceMode === customViewPersistenceModes.api) {
-      tab.persist();
+    if (postMode === customViewPostModes.api) {
+      tab.post();
     }
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      this.persistTabs();
+    if (postMode === customViewPostModes.localStorage) {
+      this.postTabs();
       tab.setField('type', 'saved');
@@ -498,79 +468,14 @@ }
 
-  persistTabs() {
+  postTabs() {
     var {
-      persistenceMode
+      postMode,
+      customViewModelType
     } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      var {
-        pathname
-      } = this.configStore;
-      localStorage.setItem("".concat(pathname, ":customTabs"), JSON.stringify(this.savedTabs));
+    if (postMode === customViewPostModes.localStorage) {
+      localStorage.setItem("".concat(customViewModelType, ":customTabs"), JSON.stringify(this.savedTabs));
     }
   }
 
-}, _temp$1), (_descriptor$1 = _applyDecoratedDescriptor(_class$1.prototype, "customViewModelType", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor2$1 = _applyDecoratedDescriptor(_class$1.prototype, "apiHandlers", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor3$1 = _applyDecoratedDescriptor(_class$1.prototype, "fixedViews", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor4$1 = _applyDecoratedDescriptor(_class$1.prototype, "isLoading", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return true;
-  }
-}), _descriptor5$1 = _applyDecoratedDescriptor(_class$1.prototype, "persistenceMode", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor6 = _applyDecoratedDescriptor(_class$1.prototype, "activeTabKey", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return null;
-  }
-}), _descriptor7 = _applyDecoratedDescriptor(_class$1.prototype, "fixedTabs", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _descriptor8 = _applyDecoratedDescriptor(_class$1.prototype, "customTabs", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _descriptor9 = _applyDecoratedDescriptor(_class$1.prototype, "fetchedCustomTabs", [observable], {
-  configurable: true,
-  enumerable: true,
-  writable: true,
-  initializer: function initializer() {
-    return [];
-  }
-}), _applyDecoratedDescriptor(_class$1.prototype, "tabs", [computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "tabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "fixedTabKeys", [computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "fixedTabKeys"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "customTabKeys", [computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "customTabKeys"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setIsLoading", [_dec$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setIsLoading"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "initializeTabs", [_dec2$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "initializeTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setPersistenceMode", [action], Object.getOwnPropertyDescriptor(_class$1.prototype, "setPersistenceMode"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setField", [_dec3$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setField"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setCustomTabs", [_dec4$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setCustomTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setFixedTabs", [_dec5$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setFixedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setFetchedTabs", [_dec6$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "setFetchedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "createCustomTab", [_dec7$1], Object.getOwnPropertyDescriptor(_class$1.prototype, "createCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "duplicateCustomTab", [_dec8], Object.getOwnPropertyDescriptor(_class$1.prototype, "duplicateCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "deleteCustomTab", [_dec9], Object.getOwnPropertyDescriptor(_class$1.prototype, "deleteCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "saveCustomTab", [_dec10], Object.getOwnPropertyDescriptor(_class$1.prototype, "saveCustomTab"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setLabelAndSave", [_dec11], Object.getOwnPropertyDescriptor(_class$1.prototype, "setLabelAndSave"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "savedTabs", [computed], Object.getOwnPropertyDescriptor(_class$1.prototype, "savedTabs"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "setActiveTabKey", [_dec12], Object.getOwnPropertyDescriptor(_class$1.prototype, "setActiveTabKey"), _class$1.prototype), _applyDecoratedDescriptor(_class$1.prototype, "persistTabs", [_dec13], Object.getOwnPropertyDescriptor(_class$1.prototype, "persistTabs"), _class$1.prototype)), _class$1));
+}
 
@@ -594,2 +499,40 @@ var CustomViewsContext = /*#__PURE__*/createContext();
 
-export { CustomViewsProviderFactory, customViewPersistenceModes as persistenceModes, useCustomViewsStore };
+var {
+  Views
+} = VeeqoUI;
+var ViewsComponent = observer((_ref) => {
+  var {
+    includedFilters,
+    hasUnsavedChanges,
+    handleChangeActiveTab: _handleChangeActiveTab,
+    handleDiscardUnsavedChanges,
+    handleCreateCustomView: _handleCreateCustomView
+  } = _ref;
+  var tabsStore = useCustomViewsStore();
+  return /*#__PURE__*/React.createElement(Views, {
+    isLoading: tabsStore.isLoading,
+    tabs: tabsStore.tabs,
+    fixedTabs: tabsStore.fixedTabs,
+    customTabs: tabsStore.customTabs,
+    activeTabKey: tabsStore.activeTabKey,
+    includedFilters: includedFilters,
+    hasUnsavedChanges: hasUnsavedChanges,
+    onSave: tabsStore.setLabelAndSave,
+    onDelete: tabsStore.deleteCustomTab,
+    handleDuplicateTab: tabsStore.duplicateCustomTab,
+    handleChangeActiveTab: id => {
+      tabsStore.setActiveTabKey(id);
+
+      _handleChangeActiveTab(id);
+    },
+    handleCreateCustomView: () => {
+      tabsStore.createCustomTab();
+
+      _handleCreateCustomView();
+    },
+    handleDiscardUnsavedChanges: handleDiscardUnsavedChanges,
+    handleSaveToCurrentView: tabsStore.saveCustomTab
+  });
+});
+
+export { ViewsComponent as CustomViews, CustomViewsProviderFactory, customViewPostModes as postModes, useCustomViewsStore };

lib/common/api.js

 const fetchCustomViews = () => {};
-const persistCustomView = () => {};
+const postCustomView = () => {};
 const patchCustomView = () => {};
@@ -8,3 +8,3 @@ const deleteCustomView = () => {};
   fetchCustomViews,
-  persistCustomView,
+  postCustomView,
   patchCustomView,
@@ -11,0 +11,0 @@ deleteCustomView,

lib/context.jsx

@@ -1,2 +0,4 @@
-import React, { Children, createContext, useContext } from 'react';
+import React, {
+  Children, createContext, useContext,
+} from 'react';
 
@@ -3,0 +5,0 @@ import TabsStore from './TabsStore';

lib/index.js

@@ -1,2 +0,3 @@
-import persistenceModes from './common/persistenceModes';
+import postModes from './common/postModes';
+import CustomViews from './CustomViews';
 
@@ -9,5 +10,6 @@ import {
 export {
-  persistenceModes,
+  postModes,
   CustomViewsProviderFactory,
   useCustomViewsStore,
+  CustomViews,
 };

lib/models/Tab.js

@@ -1,2 +0,2 @@
-import { observable, action } from 'mobx';
+import { observable, action, makeObservable } from 'mobx';
 
@@ -10,18 +10,28 @@ export default class Tab {
 
-  @observable
   key = null;
 
-  @observable
   label = null;
 
-  @observable
   type = null;
 
-  @observable
   count = null;
 
-  @observable
   filters = {};
 
   constructor({ tab, customViewModelType, apiHandlers }) {
+    makeObservable(this, {
+      key: observable,
+      label: observable,
+      type: observable,
+      count: observable,
+      filters: observable,
+      setLabel: action.bound,
+      setFilters: action.bound,
+      setField: action.bound,
+      post: action.bound,
+      patch: action.bound,
+      delete: action.bound,
+      initialize: action.bound,
+    });
+
     this.initialize(tab);
@@ -32,3 +42,2 @@ this.customViewModelType = customViewModelType;
 
-  @action.bound
   setLabel(value) {
@@ -38,3 +47,2 @@ this.label = value;
 
-  @action.bound
   setFilters(newFilters) {
@@ -44,3 +52,2 @@ this.filters = newFilters;
 
-  @action.bound
   setField(key, value) {
@@ -50,8 +57,7 @@ this[key] = value;
 
-  @action.bound
-  persist() {
+  post() {
     const { apiHandlers, customViewModelType } = this;
     if (this.type === 'saved') return this.patch();
 
-    return apiHandlers.persist({
+    return apiHandlers.post({
       type: 'custom_view',
@@ -69,3 +75,2 @@ attributes: {
 
-  @action.bound
   patch() {
@@ -84,3 +89,2 @@ const { apiHandlers, customViewModelType } = this;
 
-  @action.bound
   delete() {
@@ -91,3 +95,2 @@ const { apiHandlers } = this;
 
-  @action.bound
   initialize(tab) {
@@ -94,0 +97,0 @@ this.key = tab.key;

lib/TabsStore.js

 import {
-  observable, action, computed,
+  observable, action, computed, makeObservable,
 } from 'mobx';
 import nanoid from 'nanoid';
-import customViewPersistenceModes from './common/persistenceModes';
+import customViewPostModes from './common/postModes';
 
@@ -10,32 +10,22 @@ import Tab from './models/Tab';
 export default class TabsStore {
-  @observable
   customViewModelType = null;
 
-  @observable
   apiHandlers = null;
 
-  @observable
   fixedViews = null;
 
-  customTabPersistenceModes = customViewPersistenceModes;
+  customTabPostModes = customViewPostModes;
 
-  @observable
   isLoading = true;
 
-  @observable
-  persistenceMode = null;
+  postMode = null;
 
-  @observable
   activeTabKey = null;
 
-  @observable
   fixedTabs = [];
 
-  @observable
   customTabs = [];
 
-  @observable
   fetchedCustomTabs = [];
 
-  @computed
   get tabs() {
@@ -45,3 +35,2 @@ return [...this.fixedTabs, ...this.customTabs];
 
-  @computed
   get fixedTabKeys() {
@@ -51,3 +40,2 @@ return this.fixedTabs.map((i) => i.key);
 
-  @computed
   get customTabKeys() {
@@ -57,3 +45,2 @@ return this.customTabs.map((i) => i.key);
 
-  @action.bound
   setIsLoading(isLoading) {
@@ -63,3 +50,2 @@ this.isLoading = isLoading;
 
-  @action.bound
   async initializeTabs() {
@@ -98,19 +84,49 @@ const { apiHandlers, customViewModelType, fixedViews } = this;
 
-  @action
-  setPersistenceMode(mode) {
-    this.persistenceMode = mode;
+  setPostMode(mode) {
+    this.postMode = mode;
   }
 
   constructor({
-    customViewModelType, persistenceMode, apiHandlers, fixedViews,
+    customViewModelType, postMode, apiHandlers, fixedViews,
   }) {
+    makeObservable(this, {
+      customViewModelType: observable,
+      apiHandlers: observable,
+      fixedViews: observable,
+      isLoading: observable,
+      postMode: observable,
+      activeTabKey: observable,
+      fixedTabs: observable,
+      customTabs: observable,
+      fetchedCustomTabs: observable,
+      tabs: computed,
+      fixedTabKeys: computed,
+      customTabKeys: computed,
+      setIsLoading: action.bound,
+      initializeTabs: action.bound,
+      setPostMode: action,
+      setField: action.bound,
+      setCustomTabs: action.bound,
+      setFixedTabs: action.bound,
+      setFetchedTabs: action.bound,
+      createCustomTab: action.bound,
+      duplicateCustomTab: action.bound,
+      deleteCustomTab: action.bound,
+      saveCustomTab: action.bound,
+      setLabelAndSave: action.bound,
+      savedTabs: computed,
+      setActiveTabKey: action.bound,
+      postTabs: action.bound,
+    });
+
     this.setField('customViewModelType', customViewModelType);
-    this.setField('persistenceMode', persistenceMode);
+    this.setField('postMode', postMode);
     this.setField('apiHandlers', apiHandlers);
     this.setField('fixedViews', fixedViews);
 
-    this.setPersistenceMode(persistenceMode);
+    this.setPostMode(postMode);
+
+    this.initializeTabs();
   }
 
-  @action.bound
   setField(key, value) {
@@ -120,3 +136,2 @@ this[key] = value;
 
-  @action.bound
   setCustomTabs(tabs) {
@@ -126,3 +141,2 @@ this.customTabs = tabs;
 
-  @action.bound
   setFixedTabs(tabs) {
@@ -132,3 +146,2 @@ this.fixedTabs = tabs;
 
-  @action.bound
   setFetchedTabs(tabs) {
@@ -138,3 +151,2 @@ this.fetchedCustomTabs = tabs;
 
-  @action.bound
   createCustomTab(key = nanoid()) {
@@ -153,8 +165,8 @@ const draftTab = new Tab({
     this.setActiveTabKey(draftTab.key);
-    this.persistTabs();
+    this.postTabs();
   }
 
-  @action.bound
   duplicateCustomTab(tabKey) {
-    const { persistenceMode } = this;
+    const { postMode } = this;
+
     const targetTab = this.customTabs.find((i) => i.key === tabKey);
@@ -175,9 +187,9 @@
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.setItem(draftTab.key, localStorage.getItem(tabKey));
       this.customTabs.push(draftTab);
-      this.persistTabs();
+      this.postTabs();
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs.push(draftTab);
@@ -187,12 +199,11 @@ }
 
-  @action.bound
   deleteCustomTab(tabKey) {
     const pos = this.customTabs.findIndex((tab) => tab.key === tabKey);
-    const { persistenceMode } = this;
+    const { postMode } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
+    if (postMode === customViewPostModes.localStorage) {
       localStorage.removeItem(tabKey);
     }
 
-    if (persistenceMode === customViewPersistenceModes.api) {
+    if (postMode === customViewPostModes.api) {
       this.customTabs[pos].delete();
@@ -202,16 +213,15 @@ }
     this.customTabs.splice(pos, 1);
-    this.persistTabs();
+    this.postTabs();
   }
 
-  @action.bound
   saveCustomTab(tabKey) {
-    const { persistenceMode } = this;
+    const { postMode } = this;
     const tab = this.customTabs.find((i) => i.key === tabKey);
 
-    if (persistenceMode === customViewPersistenceModes.api) {
-      tab.persist();
+    if (postMode === customViewPostModes.api) {
+      tab.post();
     }
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      this.persistTabs();
+    if (postMode === customViewPostModes.localStorage) {
+      this.postTabs();
       tab.setField('type', 'saved');
@@ -221,3 +231,2 @@ }
 
-  @action.bound
   setLabelAndSave(tabKey, newLabel) {
@@ -231,3 +240,2 @@ const tab = this.customTabs.find((i) => i.key === tabKey);
 
-  @computed
   get savedTabs() {
@@ -237,3 +245,2 @@ return this.customTabs.filter((i) => i.type === 'saved');
 
-  @action.bound
   setActiveTabKey(key) {
@@ -243,11 +250,9 @@ this.activeTabKey = key;
 
-  @action.bound
-  persistTabs() {
-    const { persistenceMode } = this;
+  postTabs() {
+    const { postMode, customViewModelType } = this;
 
-    if (persistenceMode === customViewPersistenceModes.localStorage) {
-      const { pathname } = this.configStore;
-      localStorage.setItem(`${pathname}:customTabs`, JSON.stringify(this.savedTabs));
+    if (postMode === customViewPostModes.localStorage) {
+      localStorage.setItem(`${customViewModelType}:customTabs`, JSON.stringify(this.savedTabs));
     }
   }
 }

lib/types.ts

 export type customViewModelType = string;
 
-export type persistenceMode = string;
+export type postMode = string;
 
 export interface apiHandlers<T> {
   fetch: () => Promise<T>;
-  persist: () => Promise<T>;
+  post: () => Promise<T>;
   patch: () => Promise<T>;
@@ -9,0 +9,0 @@ delete: () => Promise<T>;

package.json

 {
   "name": "@veeqo/custom-views",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "veeqo custom views",
@@ -13,2 +13,3 @@ "main": "dist/index.cjs.js",
     "build": "npm test && npm run rollup:build",
+    "storybook": "start-storybook -p 6006",
     "rollup:build": "rollup -c --environment BUILD:production",
@@ -44,13 +45,19 @@ "prepublishOnly": "npm test && npm run rollup:build"
   "dependencies": {
-    "mobx": "^6.0.4",
-    "mobx-react": "^7.0.5",
-    "nanoid": "^2.1.11",
-    "react": "^16.12.0"
+    "veeqo-components": "file:../components"
   },
-  "gitHead": "9726b1f19273fcb8aeda98842e881b7d21fd0ffc",
+  "gitHead": "bb258798a63bfb66c95c0e2e064e2f4b8aef9a24",
   "devDependencies": {
     "eslint": "^6.8.0",
     "jest-cli": "^26.4.2",
-    "rollup": "^1.27.14"
+    "rollup": "^1.27.14",
+    "@storybook/addon-actions": "^6.1.11",
+    "@storybook/addon-controls": "^6.1.11",
+    "@storybook/addon-docs": "^6.1.11",
+    "@storybook/addon-knobs": "6.1.11",
+    "@storybook/addon-links": "^6.1.11",
+    "@storybook/addons": "^6.1.11",
+    "@storybook/react": "^6.1.11",
+    "@storybook/semver": "^7.3.2",
+    "@types/storybook__addon-info": "^5.2.3"
   }
 }

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

No README

Quality

Package does not have a README. This may indicate a failed publish or a low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

52168

increased by3.94%

Dependency count

5

decreased by-37.5%

Number of package files

15

increased by36.36%

Lines of code

1399

increased by4.25%

Number of medium quality alerts

1

decreased by-50%

Number of lines in readme file

119

increased byInfinity%

Worsened metrics

Dev dependency count

12

increased by300%

Dependency changes

• + Addedveeqo-components@file:../components

• - Removedmobx@^6.0.4

• - Removedmobx-react@^7.0.5

• - Removednanoid@^2.1.11

• - Removedreact@^16.12.0