@activecollab/components 2.0.341 → 2.0.343

package/dist/cjs/presentation/shared/LinkBranchOrPullRequestDialog.js

@@ -0,0 +1,690 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LinkBranchOrPullRequestDialog = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _ConnectRepositoryDialog = require("./ConnectRepositoryDialog");
+var _Button = require("../../components/Button");
+var _ChooseV = require("../../components/ChooseV2");
+var _Dialog = require("../../components/Dialog");
+var _Input = require("../../components/Input");
+var _Label = require("../../components/Label");
+var _Loaders = require("../../components/Loaders");
+var _Select = require("../../components/Select");
+var _SelectTrigger = require("../../components/SelectTrigger");
+var _Typography = require("../../components/Typography");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+/**
+ * "Link Branch or Pull Request" dialog — shared by every `Presentation/Task
+ * Source` story (the empty state and the populated Source Code section) so the
+ * flow lives in one place.
+ *
+ * Three modes (ChooseV2): **Link Existing** (default), **New Branch**, **New
+ * Pull Request**. The primary button is always enabled; validation runs on
+ * click and outlines the offending field. Esc does not close the dialog (it
+ * would lose entered data) — this is an action dialog.
+ *
+ * On open the body shows a ~1s skeleton, standing in for the future API loads
+ * that will drive the repository / branch / PR pickers.
+ *
+ * The **Link Existing** picker is a grouped, multi-level select: options are
+ * grouped by repository (with the connection name in parentheses), each option
+ * carries a branch or pull-request icon, everything is sorted by name and
+ * filterable via the search box at the top. The menu is sized to match the
+ * trigger width.
+ */
+
+var SANS = '-apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", Arial, sans-serif';
+
+/* ---- Mock data ------------------------------------------------------- */
+
+var LINKABLES = [{
+  id: "pr-500",
+  kind: "pr",
+  // Deliberately long, to show the name truncating with an ellipsis while the
+  // right-aligned detail and radio stay visible.
+  name: "#500 Refactor rank recalculation to support multi-region contract archival and backfill",
+  repoId: "backend",
+  updatedMinutesAgo: 8,
+  author: "Nikola M."
+}, {
+  id: "branch-cache",
+  kind: "branch",
+  name: "spike/rank-cache",
+  repoId: "backend",
+  updatedMinutesAgo: 30
+}, {
+  id: "branch-export",
+  kind: "branch",
+  name: "feature/retainer-export-34",
+  repoId: "backend",
+  updatedMinutesAgo: 5 * 60
+}, {
+  id: "pr-119900",
+  kind: "pr",
+  name: "#119900 Rank API endpoints",
+  repoId: "backend",
+  updatedMinutesAgo: 2 * 24 * 60,
+  author: "Ilija S."
+}, {
+  id: "branch-fe-retainers",
+  kind: "branch",
+  name: "feature/retainers-ui-34",
+  repoId: "frontend",
+  updatedMinutesAgo: 2 * 60
+}, {
+  id: "pr-412",
+  kind: "pr",
+  name: "#412 Contract list filters",
+  repoId: "frontend",
+  updatedMinutesAgo: 24 * 60,
+  author: "Marko K."
+}, {
+  id: "mr-88",
+  kind: "pr",
+  name: "!88 Bump worker memory",
+  repoId: "infra",
+  updatedMinutesAgo: 3 * 24 * 60,
+  author: "Ana P."
+}, {
+  id: "branch-deploy",
+  kind: "branch",
+  name: "chore/deploy-rank-cache",
+  repoId: "infra",
+  updatedMinutesAgo: 24 * 60
+}];
+var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var pad = function pad(n) {
+  return String(n).padStart(2, "0");
+};
+
+/**
+ * Reproduces the format of ActiveCollab's standard `Ago` component
+ * (`Angie.functions.ago()`) for the mock: "Just now", "N minutes ago",
+ * "Today HH:mm", "Yesterday HH:mm", "MMM D. HH:mm", else "MMM D. YYYY HH:mm".
+ * Production must use the real component.
+ */
+var formatAgo = function formatAgo(minutesAgo) {
+  var now = new Date();
+  var then = new Date(now.getTime() - minutesAgo * 60000);
+  if (minutesAgo < 2) {
+    return "Just now";
+  }
+  if (minutesAgo < 60) {
+    return "".concat(Math.floor(minutesAgo), " minutes ago");
+  }
+  var time = "".concat(pad(then.getHours()), ":").concat(pad(then.getMinutes()));
+  if (then.toDateString() === now.toDateString()) {
+    return "Today ".concat(time);
+  }
+  var yesterday = new Date(now.getTime() - 24 * 60 * 60000);
+  if (then.toDateString() === yesterday.toDateString()) {
+    return "Yesterday ".concat(time);
+  }
+  var monthDay = "".concat(MONTHS[then.getMonth()], " ").concat(then.getDate(), ".");
+  if (then.getFullYear() === now.getFullYear()) {
+    return "".concat(monthDay, " ").concat(time);
+  }
+  return "".concat(monthDay, " ").concat(then.getFullYear(), " ").concat(time);
+};
+
+/**
+ * The detail shown on the right of an option: a branch keeps just the time of
+ * its last activity; a pull request appends the author ("… by Name").
+ */
+var linkableDetail = function linkableDetail(item) {
+  return item.kind === "pr" && item.author ? "".concat(formatAgo(item.updatedMinutesAgo), " by ").concat(item.author) : formatAgo(item.updatedMinutesAgo);
+};
+
+/**
+ * Grouped options for the Select. One group per repository, labelled
+ * "repo (Org, Type)" and sorted by name; inside a group, branches and PRs are
+ * ordered by latest activity (freshest first). Standard option rendering shows
+ * the name (truncated) with the detail right-aligned and a radio.
+ */
+var GROUPED_OPTIONS = _ConnectRepositoryDialog.PROJECT_REPOSITORIES.map(function (repo) {
+  var connection = _ConnectRepositoryDialog.CONNECTIONS.find(function (c) {
+    return c.id === repo.connectionId;
+  });
+  var items = LINKABLES.filter(function (l) {
+    return l.repoId === repo.id;
+  }).sort(function (a, b) {
+    return a.updatedMinutesAgo - b.updatedMinutesAgo;
+  }).map(function (l) {
+    return {
+      id: l.id,
+      name: l.name,
+      additionalInfo: linkableDetail(l)
+    };
+  });
+  return {
+    id: repo.id,
+    name: connection ? "".concat(repo.name, " (").concat(connection.name, ", ").concat((0, _ConnectRepositoryDialog.serviceLabel)(connection.service), ")") : repo.name,
+    options: items
+  };
+}).filter(function (group) {
+  return group.options.length > 0;
+}).sort(function (a, b) {
+  return a.name.localeCompare(b.name);
+});
+var ALL_ITEMS = LINKABLES;
+
+/* ---- Branch mock data (for the New Branch / New Pull Request bases) --- */
+
+var BRANCHES = [
+// activecollab/backend
+{
+  id: "backend-main",
+  name: "main",
+  repoId: "backend",
+  isDefault: true,
+  updatedMinutesAgo: 60
+}, {
+  id: "backend-cache",
+  name: "spike/rank-cache",
+  repoId: "backend",
+  updatedMinutesAgo: 30
+}, {
+  id: "backend-export",
+  name: "feature/retainer-export-34",
+  repoId: "backend",
+  updatedMinutesAgo: 5 * 60
+}, {
+  id: "backend-hotfix",
+  name: "hotfix/rank-typo",
+  repoId: "backend",
+  updatedMinutesAgo: 3 * 24 * 60
+},
+// activecollab/frontend
+{
+  id: "frontend-main",
+  name: "main",
+  repoId: "frontend",
+  isDefault: true,
+  updatedMinutesAgo: 90
+}, {
+  id: "frontend-retainers",
+  name: "feature/retainers-ui-34",
+  repoId: "frontend",
+  updatedMinutesAgo: 2 * 60
+}, {
+  id: "frontend-filters",
+  name: "feature/contract-filters",
+  repoId: "frontend",
+  updatedMinutesAgo: 24 * 60
+},
+// activecollab/infrastructure
+{
+  id: "infra-master",
+  name: "master",
+  repoId: "infra",
+  isDefault: true,
+  updatedMinutesAgo: 6 * 60
+}, {
+  id: "infra-deploy",
+  name: "chore/deploy-rank-cache",
+  repoId: "infra",
+  updatedMinutesAgo: 24 * 60
+}];
+var repoBranches = function repoBranches(repoId) {
+  return BRANCHES.filter(function (b) {
+    return b.repoId === repoId;
+  });
+};
+var repoDefaultBranchId = function repoDefaultBranchId(repoId) {
+  var _repoBranches$find$id, _repoBranches$find;
+  return (_repoBranches$find$id = (_repoBranches$find = repoBranches(repoId).find(function (b) {
+    return b.isDefault;
+  })) === null || _repoBranches$find === void 0 ? void 0 : _repoBranches$find.id) !== null && _repoBranches$find$id !== void 0 ? _repoBranches$find$id : null;
+};
+/**
+ * Base-branch options (Create From / Merge Into): the default branch first with
+ * no timestamp, then the rest sorted by latest activity (freshest first), each
+ * with a muted "last activity" time.
+ */
+var baseBranchOptions = function baseBranchOptions(repoId) {
+  var branches = repoBranches(repoId);
+  var defaults = branches.filter(function (b) {
+    return b.isDefault;
+  }).map(function (b) {
+    return {
+      id: b.id,
+      name: b.name
+    };
+  });
+  var rest = branches.filter(function (b) {
+    return !b.isDefault;
+  }).sort(function (a, b) {
+    return a.updatedMinutesAgo - b.updatedMinutesAgo;
+  }).map(function (b) {
+    return {
+      id: b.id,
+      name: b.name,
+      additionalInfo: formatAgo(b.updatedMinutesAgo)
+    };
+  });
+  return [...defaults, ...rest];
+};
+
+/**
+ * Source-branch options (New Pull Request): the default branch is excluded — you
+ * don't open a PR to merge the trunk into a feature branch — and the rest are
+ * sorted by latest activity, each with a muted "last activity" time.
+ */
+var sourceBranchOptions = function sourceBranchOptions(repoId) {
+  return repoBranches(repoId).filter(function (b) {
+    return !b.isDefault;
+  }).sort(function (a, b) {
+    return a.updatedMinutesAgo - b.updatedMinutesAgo;
+  }).map(function (b) {
+    return {
+      id: b.id,
+      name: b.name,
+      additionalInfo: formatAgo(b.updatedMinutesAgo)
+    };
+  });
+};
+
+/* ---- Styles ---------------------------------------------------------- */
+
+var StyledLinkBody = _styledComponents.default.div.withConfig({
+  displayName: "LinkBranchOrPullRequestDialog__StyledLinkBody",
+  componentId: "sc-2wiwoe-0"
+})(["font-family:", ";.lk-tabbody{margin-top:18px;}.lk-field{margin-bottom:16px;}.lk-field:last-child{margin-bottom:0;}.lk-label{display:block;margin-bottom:6px;}.lk-control,.lk-control.c-input-wrapper{width:100%;max-width:none;}.lk-repo-hint{display:block;margin-top:8px;}.lk-repo-link{background:none;border:none;padding:0;font:inherit;color:var(--color-primary);cursor:pointer;}.lk-repo-link:hover{text-decoration:underline;}.lk-skeleton .sk-row{margin-bottom:18px;}.lk-skeleton .sk-choose{width:100%;height:36px;border-radius:6px;}.lk-skeleton .sk-label{width:160px;height:12px;margin-bottom:8px;}.lk-skeleton .sk-control{width:100%;height:40px;border-radius:6px;}"], SANS);
+
+/**
+ * The grouped select menu renders through a portal, so the "match the trigger
+ * width" override has to be global, scoped to the menu's class. `$menuWidth` is
+ * measured from the trigger and injected here.
+ */
+var MenuGlobalStyle = (0, _styledComponents.createGlobalStyle)([".c-select.lk-existing-select-menu{", "}.c-select.lk-existing-select-menu .c-option--text + span{color:var(--color-theme-600);font-size:12px;}"], function (_ref) {
+  var $menuWidth = _ref.$menuWidth;
+  return $menuWidth ? "width: ".concat($menuWidth, "px !important; max-width: none !important;") : "";
+});
+
+/**
+ * Per-instance global style for a branch select menu: matches the trigger width
+ * and applies the standard muted styling to the right-aligned "last activity".
+ */
+var BranchMenuGlobalStyle = (0, _styledComponents.createGlobalStyle)([".c-select.", "{", "}.c-select.", " .c-option--text + span{color:var(--color-theme-600);font-size:12px;}"], function (p) {
+  return p.$cls;
+}, function (p) {
+  return p.$w ? "width: ".concat(p.$w, "px !important; max-width: none !important;") : "";
+}, function (p) {
+  return p.$cls;
+});
+var BranchSelectWrap = _styledComponents.default.div.withConfig({
+  displayName: "LinkBranchOrPullRequestDialog__BranchSelectWrap",
+  componentId: "sc-2wiwoe-1"
+})(["font-family:", ";.branch-trigger{width:100%;max-width:none;}"], SANS);
+/**
+ * Flat branch picker (Create From / Source Branch / Merge Into). The caller
+ * supplies the option order (default-first or activity-sorted); the DS internal
+ * alphabetical sort is disabled so that order is preserved.
+ */
+var BranchSelect = function BranchSelect(_ref2) {
+  var _options$find$name, _options$find;
+  var options = _ref2.options,
+    selected = _ref2.selected,
+    _onChange = _ref2.onChange,
+    _ref2$placeholder = _ref2.placeholder,
+    placeholder = _ref2$placeholder === void 0 ? "Select branch" : _ref2$placeholder;
+  var wrapRef = (0, _react.useRef)(null);
+  var _useState = (0, _react.useState)(),
+    _useState2 = _slicedToArray(_useState, 2),
+    menuWidth = _useState2[0],
+    setMenuWidth = _useState2[1];
+  var _useState3 = (0, _react.useState)(function () {
+      return "branch-select-menu-".concat(Math.random().toString(36).slice(2));
+    }),
+    _useState4 = _slicedToArray(_useState3, 1),
+    menuCls = _useState4[0];
+  var measure = (0, _react.useCallback)(function () {
+    if (wrapRef.current) {
+      setMenuWidth(wrapRef.current.offsetWidth);
+    }
+  }, []);
+  (0, _react.useEffect)(function () {
+    measure();
+  }, [measure]);
+  var selectedName = (_options$find$name = (_options$find = options.find(function (o) {
+    return o.id === selected;
+  })) === null || _options$find === void 0 ? void 0 : _options$find.name) !== null && _options$find$name !== void 0 ? _options$find$name : placeholder;
+  return /*#__PURE__*/_react.default.createElement(BranchSelectWrap, {
+    ref: wrapRef
+  }, /*#__PURE__*/_react.default.createElement(BranchMenuGlobalStyle, {
+    $cls: menuCls,
+    $w: menuWidth
+  }), /*#__PURE__*/_react.default.createElement(_Select.Select, {
+    options: options,
+    selected: selected === null ? undefined : selected,
+    onChange: function onChange(v) {
+      return _onChange(String(v));
+    },
+    placeholder: "Search branches",
+    selectClassName: menuCls,
+    onSelectOpen: measure,
+    disabledInternalSort: true,
+    forceCloseMenu: true,
+    target: /*#__PURE__*/_react.default.createElement(_SelectTrigger.SelectTrigger, {
+      className: "branch-trigger",
+      typographyProps: selected === null ? {
+        color: "tertiary"
+      } : undefined
+    }, selectedName)
+  }));
+};
+var MODE_OPTIONS = [{
+  id: "existing",
+  name: "Link Existing"
+}, {
+  id: "branch",
+  name: "New Branch"
+}, {
+  id: "pr",
+  name: "New Pull Request"
+}];
+var LinkBranchOrPullRequestDialog = exports.LinkBranchOrPullRequestDialog = function LinkBranchOrPullRequestDialog(_ref3) {
+  var _ALL_ITEMS$find$name, _ALL_ITEMS$find;
+  var open = _ref3.open,
+    onClose = _ref3.onClose;
+  var _useState5 = (0, _react.useState)("existing"),
+    _useState6 = _slicedToArray(_useState5, 2),
+    mode = _useState6[0],
+    setMode = _useState6[1];
+  var _useState7 = (0, _react.useState)(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    selected = _useState8[0],
+    setSelected = _useState8[1];
+  var _useState9 = (0, _react.useState)("feature/retainers-34"),
+    _useState0 = _slicedToArray(_useState9, 2),
+    branchName = _useState0[0],
+    setBranchName = _useState0[1];
+  var _useState1 = (0, _react.useState)("#34 Retainers & Contracts functionality"),
+    _useState10 = _slicedToArray(_useState1, 2),
+    prTitle = _useState10[0],
+    setPrTitle = _useState10[1];
+  var _useState11 = (0, _react.useState)(false),
+    _useState12 = _slicedToArray(_useState11, 2),
+    attempted = _useState12[0],
+    setAttempted = _useState12[1];
+  var _useState13 = (0, _react.useState)(true),
+    _useState14 = _slicedToArray(_useState13, 2),
+    loading = _useState14[0],
+    setLoading = _useState14[1];
+  var _useState15 = (0, _react.useState)(),
+    _useState16 = _slicedToArray(_useState15, 2),
+    menuWidth = _useState16[0],
+    setMenuWidth = _useState16[1];
+
+  // Repository picker (New Branch / New Pull Request) + connect-repository flow.
+  var _useState17 = (0, _react.useState)("backend"),
+    _useState18 = _slicedToArray(_useState17, 2),
+    repo = _useState18[0],
+    setRepo = _useState18[1];
+  var _useState19 = (0, _react.useState)(false),
+    _useState20 = _slicedToArray(_useState19, 2),
+    connectOpen = _useState20[0],
+    setConnectOpen = _useState20[1];
+  var _useState21 = (0, _react.useState)([]),
+    _useState22 = _slicedToArray(_useState21, 2),
+    extraRepos = _useState22[0],
+    setExtraRepos = _useState22[1];
+
+  // Branch bases. Create From / Merge Into default to the repo's default branch;
+  // Source Branch starts unselected.
+  var _useState23 = (0, _react.useState)(function () {
+      return repoDefaultBranchId("backend");
+    }),
+    _useState24 = _slicedToArray(_useState23, 2),
+    createFrom = _useState24[0],
+    setCreateFrom = _useState24[1];
+  var _useState25 = (0, _react.useState)(null),
+    _useState26 = _slicedToArray(_useState25, 2),
+    sourceBranch = _useState26[0],
+    setSourceBranch = _useState26[1];
+  var _useState27 = (0, _react.useState)(function () {
+      return repoDefaultBranchId("backend");
+    }),
+    _useState28 = _slicedToArray(_useState27, 2),
+    mergeInto = _useState28[0],
+    setMergeInto = _useState28[1];
+
+  // When the repository changes, reset the bases: default branch for
+  // Create From / Merge Into, nothing for Source Branch.
+  (0, _react.useEffect)(function () {
+    var defaultId = repoDefaultBranchId(repo);
+    setCreateFrom(defaultId);
+    setMergeInto(defaultId);
+    setSourceBranch(null);
+  }, [repo]);
+  var fieldRef = (0, _react.useRef)(null);
+
+  // Simulate the API loads that will drive the pickers: a ~1s skeleton on open.
+  (0, _react.useEffect)(function () {
+    if (!open) {
+      return undefined;
+    }
+    setLoading(true);
+    var timer = window.setTimeout(function () {
+      return setLoading(false);
+    }, 1000);
+    return function () {
+      return window.clearTimeout(timer);
+    };
+  }, [open]);
+  var measureMenu = (0, _react.useCallback)(function () {
+    if (fieldRef.current) {
+      setMenuWidth(fieldRef.current.offsetWidth);
+    }
+  }, []);
+
+  // Keep the menu width in sync with the trigger once the form is visible.
+  (0, _react.useEffect)(function () {
+    if (open && !loading && mode === "existing") {
+      measureMenu();
+    }
+  }, [open, loading, mode, measureMenu]);
+
+  // Submit is always enabled; validation runs on click and outlines fields.
+  var existingInvalid = attempted && mode === "existing" && selected === null;
+  var branchInvalid = attempted && mode === "branch" && branchName.trim() === "";
+  var titleInvalid = attempted && mode === "pr" && prTitle.trim() === "";
+  var primaryLabel = mode === "existing" ? "Link" : mode === "branch" ? "Create Branch" : "Create Pull Request";
+  var close = function close() {
+    setAttempted(false);
+    onClose();
+  };
+  var handleSubmit = function handleSubmit() {
+    var valid = mode === "existing" ? selected !== null : mode === "branch" ? branchName.trim() !== "" : prTitle.trim() !== "";
+    if (!valid) {
+      setAttempted(true);
+      return;
+    }
+    close();
+  };
+  var changeMode = function changeMode(next) {
+    setMode(next);
+    setAttempted(false);
+  };
+  var selectedLabel = (_ALL_ITEMS$find$name = (_ALL_ITEMS$find = ALL_ITEMS.find(function (o) {
+    return o.id === selected;
+  })) === null || _ALL_ITEMS$find === void 0 ? void 0 : _ALL_ITEMS$find.name) !== null && _ALL_ITEMS$find$name !== void 0 ? _ALL_ITEMS$find$name : "Select branch or pull request";
+
+  // Repositories already on the project (plus any just connected), and the
+  // remaining ones that can still be connected from here.
+  var projectRepos = [..._ConnectRepositoryDialog.PROJECT_REPOSITORIES, ...extraRepos];
+  var connectableRepos = _ConnectRepositoryDialog.CONNECTABLE_REPOSITORIES.filter(function (r) {
+    return !projectRepos.some(function (p) {
+      return p.id === r.id;
+    });
+  });
+  var handleConnected = function handleConnected(connected) {
+    setExtraRepos(function (prev) {
+      return prev.some(function (r) {
+        return r.id === connected.id;
+      }) ? prev : [...prev, connected];
+    });
+    // The repository just connected becomes the selection in the picker.
+    setRepo(connected.id);
+  };
+  var renderRepositoryField = function renderRepositoryField() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "lk-field"
+    }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+      size: "small",
+      className: "lk-label"
+    }, "Repository"), /*#__PURE__*/_react.default.createElement(_ConnectRepositoryDialog.RepositorySelect, {
+      repositories: projectRepos,
+      connections: _ConnectRepositoryDialog.CONNECTIONS,
+      selected: repo,
+      onChange: setRepo
+    }), /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
+      color: "tertiary",
+      className: "lk-repo-hint"
+    }, "Only repositories connected to this project are listed.", " ", /*#__PURE__*/_react.default.createElement("button", {
+      type: "button",
+      className: "lk-repo-link",
+      onClick: function onClick() {
+        return setConnectOpen(true);
+      }
+    }, "Connect a repository"), " ", "if the one you need is missing."));
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Dialog.Dialog, {
+    open: open,
+    onClose: close,
+    disableCloseOnEsc: true
+  }, /*#__PURE__*/_react.default.createElement(MenuGlobalStyle, {
+    $menuWidth: menuWidth
+  }), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.Title, null, "Link Branch or Pull Request"), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.ContentDivider, null), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.Content, null, /*#__PURE__*/_react.default.createElement(StyledLinkBody, null, loading ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-skeleton"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "sk-row"
+  }, /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
+    className: "sk-choose"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "sk-row"
+  }, /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
+    className: "sk-label"
+  }), /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
+    className: "sk-control"
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ChooseV.ChooseV2, {
+    required: true,
+    options: MODE_OPTIONS,
+    selected: [mode],
+    onChange: function onChange(ids) {
+      return changeMode(ids[0]);
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-tabbody"
+  }, mode === "existing" ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field",
+    ref: fieldRef
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label",
+    invalid: existingInvalid
+  }, "Branch or Pull Request"), /*#__PURE__*/_react.default.createElement(_Select.Select, {
+    options: GROUPED_OPTIONS,
+    selected: selected === null ? undefined : selected,
+    onChange: function onChange(v) {
+      return setSelected(v);
+    },
+    placeholder: "Search branches and pull requests",
+    selectClassName: "lk-existing-select-menu",
+    onSelectOpen: measureMenu,
+    disabledInternalSort: true,
+    forceCloseMenu: true,
+    target: /*#__PURE__*/_react.default.createElement(_SelectTrigger.SelectTrigger, {
+      className: "lk-control",
+      invalid: existingInvalid,
+      typographyProps: selected === null ? {
+        color: "tertiary"
+      } : undefined
+    }, selectedLabel)
+  })) : mode === "branch" ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderRepositoryField(), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field"
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label",
+    invalid: branchInvalid
+  }, "Branch Name"), /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    className: "lk-control",
+    value: branchName,
+    invalid: branchInvalid,
+    onChange: function onChange(e) {
+      return setBranchName(e.target.value);
+    }
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field"
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label"
+  }, "Create From"), /*#__PURE__*/_react.default.createElement(BranchSelect, {
+    options: baseBranchOptions(repo),
+    selected: createFrom,
+    onChange: setCreateFrom,
+    placeholder: "Select base branch"
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderRepositoryField(), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field"
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label"
+  }, "Source Branch"), /*#__PURE__*/_react.default.createElement(BranchSelect, {
+    options: sourceBranchOptions(repo),
+    selected: sourceBranch,
+    onChange: setSourceBranch,
+    placeholder: "Select source branch"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field"
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label"
+  }, "Merge Into"), /*#__PURE__*/_react.default.createElement(BranchSelect, {
+    options: baseBranchOptions(repo),
+    selected: mergeInto,
+    onChange: setMergeInto,
+    placeholder: "Select base branch"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "lk-field"
+  }, /*#__PURE__*/_react.default.createElement(_Label.Label, {
+    size: "small",
+    className: "lk-label",
+    invalid: titleInvalid
+  }, "Title"), /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    className: "lk-control",
+    value: prTitle,
+    invalid: titleInvalid,
+    onChange: function onChange(e) {
+      return setPrTitle(e.target.value);
+    }
+  }))))))), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.ContentDivider, null), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.Actions, null, /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    variant: "primary",
+    style: {
+      marginRight: 12
+    },
+    disabled: loading,
+    onClick: handleSubmit
+  }, primaryLabel), /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    variant: "secondary",
+    onClick: close
+  }, "Cancel"))), /*#__PURE__*/_react.default.createElement(_ConnectRepositoryDialog.ConnectRepositoryDialog, {
+    open: connectOpen,
+    onClose: function onClose() {
+      return setConnectOpen(false);
+    },
+    onConnect: handleConnected,
+    repositories: connectableRepos,
+    connections: _ConnectRepositoryDialog.CONNECTIONS
+  }));
+};
+//# sourceMappingURL=LinkBranchOrPullRequestDialog.js.map