@selfcommunity/react-core 0.1.2-alpha.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 Quentral Srl
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,13 @@
+@selfcommunity/react-core
+=============
+
+[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/selfcommunity/community-js/blob/master/LICENSE)
+[![npm latest package](https://img.shields.io/npm/v/@selfcommunity/react-core/latest.svg)](https://www.npmjs.com/package/@selfcommunity/react-core)
+[![npm downloads](https://img.shields.io/npm/dm/@selfcommunity/react-core.svg)](https://www.npmjs.com/package/@selfcommunity/react-core)
+[![Follow on Twitter URL](https://img.shields.io/twitter/url/https/twitter.com/community_self.svg?style=social&label=Follow%20%40SelfCommunity)](https://twitter.com/community_self)
+
+
+### Install
+
+`npm install @selfcommunity/react-core`
+

package/lib/cjs/components/provider/SCAlertMessagesProvider/index.js

@@ -0,0 +1,67 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SCAlertMessagesContext = void 0;
+exports.default = SCAlertMessagesProvider;
+exports.useSCAlertMessages = useSCAlertMessages;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _notistack = require("notistack");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+/**
+ * Creates Global Context
+ *
+ :::tipContext can be consumed in one of the following ways:
+ ```jsx
+ 1. <SCAlertMessagesContext.Consumer>{(options,) => (...)}</SCAlertMessagesContext.Consumer>
+ ```
+ ```jsx
+ 2. const scAlertMessagesContext: SCAlertMessagesContextType = useContext(SCAlertMessagesContext)
+ ```
+ ```jsx
+ 3. const scAlertMessagesContext: SCAlertMessagesContextType = useSCAlertMessages();
+ ````
+ :::
+
+ */
+const SCAlertMessagesContext = /*#__PURE__*/(0, _react.createContext)({});
+/**
+ * #### Description:
+ * This component makes the `intl` available down the React tree.
+ * @param children
+ * @return
+ * ```jsx
+ * <SCAlertMessagesContext.Provider value={{options}}>
+ * ```
+ */
+
+exports.SCAlertMessagesContext = SCAlertMessagesContext;
+
+function SCAlertMessagesProvider({
+  children = null
+}) {
+  const [options, setOptions] = (0, _react.useState)({
+    maxSnack: 3,
+    autoHideDuration: null
+  });
+  return /*#__PURE__*/_react.default.createElement(SCAlertMessagesContext.Provider, {
+    value: {
+      options,
+      setOptions
+    }
+  }, /*#__PURE__*/_react.default.createElement(_notistack.SnackbarProvider, options, children));
+}
+/**
+ * Let's only export the `useSCAlertMessages` hook instead of the context.
+ * We only want to use the hook directly and never the context component.
+ */
+
+
+function useSCAlertMessages() {
+  return (0, _react.useContext)(SCAlertMessagesContext);
+}

package/lib/cjs/components/provider/SCContextProvider/index.js

@@ -0,0 +1,117 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SCContext = void 0;
+exports.default = SCContextProvider;
+exports.useSCContext = useSCContext;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _apiServices = require("@selfcommunity/api-services");
+
+var _useDeepCompareEffect = _interopRequireDefault(require("use-deep-compare-effect"));
+
+var _validator = require("../../../utils/validator");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+/**
+ * Creates Global Context
+ *
+ :::tipContext can be consumed in one of the following ways:
+ ```jsx
+ 1. <SCContext.Consumer>{settings => (...)}</SCContext.Consumer>
+ ```
+ ```jsx
+ 2. const scContext: SCContextType = useContext(SCContext);
+ ```
+ ```jsx
+ 3. const scContext: SCContextType = useSCContext();
+ ````
+ :::
+ */
+const SCContext = /*#__PURE__*/(0, _react.createContext)({});
+/**
+ * This component imports all providers
+ * @param object
+ * @param object.conf
+ * @param object.children
+ * @return
+ * ```jsx
+ * <SCContext.Provider value={{settings}}>
+ * ```
+ */
+
+exports.SCContext = SCContext;
+
+function SCContextProvider({
+  conf,
+  children
+}) {
+  const [settings, setSettings] = (0, _react.useState)(null);
+  /**
+   * Export the provider as we need to wrap the entire app with it
+   * This provider keeps current user logged and session
+   */
+
+  (0, _useDeepCompareEffect.default)(() => {
+    /**
+     * Validate initial settings
+     */
+    const {
+      validationResult,
+      settings
+    } = (0, _validator.validateOptions)(conf, _validator.validOptions);
+    /**
+     * Init provider
+     */
+
+    if (validationResult.hasErrors()) {
+      /**
+       * Exist errors in initial conf
+       */
+      validationResult.emit();
+    } else {
+      /**
+       * Emit warnings if exist
+       */
+      validationResult.emitWarnings();
+      /**
+       * Set the base path on the http objects
+       */
+
+      _apiServices.http.setBasePortal(settings.portal);
+      /**
+       * Render all Providers
+       */
+
+
+      setSettings(settings);
+    }
+  }, [conf]);
+  /**
+   * Nesting all necessary providers
+   * All child components will use help contexts to works
+   */
+
+  return /*#__PURE__*/_react.default.createElement(SCContext.Provider, {
+    value: {
+      settings
+    }
+  }, settings && settings.contextProviders.reduceRight((memo, ContextProvider) => {
+    return /*#__PURE__*/_react.default.createElement(ContextProvider, null, memo);
+  }, children));
+}
+/**
+ * Let's only export the `useSCContext` hook instead of the context.
+ * We only want to use the hook directly and never the context component.
+ */
+
+
+function useSCContext() {
+  return (0, _react.useContext)(SCContext);
+}

package/lib/cjs/components/provider/SCLocaleProvider/index.js

@@ -0,0 +1,158 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SCLocaleContext = void 0;
+exports.default = SCLocaleProvider;
+exports.useSCLocale = useSCLocale;
+exports.withSCLocale = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _SCContextProvider = require("../SCContextProvider");
+
+var _locale = require("../../../utils/locale");
+
+var _Locale = require("../../../constants/Locale");
+
+var _reactIntl = require("react-intl");
+
+var _logger = require("../../../utils/logger");
+
+var _Errors = require("../../../constants/Errors");
+
+var _useDeepCompareEffect = _interopRequireDefault(require("use-deep-compare-effect"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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 _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+/**
+ * Creates Global Context
+ *
+ :::tipContext can be consumed in one of the following ways:
+
+ ```jsx
+ 1. <SCLocaleContext.Consumer>{(locale,) => (...)}</SCLocaleContext.Consumer>
+ ```
+ ```jsx
+ 2. const scLocaleContext: SCLocaleContextType = useContext(SCLocaleContext);
+ ```
+ ```jsx
+ 3. const scLocaleContext: SCLocaleContextType = useSCLocale();
+ ````
+ :::
+ */
+const SCLocaleContext = /*#__PURE__*/(0, _react.createContext)({});
+/**
+ * #### Description:
+ * This component makes the `intl` available down the React tree.
+ * @param children
+ * @return
+ * ```jsx
+ * <SCLocaleContext.Provider value={{locale, messages, selectLocale}}>
+ * ```
+ */
+
+exports.SCLocaleContext = SCLocaleContext;
+
+function SCLocaleProvider({
+  children = null
+}) {
+  var _scContext$settings$l;
+
+  const scContext = (0, _SCContextProvider.useSCContext)();
+  const initialLocale = (_scContext$settings$l = scContext.settings.locale) != null && _scContext$settings$l.default ? scContext.settings.locale.default : _Locale.DEFAULT_LANGUAGE_UI;
+  const initial = (0, _locale.loadLocaleData)(initialLocale, scContext.settings);
+  const [locale, setLocale] = (0, _react.useState)(initial.locale);
+  const [messages, setMessages] = (0, _react.useState)(initial.messages);
+  /**
+   * Update current locale state
+   * @param _intl
+   */
+
+  const updateLocale = _intl => {
+    setLocale(_intl.locale);
+    setMessages(_intl.messages);
+  };
+  /**
+   * Select locale loading data
+   */
+
+
+  const selectLocale = (0, _react.useMemo)(() => l => {
+    const {
+      messages,
+      locale
+    } = (0, _locale.loadLocaleData)(l, scContext.settings);
+    updateLocale({
+      messages,
+      locale
+    });
+  }, [locale]);
+  /**
+   * Update locale and messages if initial conf changes
+   */
+
+  (0, _useDeepCompareEffect.default)(() => {
+    var _scContext$settings$l2;
+
+    selectLocale((_scContext$settings$l2 = scContext.settings.locale) != null && _scContext$settings$l2.default ? scContext.settings.locale.default : _Locale.DEFAULT_LANGUAGE_UI);
+  }, [scContext.settings.locale]);
+  /**
+   * handleIntlError
+   * @param error
+   */
+
+  const handleIntlError = error => {
+    if (error.code === 'MISSING_TRANSLATION') {
+      _logger.Logger.warn(_Errors.SCOPE_SC_CORE, `Missing translation: ${error.message}`);
+
+      return;
+    }
+
+    throw error;
+  };
+
+  return /*#__PURE__*/_react.default.createElement(SCLocaleContext.Provider, {
+    value: {
+      locale,
+      messages,
+      selectLocale
+    }
+  }, /*#__PURE__*/_react.default.createElement(_reactIntl.IntlProvider, {
+    key: locale,
+    locale: locale,
+    messages: messages,
+    onError: handleIntlError
+  }, children));
+}
+/**
+ * Export hoc to inject the base theme to components
+ * @param Component
+ */
+
+
+const withSCLocale = Component => props => {
+  const scLocaleContext = (0, _react.useContext)(SCLocaleContext);
+  return /*#__PURE__*/_react.default.createElement(_reactIntl.IntlProvider, {
+    locale: scLocaleContext.locale,
+    messages: scLocaleContext.messages
+  }, /*#__PURE__*/_react.default.createElement(Component, _extends({
+    setLanguage: scLocaleContext.selectLocale
+  }, props)));
+};
+/**
+ * Let's only export the `useSCLocale` hook instead of the context.
+ * We only want to use the hook directly and never the context component.
+ */
+
+
+exports.withSCLocale = withSCLocale;
+
+function useSCLocale() {
+  return (0, _react.useContext)(SCLocaleContext);
+}

package/lib/cjs/components/provider/SCNotificationProvider/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SCNotificationContext = void 0;
+exports.default = SCNotificationProvider;
+exports.useSCNotification = useSCNotification;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _useSCWebSocket = _interopRequireDefault(require("../../../hooks/useSCWebSocket"));
+
+var _useSCWebPushMessaging = _interopRequireDefault(require("../../../hooks/useSCWebPushMessaging"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+/**
+ * Creates Global Context
+ *
+ :::tipContext can be consumed in one of the following ways:
+
+ ```jsx
+ 1. <SCNotificationContext.Consumer>{(wsInstance, subscribe,) => (...)}</SCNotificationContext.Consumer>
+ ```
+ ```jsx
+ 2. const scNotificationContext: SCNotificationContextType = useContext(SCNotificationContext);
+ ```
+ ```jsx
+ 3. const scNotificationContext: SCNotificationContextType = useSCNotification();
+ ````
+ :::
+ */
+const SCNotificationContext = /*#__PURE__*/(0, _react.createContext)({});
+/**
+ * #### Description:
+ * This component makes the notification context available down the React tree.
+ * @param children
+ * @return
+ * ```jsx
+ * <SCNotificationContext.Provider value={{wsInstance}}>{children}</SCNotificationContext.Provider>
+ * ```
+ */
+
+exports.SCNotificationContext = SCNotificationContext;
+
+function SCNotificationProvider({
+  children = null
+}) {
+  const {
+    wsInstance
+  } = (0, _useSCWebSocket.default)();
+  const {
+    wpSubscription
+  } = (0, _useSCWebPushMessaging.default)();
+  return /*#__PURE__*/_react.default.createElement(SCNotificationContext.Provider, {
+    value: {
+      wsInstance,
+      wpSubscription
+    }
+  }, children);
+}
+/**
+ * Let's only export the `useSCNotification` hook instead of the context.
+ * We only want to use the hook directly and never the context component.
+ */
+
+
+function useSCNotification() {
+  return (0, _react.useContext)(SCNotificationContext);
+}

package/lib/cjs/components/provider/SCPreferencesProvider/index.js

@@ -0,0 +1,93 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SCPreferencesContext = void 0;
+exports.default = SCPreferencesProvider;
+exports.useSCPreferences = useSCPreferences;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _apiServices = require("@selfcommunity/api-services");
+
+var _logger = require("../../../utils/logger");
+
+var _Errors = require("../../../constants/Errors");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+/**
+ * Creates Preferences/Features Context
+ *
+ :::tipContext can be consumed in one of the following ways:
+
+
+ ```jsx
+ 1. <SCPreferencesContext.Consumer>{(preferences) => (...)}</SCPreferencesContext.Consumer>
+ ```
+ ```jsx
+ 2. const scPreferences: SCPreferencesType = usePreferencesContext(SCPreferencesContext);
+ ```
+ ```jsx
+ 3. const scPreferences: SCPreferencesType = useSCPreferences();
+ ````
+ :::
+ */
+const SCPreferencesContext = /*#__PURE__*/(0, _react.createContext)({});
+/**
+ * #### Description:
+ * This component imports all preferences and features enabled.
+ * @param children
+ * @return
+ *  ```jsx
+ *  <SCPreferencesContext.Provider value={{preferences, features}}>{!loading && children}</SCPreferencesContext.Provider>
+ *  ```
+ */
+
+exports.SCPreferencesContext = SCPreferencesContext;
+
+function SCPreferencesProvider({
+  children = null
+}) {
+  const [preferences, setPreferences] = (0, _react.useState)({});
+  const [features, setFeatures] = (0, _react.useState)([]);
+  const [, setError] = (0, _react.useState)();
+  const [loading, setLoading] = (0, _react.useState)(true);
+  /**
+   * Load all dynamic preferences and features enabled
+   * to manages configurations of the project
+   */
+
+  (0, _react.useEffect)(() => {
+    Promise.all([_apiServices.PreferenceService.getAllPreferences(), _apiServices.FeatureService.getAllFeatures()]).then(function (results) {
+      setPreferences(results[0]);
+      setFeatures(results[1]);
+      setLoading(false);
+    }).catch(_error => {
+      _logger.Logger.error(_Errors.SCOPE_SC_CORE, _error);
+
+      setError(_error);
+    });
+  }, []);
+  /**
+   * Nesting all necessary providers
+   * All child components will use help contexts to works
+   */
+
+  return /*#__PURE__*/_react.default.createElement(SCPreferencesContext.Provider, {
+    value: {
+      preferences,
+      features
+    }
+  }, !loading && children);
+}
+/**
+ * Let's only export the `useSCPreferences` hook instead of the context.
+ * We only want to use the hook directly and never the context component.
+ */
+
+
+function useSCPreferences() {
+  return (0, _react.useContext)(SCPreferencesContext);
+}