@bigbinary/neeto-github-frontend 1.0.6 → 1.0.7

package/dist/index.js

@@ -2,111 +2,16 @@ import React, { useState, useRef } from 'react';
 import { isPresent, noop } from '@bigbinary/neeto-cist';
 import { Button, Typography, Input, Pane } from '@bigbinary/neetoui';
 import { Trans, useTranslation } from 'react-i18next';
+import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
+import require$$0 from 'util';
 import { withT } from '@bigbinary/neeto-commons-frontend/react-utils';
 import { Settings, Plus, Building, User, CannedResponses, Lock } from '@bigbinary/neeto-icons';
 import { Github } from '@bigbinary/neeto-icons/misc';
-import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
-import require$$0 from 'util';
-import Search from '@bigbinary/neeto-molecules/Search';
 import classNames from 'classnames';
+import Search from '@bigbinary/neeto-molecules/Search';
 import Scrollable from '@bigbinary/neeto-molecules/Scrollable';
 import DateFormat from '@bigbinary/neeto-molecules/DateFormat';
 
-var Configure = withT(function (_ref) {
-  var t = _ref.t,
-    isConnected = _ref.isConnected,
-    installationUrl = _ref.installationUrl;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-text-gray-900 font-sans text-sm font-normal leading-6 antialiased"
-  }, /*#__PURE__*/React.createElement(Button, {
-    className: "mt-1 text-indigo-600 2xl:mt-3",
-    href: installationUrl,
-    icon: isConnected ? Settings : Plus,
-    iconPosition: "left",
-    iconSize: 20,
-    size: "small",
-    style: "text"
-  }, isConnected ? t("neetoGithub.configureAccount") : t("neetoGithub.connectAccount")));
-});
-
-var Header = withT(function (_ref) {
-  var t = _ref.t;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-text-gray-800 mb-1 flex w-full flex-row items-center space-x-2 font-sans text-lg font-medium leading-6 antialiased"
-  }, /*#__PURE__*/React.createElement(Github, {
-    size: 16
-  }), /*#__PURE__*/React.createElement(Typography, {
-    style: "h4"
-  }, t("neetoGithub.github")));
-});
-
-var List$1 = withT(function (_ref) {
-  var t = _ref.t,
-    accounts = _ref.accounts;
-  return accounts.map(function (_ref2) {
-    var id = _ref2.id,
-      name = _ref2.name,
-      avatarUrl = _ref2.avatarUrl,
-      type = _ref2.type,
-      profileUrl = _ref2.profileUrl,
-      count = _ref2.count;
-    return /*#__PURE__*/React.createElement("div", {
-      className: "neeto-ui-border-gray-300 flex w-full items-center space-x-2 border-b border-l-0 border-r-0 border-t-0 border-solid p-2",
-      key: id
-    }, type === "Organization" ? /*#__PURE__*/React.createElement(Building, {
-      className: "neeto-ui-text-gray-600",
-      size: 16
-    }) : /*#__PURE__*/React.createElement(User, {
-      className: "neeto-ui-text-gray-600",
-      size: 16
-    }), /*#__PURE__*/React.createElement(Typography, {
-      className: "neeto-ui-text-gray-900",
-      style: "body2"
-    }, "@", name), /*#__PURE__*/React.createElement("img", {
-      alt: name,
-      className: "neeto-ui-rounded-full h-4 w-4",
-      src: avatarUrl
-    }), /*#__PURE__*/React.createElement(Button, {
-      className: "text-indigo-600",
-      icon: CannedResponses,
-      iconPosition: "left",
-      iconSize: 16,
-      size: "small",
-      style: "text",
-      onClick: function onClick() {
-        return window.open(profileUrl, "_blank");
-      }
-    }), /*#__PURE__*/React.createElement(Typography, {
-      className: "neeto-ui-text-gray-900 mx-2 text-sm",
-      component: "span",
-      style: "h3"
-    }, "\u2022"), /*#__PURE__*/React.createElement(Typography, {
-      style: "body2"
-    }, t("neetoGithub.countOf.repos", {
-      count: count
-    })));
-  });
-});
-
-var Accounts = function Accounts(_ref) {
-  var accounts = _ref.accounts,
-    isConnected = _ref.isConnected,
-    onConnect = _ref.onConnect,
-    installationUrl = _ref.installationUrl;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "flex w-full flex-col border border-solid border-transparent px-0 py-2 2xl:max-w-sm 2xl:px-8"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "mb-2"
-  }, /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(List$1, {
-    accounts: accounts,
-    isConnected: isConnected
-  }), /*#__PURE__*/React.createElement(Configure, {
-    installationUrl: installationUrl,
-    isConnected: isConnected,
-    onConnect: onConnect
-  })));
-};
-
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
 /* eslint complexity: [2, 18], max-statements: [2, 33] */
@@ -2365,6 +2270,105 @@ var newInstallationParams = lib.stringify({
 var NEW_INSTALLATION_URL = "/github_integrations/app_installations/new?".concat(newInstallationParams);
 var TROUBLESHOOT_URL = "https://render.com/docs/github#troubleshooting";
 
+var Configure = withT(function (_ref) {
+  var t = _ref.t,
+    isConnected = _ref.isConnected,
+    installationUrl = _ref.installationUrl;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-text-gray-900 font-sans text-sm font-normal leading-6 antialiased"
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: "mt-1 text-indigo-600 xl:mt-3",
+    href: installationUrl,
+    icon: isConnected ? Settings : Plus,
+    iconPosition: "left",
+    iconSize: 20,
+    size: "small",
+    style: "text"
+  }, isConnected ? t("neetoGithub.configureAccount") : t("neetoGithub.connectAccount")));
+});
+
+var Header = withT(function (_ref) {
+  var t = _ref.t;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-text-gray-800 mb-1 flex w-full flex-row items-center space-x-2 font-sans text-lg font-medium leading-6 antialiased"
+  }, /*#__PURE__*/React.createElement(Github, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(Typography, {
+    style: "h4"
+  }, t("neetoGithub.github")));
+});
+
+var List$1 = withT(function (_ref) {
+  var t = _ref.t,
+    accounts = _ref.accounts;
+  return accounts.map(function (_ref2) {
+    var id = _ref2.id,
+      name = _ref2.name,
+      avatarUrl = _ref2.avatarUrl,
+      type = _ref2.type,
+      profileUrl = _ref2.profileUrl,
+      count = _ref2.count;
+    return /*#__PURE__*/React.createElement("div", {
+      className: "neeto-ui-border-gray-300 flex w-full items-center space-x-2 border-b border-l-0 border-r-0 border-t-0 border-solid p-2",
+      key: id
+    }, type === "Organization" ? /*#__PURE__*/React.createElement(Building, {
+      className: "neeto-ui-text-gray-600",
+      size: 16
+    }) : /*#__PURE__*/React.createElement(User, {
+      className: "neeto-ui-text-gray-600",
+      size: 16
+    }), /*#__PURE__*/React.createElement(Typography, {
+      className: "neeto-ui-text-gray-900",
+      style: "body2"
+    }, "@", name), /*#__PURE__*/React.createElement("img", {
+      alt: name,
+      className: "neeto-ui-rounded-full h-4 w-4",
+      src: avatarUrl
+    }), /*#__PURE__*/React.createElement(Button, {
+      className: "text-indigo-600",
+      icon: CannedResponses,
+      iconPosition: "left",
+      iconSize: 16,
+      size: "small",
+      style: "text",
+      onClick: function onClick() {
+        return window.open(profileUrl, "_blank");
+      }
+    }), /*#__PURE__*/React.createElement(Typography, {
+      className: "neeto-ui-text-gray-900 mx-2 text-sm",
+      component: "span",
+      style: "h3"
+    }, "\u2022"), /*#__PURE__*/React.createElement(Typography, {
+      style: "body2"
+    }, t("neetoGithub.countOf.repos", {
+      count: count
+    })));
+  });
+});
+
+var Accounts = function Accounts(_ref) {
+  var isPane = _ref.isPane,
+    accounts = _ref.accounts,
+    isConnected = _ref.isConnected,
+    onConnect = _ref.onConnect,
+    installationUrl = _ref.installationUrl;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("flex w-full flex-col border border-solid border-transparent px-0 py-2", {
+      "2xl:max-w-sm 2xl:px-8": isPane,
+      "xl:max-w-sm xl:px-8": !isPane
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "mb-2"
+  }, /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(List$1, {
+    accounts: accounts,
+    isConnected: isConnected
+  }), /*#__PURE__*/React.createElement(Configure, {
+    installationUrl: installationUrl,
+    isConnected: isConnected,
+    onConnect: onConnect
+  })));
+};
+
 function _arrayWithHoles(arr) {
   if (Array.isArray(arr)) return arr;
 }
@@ -2661,7 +2665,7 @@ var Repositories = function Repositories(_ref) {
     installationUrl = _ref.installationUrl,
     troubleshootUrl = _ref.troubleshootUrl;
   return /*#__PURE__*/React.createElement("div", {
-    className: "w-full space-y-6 2xl:max-w-7xl"
+    className: "w-full space-y-6"
   }, /*#__PURE__*/React.createElement(Private, {
     isPublicRepoAllowed: isPublicRepoAllowed,
     installationUrl: installationUrl,
@@ -2674,6 +2678,37 @@ var Repositories = function Repositories(_ref) {
   }));
 };
 
+var NeetoGithubNanoContainer = function NeetoGithubNanoContainer(_ref) {
+  var _ref$accounts = _ref.accounts,
+    accounts = _ref$accounts === void 0 ? [] : _ref$accounts,
+    installationUrl = _ref.installationUrl,
+    isConnected = _ref.isConnected,
+    _ref$isPublicRepoAllo = _ref.isPublicRepoAllowed,
+    isPublicRepoAllowed = _ref$isPublicRepoAllo === void 0 ? false : _ref$isPublicRepoAllo,
+    onConnect = _ref.onConnect,
+    _ref$repositories = _ref.repositories,
+    repositories = _ref$repositories === void 0 ? [] : _ref$repositories,
+    troubleshootUrl = _ref.troubleshootUrl,
+    _ref$isPane = _ref.isPane,
+    isPane = _ref$isPane === void 0 ? false : _ref$isPane;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex w-full flex-col-reverse 2xl:flex-row"
+  }, /*#__PURE__*/React.createElement(Repositories, {
+    installationUrl: installationUrl,
+    isConnected: isConnected,
+    isPublicRepoAllowed: isPublicRepoAllowed,
+    onConnect: onConnect,
+    repositories: repositories,
+    troubleshootUrl: troubleshootUrl
+  }), /*#__PURE__*/React.createElement(Accounts, {
+    accounts: accounts,
+    installationUrl: installationUrl,
+    isConnected: isConnected,
+    onConnect: onConnect,
+    isPane: isPane
+  }));
+};
+
 var NeetoGithubNanoModal = function NeetoGithubNanoModal(_ref) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
@@ -2705,23 +2740,16 @@ var NeetoGithubNanoModal = function NeetoGithubNanoModal(_ref) {
   }, t("neetoGithub.modal.title")), /*#__PURE__*/React.createElement(Typography, {
     className: "mt-4",
     style: "body2"
-  }, t("neetoGithub.modal.description"))), /*#__PURE__*/React.createElement(Pane.Body, null, /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col-reverse 2xl:flex-row"
-  }, /*#__PURE__*/React.createElement(Repositories, {
+  }, t("neetoGithub.modal.description"))), /*#__PURE__*/React.createElement(Pane.Body, null, /*#__PURE__*/React.createElement(NeetoGithubNanoContainer, {
+    accounts: accounts,
     installationUrl: installationUrl,
     isConnected: isConnected,
     isPublicRepoAllowed: isPublicRepoAllowed,
     onConnect: onConnect,
     repositories: repositories,
-    troubleshootUrl: troubleshootUrl
-  }), /*#__PURE__*/React.createElement(Accounts, {
-    accounts: accounts,
-    installationUrl: installationUrl,
-    isConnected: isConnected,
-    onConnect: onConnect
-  })))));
+    troubleshootUrl: troubleshootUrl,
+    isPane: true
+  })));
 };
 
 var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}