@activecollab/components 2.0.393 → 2.0.395
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Icons/collection/ViewCombined.js +60 -0
- package/dist/cjs/components/Icons/collection/ViewCombined.js.map +1 -0
- package/dist/cjs/components/Icons/collection/index.js +7 -0
- package/dist/cjs/components/Icons/collection/index.js.map +1 -1
- package/dist/cjs/presentation/shared/LinkingCommandsButton.js +236 -103
- package/dist/cjs/presentation/shared/LinkingCommandsButton.js.map +1 -1
- package/dist/cjs/presentation/shared/SourceCodeSection.js +23 -10
- package/dist/cjs/presentation/shared/SourceCodeSection.js.map +1 -1
- package/dist/esm/components/Icons/collection/ViewCombined.d.ts +32 -0
- package/dist/esm/components/Icons/collection/ViewCombined.d.ts.map +1 -0
- package/dist/esm/components/Icons/collection/ViewCombined.js +53 -0
- package/dist/esm/components/Icons/collection/ViewCombined.js.map +1 -0
- package/dist/esm/components/Icons/collection/index.d.ts +1 -0
- package/dist/esm/components/Icons/collection/index.d.ts.map +1 -1
- package/dist/esm/components/Icons/collection/index.js +1 -0
- package/dist/esm/components/Icons/collection/index.js.map +1 -1
- package/dist/esm/presentation/shared/LinkingCommandsButton.d.ts.map +1 -1
- package/dist/esm/presentation/shared/LinkingCommandsButton.js +234 -104
- package/dist/esm/presentation/shared/LinkingCommandsButton.js.map +1 -1
- package/dist/esm/presentation/shared/SourceCodeSection.d.ts +12 -1
- package/dist/esm/presentation/shared/SourceCodeSection.d.ts.map +1 -1
- package/dist/esm/presentation/shared/SourceCodeSection.js +21 -9
- package/dist/esm/presentation/shared/SourceCodeSection.js.map +1 -1
- package/dist/index.js +566 -516
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.LinkingCommandsButton = void 0;
|
|
7
7
|
var _react = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
+
var _Button = require("../../components/Button");
|
|
9
10
|
var _ChooseV = require("../../components/ChooseV2");
|
|
10
11
|
var _Dialog = require("../../components/Dialog");
|
|
11
12
|
var _IconButton = require("../../components/IconButton");
|
|
12
13
|
var _Icons = require("../../components/Icons");
|
|
13
14
|
var _Loaders = require("../../components/Loaders");
|
|
14
15
|
var _Tooltip = require("../../components/Tooltip");
|
|
15
|
-
var _Trigger = require("../../components/Trigger");
|
|
16
16
|
var _Typography = require("../../components/Typography");
|
|
17
17
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
18
18
|
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); }
|
|
@@ -23,40 +23,148 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
|
|
|
23
23
|
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; } }
|
|
24
24
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
25
25
|
/**
|
|
26
|
-
* "Linking and Commands" button —
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
*
|
|
31
|
-
*
|
|
26
|
+
* "Linking and Commands" button — a plain design-system secondary button (small,
|
|
27
|
+
* rounded, no icon, no AI gradient: this is not an AI feature). Clicking it opens
|
|
28
|
+
* a read-only reference dialog.
|
|
29
|
+
*
|
|
30
|
+
* This mock mirrors the shipped `activecollab-next` implementation
|
|
31
|
+
* (`src/components/tasks/SourceCode/LinkingAndCommandsButton.jsx` +
|
|
32
|
+
* `LinkingAndCommandsDialog.jsx`, task #457754): a 640px dialog with a short
|
|
33
|
+
* pitch, a centered ChooseV2 to switch conventions (Linking default), and two
|
|
34
|
+
* tabs. Linking shows the reference forms for this task and a copyable
|
|
35
|
+
* `git checkout -b …` suggestion; Commands shows an API-shaped table of action
|
|
36
|
+
* words and slash commands, plus a fixed example commit. Both the reference
|
|
37
|
+
* guide and the suggested-branch request are represented by short skeleton
|
|
38
|
+
* loads, the way the real dialog fetches them once it is opened.
|
|
32
39
|
*/
|
|
33
40
|
var SANS = '-apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", Arial, sans-serif';
|
|
34
41
|
var MONO = "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace";
|
|
35
42
|
|
|
36
43
|
/** The example task these instructions are written against. */
|
|
37
44
|
var TASK_ID = 4231;
|
|
45
|
+
/** Task URL, in production built with `~/utils/urls` `getTaskUrl`. */
|
|
46
|
+
var TASK_URL = "https://app.activecollab.com/1/projects/2110/tasks/".concat(TASK_ID);
|
|
38
47
|
/**
|
|
39
48
|
* Suggested branch name for this task — in production it is resolved per repo
|
|
40
49
|
* via GET .../tasks/{task_id}/source/suggest-branch-name. Mocked here.
|
|
41
50
|
*/
|
|
42
|
-
var SUGGESTED_BRANCH = "ilija/
|
|
51
|
+
var SUGGESTED_BRANCH = "ilija/".concat(TASK_ID, "-add-cacak-region-support");
|
|
43
52
|
|
|
44
53
|
/** POSIX-safe single-quote escaping for a value dropped into a shell command. */
|
|
45
54
|
var shellQuote = function shellQuote(value) {
|
|
46
55
|
return "'".concat(value.replace(/'/g, "'\\''"), "'");
|
|
47
56
|
};
|
|
48
|
-
|
|
49
|
-
|
|
57
|
+
|
|
58
|
+
/* ------------------------------------------------------------------ */
|
|
59
|
+
/* Reference-guide data — shaped like the GET .../source/reference-guide */
|
|
60
|
+
/* payload the real dialog is driven by: a map of action words plus a */
|
|
61
|
+
/* flat list of slash commands. Descriptions are localised server-side; */
|
|
62
|
+
/* tokens and examples never translate. */
|
|
63
|
+
/* ------------------------------------------------------------------ */
|
|
64
|
+
|
|
65
|
+
/** Action words act on the linked task from a title, commit, or PR body. */
|
|
66
|
+
var ACTION_WORDS = {
|
|
67
|
+
close: {
|
|
68
|
+
primary: "Close",
|
|
69
|
+
example: "Close #".concat(TASK_ID),
|
|
70
|
+
description: "Closes the task when its pull request is merged.",
|
|
71
|
+
aliases: ["Closes", "Fixes", "Fixed", "Resolves", "Resolved"]
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
/** Slash commands act on the task from a commit message or PR description. */
|
|
76
|
+
var COMMANDS = [{
|
|
77
|
+
name: "spend",
|
|
78
|
+
syntax: "/spend {duration} [of {job type}]",
|
|
79
|
+
example: "/spend 1h 30m of Design",
|
|
80
|
+
description: "Logs the time you spent on the task."
|
|
81
|
+
}, {
|
|
82
|
+
name: "estimate",
|
|
83
|
+
syntax: "/estimate {duration}",
|
|
84
|
+
example: "/estimate 4h",
|
|
85
|
+
description: "Sets the task's time estimate."
|
|
86
|
+
}, {
|
|
87
|
+
name: "comment",
|
|
88
|
+
syntax: "/comment {text}",
|
|
89
|
+
example: "/comment Deployed to staging",
|
|
90
|
+
description: "Posts a comment on the task."
|
|
91
|
+
}, {
|
|
92
|
+
name: "done",
|
|
93
|
+
syntax: "/done",
|
|
94
|
+
example: "/done",
|
|
95
|
+
description: "Marks the task complete.",
|
|
96
|
+
aliases: ["/complete"]
|
|
97
|
+
}, {
|
|
98
|
+
name: "reopen",
|
|
99
|
+
syntax: "/reopen",
|
|
100
|
+
example: "/reopen",
|
|
101
|
+
description: "Reopens a completed task."
|
|
102
|
+
}, {
|
|
103
|
+
name: "assign",
|
|
104
|
+
syntax: "/assign @{member}",
|
|
105
|
+
example: "/assign @ilija",
|
|
106
|
+
description: "Assigns the task to a team member."
|
|
107
|
+
}, {
|
|
108
|
+
name: "label",
|
|
109
|
+
syntax: "/label {name}",
|
|
110
|
+
example: "/label In Progress",
|
|
111
|
+
description: "Adds a label to the task."
|
|
112
|
+
}];
|
|
113
|
+
/** Action words first, then the slash commands — the shipped row order. */
|
|
114
|
+
var TABLE_ROWS = [...Object.values(ACTION_WORDS).map(function (word) {
|
|
115
|
+
return {
|
|
116
|
+
key: "action-".concat(word.primary),
|
|
117
|
+
example: word.example,
|
|
118
|
+
description: word.description,
|
|
119
|
+
aliases: word.aliases
|
|
120
|
+
};
|
|
121
|
+
}), ...COMMANDS.map(function (command) {
|
|
122
|
+
return {
|
|
123
|
+
key: "command-".concat(command.name),
|
|
124
|
+
example: command.example,
|
|
125
|
+
format: command.syntax,
|
|
126
|
+
description: command.description,
|
|
127
|
+
aliases: command.aliases
|
|
128
|
+
};
|
|
129
|
+
})];
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* Illustrative commit message: closes the task on the subject line, logs time,
|
|
133
|
+
* leaves a note. Fixed sample text — only the task id is interpolated, and
|
|
134
|
+
* durations are printed verbatim (never reformatted).
|
|
135
|
+
*/
|
|
136
|
+
var EXAMPLE_COMMIT = "Fix ranks reset when a contract is archived, closes #".concat(TASK_ID, "\n\n/spend 1h 30m\n/comment Verified on staging, ranks hold after archive");
|
|
137
|
+
|
|
138
|
+
/* ------------------------------------------------------------------ */
|
|
139
|
+
/* Trigger button — plain DS secondary button, rounded to the compact */
|
|
140
|
+
/* "Suggest Subtasks" shape (6px), no icon, no gradient. */
|
|
141
|
+
/* ------------------------------------------------------------------ */
|
|
142
|
+
|
|
143
|
+
var TriggerButton = (0, _styledComponents.default)(_Button.Button).withConfig({
|
|
144
|
+
displayName: "LinkingCommandsButton__TriggerButton",
|
|
50
145
|
componentId: "sc-11q4kcm-0"
|
|
51
|
-
})(["
|
|
146
|
+
})(["&&{border-radius:6px;}"]);
|
|
147
|
+
|
|
148
|
+
/** Wider than the default 540px dialog, matching the shipped 640px width. */
|
|
149
|
+
var StyledDialog = (0, _styledComponents.default)(_Dialog.Dialog).withConfig({
|
|
150
|
+
displayName: "LinkingCommandsButton__StyledDialog",
|
|
151
|
+
componentId: "sc-11q4kcm-1"
|
|
152
|
+
})(["&&{width:640px;max-width:calc(100vw - 64px);}"]);
|
|
52
153
|
var StyledTitleRow = _styledComponents.default.div.withConfig({
|
|
53
154
|
displayName: "LinkingCommandsButton__StyledTitleRow",
|
|
54
|
-
componentId: "sc-11q4kcm-
|
|
155
|
+
componentId: "sc-11q4kcm-2"
|
|
55
156
|
})(["display:flex;align-items:center;justify-content:space-between;gap:12px;"]);
|
|
56
157
|
var StyledBody = _styledComponents.default.div.withConfig({
|
|
57
158
|
displayName: "LinkingCommandsButton__StyledBody",
|
|
58
|
-
componentId: "sc-11q4kcm-
|
|
59
|
-
})(["font-family:", ";.lc-
|
|
159
|
+
componentId: "sc-11q4kcm-3"
|
|
160
|
+
})(["font-family:", ";display:flex;flex-direction:column;gap:16px;max-height:60vh;overflow-y:auto;.code{font-family:", ";background:var(--color-theme-200);color:var(--color-theme-900);border-radius:4px;padding:2px 6px;font-size:12px;}.lc-term{font-weight:600;color:var(--color-theme-900);}.lc-leads{display:flex;flex-direction:column;gap:8px;}.lc-lead{display:flex;align-items:flex-start;gap:8px;}.lc-lead svg{flex-shrink:0;width:16px;height:16px;margin-top:2px;color:var(--color-theme-600);}.lc-choosectl > div{justify-content:center;}.lc-tabbody{display:flex;flex-direction:column;gap:20px;}.lc-commands{gap:16px;}.lc-block{display:flex;flex-direction:column;gap:8px;}.lc-list{display:flex;flex-direction:column;gap:6px;margin:0;padding-left:20px;list-style:disc;}.lc-table{display:grid;grid-template-columns:max-content 1fr;column-gap:24px;}.lc-th{padding-bottom:8px;border-bottom:1px solid var(--border-primary);}.lc-td{padding:12px 0;border-bottom:1px solid var(--border-primary);}.lc-format{display:block;margin-top:4px;font-family:", ";}.lc-aliases{margin-top:12px;}.lc-skeleton{display:flex;flex-direction:column;gap:12px;}.lc-skel{border-radius:6px;}.lc-skel-line{height:20px;}.lc-skel-block{height:36px;width:100%;}.lc-skel-2-3{width:66%;}.lc-skel-1-2{width:50%;}.lc-branch-skel{width:100%;height:36px;border-radius:6px;}"], SANS, MONO, MONO);
|
|
161
|
+
|
|
162
|
+
/* Copyable code snippet — mirrors the shared CopySnippet: a theme-200 <pre>
|
|
163
|
+
with a copy control that reveals on hover (hidden when hideCopyButton). */
|
|
164
|
+
var StyledSnippet = _styledComponents.default.div.withConfig({
|
|
165
|
+
displayName: "LinkingCommandsButton__StyledSnippet",
|
|
166
|
+
componentId: "sc-11q4kcm-4"
|
|
167
|
+
})(["position:relative;pre{margin:0;background:var(--color-theme-200);color:var(--color-theme-900);border-radius:6px;padding:12px 16px;overflow-x:auto;font-family:", ";font-size:13px;line-height:1.5;}.lc-copy-btn{position:absolute;top:6px;right:6px;opacity:0;transition:opacity 0.15s ease;}&:hover .lc-copy-btn{opacity:1;}.lc-copy-btn svg{width:16px;height:16px;}"], MONO);
|
|
60
168
|
var TAB_OPTIONS = [{
|
|
61
169
|
id: "linking",
|
|
62
170
|
name: "Linking"
|
|
@@ -64,114 +172,118 @@ var TAB_OPTIONS = [{
|
|
|
64
172
|
id: "commands",
|
|
65
173
|
name: "Commands"
|
|
66
174
|
}];
|
|
67
|
-
var
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
cmd: "Fixes #34",
|
|
72
|
-
does: "Same as Closes: closes on merge"
|
|
73
|
-
}, {
|
|
74
|
-
cmd: "Refs #34",
|
|
75
|
-
does: "Links to the task without closing it"
|
|
76
|
-
}, {
|
|
77
|
-
cmd: "/spend 1:30",
|
|
78
|
-
does: "Logs time against the task"
|
|
79
|
-
}, {
|
|
80
|
-
cmd: "/estimate 4:00",
|
|
81
|
-
does: "Sets the task's time estimate"
|
|
82
|
-
}, {
|
|
83
|
-
cmd: "/done",
|
|
84
|
-
does: "Marks the task complete"
|
|
85
|
-
}, {
|
|
86
|
-
cmd: "/reopen",
|
|
87
|
-
does: "Reopens the task"
|
|
88
|
-
}, {
|
|
89
|
-
cmd: "/assign @ilija",
|
|
90
|
-
does: "Assigns the task to a user"
|
|
91
|
-
}, {
|
|
92
|
-
cmd: "/label In Progress",
|
|
93
|
-
does: "Adds a label to the task"
|
|
94
|
-
}, {
|
|
95
|
-
cmd: "/comment Deployed to staging",
|
|
96
|
-
does: "Posts a comment on the task"
|
|
97
|
-
}, {
|
|
98
|
-
cmd: "/relate #35",
|
|
99
|
-
does: "Relates this task to another task"
|
|
100
|
-
}];
|
|
101
|
-
|
|
102
|
-
/** Illustrative commit message: closes the task, logs time, leaves a note. */
|
|
103
|
-
var EXAMPLE_COMMIT = "Fix ranks reset when a contract is archived\n\nCloses #".concat(TASK_ID, "\n/spend 1:30\n/comment Verified on staging, ranks hold after archive");
|
|
104
|
-
var LinkingTab = function LinkingTab(_ref) {
|
|
105
|
-
var loading = _ref.loading,
|
|
106
|
-
branch = _ref.branch;
|
|
175
|
+
var CopySnippet = function CopySnippet(_ref) {
|
|
176
|
+
var code = _ref.code,
|
|
177
|
+
_ref$hideCopyButton = _ref.hideCopyButton,
|
|
178
|
+
hideCopyButton = _ref$hideCopyButton === void 0 ? false : _ref$hideCopyButton;
|
|
107
179
|
var _useState = (0, _react.useState)(false),
|
|
108
180
|
_useState2 = _slicedToArray(_useState, 2),
|
|
109
181
|
copied = _useState2[0],
|
|
110
182
|
setCopied = _useState2[1];
|
|
111
|
-
var command = branch ? "git checkout -b ".concat(shellQuote(branch)) : "";
|
|
112
183
|
var copy = function copy() {
|
|
113
184
|
var _navigator$clipboard;
|
|
114
|
-
if (!command) return;
|
|
115
185
|
// eslint-disable-next-line compat/compat
|
|
116
|
-
void ((_navigator$clipboard = navigator.clipboard) === null || _navigator$clipboard === void 0 ? void 0 : _navigator$clipboard.writeText(
|
|
186
|
+
void ((_navigator$clipboard = navigator.clipboard) === null || _navigator$clipboard === void 0 ? void 0 : _navigator$clipboard.writeText(code));
|
|
117
187
|
setCopied(true);
|
|
118
188
|
window.setTimeout(function () {
|
|
119
189
|
return setCopied(false);
|
|
120
190
|
}, 1500);
|
|
121
191
|
};
|
|
192
|
+
return /*#__PURE__*/_react.default.createElement(StyledSnippet, null, /*#__PURE__*/_react.default.createElement("pre", null, /*#__PURE__*/_react.default.createElement("code", null, code)), !hideCopyButton && /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
|
|
193
|
+
title: copied ? "Copied!" : "Copy"
|
|
194
|
+
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
195
|
+
type: "button",
|
|
196
|
+
className: "lc-copy-btn",
|
|
197
|
+
onClick: copy,
|
|
198
|
+
"aria-label": "Copy command",
|
|
199
|
+
style: {
|
|
200
|
+
border: "none",
|
|
201
|
+
background: "transparent",
|
|
202
|
+
cursor: "pointer",
|
|
203
|
+
padding: 4,
|
|
204
|
+
display: "inline-flex",
|
|
205
|
+
color: "var(--color-theme-600)"
|
|
206
|
+
}
|
|
207
|
+
}, /*#__PURE__*/_react.default.createElement(_Icons.CopyIcon, null))));
|
|
208
|
+
};
|
|
209
|
+
var LinkingTab = function LinkingTab(_ref2) {
|
|
210
|
+
var branchLoading = _ref2.branchLoading,
|
|
211
|
+
branch = _ref2.branch;
|
|
212
|
+
var command = branch ? "git checkout -b ".concat(shellQuote(branch)) : "";
|
|
122
213
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
123
214
|
className: "lc-tabbody"
|
|
215
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
216
|
+
className: "lc-block"
|
|
124
217
|
}, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
125
218
|
color: "secondary"
|
|
126
219
|
}, "Mention the task in your git activity and it links to this task on its own:"), /*#__PURE__*/_react.default.createElement("ul", {
|
|
127
220
|
className: "lc-list"
|
|
128
|
-
}, /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2,
|
|
221
|
+
}, /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
222
|
+
color: "secondary"
|
|
223
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
129
224
|
className: "lc-term"
|
|
130
225
|
}, "In a branch name:"), " the raw task ID", " ", /*#__PURE__*/_react.default.createElement("span", {
|
|
131
226
|
className: "code"
|
|
132
|
-
}, TASK_ID))), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2,
|
|
227
|
+
}, TASK_ID))), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
228
|
+
color: "secondary"
|
|
229
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
133
230
|
className: "lc-term"
|
|
134
231
|
}, "In a title, commit message, or description:"), " ", /*#__PURE__*/_react.default.createElement("span", {
|
|
135
232
|
className: "code"
|
|
136
233
|
}, "#", TASK_ID), " or", " ", /*#__PURE__*/_react.default.createElement("span", {
|
|
137
234
|
className: "code"
|
|
138
|
-
}, "AC-", TASK_ID))), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2,
|
|
235
|
+
}, "AC-", TASK_ID))), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
236
|
+
color: "secondary"
|
|
237
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
139
238
|
className: "lc-term"
|
|
140
239
|
}, "Anywhere:"), " the task URL", " ", /*#__PURE__*/_react.default.createElement("span", {
|
|
141
240
|
className: "code"
|
|
142
|
-
},
|
|
143
|
-
className: "lc-
|
|
241
|
+
}, TASK_URL))))), branchLoading || command ? /*#__PURE__*/_react.default.createElement("div", {
|
|
242
|
+
className: "lc-block"
|
|
144
243
|
}, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
145
244
|
color: "secondary"
|
|
146
|
-
}, "Give the branch a name with the task number in it and it links the moment you push. Create one from the suggested name:"),
|
|
147
|
-
className: "lc-
|
|
148
|
-
}) : /*#__PURE__*/_react.default.createElement(
|
|
149
|
-
|
|
150
|
-
}
|
|
151
|
-
title: copied ? "Copied!" : "Copy"
|
|
152
|
-
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
153
|
-
type: "button",
|
|
154
|
-
className: "lc-copy-btn",
|
|
155
|
-
onClick: copy,
|
|
156
|
-
"aria-label": "Copy command"
|
|
157
|
-
}, /*#__PURE__*/_react.default.createElement(_Icons.CopyIcon, null))))));
|
|
245
|
+
}, "Give the branch a name with the task number in it and it links the moment you push. Create one from the suggested name:"), branchLoading ? /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
|
|
246
|
+
className: "lc-branch-skel"
|
|
247
|
+
}) : /*#__PURE__*/_react.default.createElement(CopySnippet, {
|
|
248
|
+
code: command
|
|
249
|
+
})) : null);
|
|
158
250
|
};
|
|
159
251
|
var CommandsTab = function CommandsTab() {
|
|
160
252
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
161
|
-
className: "lc-tabbody"
|
|
253
|
+
className: "lc-tabbody lc-commands"
|
|
162
254
|
}, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
163
255
|
color: "secondary"
|
|
164
|
-
}, "The table below lists action words and slash commands that you can use in a commit message or a pull request description to act on the linked task. Example:"), /*#__PURE__*/_react.default.createElement(
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
256
|
+
}, "The table below lists action words and slash commands that you can use in a commit message or a pull request description to act on the linked task. Example:"), /*#__PURE__*/_react.default.createElement(CopySnippet, {
|
|
257
|
+
code: EXAMPLE_COMMIT,
|
|
258
|
+
hideCopyButton: true
|
|
259
|
+
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
260
|
+
className: "lc-table"
|
|
261
|
+
}, /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
|
|
262
|
+
color: "tertiary",
|
|
263
|
+
className: "lc-th"
|
|
264
|
+
}, "Command"), /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
|
|
265
|
+
color: "tertiary",
|
|
266
|
+
className: "lc-th"
|
|
267
|
+
}, "What it does"), TABLE_ROWS.map(function (row) {
|
|
268
|
+
var _row$aliases;
|
|
269
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
|
|
270
|
+
key: row.key
|
|
271
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
272
|
+
className: "lc-td"
|
|
273
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
170
274
|
className: "code"
|
|
171
|
-
},
|
|
275
|
+
}, row.example), row.format ? /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
|
|
276
|
+
color: "tertiary",
|
|
277
|
+
className: "lc-format"
|
|
278
|
+
}, row.format) : null), /*#__PURE__*/_react.default.createElement("div", {
|
|
279
|
+
className: "lc-td"
|
|
280
|
+
}, /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
172
281
|
color: "secondary"
|
|
173
|
-
},
|
|
174
|
-
|
|
282
|
+
}, row.description), (_row$aliases = row.aliases) !== null && _row$aliases !== void 0 && _row$aliases.length ? /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
283
|
+
color: "secondary",
|
|
284
|
+
className: "lc-aliases"
|
|
285
|
+
}, "Aliases: ", row.aliases.join(", ")) : null));
|
|
286
|
+
})));
|
|
175
287
|
};
|
|
176
288
|
var LinkingCommandsButton = exports.LinkingCommandsButton = function LinkingCommandsButton() {
|
|
177
289
|
var _useState3 = (0, _react.useState)(false),
|
|
@@ -184,37 +296,47 @@ var LinkingCommandsButton = exports.LinkingCommandsButton = function LinkingComm
|
|
|
184
296
|
setTab = _useState6[1];
|
|
185
297
|
var _useState7 = (0, _react.useState)(true),
|
|
186
298
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
var _useState9 = (0, _react.useState)(
|
|
299
|
+
guideLoading = _useState8[0],
|
|
300
|
+
setGuideLoading = _useState8[1];
|
|
301
|
+
var _useState9 = (0, _react.useState)(true),
|
|
190
302
|
_useState0 = _slicedToArray(_useState9, 2),
|
|
191
|
-
|
|
192
|
-
|
|
303
|
+
branchLoading = _useState0[0],
|
|
304
|
+
setBranchLoading = _useState0[1];
|
|
305
|
+
var _useState1 = (0, _react.useState)(null),
|
|
306
|
+
_useState10 = _slicedToArray(_useState1, 2),
|
|
307
|
+
suggestedBranch = _useState10[0],
|
|
308
|
+
setSuggestedBranch = _useState10[1];
|
|
193
309
|
|
|
194
|
-
// Mock the
|
|
195
|
-
//
|
|
310
|
+
// Mock the two endpoint loads the real dialog fires once it opens: the
|
|
311
|
+
// reference guide resolves first (~0.6s), then the suggested branch name
|
|
312
|
+
// (~1.1s), each showing its own skeleton until it lands.
|
|
196
313
|
(0, _react.useEffect)(function () {
|
|
197
314
|
if (!open) return undefined;
|
|
315
|
+
setGuideLoading(true);
|
|
198
316
|
setBranchLoading(true);
|
|
199
317
|
setSuggestedBranch(null);
|
|
200
|
-
var
|
|
318
|
+
var guideTimer = window.setTimeout(function () {
|
|
319
|
+
return setGuideLoading(false);
|
|
320
|
+
}, 600);
|
|
321
|
+
var branchTimer = window.setTimeout(function () {
|
|
201
322
|
setSuggestedBranch(SUGGESTED_BRANCH);
|
|
202
323
|
setBranchLoading(false);
|
|
203
|
-
},
|
|
324
|
+
}, 1100);
|
|
204
325
|
return function () {
|
|
205
|
-
|
|
326
|
+
window.clearTimeout(guideTimer);
|
|
327
|
+
window.clearTimeout(branchTimer);
|
|
206
328
|
};
|
|
207
329
|
}, [open]);
|
|
208
330
|
var openDialog = function openDialog() {
|
|
209
331
|
setTab("linking");
|
|
210
332
|
setOpen(true);
|
|
211
333
|
};
|
|
212
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(
|
|
334
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(TriggerButton, {
|
|
213
335
|
type: "button",
|
|
336
|
+
variant: "secondary",
|
|
337
|
+
size: "small",
|
|
214
338
|
onClick: openDialog
|
|
215
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
216
|
-
className: "lc-btn"
|
|
217
|
-
}, "Linking and Commands")), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog, {
|
|
339
|
+
}, "Linking and Commands"), /*#__PURE__*/_react.default.createElement(StyledDialog, {
|
|
218
340
|
open: open,
|
|
219
341
|
onClose: function onClose() {
|
|
220
342
|
return setOpen(false);
|
|
@@ -225,12 +347,23 @@ var LinkingCommandsButton = exports.LinkingCommandsButton = function LinkingComm
|
|
|
225
347
|
}, /*#__PURE__*/_react.default.createElement(StyledTitleRow, null, /*#__PURE__*/_react.default.createElement(_Typography.Header3, null, "Linking and Commands"), /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
|
|
226
348
|
type: "button",
|
|
227
349
|
variant: "text gray",
|
|
350
|
+
"aria-label": "Close",
|
|
228
351
|
onClick: function onClick() {
|
|
229
352
|
return setOpen(false);
|
|
230
353
|
}
|
|
231
|
-
}, /*#__PURE__*/_react.default.createElement(_Icons.CancelCrossIcon, null)))), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.ContentDivider, null), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.Content, null, /*#__PURE__*/_react.default.createElement(StyledBody, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
232
|
-
className: "lc-
|
|
233
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
354
|
+
}, /*#__PURE__*/_react.default.createElement(_Icons.CancelCrossIcon, null)))), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.ContentDivider, null), /*#__PURE__*/_react.default.createElement(_Dialog.Dialog.Content, null, /*#__PURE__*/_react.default.createElement(StyledBody, null, guideLoading ? /*#__PURE__*/_react.default.createElement("div", {
|
|
355
|
+
className: "lc-skeleton"
|
|
356
|
+
}, /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
|
|
357
|
+
className: "lc-skel lc-skel-line lc-skel-2-3"
|
|
358
|
+
}), /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
|
|
359
|
+
className: "lc-skel lc-skel-block"
|
|
360
|
+
}), /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
|
|
361
|
+
className: "lc-skel lc-skel-block"
|
|
362
|
+
}), /*#__PURE__*/_react.default.createElement(_Loaders.SkeletonLoader, {
|
|
363
|
+
className: "lc-skel lc-skel-line lc-skel-1-2"
|
|
364
|
+
})) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Typography.Body2, null, "Keep a task in sync with your code without leaving your editor."), /*#__PURE__*/_react.default.createElement("div", {
|
|
365
|
+
className: "lc-leads"
|
|
366
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
234
367
|
className: "lc-lead"
|
|
235
368
|
}, /*#__PURE__*/_react.default.createElement(_Icons.HashIcon, null), /*#__PURE__*/_react.default.createElement(_Typography.Body2, {
|
|
236
369
|
color: "secondary"
|
|
@@ -250,9 +383,9 @@ var LinkingCommandsButton = exports.LinkingCommandsButton = function LinkingComm
|
|
|
250
383
|
return setTab(ids[0]);
|
|
251
384
|
}
|
|
252
385
|
}), tab === "linking" ? /*#__PURE__*/_react.default.createElement(LinkingTab, {
|
|
253
|
-
|
|
386
|
+
branchLoading: branchLoading,
|
|
254
387
|
branch: suggestedBranch
|
|
255
|
-
}) : /*#__PURE__*/_react.default.createElement(CommandsTab, null)))));
|
|
388
|
+
}) : /*#__PURE__*/_react.default.createElement(CommandsTab, null))))));
|
|
256
389
|
};
|
|
257
390
|
LinkingCommandsButton.displayName = "LinkingCommandsButton";
|
|
258
391
|
//# sourceMappingURL=LinkingCommandsButton.js.map
|