@digigov/ui 0.12.2 → 0.13.0

package/esm/api/useResourceAction.js

@@ -0,0 +1,141 @@
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useState, useEffect } from 'react';
+import { getQueryKey, processResponse } from '@digigov/ui/api/utils';
+import { useMutation } from 'react-query';
+import { useAPI } from '@digigov/ui/api';
+export function useResourceAction(resource, id) {
+  var method = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'POST';
+  var data = arguments.length > 3 ? arguments[3] : undefined;
+  var query = arguments.length > 4 ? arguments[4] : undefined;
+  var options = arguments.length > 5 ? arguments[5] : undefined;
+
+  var _useAPI = useAPI(),
+      baseURL = _useAPI.config.baseURL,
+      token = _useAPI.token;
+
+  var _useState = useState({
+    url: '',
+    dataSet: false
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      _useState2$ = _useState2[0],
+      url = _useState2$.url,
+      dataSet = _useState2$.dataSet,
+      setFetchOpts = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      consume = _useState4[0],
+      setConsume = _useState4[1];
+
+  function customFetcher() {
+    return _customFetcher.apply(this, arguments);
+  }
+
+  function _customFetcher() {
+    _customFetcher = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _ref,
+          _ref2,
+          fetchUrl,
+          options,
+          response,
+          _yield$processRespons,
+          _data2,
+          _args = arguments;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _ref = _args.length <= 0 ? undefined : _args[0], _ref2 = _slicedToArray(_ref, 2), fetchUrl = _ref2[0], options = _ref2[1];
+
+              if (options.body) {
+                setFetchOpts({
+                  url: fetchUrl,
+                  dataSet: true
+                });
+              } else {
+                setFetchOpts({
+                  url: fetchUrl,
+                  dataSet: false
+                });
+              }
+
+              _context.next = 4;
+              return fetch(fetchUrl, options);
+
+            case 4:
+              response = _context.sent;
+              _context.prev = 5;
+              _context.next = 8;
+              return processResponse(response, true);
+
+            case 8:
+              _yield$processRespons = _context.sent;
+              _data2 = _yield$processRespons.data;
+
+              if (!_data2) {
+                _context.next = 12;
+                break;
+              }
+
+              return _context.abrupt("return", Promise.resolve(_data2));
+
+            case 12:
+              _context.next = 17;
+              break;
+
+            case 14:
+              _context.prev = 14;
+              _context.t0 = _context["catch"](5);
+              return _context.abrupt("return", Promise.reject(_context.t0.error));
+
+            case 17:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[5, 14]]);
+    }));
+    return _customFetcher.apply(this, arguments);
+  }
+
+  var _useMutation = useMutation(customFetcher, {}),
+      _useMutation2 = _slicedToArray(_useMutation, 2),
+      mutate = _useMutation2[0],
+      _useMutation2$ = _useMutation2[1],
+      status = _useMutation2$.status,
+      _data = _useMutation2$.data,
+      error = _useMutation2$.error,
+      reset = _useMutation2$.reset;
+
+  useEffect(function () {
+    if (consume) {
+      var queryKey = getQueryKey(resource, id, query, data, options, method, baseURL, token);
+
+      if (typeof queryKey === 'function') {
+        mutate(queryKey());
+      } else {
+        mutate(queryKey);
+      }
+
+      setConsume(false);
+    }
+  }, [consume]);
+  return {
+    data: _data,
+    loading: status === 'loading',
+    loaded: ['success', 'error'].includes(status),
+    error: error,
+    invalidate: function invalidate() {
+      reset();
+    },
+    fetch: function fetch() {
+      setConsume(true);
+    },
+    dataSet: dataSet,
+    url: url
+  };
+}

package/esm/api/useResourceQuery.js

@@ -0,0 +1,208 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _extends from "@babel/runtime/helpers/extends";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+var _excluded = ["data"];
+import { useEffect, useMemo, useState, useCallback } from 'react';
+import { getQueryKey, processResponse } from '@digigov/ui/api/utils';
+import { usePaginatedQuery, queryCache } from 'react-query';
+import { useAPI } from '@digigov/ui/api';
+var DEFAULT_PAGINATION_LIMIT = 30;
+var DEFAULT_LIMIT_OPTIONS = [10, 30, 60, 100];
+export function useResourceManyBase(resource, query, options) {
+  var _useAPI = useAPI(),
+      baseURL = _useAPI.config.baseURL,
+      token = _useAPI.token;
+
+  var _useState = useState({
+    url: '',
+    dataSet: false
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      _useState2$ = _useState2[0],
+      url = _useState2$.url,
+      dataSet = _useState2$.dataSet,
+      setFetchOpts = _useState2[1];
+
+  var customFetcher = useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(fetchUrl, options) {
+      var response, _yield$processRespons, _data;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setFetchOpts({
+                url: fetchUrl,
+                dataSet: false
+              });
+              _context.next = 3;
+              return fetch(fetchUrl, options);
+
+            case 3:
+              response = _context.sent;
+              _context.prev = 4;
+              _context.next = 7;
+              return processResponse(response, true);
+
+            case 7:
+              _yield$processRespons = _context.sent;
+              _data = _yield$processRespons.data;
+
+              if (!_data) {
+                _context.next = 11;
+                break;
+              }
+
+              return _context.abrupt("return", Promise.resolve(_data));
+
+            case 11:
+              _context.next = 16;
+              break;
+
+            case 13:
+              _context.prev = 13;
+              _context.t0 = _context["catch"](4);
+              return _context.abrupt("return", Promise.reject(_context.t0.error));
+
+            case 16:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[4, 13]]);
+    }));
+
+    return function (_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }(), []);
+  var queryKey = getQueryKey(resource, null, query, null, options, 'GET', baseURL, token);
+  var enabled = true;
+  var resolvedQueryKey;
+
+  if (typeof queryKey === 'function') {
+    try {
+      resolvedQueryKey = queryKey();
+    } catch (err) {
+      enabled = false;
+    }
+  }
+
+  var _usePaginatedQuery = usePaginatedQuery({
+    queryKey: resolvedQueryKey || queryKey,
+    queryFn: customFetcher,
+    config: {
+      enabled: enabled,
+      suspense: true,
+      cacheTime: 30000,
+      refetchOnMount: false
+    }
+  }),
+      resolvedData = _usePaginatedQuery.resolvedData,
+      data = _usePaginatedQuery.latestData,
+      error = _usePaginatedQuery.error,
+      isFetching = _usePaginatedQuery.isFetching,
+      refetch = _usePaginatedQuery.refetch;
+
+  return {
+    data: data || resolvedData,
+    loading: isFetching,
+    loaded: !!data || !!error,
+    error: error,
+    invalidate: function invalidate() {
+      queryCache.invalidateQueries(resolvedQueryKey || queryKey);
+    },
+    fetch: refetch,
+    dataSet: dataSet,
+    url: url
+  };
+}
+export function useResourceMany(resource, query, options) {
+  // allow developer to set a custom limit, fallback to a common value
+  var _useState3 = useState(query && query.limit || DEFAULT_PAGINATION_LIMIT),
+      _useState4 = _slicedToArray(_useState3, 2),
+      limit = _useState4[0],
+      setLimit = _useState4[1];
+
+  var _useState5 = useState({
+    offset: query && query.offset || 0,
+    limit: limit
+  }),
+      _useState6 = _slicedToArray(_useState5, 2),
+      pageParams = _useState6[0],
+      setPageParams = _useState6[1]; // update options when limit is changed
+
+
+  useEffect(function () {
+    if (pageParams.limit !== limit) {
+      setPageParams(_extends({}, pageParams, {
+        limit: limit
+      }));
+    }
+  }, [limit]); // update user provided query with pagination params
+
+  var queryKey = JSON.stringify(query);
+  var pageParamsKey = JSON.stringify(pageParams);
+  var q = useMemo(function () {
+    return _extends({}, pageParams, query);
+  }, [queryKey, pageParamsKey]);
+
+  var _useResourceManyBase = useResourceManyBase(resource, q, options),
+      data = _useResourceManyBase.data,
+      rest = _objectWithoutProperties(_useResourceManyBase, _excluded); // extract data/metadata from response
+
+
+  var resp = data ? data.data : data;
+  var meta = data ? data.meta : data;
+  var totalPages = useMemo(function () {
+    return data && data.meta && data.meta.total || 1;
+  }, [data]);
+  var total = useMemo(function () {
+    return data && data.meta && data.meta.count || 0;
+  }, [data]);
+  var limitOptions = useMemo(function () {
+    return DEFAULT_LIMIT_OPTIONS;
+  }, []);
+  var page = useMemo(function () {
+    var offset = parseInt(pageParams.offset) || 0;
+
+    var _limit = parseInt("".concat(pageParams.limit)) || parseInt("".concat(limit));
+
+    return offset / _limit;
+  }, [pageParams]); // set params to specific page
+
+  var setPage = useCallback(function (page) {
+    if (page > totalPages) {
+      page = totalPages;
+    }
+
+    if (page <= 0) {
+      page = 0;
+    }
+
+    var _limit = limit || DEFAULT_PAGINATION_LIMIT;
+
+    var offset = _limit * page;
+    setPageParams({
+      offset: offset,
+      limit: limit
+    });
+  }, [setPageParams]);
+  var hasNext = page < totalPages - 1;
+  var hasPrevious = page > 0;
+  return _extends({
+    data: resp,
+    meta: meta,
+    page: page,
+    limit: limit,
+    totalPages: totalPages,
+    total: total,
+    limitOptions: limitOptions,
+    setPage: setPage,
+    setLimit: setLimit,
+    hasNext: hasNext,
+    hasPrevious: hasPrevious
+  }, rest);
+}

package/esm/api/utils.js

@@ -0,0 +1,233 @@
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _extends from "@babel/runtime/helpers/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import { APIError } from '@digigov/ui/api/APIErrors';
+export function parseErrors(_x) {
+  return _parseErrors.apply(this, arguments);
+}
+
+function _parseErrors() {
+  _parseErrors = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(response) {
+    var errors, error, json, apiErrors, text;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            errors = [];
+            error = {
+              message: response.statusText,
+              code: response.status,
+              meta: {}
+            }; // do our best to resolve as more specific details for the error
+
+            _context.prev = 2;
+            _context.next = 5;
+            return response.json();
+
+          case 5:
+            json = _context.sent;
+            error.meta = json; // this is the way synnefo reports errors
+
+            try {
+              apiErrors = Object.keys(json);
+              apiErrors.forEach(function (key) {
+                return json[key] && errors.push(json[key]);
+              });
+            } catch (err) {
+              console.error('Cannot parse json error', json);
+            }
+
+            _context.next = 21;
+            break;
+
+          case 10:
+            _context.prev = 10;
+            _context.t0 = _context["catch"](2);
+            _context.prev = 12;
+            _context.next = 15;
+            return response.text();
+
+          case 15:
+            text = _context.sent;
+            error.message = text; // error.meta.statusText = response.statusText; // keep reference to statusText
+
+            _context.next = 21;
+            break;
+
+          case 19:
+            _context.prev = 19;
+            _context.t1 = _context["catch"](12);
+
+          case 21:
+            return _context.abrupt("return", errors);
+
+          case 22:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee, null, [[2, 10], [12, 19]]);
+  }));
+  return _parseErrors.apply(this, arguments);
+}
+
+export function processResponse(_x2) {
+  return _processResponse.apply(this, arguments);
+}
+
+function _processResponse() {
+  _processResponse = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(response) {
+    var raiseError,
+        status,
+        errors,
+        contentType,
+        data,
+        _data,
+        _args2 = arguments;
+
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            raiseError = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : false;
+            status = response.status;
+            _context2.prev = 2;
+
+            if (response.ok) {
+              _context2.next = 10;
+              break;
+            }
+
+            _context2.next = 6;
+            return parseErrors(response);
+
+          case 6:
+            errors = _context2.sent;
+
+            if (!raiseError) {
+              _context2.next = 9;
+              break;
+            }
+
+            throw new APIError(errors, status);
+
+          case 9:
+            return _context2.abrupt("return", {
+              error: errors[0],
+              status: status
+            });
+
+          case 10:
+            contentType = response.headers.get('content-type');
+
+            if (!(contentType && contentType.indexOf('application/json') !== -1)) {
+              _context2.next = 18;
+              break;
+            }
+
+            _context2.next = 14;
+            return response.json();
+
+          case 14:
+            data = _context2.sent;
+            return _context2.abrupt("return", {
+              data: data,
+              status: status
+            });
+
+          case 18:
+            _context2.next = 20;
+            return response.text();
+
+          case 20:
+            _data = _context2.sent;
+            return _context2.abrupt("return", {
+              data: _data,
+              status: status
+            });
+
+          case 22:
+            _context2.next = 29;
+            break;
+
+          case 24:
+            _context2.prev = 24;
+            _context2.t0 = _context2["catch"](2);
+
+            if (!raiseError) {
+              _context2.next = 28;
+              break;
+            }
+
+            throw new APIError([_context2.t0], status);
+
+          case 28:
+            return _context2.abrupt("return", {
+              status: status,
+              error: _context2.t0
+            });
+
+          case 29:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2, null, [[2, 24]]);
+  }));
+  return _processResponse.apply(this, arguments);
+}
+
+export function getArgs(resource, id, query, data, options, method, baseURL, token) {
+  var body, params;
+
+  if (typeof query === 'function') {
+    params = new URLSearchParams(query()).toString();
+  } else if (query) {
+    params = new URLSearchParams(query).toString();
+  }
+
+  if (typeof data === 'function') {
+    body = JSON.stringify(data());
+  } else if (data) {
+    body = JSON.stringify(data);
+  }
+
+  if (typeof id === 'function') {
+    id = id();
+  }
+
+  if (!options) {
+    options = {};
+  }
+
+  var url = "".concat(baseURL, "/").concat(resource).concat(id ? "/".concat(id, "/") : '').concat(params ? "?".concat(params) : '');
+
+  var _options = _extends({
+    headers: {
+      'content-type': 'application/json'
+    },
+    body: body,
+    method: method
+  }, options);
+
+  if (token) {
+    _options.headers.Authorization = "Token ".concat(token);
+  }
+
+  return [url, _options];
+}
+export function getQueryKey(resource, id, query, data, options, method, baseURL, token) {
+  var queryKey;
+
+  if ([id, query, data].some(function (param) {
+    return typeof param === 'function';
+  })) {
+    queryKey = function queryKey() {
+      return getArgs(resource, id, query, data, options, method, baseURL, token);
+    };
+  } else {
+    queryKey = getArgs(resource, id, query, data, options, method, baseURL, token);
+  }
+
+  return queryKey;
+}

package/esm/app/App.js

@@ -0,0 +1,27 @@
+import React, { Suspense } from 'react';
+import CssBaseline from '@material-ui/core/CssBaseline';
+import { ThemeProvider, makeStyles } from '@material-ui/core/styles';
+export var useAppStyles = makeStyles({
+  root: {}
+});
+
+var App = function App(_ref) {
+  var theme = _ref.theme,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement(ThemeProvider, {
+    theme: theme
+  }, /*#__PURE__*/React.createElement(Suspense, {
+    fallback: 'loading...'
+  }, children));
+};
+
+var _ref3 = /*#__PURE__*/React.createElement(CssBaseline, null);
+
+export var StaticApp = function StaticApp(_ref2) {
+  var theme = _ref2.theme,
+      children = _ref2.children;
+  return /*#__PURE__*/React.createElement(ThemeProvider, {
+    theme: theme
+  }, _ref3, children);
+};
+export default App;

package/esm/app/Confirmation/index.js

@@ -0,0 +1,3 @@
+export * from '@digigov/react-core/Confirmation';
+export * from '@digigov/react-core/ConfirmationBody';
+export * from '@digigov/react-core/ConfirmationTitle';

package/esm/app/Footer/index.js

@@ -0,0 +1,15 @@
+export * from '@digigov/react-core/Footer';
+export * from '@digigov/react-core/FooterContainer';
+export * from '@digigov/react-core/FooterContent';
+export * from '@digigov/react-core/FooterContentLogos';
+export * from '@digigov/react-core/FooterHeading';
+export * from '@digigov/react-core/FooterImage';
+export * from '@digigov/react-core/FooterInlineList';
+export * from '@digigov/react-core/FooterInlineListItem';
+export * from '@digigov/react-core/FooterLink';
+export * from '@digigov/react-core/FooterList';
+export * from '@digigov/react-core/FooterListItem';
+export * from '@digigov/react-core/FooterMeta';
+export * from '@digigov/react-core/FooterMetaItem';
+export * from '@digigov/react-core/FooterNavigation';
+export * from '@digigov/react-core/FooterSection';

package/esm/app/Header/HeaderLogo.js

@@ -0,0 +1,17 @@
+import CoreHeaderLogo from '@digigov/react-core/HeaderLogo';
+import withDeprecation from '@digigov/ui/utils/withDeprecation';
+export var HeaderLogo = withDeprecation(CoreHeaderLogo, {
+  name: 'HeaderLogo',
+  props: {
+    height: {
+      warning: true
+    },
+    linkprops: {
+      warning: true
+    },
+    label: {
+      warning: true
+    }
+  }
+});
+export default HeaderLogo;

package/esm/app/Header/HeaderSection.js

@@ -0,0 +1,7 @@
+import CoreHeaderSection from '@digigov/react-core/HeaderSection';
+import withDeprecation from '@digigov/ui/utils/withDeprecation';
+export var HeaderSection = withDeprecation(CoreHeaderSection, {
+  name: 'HeaderSection',
+  rename: 'HeaderSection'
+});
+export default HeaderSection;

package/esm/app/Header/HeaderTitle.js

@@ -0,0 +1,17 @@
+import CoreHeaderTitle from '@digigov/react-core/HeaderTitle';
+import withDeprecation from '@digigov/ui/utils/withDeprecation';
+export var HeaderTitle = withDeprecation(CoreHeaderTitle, {
+  name: 'Header',
+  props: {
+    xs: {
+      error: true
+    },
+    linkProps: {
+      error: 'The `linkProps` property is deprecated. You can use native anchor link props instead.'
+    },
+    linkComponent: {
+      error: 'The `linkComponent` property is deprecated.'
+    }
+  }
+});
+export default HeaderTitle;