@bigbinary/neeto-slack-frontend 0.3.7 → 0.3.9

package/dist/index.js

@@ -1,9 +1,10 @@
 import * as React from 'react';
 import React__default, { useContext, useState, useRef, useEffect } from 'react';
 import classNames from 'classnames';
-import { Typography, Label, Button } from '@bigbinary/neetoui';
+import { Button, Typography, Label } from '@bigbinary/neetoui';
 import { Form, Select } from '@bigbinary/neetoui/formik';
 import { not, is } from 'ramda';
+import { Refresh } from '@bigbinary/neeto-icons';
 import * as yup from 'yup';
 import { Slack } from '@bigbinary/neeto-icons/misc';
 import { isNotEmpty } from '@bigbinary/neeto-commons-frontend/pure';
@@ -3187,7 +3188,8 @@ var slack = {
 	configure: {
 		sendTo: "Send to",
 		sendToDescription: "Choose a Slack channel or contact to send the notifications",
-		updateType: "Update type"
+		updateType: "Update type",
+		refreshSlackChannelList: "Refresh Slack Channel list"
 	},
 	finish: {
 		title: "Slack successfully connected",
@@ -3310,6 +3312,26 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
+var SlackRefreshChannelListButton = function SlackRefreshChannelListButton(_ref) {
+  var channelRefreshHandler = _ref.channelRefreshHandler,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "relative top-0 flex justify-center"
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    icon: Refresh,
+    style: "secondary",
+    className: classNames("border border-solid border-gray-400 bg-white", className),
+    tooltipProps: {
+      content: t("slack.configure.refreshSlackChannelList"),
+      position: "top"
+    },
+    onClick: channelRefreshHandler
+  }));
+};
+
 var CHANNEL_NAME_VALIDAITON_SCHEMA = {
   selectedChannel: yup.object().shape({
     label: yup.string(),
@@ -3337,7 +3359,8 @@ var Settings = function Settings(_ref) {
     handleSubmit = _ref.handleSubmit,
     isSubmitting = _ref.isSubmitting,
     className = _ref.className,
-    validationSchema = _ref.validationSchema;
+    validationSchema = _ref.validationSchema,
+    channelRefreshHandler = _ref.channelRefreshHandler;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isEditable = _useState2[0],
@@ -3377,14 +3400,18 @@ var Settings = function Settings(_ref) {
       className: "neeto-ui-text-gray-700 neeto-ui-mb-3",
       style: "body2",
       weight: "normal"
-    }, t("slack.configure.sendToDescription")), /*#__PURE__*/React__default.createElement(Select, {
+    }, t("slack.configure.sendToDescription")), /*#__PURE__*/React__default.createElement("div", {
+      className: "relative flex"
+    }, /*#__PURE__*/React__default.createElement(Select, {
       isSearchable: true,
       isDisabled: not(isEditable),
       name: "selectedChannel",
       options: formikProps.values.channels,
       placeholder: t("slack.placeholder"),
       size: "large"
-    })), is(Function, children) ? children(_objectSpread(_objectSpread({}, formikProps), {}, {
+    }), /*#__PURE__*/React__default.createElement(SlackRefreshChannelListButton, {
+      channelRefreshHandler: channelRefreshHandler
+    }))), is(Function, children) ? children(_objectSpread(_objectSpread({}, formikProps), {}, {
       isDisabled: not(isEditable)
     })) : children, /*#__PURE__*/React__default.createElement("div", {
       className: "neeto-ui-mt-4"
@@ -3412,7 +3439,8 @@ var Configure = function Configure(_ref) {
     handleSubmit = _ref.handleSubmit,
     isSubmitting = _ref.isSubmitting,
     className = _ref.className,
-    validationSchema = _ref.validationSchema;
+    validationSchema = _ref.validationSchema,
+    channelRefreshHandler = _ref.channelRefreshHandler;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   return /*#__PURE__*/React__default.createElement("div", {
@@ -3443,13 +3471,17 @@ var Configure = function Configure(_ref) {
       className: "neeto-ui-text-gray-700 neeto-ui-mb-3",
       style: "body2",
       weight: "normal"
-    }, t("slack.configure.sendToDescription")), /*#__PURE__*/React__default.createElement(Select, {
+    }, t("slack.configure.sendToDescription")), /*#__PURE__*/React__default.createElement("div", {
+      className: "relative flex"
+    }, /*#__PURE__*/React__default.createElement(Select, {
       isSearchable: true,
       name: "selectedChannel",
       options: formikProps.values.channels,
       placeholder: t("slack.placeholder"),
       size: "large"
-    })), is(Function, children) ? children(formikProps) : children, /*#__PURE__*/React__default.createElement(Button, {
+    }), /*#__PURE__*/React__default.createElement(SlackRefreshChannelListButton, {
+      channelRefreshHandler: channelRefreshHandler
+    }))), is(Function, children) ? children(formikProps) : children, /*#__PURE__*/React__default.createElement(Button, {
       label: t("common.continue"),
       loading: isSubmitting,
       type: "submit"
@@ -3458,7 +3490,8 @@ var Configure = function Configure(_ref) {
 };
 
 var Connect = function Connect(_ref) {
-  var handleRedirectToSlack = _ref.handleRedirectToSlack;
+  var handleRedirectToSlack = _ref.handleRedirectToSlack,
+    isAuthorizeUrlFetching = _ref.isAuthorizeUrlFetching;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   return /*#__PURE__*/React__default.createElement("div", {
@@ -3475,6 +3508,7 @@ var Connect = function Connect(_ref) {
     weight: "normal"
   }, t("slack.connect.description")), /*#__PURE__*/React__default.createElement(Button, {
     label: t("slack.connect.loginButton"),
+    loading: isAuthorizeUrlFetching,
     onClick: handleRedirectToSlack
   }));
 };