@guillotinaweb/react-gmi 0.29.1 → 0.29.2-alpha.2

package/dist/react-gmi.umd.js

@@ -145,6 +145,7 @@
     };
 
     _proto.apply = function apply(data) {
+      // apply a optimistic update to context
       this.dispatch({
         type: 'APPLY',
         payload: data
@@ -767,8 +768,10 @@
     return bytes;
   }
   function stringToSlug(str) {
-    str = str.replace(/^\s+|\s+$/g, '');
-    str = str.toLowerCase();
+    str = str.replace(/^\s+|\s+$/g, ''); // trim
+
+    str = str.toLowerCase(); // remove accents, swap ñ for n, etc
+
     var from = 'àáäâèéëêìíïîòóöôùúüûñç·/_,:;';
     var to = 'aaaaeeeeiiiioooouuuunc------';
 
@@ -776,7 +779,10 @@
       str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));
     }
 
-    str = str.replace(/[^a-z0-9 -]/g, '').replace(/\s+/g, '-').replace(/-+/g, '-');
+    str = str.replace(/[^a-z0-9 -]/g, '') // remove invalid chars
+    .replace(/\s+/g, '-') // collapse whitespace and replace by -
+    .replace(/-+/g, '-'); // collapse dashes
+
     return str;
   }
   function sleep(ms) {
@@ -920,7 +926,8 @@
         })]
       })]
     });
-  }
+  } // @todo Improve it... Replacing the inputText to a tree
+
   function PathTree(_ref2) {
     var title = _ref2.title,
         defaultPath = _ref2.defaultPath,
@@ -1291,6 +1298,7 @@
     DelayActions: 200,
     Permissions: Permissions,
     SearchEngine: 'PostreSQL',
+    // Elasticsearch
     fieldHaveDeleteButton: function fieldHaveDeleteButton(schema) {
       return (schema == null ? void 0 : schema.widget) === 'file' || (schema == null ? void 0 : schema.widget) === 'select' || (schema == null ? void 0 : schema.type) === 'array';
     }
@@ -1347,7 +1355,9 @@
           } catch (e) {
             return Promise.reject(e);
           }
-        });
+        }); // this sleep is here, to let elasticsearch, wait for
+        // index our operations... (will work 99% of use cases)
+
         actions.push(sleep(cfg.DelayActions));
         return Promise.resolve(Promise.all(actions)).then(function () {
           if (errors.length === 0) {
@@ -1517,6 +1527,9 @@
     };
   };
 
+  // From github.com/protonmail/proton-shared
+
+  /* eslint-disable no-useless-escape */
   var REGEX_EMAIL = /(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/i;
   var REGEX_URL = /((([A-Za-z]{3,9}:(?:\/\/)?)(?:[\-;:&=\+\$,\w]+@)?[A-Za-z0-9\.\-]+|(?:www\.|[\-;:&=\+\$,\w]+@)[A-Za-z0-9\.\-]+)((?:\/[\+~%\/\.\w\-_]*)?\??(?:[\-\+=&;%@\.\w_]*)#?(?:[\.\!\/\\\w]*))?)/;
   var REGEX_HEX_COLOR = /^#([a-f0-9]{3,4}|[a-f0-9]{4}(?:[a-f0-9]{2}){1,2})\b$/i;
@@ -1632,7 +1645,8 @@
 
     var _useState2 = React.useState(false),
         mounted = _useState2[0],
-        setMounted = _useState2[1];
+        setMounted = _useState2[1]; // eslint-disable-next-line
+
 
     ref = ref || React.useRef();
     React.useEffect(function () {
@@ -1700,7 +1714,8 @@
         value = _ref$value === void 0 ? '' : _ref$value,
         dataTest = _ref.dataTest,
         placeholder = _ref.placeholder,
-        id = _ref.id;
+        id = _ref.id,
+        onChange = _ref.onChange;
     var intl = reactIntl.useIntl();
     return jsxRuntime.jsx(Input, {
       type: "email",
@@ -1718,7 +1733,8 @@
         icon: "fas fa-envelope"
       }),
       id: id,
-      placeholder: placeholder
+      placeholder: placeholder,
+      onChange: onChange
     });
   };
 
@@ -1795,14 +1811,15 @@
     var ref = React.useRef();
     var properties = schema.properties,
         required = schema.required;
-    var values = Object.assign({}, formData || {});
+    var values = Object.assign({}, formData || {}); // build initial state
+
     var initialState = {};
     var fields = Object.keys(properties).filter(function (x) {
       return !exclude.includes(x);
     });
     fields.forEach(function (element) {
       initialState[element] = values[element] || undefined;
-    });
+    }); // Register remotes
 
     if (!ref.current) {
       ref.current = {};
@@ -1810,6 +1827,7 @@
         return ref.current[item] = remotes[item];
       });
     } else {
+      // apply remote changes
       Object.keys(remotes).forEach(function (key) {
         if (JSON.stringify(ref.current[key]) !== JSON.stringify(remotes[key])) {
           ref.current[key] = remotes[key];
@@ -1963,166 +1981,7 @@
   });
   Select.displayName = 'Select';
 
-  var formatDate = function formatDate(str) {
-    var d = new Date(str);
-    var minutes = d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes();
-    return d.getDate() + "/" + (d.getMonth() + 1) + "/" + d.getFullYear() + " " + d.getHours() + ":" + minutes;
-  };
-  var get$1 = function get(obj, path, defValue) {
-    var _pathArray$reduce;
-
-    if (!path) return undefined;
-    var pathArray = Array.isArray(path) ? path : path.match(/([^[.\]])+/g);
-    return (_pathArray$reduce = pathArray.reduce(function (prevObj, key) {
-      return prevObj && prevObj[key];
-    }, obj)) != null ? _pathArray$reduce : defValue;
-  };
-  function getNewId(id) {
-    if (id === void 0) {
-      id = '';
-    }
-
-    var suffix = '-copy-';
-    var rgx = new RegExp("($|" + suffix + "\\d*)");
-    return stringToSlug(id).replace(rgx, function (r) {
-      var num = parseInt(r.replace(suffix, '') || '0');
-      return "" + suffix + (num + 1);
-    });
-  }
-
-  function _catch$1(body, recover) {
-    try {
-      var result = body();
-    } catch (e) {
-      return recover(e);
-    }
-
-    if (result && result.then) {
-      return result.then(void 0, recover);
-    }
-
-    return result;
-  }
-
-  function useVocabulary(vocabularyName, path) {
-    if (path === void 0) {
-      path = null;
-    }
-
-    var traversal = useTraversal();
-
-    var _useSetState = useSetState({
-      data: undefined,
-      loading: false,
-      error: undefined
-    }),
-        vocabulary = _useSetState[0],
-        setVocabulary = _useSetState[1];
-
-    var getPath = function getPath() {
-      if (path) return path;
-      return traversal.path + "@vocabularies/" + vocabularyName;
-    };
-
-    React.useEffect(function () {
-      var getVocabulary = function getVocabulary() {
-        try {
-          var _temp3 = function () {
-            if (vocabularyName && vocabulary.data === undefined && !vocabulary.loading) {
-              var _temp4 = _catch$1(function () {
-                setVocabulary({
-                  loading: true
-                });
-                return Promise.resolve(traversal.client.get(getPath())).then(function (data) {
-                  return Promise.resolve(data.json()).then(function (dataJson) {
-                    setVocabulary({
-                      loading: false,
-                      data: dataJson
-                    });
-                  });
-                });
-              }, function (err) {
-                setVocabulary({
-                  loading: false,
-                  error: err,
-                  data: undefined
-                });
-              });
-
-              if (_temp4 && _temp4.then) return _temp4.then(function () {});
-            }
-          }();
-
-          return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
-        } catch (e) {
-          return Promise.reject(e);
-        }
-      };
-
-      getVocabulary();
-    }, [vocabularyName, vocabulary, path]);
-    return vocabulary;
-  }
-
-  var SelectVocabulary = React.forwardRef(function (_ref, ref) {
-    var vocabularyName = _ref.vocabularyName,
-        className = _ref.className,
-        classWrap = _ref.classWrap,
-        val = _ref.val,
-        dataTest = _ref.dataTest,
-        multiple = _ref.multiple,
-        onChange = _ref.onChange,
-        id = _ref.id,
-        placeholder = _ref.placeholder;
-    var vocabulary = useVocabulary(vocabularyName);
-
-    var getOptions = function getOptions() {
-      if (get$1(vocabulary, 'data.items', null)) {
-        var vocData = vocabulary.data.items.map(function (item) {
-          return {
-            text: item.title,
-            value: item.token
-          };
-        });
-        return vocData;
-      }
-
-      return [];
-    };
-
-    var getProps = function getProps() {
-      if (multiple) {
-        var currentValue = val || [];
-        return {
-          multiple: true,
-          size: 5,
-          value: currentValue,
-          options: getOptions()
-        };
-      }
-
-      return {
-        value: val != null ? val : '',
-        appendDefault: true,
-        options: getOptions()
-      };
-    };
-
-    if (vocabulary.data === undefined || vocabulary.loading) {
-      return jsxRuntime.jsx("div", {});
-    }
-
-    return jsxRuntime.jsx(Select, _extends({}, getProps(), {
-      className: className,
-      classWrap: classWrap || 'is-fullwidth',
-      dataTest: dataTest,
-      ref: ref,
-      onChange: onChange,
-      id: id,
-      placeholder: placeholder
-    }));
-  });
-  SelectVocabulary.displayName = 'SelectVocabulary';
+  // https://github.com/molefrog/wouter
 
   var setURLParams = function setURLParams(p) {
     return window.history.pushState(0, '0', '' + '?' + p.toString().replace(/%2F/g, '/'));
@@ -2143,7 +2002,10 @@
 
     var prevPath = React.useRef(path);
     React.useEffect(function () {
-      patchHistoryEvents();
+      patchHistoryEvents(); // this function checks if the location has been changed since the
+      // last render and updates the state only when needed.
+      // unfortunately, we can't rely on `path` value here, since it can be stale,
+      // that's why we store the last pathname in a ref.
 
       var checkForUpdates = function checkForUpdates() {
         var pathname = currentSearchParams();
@@ -2153,14 +2015,22 @@
       var events = ['popstate', 'pushState', 'replaceState'];
       events.map(function (e) {
         return window.addEventListener(e, checkForUpdates);
-      });
+      }); // it's possible that an update has occurred between render and the effect handler,
+      // so we run additional check on mount to catch these updates. Based on:
+      // https://gist.github.com/bvaughn/e25397f70e8c65b0ae0d7c90b731b189
+
       checkForUpdates();
       return function () {
         events.map(function (e) {
           return window.removeEventListener(e, checkForUpdates);
         });
       };
-    }, []);
+    }, []); // the 2nd argument of the `useLocation` return value is a function
+    // that allows to perform a navigation.
+    //
+    // the function reference should stay the same between re-renders, so that
+    // it can be passed down as an element prop without any performance concerns.
+
     var navigate = React.useCallback(function (to, replace) {
       if (replace) {
         clean(to);
@@ -2179,7 +2049,12 @@
       setURLParams(current);
     }, [path]);
     return [path, navigate, remove];
-  };
+  }; // While History API does have `popstate` event, the only
+  // proper way to listen to changes via `push/replaceState`
+  // is to monkey-patch these methods.
+  //
+  // See https://stackoverflow.com/a/4585031
+
   var patched = 0;
 
   var patchHistoryEvents = function patchHistoryEvents() {
@@ -2189,7 +2064,8 @@
 
       window.history[type] = function () {
         var args = [].slice.call(arguments);
-        var result = original.apply(this, args);
+        var result = original.apply(this, args); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
         var event = new Event(type);
         event.arguments = args;
         dispatchEvent(event);
@@ -2737,7 +2613,8 @@
           });
         }
       }];
-    };
+    } // BBB API changes. Compat G5 and G6
+    ;
 
     _proto.applyCompat = function applyCompat(data) {
       data.member = data.items;
@@ -2897,7 +2774,8 @@
 
         var _temp4 = function () {
           if (!cacheSchemas[name]) {
-            var url = _this25.getContainerFromPath(path);
+            var url = _this25.getContainerFromPath(path); // todo: handle db case (only addable containers)
+
 
             return Promise.resolve(_this25.rest.get(url + "@types/" + name)).then(function (res) {
               return Promise.resolve(res.json()).then(function (_res$json) {
@@ -3016,6 +2894,7 @@
       try {
         var _this41 = this;
 
+        // paths used to query the API always has to start without a "/"
         if (path.startsWith('/')) {
           path = path.slice(1);
         }
@@ -3244,10 +3123,43 @@
     }, [events, ref]);
   }
 
+  var formatDate = function formatDate(str) {
+    var d = new Date(str);
+    var minutes = d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes();
+    return d.getDate() + "/" + (d.getMonth() + 1) + "/" + d.getFullYear() + " " + d.getHours() + ":" + minutes;
+  };
+  var get$1 = function get(obj, path, defValue) {
+    var _pathArray$reduce;
+
+    // If path is not defined or it has false value
+    if (!path) return undefined; // Check if path is string or array. Regex : ensure that we do not have '.' and brackets.
+    // Regex explained: https://regexr.com/58j0k
+
+    var pathArray = Array.isArray(path) ? path : path.match(/([^[.\]])+/g); // Find value if exist return otherwise return undefined value;
+
+    return (_pathArray$reduce = pathArray.reduce(function (prevObj, key) {
+      return prevObj && prevObj[key];
+    }, obj)) != null ? _pathArray$reduce : defValue;
+  };
+  function getNewId(id) {
+    if (id === void 0) {
+      id = '';
+    }
+
+    var suffix = '-copy-';
+    var rgx = new RegExp("($|" + suffix + "\\d*)");
+    return stringToSlug(id).replace(rgx, function (r) {
+      var num = parseInt(r.replace(suffix, '') || '0');
+      return "" + suffix + (num + 1);
+    });
+  }
+
   function debounce(func, wait) {
     var timeout;
     return function () {
-      var context = this;
+      // eslint-disable-next-line @typescript-eslint/no-this-alias
+      var context = this; // eslint-disable-next-line prefer-rest-params
+
       var args = arguments;
 
       var later = function later() {
@@ -3576,7 +3488,9 @@
   function debounce$1(func, wait) {
     var timeout;
     return function () {
-      var context = this;
+      // eslint-disable-next-line @typescript-eslint/no-this-alias
+      var context = this; // eslint-disable-next-line prefer-rest-params
+
       var args = arguments;
 
       var later = function later() {
@@ -4257,7 +4171,8 @@
             var blob = new Blob([text], {
               type: data.content_type
             });
-            var url = window.URL.createObjectURL(blob);
+            var url = window.URL.createObjectURL(blob); // Create blob link to download
+
             var link = document.createElement('a');
             link.href = url;
 
@@ -4272,6 +4187,7 @@
             setTimeout(function () {
               var _link$parentNode;
 
+              // For Firefox it is necessary to delay revoking the ObjectURL
               window.URL.revokeObjectURL(url);
               (_link$parentNode = link.parentNode) == null ? void 0 : _link$parentNode.removeChild(link);
             }, 100);
@@ -4326,6 +4242,80 @@
     });
   };
 
+  function _catch$1(body, recover) {
+    try {
+      var result = body();
+    } catch (e) {
+      return recover(e);
+    }
+
+    if (result && result.then) {
+      return result.then(void 0, recover);
+    }
+
+    return result;
+  }
+
+  function useVocabulary(vocabularyName, path) {
+    if (path === void 0) {
+      path = null;
+    }
+
+    var traversal = useTraversal();
+
+    var _useSetState = useSetState({
+      data: undefined,
+      loading: false,
+      error: undefined
+    }),
+        vocabulary = _useSetState[0],
+        setVocabulary = _useSetState[1];
+
+    var getPath = function getPath() {
+      if (path) return path;
+      return traversal.path + "@vocabularies/" + vocabularyName;
+    };
+
+    React.useEffect(function () {
+      var getVocabulary = function getVocabulary() {
+        try {
+          var _temp3 = function () {
+            if (vocabularyName && vocabulary.data === undefined && !vocabulary.loading) {
+              var _temp4 = _catch$1(function () {
+                setVocabulary({
+                  loading: true
+                });
+                return Promise.resolve(traversal.client.get(getPath())).then(function (data) {
+                  return Promise.resolve(data.json()).then(function (dataJson) {
+                    setVocabulary({
+                      loading: false,
+                      data: dataJson
+                    });
+                  });
+                });
+              }, function (err) {
+                setVocabulary({
+                  loading: false,
+                  error: err,
+                  data: undefined
+                });
+              });
+
+              if (_temp4 && _temp4.then) return _temp4.then(function () {});
+            }
+          }();
+
+          return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
+        } catch (e) {
+          return Promise.reject(e);
+        }
+      };
+
+      getVocabulary();
+    }, [vocabularyName, vocabulary, path]);
+    return vocabulary;
+  }
+
   var plain = ['string', 'number', 'boolean'];
   function RenderField(_ref) {
     var value = _ref.value,
@@ -4570,6 +4560,66 @@
     return jsxRuntime.jsx(RenderField, _extends({}, getRenderProps()));
   }
 
+  var SelectVocabulary = React.forwardRef(function (_ref, ref) {
+    var vocabularyName = _ref.vocabularyName,
+        className = _ref.className,
+        classWrap = _ref.classWrap,
+        val = _ref.val,
+        dataTest = _ref.dataTest,
+        multiple = _ref.multiple,
+        onChange = _ref.onChange,
+        id = _ref.id,
+        placeholder = _ref.placeholder;
+    var vocabulary = useVocabulary(vocabularyName);
+
+    var getOptions = function getOptions() {
+      if (get$1(vocabulary, 'data.items', null)) {
+        var vocData = vocabulary.data.items.map(function (item) {
+          return {
+            text: item.title,
+            value: item.token
+          };
+        });
+        return vocData;
+      }
+
+      return [];
+    };
+
+    var getProps = function getProps() {
+      if (multiple) {
+        var currentValue = val || [];
+        return {
+          multiple: true,
+          size: 5,
+          value: currentValue,
+          options: getOptions()
+        };
+      }
+
+      return {
+        value: val != null ? val : '',
+        appendDefault: true,
+        options: getOptions()
+      };
+    };
+
+    if (vocabulary.data === undefined || vocabulary.loading) {
+      return jsxRuntime.jsx("div", {});
+    }
+
+    return jsxRuntime.jsx(Select, _extends({}, getProps(), {
+      className: className,
+      classWrap: classWrap || 'is-fullwidth',
+      dataTest: dataTest,
+      ref: ref,
+      onChange: onChange,
+      id: id,
+      placeholder: placeholder
+    }));
+  });
+  SelectVocabulary.displayName = 'SelectVocabulary';
+
   var EditComponent = React.forwardRef(function (_ref, ref) {
     var schema = _ref.schema,
         val = _ref.val,
@@ -6126,6 +6176,7 @@
     _createClass(ItemModel, [{
       key: "path",
       get: function get() {
+        // Compat
         var item = this.item['@id'] ? this.item['@id'] : this.item['@absolute_url'];
         var path = item.split('//')[1].split('/').splice(1).join('/');
         path = "/" + path + "/";
@@ -6148,6 +6199,7 @@
     }, {
       key: "icon",
       get: function get() {
+        // eslint-disable-next-line
         var cfg = useConfig();
 
         if (cfg.icons && cfg.icons[this.type]) {
@@ -6460,7 +6512,8 @@
         "value": "Installed Addons"
       }]
     }
-  });
+  }); // TODO: Refactor without useAsync... just crudContext
+
   function PanelAddons() {
     var _state$data$available, _state$data, _state$data$available2, _state$data2, _state$data$installed, _state$data3, _state$data$installed2, _state$data4;
 
@@ -6813,6 +6866,11 @@
       children: children
     });
   }
+  /**
+   * Checkbox component without props that consume the ItemsActionsContext
+   * and it select/unselect all items of the page.
+   */
+
   function AllItemsCheckbox(_ref2) {
     var dataTest = _ref2.dataTest;
 
@@ -6844,6 +6902,10 @@
       dataTest: dataTest
     });
   }
+  /**
+   * Dropdown to choose some action to apply to the selected items.
+   */
+
   function ItemsActionsDropdown() {
     var intl = reactIntl.useIntl();
     var ACTIONS_OBJECT = getActionsObject(intl, true);
@@ -6935,6 +6997,7 @@
         "aria-label": "pagination",
         children: [jsxRuntime.jsx("a", {
           className: "pagination-previous is-small",
+          // disabled={current === 0}
           onClick: function onClick() {
             return current > 0 ? doPaginate(current - 1) : null;
           },
@@ -6946,6 +7009,7 @@
           })
         }), jsxRuntime.jsx("a", {
           className: "pagination-next is-small",
+          // disabled={current >= maxPages - 1}
           onClick: function onClick() {
             return doPaginate(current + 1);
           },
@@ -8643,7 +8707,8 @@
 
     if (state.types && state.types.length === 0) {
       return null;
-    }
+    } // Implement some kind of filtering
+
 
     return jsxRuntime.jsx(Dropdown, {
       id: "dropdown-menu",
@@ -8820,6 +8885,11 @@
     } else {
       currentTab = currentTab || Object.keys(tabs)[0];
     }
+    /*if (!Object.keys(tabs).includes(currentTab)) {
+      setLocation(defaultTab)
+      currentTab = defaultTab
+    }*/
+
 
     var _useState = React.useState(currentTab),
         current = _useState[0],
@@ -8828,7 +8898,7 @@
     var CurrentComp = tabs[current] || fallback;
     React__default['default'].useEffect(function () {
       if (Object.keys(tabs).includes(currentTab)) {
-        setTab(currentTab);
+        setTab(currentTab); // setLocation({tab: currentTab})
       }
     }, [currentTab, tabs]);
 
@@ -9258,7 +9328,8 @@
         page: 0
       });
       ev.preventDefault();
-    };
+    }; // cleanup form on state.search change
+
 
     React.useEffect(function () {
       if (!searchText || searchText === '') {
@@ -9996,7 +10067,8 @@
         page: 0
       });
       ev.preventDefault();
-    };
+    }; // cleanup form on state.search change
+
 
     React.useEffect(function () {
       if (!searchText || searchText === '') {
@@ -10617,11 +10689,13 @@
       fallback = undefined;
     }
 
-    if (!context) return;
+    if (!context) return; // console.log("Component for path", path)
+    // lookup by path
 
     if (registry.paths[path]) {
       return registry.paths[path];
-    }
+    } // by type
+
 
     if (registry.views[context['@type']]) {
       return registry.views[context['@type']];
@@ -10670,6 +10744,17 @@
 
   var getSchemas = function getSchemas(type) {
     return registry.schemas[type] || {};
+    /*
+      filters: [
+        {
+          attribute_key: string,
+          label: string,
+          type: 'select' | 'input'
+          vocabulary: string | undefined
+          values: {[key:string]:any}[]
+        }
+      ]
+    */
   };
 
   var getFieldsToFilter = function getFieldsToFilter(type, fallback) {
@@ -10684,6 +10769,7 @@
     return context.is_folderish ? FolderCtx : ItemCtx;
   };
   function useRegistry(data) {
+    // if data is provided we need to merge it into actual registry
     var ref = React__default['default'].useRef();
 
     if (data && !ref.current) {
@@ -10707,6 +10793,22 @@
       getSchemas: getSchemas
     };
   }
+  /*
+
+  const registry = {
+    paths: {
+      "/db/guillotina/tags/": TagsContext
+    },
+    forms: {
+      Tag: AddTagForm
+    }
+  }
+
+
+  <guillotina registry={registry} />
+
+
+  */
 
   var initialState$4 = {
     path: '',
@@ -13594,17 +13696,19 @@
         props = _objectWithoutPropertiesLoose(_ref, ["auth", "locale"]);
 
     var messages = loadLocaleData(locale);
-    var url = props.url || 'http://localhost:8080';
+    var url = props.url || 'http://localhost:8080'; // without trailing slash
+
     var config = props.config || {};
     var client = useGuillotinaClient();
 
     var _useConfig = useConfig(config),
         Permissions = _useConfig.Permissions;
 
-    var registry = useRegistry(props.registry || {});
+    var registry = useRegistry(props.registry || {}); // Location is cooked routing solution (only uses search params)
 
     var _useLocation = useLocation(),
-        location = _useLocation[0];
+        location = _useLocation[0]; // if there is no path provided just go to root
+
 
     var searchPath = location.get('path') || '/';
 
@@ -14198,6 +14302,7 @@
           method: 'post'
         })).then(function (data) {
           if (data.status === 401) {
+            // invalid token
             _this4.cleanAuth();
 
             _this4.logout();