@industry-theme/github-panels 0.1.54 → 0.1.55

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.
@@ -130,7 +130,7 @@ const createLucideIcon = (iconName, iconNode) => {
130
130
  * This source code is licensed under the ISC license.
131
131
  * See the LICENSE file in the root directory of this source tree.
132
132
  */
133
- const __iconNode$F = [
133
+ const __iconNode$G = [
134
134
  ["path", { d: "M12 7v14", key: "1akyts" }],
135
135
  [
136
136
  "path",
@@ -140,14 +140,14 @@ const __iconNode$F = [
140
140
  }
141
141
  ]
142
142
  ];
143
- const BookOpen = createLucideIcon("book-open", __iconNode$F);
143
+ const BookOpen = createLucideIcon("book-open", __iconNode$G);
144
144
  /**
145
145
  * @license lucide-react v0.552.0 - ISC
146
146
  *
147
147
  * This source code is licensed under the ISC license.
148
148
  * See the LICENSE file in the root directory of this source tree.
149
149
  */
150
- const __iconNode$E = [
150
+ const __iconNode$F = [
151
151
  ["path", { d: "M10 12h4", key: "a56b0p" }],
152
152
  ["path", { d: "M10 8h4", key: "1sr2af" }],
153
153
  ["path", { d: "M14 21v-3a2 2 0 0 0-4 0v3", key: "1rgiei" }],
@@ -160,108 +160,108 @@ const __iconNode$E = [
160
160
  ],
161
161
  ["path", { d: "M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16", key: "16ra0t" }]
162
162
  ];
163
- const Building2 = createLucideIcon("building-2", __iconNode$E);
163
+ const Building2 = createLucideIcon("building-2", __iconNode$F);
164
164
  /**
165
165
  * @license lucide-react v0.552.0 - ISC
166
166
  *
167
167
  * This source code is licensed under the ISC license.
168
168
  * See the LICENSE file in the root directory of this source tree.
169
169
  */
170
- const __iconNode$D = [
170
+ const __iconNode$E = [
171
171
  ["path", { d: "M8 2v4", key: "1cmpym" }],
172
172
  ["path", { d: "M16 2v4", key: "4m81vk" }],
173
173
  ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
174
174
  ["path", { d: "M3 10h18", key: "8toen8" }]
175
175
  ];
176
- const Calendar = createLucideIcon("calendar", __iconNode$D);
176
+ const Calendar = createLucideIcon("calendar", __iconNode$E);
177
177
  /**
178
178
  * @license lucide-react v0.552.0 - ISC
179
179
  *
180
180
  * This source code is licensed under the ISC license.
181
181
  * See the LICENSE file in the root directory of this source tree.
182
182
  */
183
- const __iconNode$C = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
184
- const Check = createLucideIcon("check", __iconNode$C);
183
+ const __iconNode$D = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
184
+ const Check = createLucideIcon("check", __iconNode$D);
185
185
  /**
186
186
  * @license lucide-react v0.552.0 - ISC
187
187
  *
188
188
  * This source code is licensed under the ISC license.
189
189
  * See the LICENSE file in the root directory of this source tree.
190
190
  */
191
- const __iconNode$B = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
192
- const ChevronDown = createLucideIcon("chevron-down", __iconNode$B);
191
+ const __iconNode$C = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
192
+ const ChevronDown = createLucideIcon("chevron-down", __iconNode$C);
193
193
  /**
194
194
  * @license lucide-react v0.552.0 - ISC
195
195
  *
196
196
  * This source code is licensed under the ISC license.
197
197
  * See the LICENSE file in the root directory of this source tree.
198
198
  */
199
- const __iconNode$A = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
200
- const ChevronRight = createLucideIcon("chevron-right", __iconNode$A);
199
+ const __iconNode$B = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
200
+ const ChevronRight = createLucideIcon("chevron-right", __iconNode$B);
201
201
  /**
202
202
  * @license lucide-react v0.552.0 - ISC
203
203
  *
204
204
  * This source code is licensed under the ISC license.
205
205
  * See the LICENSE file in the root directory of this source tree.
206
206
  */
207
- const __iconNode$z = [
207
+ const __iconNode$A = [
208
208
  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
209
209
  ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
210
210
  ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
211
211
  ];
212
- const CircleAlert = createLucideIcon("circle-alert", __iconNode$z);
212
+ const CircleAlert = createLucideIcon("circle-alert", __iconNode$A);
213
213
  /**
214
214
  * @license lucide-react v0.552.0 - ISC
215
215
  *
216
216
  * This source code is licensed under the ISC license.
217
217
  * See the LICENSE file in the root directory of this source tree.
218
218
  */
219
- const __iconNode$y = [
219
+ const __iconNode$z = [
220
220
  ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
221
221
  ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
222
222
  ];
223
- const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$y);
223
+ const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$z);
224
224
  /**
225
225
  * @license lucide-react v0.552.0 - ISC
226
226
  *
227
227
  * This source code is licensed under the ISC license.
228
228
  * See the LICENSE file in the root directory of this source tree.
229
229
  */
230
- const __iconNode$x = [
230
+ const __iconNode$y = [
231
231
  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
232
232
  ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }]
233
233
  ];
234
- const CircleDot = createLucideIcon("circle-dot", __iconNode$x);
234
+ const CircleDot = createLucideIcon("circle-dot", __iconNode$y);
235
235
  /**
236
236
  * @license lucide-react v0.552.0 - ISC
237
237
  *
238
238
  * This source code is licensed under the ISC license.
239
239
  * See the LICENSE file in the root directory of this source tree.
240
240
  */
241
- const __iconNode$w = [
241
+ const __iconNode$x = [
242
242
  ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
243
243
  ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
244
244
  ];
245
- const Copy = createLucideIcon("copy", __iconNode$w);
245
+ const Copy = createLucideIcon("copy", __iconNode$x);
246
246
  /**
247
247
  * @license lucide-react v0.552.0 - ISC
248
248
  *
249
249
  * This source code is licensed under the ISC license.
250
250
  * See the LICENSE file in the root directory of this source tree.
251
251
  */
252
- const __iconNode$v = [
252
+ const __iconNode$w = [
253
253
  ["path", { d: "M12 15V3", key: "m9g1x1" }],
254
254
  ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4", key: "ih7n3h" }],
255
255
  ["path", { d: "m7 10 5 5 5-5", key: "brsn70" }]
256
256
  ];
257
- const Download = createLucideIcon("download", __iconNode$v);
257
+ const Download = createLucideIcon("download", __iconNode$w);
258
258
  /**
259
259
  * @license lucide-react v0.552.0 - ISC
260
260
  *
261
261
  * This source code is licensed under the ISC license.
262
262
  * See the LICENSE file in the root directory of this source tree.
263
263
  */
264
- const __iconNode$u = [
264
+ const __iconNode$v = [
265
265
  ["path", { d: "m15 15 6 6", key: "1s409w" }],
266
266
  ["path", { d: "m15 9 6-6", key: "ko1vev" }],
267
267
  ["path", { d: "M21 16v5h-5", key: "1ck2sf" }],
@@ -271,19 +271,44 @@ const __iconNode$u = [
271
271
  ["path", { d: "M3 8V3h5", key: "1ln10m" }],
272
272
  ["path", { d: "M9 9 3 3", key: "v551iv" }]
273
273
  ];
274
- const Expand = createLucideIcon("expand", __iconNode$u);
274
+ const Expand = createLucideIcon("expand", __iconNode$v);
275
275
  /**
276
276
  * @license lucide-react v0.552.0 - ISC
277
277
  *
278
278
  * This source code is licensed under the ISC license.
279
279
  * See the LICENSE file in the root directory of this source tree.
280
280
  */
281
- const __iconNode$t = [
281
+ const __iconNode$u = [
282
282
  ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
283
283
  ["path", { d: "M10 14 21 3", key: "gplh6r" }],
284
284
  ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6", key: "a6xqqp" }]
285
285
  ];
286
- const ExternalLink = createLucideIcon("external-link", __iconNode$t);
286
+ const ExternalLink = createLucideIcon("external-link", __iconNode$u);
287
+ /**
288
+ * @license lucide-react v0.552.0 - ISC
289
+ *
290
+ * This source code is licensed under the ISC license.
291
+ * See the LICENSE file in the root directory of this source tree.
292
+ */
293
+ const __iconNode$t = [
294
+ [
295
+ "path",
296
+ {
297
+ d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
298
+ key: "ct8e1f"
299
+ }
300
+ ],
301
+ ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
302
+ [
303
+ "path",
304
+ {
305
+ d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
306
+ key: "13bj9a"
307
+ }
308
+ ],
309
+ ["path", { d: "m2 2 20 20", key: "1ooewy" }]
310
+ ];
311
+ const EyeOff = createLucideIcon("eye-off", __iconNode$t);
287
312
  /**
288
313
  * @license lucide-react v0.552.0 - ISC
289
314
  *
@@ -50087,6 +50112,26 @@ const GitHubIssueDetailPanelMetadata = {
50087
50112
  slices: [],
50088
50113
  surfaces: ["panel"]
50089
50114
  };
50115
+ const REACTION_EMOJI = {
50116
+ "+1": "👍",
50117
+ "-1": "👎",
50118
+ "laugh": "😄",
50119
+ "hooray": "🎉",
50120
+ "confused": "😕",
50121
+ "heart": "❤️",
50122
+ "rocket": "🚀",
50123
+ "eyes": "👀"
50124
+ };
50125
+ const REACTION_ORDER = [
50126
+ "+1",
50127
+ "heart",
50128
+ "hooray",
50129
+ "rocket",
50130
+ "eyes",
50131
+ "laugh",
50132
+ "confused",
50133
+ "-1"
50134
+ ];
50090
50135
  const formatDate = (dateString) => {
50091
50136
  const date = new Date(dateString);
50092
50137
  const now = /* @__PURE__ */ new Date();
@@ -50111,6 +50156,12 @@ const formatDate = (dateString) => {
50111
50156
  return `${years}y ago`;
50112
50157
  };
50113
50158
  const formatSha = (sha) => sha.substring(0, 7);
50159
+ const getEventTimestamp = (event) => {
50160
+ if ("created_at" in event) return event.created_at;
50161
+ if ("submitted_at" in event) return event.submitted_at;
50162
+ if ("committer" in event) return event.committer.date;
50163
+ return "";
50164
+ };
50114
50165
  const Avatar = ({ user, size = 32 }) => {
50115
50166
  const { theme: theme2 } = useTheme();
50116
50167
  return /* @__PURE__ */ jsx(
@@ -50127,57 +50178,148 @@ const Avatar = ({ user, size = 32 }) => {
50127
50178
  }
50128
50179
  );
50129
50180
  };
50130
- const ReactionsDisplay = ({ reactions }) => {
50181
+ const ReactionBar = ({ reactions, onToggleReaction, disabled }) => {
50131
50182
  const { theme: theme2 } = useTheme();
50132
- if (reactions.total_count === 0) return null;
50133
- const reactionEmojis = {
50134
- "+1": "👍",
50135
- "-1": "👎",
50136
- laugh: "😄",
50137
- hooray: "🎉",
50138
- confused: "😕",
50139
- heart: "❤️",
50140
- rocket: "🚀",
50141
- eyes: "👀"
50142
- };
50143
- const reactionCounts = {
50144
- "+1": reactions["+1"],
50145
- "-1": reactions["-1"],
50146
- laugh: reactions.laugh,
50147
- hooray: reactions.hooray,
50148
- confused: reactions.confused,
50149
- heart: reactions.heart,
50150
- rocket: reactions.rocket,
50151
- eyes: reactions.eyes
50152
- };
50153
- const activeReactions = Object.entries(reactionEmojis).filter(([key]) => reactionCounts[key] > 0).map(([key, emoji]) => ({
50154
- emoji,
50155
- count: reactionCounts[key]
50156
- }));
50157
- return /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "8px", marginTop: "8px" }, children: activeReactions.map(({ emoji, count }) => /* @__PURE__ */ jsxs(
50158
- "span",
50159
- {
50160
- style: {
50161
- display: "inline-flex",
50162
- alignItems: "center",
50163
- gap: "4px",
50164
- padding: "2px 8px",
50165
- borderRadius: "12px",
50166
- backgroundColor: theme2.colors.backgroundSecondary,
50167
- border: `1px solid ${theme2.colors.border}`,
50168
- fontSize: theme2.fontSizes[0]
50183
+ const [showPicker, setShowPicker] = useState(false);
50184
+ const sortedReactions = REACTION_ORDER.filter((type) => reactions[type] > 0).map((type) => {
50185
+ var _a, _b;
50186
+ return {
50187
+ type,
50188
+ count: reactions[type],
50189
+ viewerReacted: !!((_a = reactions.viewerReactions) == null ? void 0 : _a[type]),
50190
+ reactionId: (_b = reactions.viewerReactions) == null ? void 0 : _b[type]
50191
+ };
50192
+ });
50193
+ const handleReactionClick = (type, reactionId) => {
50194
+ if (disabled || !onToggleReaction) return;
50195
+ onToggleReaction(type, reactionId);
50196
+ };
50197
+ const handlePickerSelect = (type) => {
50198
+ var _a;
50199
+ setShowPicker(false);
50200
+ if (disabled || !onToggleReaction) return;
50201
+ const reactionId = (_a = reactions.viewerReactions) == null ? void 0 : _a[type];
50202
+ onToggleReaction(type, reactionId);
50203
+ };
50204
+ return /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", marginTop: "8px", flexWrap: "wrap", position: "relative" }, children: [
50205
+ sortedReactions.map(({ type, count, viewerReacted, reactionId }) => /* @__PURE__ */ jsxs(
50206
+ "button",
50207
+ {
50208
+ type: "button",
50209
+ onClick: (e) => {
50210
+ e.stopPropagation();
50211
+ handleReactionClick(type, reactionId);
50212
+ },
50213
+ disabled,
50214
+ style: {
50215
+ display: "inline-flex",
50216
+ alignItems: "center",
50217
+ gap: "4px",
50218
+ padding: "2px 8px",
50219
+ borderRadius: "12px",
50220
+ backgroundColor: viewerReacted ? `${theme2.colors.primary}20` : theme2.colors.backgroundSecondary,
50221
+ border: `1px solid ${viewerReacted ? theme2.colors.primary : theme2.colors.border}`,
50222
+ fontSize: theme2.fontSizes[0],
50223
+ cursor: disabled ? "default" : "pointer",
50224
+ opacity: disabled ? 0.5 : 1,
50225
+ transition: "all 0.2s"
50226
+ },
50227
+ title: viewerReacted ? "Remove reaction" : "Add reaction",
50228
+ children: [
50229
+ /* @__PURE__ */ jsx("span", { children: REACTION_EMOJI[type] }),
50230
+ /* @__PURE__ */ jsx("span", { style: { fontFamily: theme2.fonts.body, color: viewerReacted ? theme2.colors.primary : theme2.colors.textSecondary }, children: count })
50231
+ ]
50169
50232
  },
50170
- children: [
50171
- /* @__PURE__ */ jsx("span", { children: emoji }),
50172
- /* @__PURE__ */ jsx("span", { style: { fontFamily: theme2.fonts.body, color: theme2.colors.textSecondary }, children: count })
50173
- ]
50174
- },
50175
- emoji
50176
- )) });
50233
+ type
50234
+ )),
50235
+ onToggleReaction && /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
50236
+ /* @__PURE__ */ jsx(
50237
+ "button",
50238
+ {
50239
+ type: "button",
50240
+ onClick: (e) => {
50241
+ e.stopPropagation();
50242
+ setShowPicker(!showPicker);
50243
+ },
50244
+ disabled,
50245
+ style: {
50246
+ display: "inline-flex",
50247
+ alignItems: "center",
50248
+ justifyContent: "center",
50249
+ width: "24px",
50250
+ height: "24px",
50251
+ borderRadius: "12px",
50252
+ backgroundColor: theme2.colors.backgroundSecondary,
50253
+ border: `1px solid ${theme2.colors.border}`,
50254
+ fontSize: theme2.fontSizes[1],
50255
+ color: theme2.colors.textMuted,
50256
+ cursor: disabled ? "default" : "pointer",
50257
+ opacity: disabled ? 0.5 : 1,
50258
+ transition: "all 0.2s"
50259
+ },
50260
+ title: "Add reaction",
50261
+ children: "+"
50262
+ }
50263
+ ),
50264
+ showPicker && /* @__PURE__ */ jsx(
50265
+ "div",
50266
+ {
50267
+ style: {
50268
+ position: "absolute",
50269
+ bottom: "100%",
50270
+ left: 0,
50271
+ marginBottom: "4px",
50272
+ padding: "4px",
50273
+ borderRadius: "8px",
50274
+ backgroundColor: theme2.colors.background,
50275
+ border: `1px solid ${theme2.colors.border}`,
50276
+ boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
50277
+ display: "flex",
50278
+ gap: "2px",
50279
+ zIndex: 1e3
50280
+ },
50281
+ onClick: (e) => e.stopPropagation(),
50282
+ children: REACTION_ORDER.map((type) => {
50283
+ var _a;
50284
+ const viewerReacted = !!((_a = reactions.viewerReactions) == null ? void 0 : _a[type]);
50285
+ return /* @__PURE__ */ jsx(
50286
+ "button",
50287
+ {
50288
+ type: "button",
50289
+ onClick: (e) => {
50290
+ e.stopPropagation();
50291
+ handlePickerSelect(type);
50292
+ },
50293
+ style: {
50294
+ padding: "4px",
50295
+ borderRadius: "4px",
50296
+ backgroundColor: viewerReacted ? `${theme2.colors.primary}20` : "transparent",
50297
+ border: "none",
50298
+ cursor: "pointer",
50299
+ fontSize: "16px",
50300
+ transition: "transform 0.2s"
50301
+ },
50302
+ title: type,
50303
+ onMouseEnter: (e) => {
50304
+ e.currentTarget.style.transform = "scale(1.25)";
50305
+ },
50306
+ onMouseLeave: (e) => {
50307
+ e.currentTarget.style.transform = "scale(1)";
50308
+ },
50309
+ children: REACTION_EMOJI[type]
50310
+ },
50311
+ type
50312
+ );
50313
+ })
50314
+ }
50315
+ )
50316
+ ] })
50317
+ ] });
50177
50318
  };
50178
- const CommentEvent = ({ event }) => {
50319
+ const CommentEvent = ({ event, onToggleReaction, getMergedReactions }) => {
50179
50320
  const { theme: theme2 } = useTheme();
50180
50321
  const user = event.user || event.actor;
50322
+ const mergedReactions = getMergedReactions ? getMergedReactions(event.id, "comment", event.reactions) : event.reactions;
50181
50323
  return /* @__PURE__ */ jsxs(
50182
50324
  "div",
50183
50325
  {
@@ -50265,7 +50407,13 @@ const CommentEvent = ({ event }) => {
50265
50407
  )
50266
50408
  }
50267
50409
  ),
50268
- event.reactions && /* @__PURE__ */ jsx(ReactionsDisplay, { reactions: event.reactions })
50410
+ mergedReactions && /* @__PURE__ */ jsx(
50411
+ ReactionBar,
50412
+ {
50413
+ reactions: mergedReactions,
50414
+ onToggleReaction: onToggleReaction ? (type, reactionId) => onToggleReaction(event.id, "comment", type, reactionId) : void 0
50415
+ }
50416
+ )
50269
50417
  ] })
50270
50418
  ]
50271
50419
  }
@@ -50398,7 +50546,7 @@ const CommitEvent = ({ event }) => {
50398
50546
  gap: "12px",
50399
50547
  padding: "12px 16px",
50400
50548
  borderBottom: `1px solid ${theme2.colors.border}`,
50401
- backgroundColor: theme2.colors.background
50549
+ backgroundColor: theme2.colors.backgroundSecondary
50402
50550
  },
50403
50551
  children: [
50404
50552
  /* @__PURE__ */ jsx(
@@ -50683,8 +50831,9 @@ const RefEvent = ({ event }) => {
50683
50831
  }
50684
50832
  );
50685
50833
  };
50686
- const InlineReviewComment = ({ comment: comment2 }) => {
50834
+ const InlineReviewComment = ({ comment: comment2, onToggleReaction, getMergedReactions }) => {
50687
50835
  const { theme: theme2 } = useTheme();
50836
+ const mergedReactions = getMergedReactions ? getMergedReactions(comment2.id, "review_comment", comment2.reactions) : comment2.reactions;
50688
50837
  return /* @__PURE__ */ jsxs(
50689
50838
  "div",
50690
50839
  {
@@ -50752,24 +50901,6 @@ const InlineReviewComment = ({ comment: comment2 }) => {
50752
50901
  ]
50753
50902
  }
50754
50903
  ),
50755
- comment2.diff_hunk && /* @__PURE__ */ jsx(
50756
- "pre",
50757
- {
50758
- style: {
50759
- margin: "0 0 8px 0",
50760
- padding: "8px",
50761
- backgroundColor: theme2.colors.background,
50762
- border: `1px solid ${theme2.colors.border}`,
50763
- borderRadius: "6px",
50764
- fontFamily: theme2.fonts.monospace,
50765
- fontSize: "11px",
50766
- color: theme2.colors.textSecondary,
50767
- overflow: "auto",
50768
- maxHeight: "100px"
50769
- },
50770
- children: comment2.diff_hunk
50771
- }
50772
- ),
50773
50904
  /* @__PURE__ */ jsx(
50774
50905
  "div",
50775
50906
  {
@@ -50777,7 +50908,8 @@ const InlineReviewComment = ({ comment: comment2 }) => {
50777
50908
  backgroundColor: theme2.colors.background,
50778
50909
  border: `1px solid ${theme2.colors.border}`,
50779
50910
  borderRadius: "6px",
50780
- overflow: "hidden"
50911
+ overflow: "hidden",
50912
+ marginBottom: comment2.diff_hunk ? "8px" : 0
50781
50913
  },
50782
50914
  children: /* @__PURE__ */ jsx(
50783
50915
  DocumentView,
@@ -50790,16 +50922,47 @@ const InlineReviewComment = ({ comment: comment2 }) => {
50790
50922
  )
50791
50923
  }
50792
50924
  ),
50793
- comment2.reactions && /* @__PURE__ */ jsx(ReactionsDisplay, { reactions: comment2.reactions })
50925
+ comment2.diff_hunk && /* @__PURE__ */ jsx(
50926
+ "pre",
50927
+ {
50928
+ style: {
50929
+ margin: 0,
50930
+ padding: "8px",
50931
+ backgroundColor: theme2.colors.background,
50932
+ border: `1px solid ${theme2.colors.border}`,
50933
+ borderRadius: "6px",
50934
+ fontFamily: theme2.fonts.monospace,
50935
+ fontSize: "11px",
50936
+ color: theme2.colors.textSecondary,
50937
+ overflow: "auto",
50938
+ maxHeight: "100px"
50939
+ },
50940
+ children: comment2.diff_hunk
50941
+ }
50942
+ ),
50943
+ mergedReactions && /* @__PURE__ */ jsx(
50944
+ ReactionBar,
50945
+ {
50946
+ reactions: mergedReactions,
50947
+ onToggleReaction: onToggleReaction ? (type, reactionId) => onToggleReaction(comment2.id, "review_comment", type, reactionId) : void 0
50948
+ }
50949
+ )
50794
50950
  ] })
50795
50951
  ]
50796
50952
  }
50797
50953
  );
50798
50954
  };
50799
- const TimelineEventRenderer = ({ event }) => {
50955
+ const TimelineEventRenderer = ({ event, onToggleReaction, getMergedReactions }) => {
50800
50956
  switch (event.event) {
50801
50957
  case "commented":
50802
- return /* @__PURE__ */ jsx(CommentEvent, { event });
50958
+ return /* @__PURE__ */ jsx(
50959
+ CommentEvent,
50960
+ {
50961
+ event,
50962
+ onToggleReaction,
50963
+ getMergedReactions
50964
+ }
50965
+ );
50803
50966
  case "reviewed":
50804
50967
  return /* @__PURE__ */ jsx(ReviewEvent, { event });
50805
50968
  case "committed":
@@ -50829,6 +50992,146 @@ const TimelineEventRenderer = ({ event }) => {
50829
50992
  const GitHubMessagesPanelContent = ({ context, events }) => {
50830
50993
  const { theme: theme2 } = useTheme();
50831
50994
  const panelRef = useRef(null);
50995
+ const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
50996
+ const [localReactions, setLocalReactions] = useState({});
50997
+ const [hiddenMessages, setHiddenMessages] = useState(() => {
50998
+ if (typeof window !== "undefined") {
50999
+ const stored = localStorage.getItem("github-messages-hidden");
51000
+ return stored ? new Set(JSON.parse(stored)) : /* @__PURE__ */ new Set();
51001
+ }
51002
+ return /* @__PURE__ */ new Set();
51003
+ });
51004
+ const [showHiddenMessages, setShowHiddenMessages] = useState(false);
51005
+ const handleDelete2 = () => {
51006
+ const messagesSlice2 = context.getSlice("github-messages");
51007
+ const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
51008
+ if ((messagesData2 == null ? void 0 : messagesData2.target) && events) {
51009
+ const { target: target2, owner, repo } = messagesData2;
51010
+ events.emit({
51011
+ type: target2.type === "pull_request" ? "github-pr:delete" : "github-issue:delete",
51012
+ source: "github-messages-panel",
51013
+ timestamp: Date.now(),
51014
+ payload: {
51015
+ owner,
51016
+ repo,
51017
+ number: target2.number
51018
+ }
51019
+ });
51020
+ }
51021
+ setShowDeleteConfirm(false);
51022
+ };
51023
+ const handleToggleReaction = useCallback((itemId, itemType, reactionType, currentReactionId) => {
51024
+ const messagesSlice2 = context.getSlice("github-messages");
51025
+ const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
51026
+ if (!(messagesData2 == null ? void 0 : messagesData2.target) || !events) return;
51027
+ const { owner, repo, target: target2 } = messagesData2;
51028
+ const key = `${itemType}-${itemId}`;
51029
+ setLocalReactions((prev) => {
51030
+ const current = prev[key] || {
51031
+ url: "",
51032
+ total_count: 0,
51033
+ "+1": 0,
51034
+ "-1": 0,
51035
+ laugh: 0,
51036
+ hooray: 0,
51037
+ confused: 0,
51038
+ heart: 0,
51039
+ rocket: 0,
51040
+ eyes: 0,
51041
+ viewerReactions: {}
51042
+ };
51043
+ const updated = { ...current };
51044
+ const viewerReactions = { ...updated.viewerReactions };
51045
+ if (currentReactionId) {
51046
+ updated[reactionType] = Math.max(0, (updated[reactionType] || 0) - 1);
51047
+ updated.total_count = Math.max(0, updated.total_count - 1);
51048
+ delete viewerReactions[reactionType];
51049
+ } else {
51050
+ updated[reactionType] = (updated[reactionType] || 0) + 1;
51051
+ updated.total_count = (updated.total_count || 0) + 1;
51052
+ viewerReactions[reactionType] = -1;
51053
+ }
51054
+ updated.viewerReactions = viewerReactions;
51055
+ return { ...prev, [key]: updated };
51056
+ });
51057
+ if (currentReactionId) {
51058
+ events.emit({
51059
+ type: "github-messages:reaction:remove",
51060
+ source: "github-messages-panel",
51061
+ timestamp: Date.now(),
51062
+ payload: {
51063
+ owner,
51064
+ repo,
51065
+ targetType: target2.type,
51066
+ targetNumber: target2.number,
51067
+ itemType,
51068
+ itemId,
51069
+ reactionId: currentReactionId
51070
+ }
51071
+ });
51072
+ } else {
51073
+ events.emit({
51074
+ type: "github-messages:reaction:add",
51075
+ source: "github-messages-panel",
51076
+ timestamp: Date.now(),
51077
+ payload: {
51078
+ owner,
51079
+ repo,
51080
+ targetType: target2.type,
51081
+ targetNumber: target2.number,
51082
+ itemType,
51083
+ itemId,
51084
+ reactionType
51085
+ }
51086
+ });
51087
+ setHiddenMessages((prev) => {
51088
+ const next2 = new Set(prev);
51089
+ next2.add(key);
51090
+ if (typeof window !== "undefined") {
51091
+ localStorage.setItem("github-messages-hidden", JSON.stringify([...next2]));
51092
+ }
51093
+ return next2;
51094
+ });
51095
+ }
51096
+ }, [context, events]);
51097
+ const getMergedReactions = useCallback((itemId, itemType, apiReactions) => {
51098
+ const key = `${itemType}-${itemId}`;
51099
+ const local = localReactions[key];
51100
+ if (!apiReactions && !local) {
51101
+ return {
51102
+ url: "",
51103
+ total_count: 0,
51104
+ "+1": 0,
51105
+ "-1": 0,
51106
+ laugh: 0,
51107
+ hooray: 0,
51108
+ confused: 0,
51109
+ heart: 0,
51110
+ rocket: 0,
51111
+ eyes: 0,
51112
+ viewerReactions: {}
51113
+ };
51114
+ }
51115
+ if (local) {
51116
+ return local;
51117
+ }
51118
+ return {
51119
+ ...apiReactions,
51120
+ viewerReactions: {}
51121
+ };
51122
+ }, [localReactions]);
51123
+ const getMergedTimeline = useCallback((timeline2, reviewComments2) => {
51124
+ const merged = [
51125
+ ...timeline2.map((event) => ({ type: "event", data: event })),
51126
+ ...reviewComments2.map((comment2) => ({ type: "review_comment", data: comment2 }))
51127
+ ];
51128
+ merged.sort((a, b) => {
51129
+ const timeA = a.type === "event" ? getEventTimestamp(a.data) : a.data.created_at;
51130
+ const timeB = b.type === "event" ? getEventTimestamp(b.data) : b.data.created_at;
51131
+ return new Date(timeA).getTime() - new Date(timeB).getTime();
51132
+ });
51133
+ return merged;
51134
+ }, []);
50832
51135
  gt(
50833
51136
  "github-messages",
50834
51137
  events,
@@ -50976,30 +51279,150 @@ const GitHubMessagesPanelContent = ({ context, events }) => {
50976
51279
  "div",
50977
51280
  {
50978
51281
  style: {
50979
- height: "40px",
50980
51282
  minHeight: "40px",
50981
- padding: "0 12px",
51283
+ padding: "8px 12px",
50982
51284
  borderBottom: `1px solid ${theme2.colors.border}`,
50983
51285
  backgroundColor: theme2.colors.backgroundSecondary,
50984
51286
  display: "flex",
50985
51287
  alignItems: "center",
50986
- gap: "12px",
50987
- boxSizing: "border-box"
51288
+ gap: "8px",
51289
+ boxSizing: "border-box",
51290
+ flexWrap: "wrap"
50988
51291
  },
50989
51292
  children: [
51293
+ target.labels && target.labels.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px", alignItems: "center", flexWrap: "wrap" }, children: [
51294
+ /* @__PURE__ */ jsx(
51295
+ "span",
51296
+ {
51297
+ style: {
51298
+ fontFamily: theme2.fonts.body,
51299
+ fontSize: theme2.fontSizes[0],
51300
+ color: theme2.colors.textMuted,
51301
+ fontWeight: 500
51302
+ },
51303
+ children: "Tagged as"
51304
+ }
51305
+ ),
51306
+ target.labels.map((label) => /* @__PURE__ */ jsx(
51307
+ "span",
51308
+ {
51309
+ style: {
51310
+ padding: "2px 8px",
51311
+ borderRadius: "12px",
51312
+ backgroundColor: `#${label.color}`,
51313
+ color: parseInt(label.color, 16) > 8388607 ? "#000" : "#fff",
51314
+ fontFamily: theme2.fonts.body,
51315
+ fontSize: theme2.fontSizes[0],
51316
+ fontWeight: 500
51317
+ },
51318
+ children: label.name
51319
+ },
51320
+ label.id
51321
+ ))
51322
+ ] }),
51323
+ target.assignees && target.assignees.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px", alignItems: "center", flexWrap: "wrap" }, children: [
51324
+ /* @__PURE__ */ jsx(
51325
+ "span",
51326
+ {
51327
+ style: {
51328
+ fontFamily: theme2.fonts.body,
51329
+ fontSize: theme2.fontSizes[0],
51330
+ color: theme2.colors.textMuted,
51331
+ fontWeight: 500
51332
+ },
51333
+ children: "Assigned to"
51334
+ }
51335
+ ),
51336
+ target.assignees.map((assignee) => /* @__PURE__ */ jsxs(
51337
+ "div",
51338
+ {
51339
+ style: {
51340
+ display: "flex",
51341
+ alignItems: "center",
51342
+ gap: "4px",
51343
+ padding: "2px 8px",
51344
+ borderRadius: "12px",
51345
+ backgroundColor: theme2.colors.backgroundSecondary,
51346
+ border: `1px solid ${theme2.colors.border}`
51347
+ },
51348
+ children: [
51349
+ /* @__PURE__ */ jsx(
51350
+ "img",
51351
+ {
51352
+ src: assignee.avatar_url,
51353
+ alt: assignee.login,
51354
+ style: {
51355
+ width: 20,
51356
+ height: 20,
51357
+ borderRadius: "50%"
51358
+ }
51359
+ }
51360
+ ),
51361
+ /* @__PURE__ */ jsx(
51362
+ "span",
51363
+ {
51364
+ style: {
51365
+ fontFamily: theme2.fonts.body,
51366
+ fontSize: theme2.fontSizes[0],
51367
+ color: theme2.colors.text,
51368
+ fontWeight: 500
51369
+ },
51370
+ children: assignee.login
51371
+ }
51372
+ )
51373
+ ]
51374
+ },
51375
+ assignee.login
51376
+ ))
51377
+ ] }),
51378
+ /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
51379
+ hiddenMessages.size > 0 && /* @__PURE__ */ jsxs(
51380
+ "button",
51381
+ {
51382
+ type: "button",
51383
+ onClick: () => setShowHiddenMessages(!showHiddenMessages),
51384
+ title: showHiddenMessages ? "Hide reacted messages" : `Show ${hiddenMessages.size} hidden message${hiddenMessages.size > 1 ? "s" : ""}`,
51385
+ style: {
51386
+ display: "inline-flex",
51387
+ alignItems: "center",
51388
+ justifyContent: "center",
51389
+ gap: "4px",
51390
+ height: "28px",
51391
+ padding: "0 8px",
51392
+ border: `1px solid ${theme2.colors.border}`,
51393
+ borderRadius: "6px",
51394
+ backgroundColor: showHiddenMessages ? `${theme2.colors.primary}20` : theme2.colors.background,
51395
+ color: showHiddenMessages ? theme2.colors.primary : theme2.colors.textSecondary,
51396
+ cursor: "pointer",
51397
+ fontSize: theme2.fontSizes[0],
51398
+ fontFamily: theme2.fonts.body
51399
+ },
51400
+ children: [
51401
+ /* @__PURE__ */ jsx(EyeOff, { size: 14 }),
51402
+ /* @__PURE__ */ jsx("span", { children: hiddenMessages.size })
51403
+ ]
51404
+ }
51405
+ ),
50990
51406
  /* @__PURE__ */ jsx(
50991
- "span",
51407
+ "button",
50992
51408
  {
51409
+ type: "button",
51410
+ onClick: () => setShowDeleteConfirm(true),
51411
+ title: "Delete issue",
50993
51412
  style: {
50994
- flex: 1,
50995
- overflow: "hidden",
50996
- textOverflow: "ellipsis",
50997
- whiteSpace: "nowrap",
50998
- fontFamily: theme2.fonts.heading,
50999
- color: theme2.colors.text,
51000
- fontSize: theme2.fontSizes[1]
51413
+ display: "inline-flex",
51414
+ alignItems: "center",
51415
+ justifyContent: "center",
51416
+ width: "28px",
51417
+ height: "28px",
51418
+ padding: 0,
51419
+ border: `1px solid ${theme2.colors.border}`,
51420
+ borderRadius: "6px",
51421
+ backgroundColor: theme2.colors.background,
51422
+ color: theme2.colors.textSecondary,
51423
+ cursor: "pointer"
51001
51424
  },
51002
- children: target.title
51425
+ children: /* @__PURE__ */ jsx(Trash2, { size: 14 })
51003
51426
  }
51004
51427
  ),
51005
51428
  /* @__PURE__ */ jsx(
@@ -51047,32 +51470,200 @@ const GitHubMessagesPanelContent = ({ context, events }) => {
51047
51470
  },
51048
51471
  children: "No activity yet."
51049
51472
  }
51050
- ) : /* @__PURE__ */ jsxs(Fragment, { children: [
51051
- timeline.map((event, index2) => /* @__PURE__ */ jsx(TimelineEventRenderer, { event }, `${event.event}-${index2}`)),
51052
- reviewComments.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
51053
- /* @__PURE__ */ jsxs(
51054
- "div",
51473
+ ) : /* @__PURE__ */ jsx(Fragment, { children: getMergedTimeline(timeline, reviewComments).filter((item) => {
51474
+ if (item.type === "event") {
51475
+ const event = item.data;
51476
+ if (!showHiddenMessages && event.event === "commented") {
51477
+ const key = `comment-${event.id}`;
51478
+ if (hiddenMessages.has(key)) return false;
51479
+ }
51480
+ if (event.event === "labeled" || event.event === "unlabeled") {
51481
+ return false;
51482
+ }
51483
+ if (event.event === "assigned" || event.event === "unassigned") {
51484
+ return false;
51485
+ }
51486
+ return true;
51487
+ } else {
51488
+ const comment2 = item.data;
51489
+ if (!showHiddenMessages) {
51490
+ const key = `review_comment-${comment2.id}`;
51491
+ if (hiddenMessages.has(key)) return false;
51492
+ }
51493
+ return true;
51494
+ }
51495
+ }).map((item, index2) => {
51496
+ if (item.type === "event") {
51497
+ const event = item.data;
51498
+ return /* @__PURE__ */ jsx(
51499
+ TimelineEventRenderer,
51055
51500
  {
51056
- style: {
51057
- padding: "12px 16px",
51058
- backgroundColor: theme2.colors.backgroundSecondary,
51059
- borderBottom: `1px solid ${theme2.colors.border}`,
51060
- fontFamily: theme2.fonts.heading,
51061
- fontWeight: 600,
51062
- fontSize: theme2.fontSizes[0],
51063
- color: theme2.colors.textSecondary,
51064
- textTransform: "uppercase"
51065
- },
51066
- children: [
51067
- "Inline Review Comments (",
51068
- reviewComments.length,
51069
- ")"
51070
- ]
51071
- }
51072
- ),
51073
- reviewComments.map((comment2) => /* @__PURE__ */ jsx(InlineReviewComment, { comment: comment2 }, comment2.id))
51074
- ] })
51075
- ] })
51501
+ event,
51502
+ onToggleReaction: handleToggleReaction,
51503
+ getMergedReactions
51504
+ },
51505
+ `event-${event.event}-${index2}`
51506
+ );
51507
+ } else {
51508
+ const comment2 = item.data;
51509
+ return /* @__PURE__ */ jsx(
51510
+ InlineReviewComment,
51511
+ {
51512
+ comment: comment2,
51513
+ onToggleReaction: handleToggleReaction,
51514
+ getMergedReactions
51515
+ },
51516
+ `review-comment-${comment2.id}`
51517
+ );
51518
+ }
51519
+ }) })
51520
+ }
51521
+ ),
51522
+ showDeleteConfirm && /* @__PURE__ */ jsx(
51523
+ "div",
51524
+ {
51525
+ style: {
51526
+ position: "absolute",
51527
+ top: 0,
51528
+ left: 0,
51529
+ right: 0,
51530
+ bottom: 0,
51531
+ backgroundColor: "rgba(0, 0, 0, 0.5)",
51532
+ display: "flex",
51533
+ alignItems: "center",
51534
+ justifyContent: "center",
51535
+ zIndex: 1e3
51536
+ },
51537
+ onClick: () => setShowDeleteConfirm(false),
51538
+ children: /* @__PURE__ */ jsxs(
51539
+ "div",
51540
+ {
51541
+ style: {
51542
+ backgroundColor: theme2.colors.background,
51543
+ border: `1px solid ${theme2.colors.border}`,
51544
+ borderRadius: "8px",
51545
+ padding: "24px",
51546
+ minWidth: "320px",
51547
+ maxWidth: "400px",
51548
+ boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)"
51549
+ },
51550
+ onClick: (e) => e.stopPropagation(),
51551
+ children: [
51552
+ /* @__PURE__ */ jsxs(
51553
+ "div",
51554
+ {
51555
+ style: {
51556
+ display: "flex",
51557
+ alignItems: "center",
51558
+ gap: "12px",
51559
+ marginBottom: "16px"
51560
+ },
51561
+ children: [
51562
+ /* @__PURE__ */ jsx(
51563
+ "div",
51564
+ {
51565
+ style: {
51566
+ width: "40px",
51567
+ height: "40px",
51568
+ borderRadius: "50%",
51569
+ backgroundColor: theme2.colors.error ? `${theme2.colors.error}20` : "#ef444420",
51570
+ display: "flex",
51571
+ alignItems: "center",
51572
+ justifyContent: "center",
51573
+ color: theme2.colors.error || "#ef4444"
51574
+ },
51575
+ children: /* @__PURE__ */ jsx(Trash2, { size: 20 })
51576
+ }
51577
+ ),
51578
+ /* @__PURE__ */ jsxs(
51579
+ "h3",
51580
+ {
51581
+ style: {
51582
+ margin: 0,
51583
+ fontFamily: theme2.fonts.heading,
51584
+ fontSize: theme2.fontSizes[2],
51585
+ fontWeight: 600,
51586
+ color: theme2.colors.text
51587
+ },
51588
+ children: [
51589
+ "Delete ",
51590
+ target.type === "pull_request" ? "Pull Request" : "Issue",
51591
+ "?"
51592
+ ]
51593
+ }
51594
+ )
51595
+ ]
51596
+ }
51597
+ ),
51598
+ /* @__PURE__ */ jsxs(
51599
+ "p",
51600
+ {
51601
+ style: {
51602
+ margin: "0 0 24px 0",
51603
+ fontFamily: theme2.fonts.body,
51604
+ fontSize: theme2.fontSizes[1],
51605
+ color: theme2.colors.textSecondary,
51606
+ lineHeight: 1.5
51607
+ },
51608
+ children: [
51609
+ 'Are you sure you want to delete "',
51610
+ target.title,
51611
+ '"? This action cannot be undone.'
51612
+ ]
51613
+ }
51614
+ ),
51615
+ /* @__PURE__ */ jsxs(
51616
+ "div",
51617
+ {
51618
+ style: {
51619
+ display: "flex",
51620
+ gap: "12px",
51621
+ justifyContent: "flex-end"
51622
+ },
51623
+ children: [
51624
+ /* @__PURE__ */ jsx(
51625
+ "button",
51626
+ {
51627
+ type: "button",
51628
+ onClick: () => setShowDeleteConfirm(false),
51629
+ style: {
51630
+ padding: "8px 16px",
51631
+ border: `1px solid ${theme2.colors.border}`,
51632
+ borderRadius: "6px",
51633
+ backgroundColor: theme2.colors.background,
51634
+ color: theme2.colors.text,
51635
+ fontFamily: theme2.fonts.body,
51636
+ fontSize: theme2.fontSizes[1],
51637
+ cursor: "pointer"
51638
+ },
51639
+ children: "Cancel"
51640
+ }
51641
+ ),
51642
+ /* @__PURE__ */ jsx(
51643
+ "button",
51644
+ {
51645
+ type: "button",
51646
+ onClick: handleDelete2,
51647
+ style: {
51648
+ padding: "8px 16px",
51649
+ border: "none",
51650
+ borderRadius: "6px",
51651
+ backgroundColor: theme2.colors.error || "#ef4444",
51652
+ color: "#ffffff",
51653
+ fontFamily: theme2.fonts.body,
51654
+ fontSize: theme2.fontSizes[1],
51655
+ fontWeight: 500,
51656
+ cursor: "pointer"
51657
+ },
51658
+ children: "Delete"
51659
+ }
51660
+ )
51661
+ ]
51662
+ }
51663
+ )
51664
+ ]
51665
+ }
51666
+ )
51076
51667
  }
51077
51668
  )
51078
51669
  ] });