@industry-theme/github-panels 0.1.39 → 0.1.40

package/dist/panels.bundle.js

@@ -130,18 +130,18 @@ const createLucideIcon = (iconName, iconNode) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$v = [
+const __iconNode$u = [
   ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
   ["path", { d: "M19 12H5", key: "x3x0zl" }]
 ];
-const ArrowLeft = createLucideIcon("arrow-left", __iconNode$v);
+const ArrowLeft = createLucideIcon("arrow-left", __iconNode$u);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$u = [
+const __iconNode$t = [
   ["path", { d: "M12 7v14", key: "1akyts" }],
   [
     "path",
@@ -151,14 +151,14 @@ const __iconNode$u = [
     }
   ]
 ];
-const BookOpen = createLucideIcon("book-open", __iconNode$u);
+const BookOpen = createLucideIcon("book-open", __iconNode$t);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$t = [
+const __iconNode$s = [
   ["path", { d: "M10 12h4", key: "a56b0p" }],
   ["path", { d: "M10 8h4", key: "1sr2af" }],
   ["path", { d: "M14 21v-3a2 2 0 0 0-4 0v3", key: "1rgiei" }],
@@ -171,67 +171,56 @@ const __iconNode$t = [
   ],
   ["path", { d: "M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16", key: "16ra0t" }]
 ];
-const Building2 = createLucideIcon("building-2", __iconNode$t);
+const Building2 = createLucideIcon("building-2", __iconNode$s);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$s = [
+const __iconNode$r = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
   ["path", { d: "M3 10h18", key: "8toen8" }]
 ];
-const Calendar = createLucideIcon("calendar", __iconNode$s);
+const Calendar = createLucideIcon("calendar", __iconNode$r);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$r = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$r);
+const __iconNode$q = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$q);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$q = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$q);
+const __iconNode$p = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$p);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$p = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$p);
+const __iconNode$o = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$o);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$o = [
+const __iconNode$n = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$o);
-/**
- * @license lucide-react v0.552.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const __iconNode$n = [
-  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
-  ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
-];
-const CircleCheck = createLucideIcon("circle-check", __iconNode$n);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$n);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -1642,9 +1631,12 @@ const formatDate$1 = (dateString) => {
   if (diffDays === 0) return "Today";
   if (diffDays === 1) return "Yesterday";
   if (diffDays < 7) return `${diffDays} days ago`;
-  if (diffDays < 30) return `${Math.floor(diffDays / 7)} weeks ago`;
-  if (diffDays < 365) return `${Math.floor(diffDays / 30)} months ago`;
-  return `${Math.floor(diffDays / 365)} years ago`;
+  const weeks = Math.floor(diffDays / 7);
+  if (diffDays < 30) return `${weeks} ${weeks === 1 ? "week" : "weeks"} ago`;
+  const months = Math.floor(diffDays / 30);
+  if (diffDays < 365) return `${months} ${months === 1 ? "month" : "months"} ago`;
+  const years = Math.floor(diffDays / 365);
+  return `${years} ${years === 1 ? "year" : "years"} ago`;
 };
 const GitHubIssuesPanelContent = ({
   context,
@@ -1660,9 +1652,6 @@ const GitHubIssuesPanelContent = ({
   const repo = ((_c = issuesSlice == null ? void 0 : issuesSlice.data) == null ? void 0 : _c.repo) ?? "";
   const isAuthenticated = ((_d = issuesSlice == null ? void 0 : issuesSlice.data) == null ? void 0 : _d.isAuthenticated) ?? false;
   const sliceError = (_e = issuesSlice == null ? void 0 : issuesSlice.data) == null ? void 0 : _e.error;
-  const [selectedIssues, setSelectedIssues] = useState(/* @__PURE__ */ new Set());
-  const [copiedPrompt, setCopiedPrompt] = useState(false);
-  const [issueFilter, setIssueFilter] = useState("open");
   useEffect(() => {
     events.emit({
       type: "github-issues:request",
@@ -1671,36 +1660,10 @@ const GitHubIssuesPanelContent = ({
       payload: {}
     });
   }, [events]);
-  const filteredIssues = useMemo(() => {
-    if (issueFilter === "all") return issues;
-    return issues.filter((issue) => issue.state === issueFilter);
-  }, [issues, issueFilter]);
-  const issueCounts = useMemo(() => ({
-    all: issues.length,
-    open: issues.filter((i) => i.state === "open").length,
-    closed: issues.filter((i) => i.state === "closed").length
-  }), [issues]);
-  const handleSelectAll = () => {
-    if (selectedIssues.size === filteredIssues.length) {
-      setSelectedIssues(/* @__PURE__ */ new Set());
-    } else {
-      setSelectedIssues(new Set(filteredIssues.map((i) => i.number)));
-    }
-  };
-  const handleToggleIssue = (issueNumber, event) => {
-    const newSelected = new Set(selectedIssues);
-    if (newSelected.has(issueNumber)) {
-      newSelected.delete(issueNumber);
-    } else {
-      newSelected.add(issueNumber);
-    }
-    setSelectedIssues(newSelected);
-  };
-  const handleIssueClick = (issue, event) => {
-    const target = event.target;
-    if (target.tagName === "INPUT" || target.closest("a")) {
-      return;
-    }
+  const openIssues = useMemo(() => {
+    return issues.filter((issue) => issue.state === "open");
+  }, [issues]);
+  const handleIssueClick = (issue) => {
     events.emit({
       type: "issue:selected",
       source: "github-issues-panel",
@@ -1728,46 +1691,6 @@ const GitHubIssuesPanelContent = ({
       payload: {}
     });
   };
-  const generatePrompt = () => {
-    const selectedIssueData = issues.filter(
-      (i) => selectedIssues.has(i.number)
-    );
-    if (selectedIssueData.length === 0) return "";
-    let prompt = `I'm working on the GitHub repository ${owner}/${repo}. Here are the issues I need help with:
-
-`;
-    selectedIssueData.forEach((issue) => {
-      prompt += `## Issue #${issue.number}: ${issue.title}
-`;
-      prompt += `- Status: ${issue.state}
-`;
-      prompt += `- URL: ${issue.html_url}
-`;
-      if (issue.labels.length > 0) {
-        prompt += `- Labels: ${issue.labels.map((l) => l.name).join(", ")}
-`;
-      }
-      if (issue.body) {
-        prompt += `- Description:
-${issue.body}
-`;
-      }
-      prompt += "\n";
-    });
-    prompt += `Please help me understand and address these issues.`;
-    return prompt;
-  };
-  const handleCopyPrompt = async () => {
-    const prompt = generatePrompt();
-    if (!prompt) return;
-    try {
-      await navigator.clipboard.writeText(prompt);
-      setCopiedPrompt(true);
-      setTimeout(() => setCopiedPrompt(false), 2e3);
-    } catch (err) {
-      console.error("Failed to copy to clipboard:", err);
-    }
-  };
   const renderState = (icon, title, description, action) => /* @__PURE__ */ jsx(
     "div",
     {
@@ -1926,164 +1849,66 @@ ${issue.body}
         fontFamily: theme2.fonts.body
       },
       children: [
-        /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx(
           "div",
           {
             style: {
+              position: "relative",
               height: "40px",
-              minHeight: "40px",
               padding: "0 16px",
-              borderBottom: `1px solid ${theme2.colors.border}`,
-              display: "flex",
-              alignItems: "center",
-              gap: "12px",
-              boxSizing: "border-box"
-            },
-            children: [
-              /* @__PURE__ */ jsx(Github, { size: 20, color: theme2.colors.primary }),
-              /* @__PURE__ */ jsx(
-                "h2",
-                {
-                  style: {
-                    margin: 0,
-                    fontSize: `${theme2.fontSizes[3]}px`,
-                    fontWeight: theme2.fontWeights.semibold,
-                    flex: 1
-                  },
-                  children: "Issues"
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                "span",
-                {
-                  style: {
-                    fontSize: `${theme2.fontSizes[1]}px`,
-                    color: theme2.colors.textSecondary
-                  },
-                  children: [
-                    owner,
-                    "/",
-                    repo
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
               display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              padding: "12px 16px",
+              flexDirection: "column",
+              justifyContent: "center",
               borderBottom: `1px solid ${theme2.colors.border}`,
-              backgroundColor: theme2.colors.backgroundSecondary,
-              flexWrap: "wrap",
-              gap: "8px"
+              backgroundColor: theme2.colors.backgroundLight,
+              boxSizing: "border-box"
             },
-            children: [
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
-                /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "4px" }, children: ["open", "closed", "all"].map((filter) => /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => setIssueFilter(filter),
-                    style: {
-                      padding: "6px 12px",
-                      borderRadius: "6px",
-                      border: issueFilter === filter ? "none" : `1px solid ${theme2.colors.border}`,
-                      backgroundColor: issueFilter === filter ? theme2.colors.primary : theme2.colors.background,
-                      color: issueFilter === filter ? theme2.colors.background : theme2.colors.text,
-                      fontSize: `${theme2.fontSizes[1]}px`,
-                      fontWeight: issueFilter === filter ? theme2.fontWeights.semibold : theme2.fontWeights.body,
-                      cursor: "pointer",
-                      textTransform: "capitalize"
-                    },
-                    children: [
-                      filter === "all" ? "All" : filter === "open" ? "Open" : "Closed",
-                      /* @__PURE__ */ jsxs("span", { style: { marginLeft: "6px", opacity: 0.8 }, children: [
-                        "(",
-                        issueCounts[filter],
-                        ")"
-                      ] })
-                    ]
-                  },
-                  filter
-                )) }),
-                filteredIssues.length > 0 && /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleSelectAll,
-                    style: {
-                      padding: "6px 12px",
-                      borderRadius: "6px",
-                      border: `1px solid ${theme2.colors.border}`,
-                      backgroundColor: theme2.colors.background,
-                      color: theme2.colors.textSecondary,
-                      fontSize: `${theme2.fontSizes[1]}px`,
-                      cursor: "pointer"
-                    },
-                    children: selectedIssues.size === filteredIssues.length ? "Deselect All" : "Select All"
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px" }, children: [
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleRefresh,
-                    disabled: isLoading,
-                    style: {
-                      display: "flex",
-                      alignItems: "center",
-                      gap: "6px",
-                      padding: "6px 12px",
-                      borderRadius: "6px",
-                      border: `1px solid ${theme2.colors.border}`,
-                      backgroundColor: theme2.colors.background,
-                      color: theme2.colors.text,
-                      fontSize: `${theme2.fontSizes[1]}px`,
-                      cursor: isLoading ? "not-allowed" : "pointer",
-                      opacity: isLoading ? 0.5 : 1
-                    },
-                    children: /* @__PURE__ */ jsx(RefreshCw, { size: 14, className: isLoading ? "animate-spin" : "" })
-                  }
-                ),
-                /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleCopyPrompt,
-                    disabled: selectedIssues.size === 0,
-                    style: {
-                      display: "flex",
-                      alignItems: "center",
-                      gap: "6px",
-                      padding: "6px 12px",
-                      borderRadius: "6px",
-                      border: "none",
-                      backgroundColor: selectedIssues.size > 0 ? theme2.colors.primary : theme2.colors.backgroundTertiary,
-                      color: selectedIssues.size > 0 ? theme2.colors.background : theme2.colors.textSecondary,
-                      fontSize: `${theme2.fontSizes[1]}px`,
-                      fontWeight: theme2.fontWeights.semibold,
-                      cursor: selectedIssues.size > 0 ? "pointer" : "not-allowed",
-                      opacity: selectedIssues.size > 0 ? 1 : 0.5
-                    },
-                    children: [
-                      copiedPrompt ? /* @__PURE__ */ jsx(CircleCheck, { size: 14 }) : /* @__PURE__ */ jsx(Copy, { size: 14 }),
-                      copiedPrompt ? "Copied!" : `Copy Prompt (${selectedIssues.size})`
-                    ]
-                  }
-                )
-              ] })
-            ]
+            children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "space-between"
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      style: {
+                        fontFamily: theme2.fonts.body,
+                        fontSize: theme2.fontSizes[1],
+                        color: theme2.colors.textSecondary,
+                        fontWeight: 500
+                      },
+                      children: "Open Issues"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: handleRefresh,
+                      disabled: isLoading,
+                      style: {
+                        background: "none",
+                        border: "none",
+                        cursor: isLoading ? "not-allowed" : "pointer",
+                        padding: "4px",
+                        color: theme2.colors.textSecondary,
+                        opacity: isLoading ? 0.5 : 1,
+                        display: "flex",
+                        alignItems: "center"
+                      },
+                      children: /* @__PURE__ */ jsx(RefreshCw, { size: 14, className: isLoading ? "animate-spin" : "" })
+                    }
+                  )
+                ]
+              }
+            )
           }
         ),
-        /* @__PURE__ */ jsx("div", { style: { flex: 1, overflow: "auto" }, children: filteredIssues.length === 0 ? /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx("div", { style: { flex: 1, overflow: "auto" }, children: openIssues.length === 0 ? /* @__PURE__ */ jsxs(
           "div",
           {
             style: {
@@ -2106,14 +1931,10 @@ ${issue.body}
                       marginBottom: "8px",
                       fontSize: `${theme2.fontSizes[3]}px`
                     },
-                    children: "No Issues Found"
+                    children: "No Open Issues"
                   }
                 ),
-                /* @__PURE__ */ jsxs("p", { style: { margin: 0, fontSize: `${theme2.fontSizes[2]}px` }, children: [
-                  "There are no ",
-                  issueFilter !== "all" ? issueFilter : "",
-                  " issues in this repository."
-                ] })
+                /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: `${theme2.fontSizes[2]}px` }, children: "There are no open issues in this repository." })
               ] })
             ]
           }
@@ -2121,236 +1942,126 @@ ${issue.body}
           "div",
           {
             style: { display: "flex", flexDirection: "column" },
-            children: filteredIssues.map((issue) => /* @__PURE__ */ jsx(
+            children: openIssues.map((issue) => /* @__PURE__ */ jsx(
               "button",
               {
                 type: "button",
-                onClick: (e) => handleIssueClick(issue, e),
+                onClick: () => handleIssueClick(issue),
                 style: {
                   width: "100%",
-                  padding: "8px 12px",
+                  padding: "16px 16px",
                   borderRadius: 0,
                   border: "none",
-                  borderBottom: `1px solid ${selectedIssues.has(issue.number) ? theme2.colors.primary : theme2.colors.border}`,
-                  backgroundColor: selectedIssues.has(issue.number) ? `${theme2.colors.primary}10` : theme2.colors.surface,
+                  borderBottom: `1px solid ${theme2.colors.border}`,
+                  backgroundColor: theme2.colors.surface,
                   cursor: "pointer",
                   textAlign: "left"
                 },
-                children: /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    style: {
-                      display: "flex",
-                      alignItems: "flex-start",
-                      gap: "12px"
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        "input",
-                        {
-                          type: "checkbox",
-                          checked: selectedIssues.has(issue.number),
-                          onChange: () => handleToggleIssue(issue.number),
-                          onClick: (e) => e.stopPropagation(),
-                          style: { marginTop: "2px", cursor: "pointer" }
-                        }
-                      ),
-                      /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-                        /* @__PURE__ */ jsxs(
-                          "div",
+                children: /* @__PURE__ */ jsxs("div", { style: { minWidth: 0 }, children: [
+                  issue.labels.length > 0 && /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      style: {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: "8px",
+                        marginBottom: "6px",
+                        flexWrap: "wrap"
+                      },
+                      children: [
+                        issue.labels.slice(0, 3).map((label) => /* @__PURE__ */ jsxs(
+                          "span",
                           {
                             style: {
-                              display: "flex",
+                              display: "inline-flex",
                               alignItems: "center",
-                              gap: "8px",
-                              marginBottom: "6px",
-                              flexWrap: "wrap"
+                              gap: "4px",
+                              padding: "2px 6px",
+                              borderRadius: "12px",
+                              backgroundColor: `#${label.color}22`,
+                              color: `#${label.color}`,
+                              fontSize: `${theme2.fontSizes[0]}px`,
+                              fontWeight: theme2.fontWeights.medium
                             },
                             children: [
-                              /* @__PURE__ */ jsx(
-                                "span",
-                                {
-                                  style: {
-                                    display: "inline-flex",
-                                    alignItems: "center",
-                                    padding: "2px 8px",
-                                    borderRadius: "12px",
-                                    backgroundColor: issue.state === "open" ? "#22c55e22" : "#6b728022",
-                                    color: issue.state === "open" ? "#22c55e" : "#6b7280",
-                                    fontSize: `${theme2.fontSizes[0]}px`,
-                                    fontWeight: theme2.fontWeights.semibold,
-                                    textTransform: "uppercase"
-                                  },
-                                  children: issue.state
-                                }
-                              ),
-                              /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    color: theme2.colors.textSecondary,
-                                    fontSize: `${theme2.fontSizes[1]}px`
-                                  },
-                                  children: [
-                                    "#",
-                                    issue.number
-                                  ]
-                                }
-                              ),
-                              /* @__PURE__ */ jsx(
-                                "a",
-                                {
-                                  href: issue.html_url,
-                                  target: "_blank",
-                                  rel: "noopener noreferrer",
-                                  onClick: (e) => e.stopPropagation(),
-                                  style: {
-                                    color: theme2.colors.primary,
-                                    textDecoration: "none",
-                                    display: "inline-flex",
-                                    alignItems: "center"
-                                  },
-                                  children: /* @__PURE__ */ jsx(ExternalLink, { size: 12 })
-                                }
-                              )
+                              /* @__PURE__ */ jsx(Tag, { size: 10 }),
+                              label.name
                             ]
-                          }
-                        ),
-                        /* @__PURE__ */ jsx(
-                          "h4",
-                          {
-                            style: {
-                              margin: 0,
-                              marginBottom: "6px",
-                              color: theme2.colors.text,
-                              fontSize: `${theme2.fontSizes[2]}px`,
-                              fontWeight: theme2.fontWeights.semibold,
-                              overflow: "hidden",
-                              textOverflow: "ellipsis",
-                              whiteSpace: "nowrap"
-                            },
-                            children: issue.title
-                          }
-                        ),
-                        issue.labels.length > 0 && /* @__PURE__ */ jsxs(
-                          "div",
+                          },
+                          label.id
+                        )),
+                        issue.labels.length > 3 && /* @__PURE__ */ jsxs(
+                          "span",
                           {
                             style: {
-                              display: "flex",
-                              flexWrap: "wrap",
-                              gap: "4px",
-                              marginBottom: "6px"
+                              fontSize: `${theme2.fontSizes[0]}px`,
+                              color: theme2.colors.textSecondary
                             },
                             children: [
-                              issue.labels.slice(0, 3).map((label) => /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    display: "inline-flex",
-                                    alignItems: "center",
-                                    gap: "4px",
-                                    padding: "2px 6px",
-                                    borderRadius: "12px",
-                                    backgroundColor: `#${label.color}22`,
-                                    color: `#${label.color}`,
-                                    fontSize: `${theme2.fontSizes[0]}px`,
-                                    fontWeight: theme2.fontWeights.medium
-                                  },
-                                  children: [
-                                    /* @__PURE__ */ jsx(Tag, { size: 10 }),
-                                    label.name
-                                  ]
-                                },
-                                label.id
-                              )),
-                              issue.labels.length > 3 && /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    fontSize: `${theme2.fontSizes[0]}px`,
-                                    color: theme2.colors.textSecondary
-                                  },
-                                  children: [
-                                    "+",
-                                    issue.labels.length - 3
-                                  ]
-                                }
-                              )
+                              "+",
+                              issue.labels.length - 3
                             ]
                           }
-                        ),
-                        /* @__PURE__ */ jsxs(
-                          "div",
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "h4",
+                    {
+                      style: {
+                        margin: 0,
+                        marginBottom: "6px",
+                        color: theme2.colors.text,
+                        fontSize: `${theme2.fontSizes[2]}px`,
+                        fontWeight: theme2.fontWeights.semibold,
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                        whiteSpace: "nowrap"
+                      },
+                      children: issue.title
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      style: {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: "6px",
+                        fontSize: `${theme2.fontSizes[0]}px`,
+                        color: theme2.colors.textSecondary,
+                        flexWrap: "wrap"
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxs("span", { children: [
+                          "#",
+                          issue.number
+                        ] }),
+                        /* @__PURE__ */ jsxs("span", { children: [
+                          "Created by",
+                          " ",
+                          /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.primary }, children: issue.user.login })
+                        ] }),
+                        /* @__PURE__ */ jsx("span", { children: formatDate$1(issue.created_at) }),
+                        issue.comments > 0 && /* @__PURE__ */ jsxs(
+                          "span",
                           {
                             style: {
                               display: "flex",
                               alignItems: "center",
-                              gap: "12px",
-                              fontSize: `${theme2.fontSizes[0]}px`,
-                              color: theme2.colors.textSecondary,
-                              flexWrap: "wrap"
+                              gap: "4px"
                             },
                             children: [
-                              /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    display: "flex",
-                                    alignItems: "center",
-                                    gap: "4px"
-                                  },
-                                  children: [
-                                    /* @__PURE__ */ jsx(
-                                      "img",
-                                      {
-                                        src: issue.user.avatar_url,
-                                        alt: issue.user.login,
-                                        style: {
-                                          width: "14px",
-                                          height: "14px",
-                                          borderRadius: "50%"
-                                        }
-                                      }
-                                    ),
-                                    issue.user.login
-                                  ]
-                                }
-                              ),
-                              /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    display: "flex",
-                                    alignItems: "center",
-                                    gap: "4px"
-                                  },
-                                  children: [
-                                    /* @__PURE__ */ jsx(Calendar, { size: 12 }),
-                                    formatDate$1(issue.created_at)
-                                  ]
-                                }
-                              ),
-                              issue.comments > 0 && /* @__PURE__ */ jsxs(
-                                "span",
-                                {
-                                  style: {
-                                    display: "flex",
-                                    alignItems: "center",
-                                    gap: "4px"
-                                  },
-                                  children: [
-                                    /* @__PURE__ */ jsx(MessageSquare, { size: 12 }),
-                                    issue.comments
-                                  ]
-                                }
-                              )
+                              /* @__PURE__ */ jsx(MessageSquare, { size: 12 }),
+                              issue.comments
                             ]
                           }
                         )
-                      ] })
-                    ]
-                  }
-                )
+                      ]
+                    }
+                  )
+                ] })
               },
               issue.id
             ))