clairo 3.1.2 → 3.1.4

package/README.md

@@ -2,7 +2,7 @@
 
 an opinionated dashboard tui for github PRs, jira tickets, and daily logs.
 
-<img width="1728" height="1056" alt="clairo" src="https://private-user-images.githubusercontent.com/89874389/548183415-7bf63805-c7fd-4741-bb44-6f9449ba6de3.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3NzA4MDkyMDAsIm5iZiI6MTc3MDgwODkwMCwicGF0aCI6Ii84OTg3NDM4OS81NDgxODM0MTUtN2JmNjM4MDUtYzdmZC00NzQxLWJiNDQtNmY5NDQ5YmE2ZGUzLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNjAyMTElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjYwMjExVDExMjE0MFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTk1NjZkMWVjMzliZWEyY2FhYjQ0NTBmMjQ0OTI3OWFmYjIwZjQ0ZmE5YzAzZjc5MDdlMGY1ODRjMWY5MWQ4YzEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.Ha4J9yh-xRAYGuDCMbqPgwEtjjY3qvni9dHGhUR-JRI" />
+<img width="1728" height="1056" alt="clairo" src="https://www.zzzzion.com/images/clairo.webp" />
 
 ## features
 
@@ -33,6 +33,7 @@ an opinionated dashboard tui for github PRs, jira tickets, and daily logs.
 
 - Node.js 18+
 - [GitHub CLI](https://cli.github.com/) (`gh`) installed and authenticated
+- A [Nerd Font](https://www.nerdfonts.com/) is highly recommended for proper icon rendering
 
 ## usage
 

package/dist/cli.js

@@ -216,11 +216,11 @@ function resolveReviewDisplay(reviewDecision) {
 }
 function resolveMergeDisplay(pr) {
   if (!pr) return { text: "Unknown", color: "yellow" };
-  if (pr.state === "MERGED") return { text: "Merged", color: "magenta" };
-  if (pr.state === "CLOSED") return { text: "Closed", color: "red" };
-  if (pr.isDraft) return { text: "Draft", color: "yellow" };
-  if (pr.mergeable === "MERGEABLE") return { text: "Open", color: "green" };
-  if (pr.mergeable === "CONFLICTING") return { text: "Conflicts", color: "red" };
+  if (pr.state === "MERGED") return { text: "\uE727 Merged", color: "magenta" };
+  if (pr.state === "CLOSED") return { text: "\uE726 Closed", color: "red" };
+  if (pr.isDraft) return { text: "\uE726 Draft", color: "yellow" };
+  if (pr.mergeable === "MERGEABLE") return { text: "\uE726 Open", color: "green" };
+  if (pr.mergeable === "CONFLICTING") return { text: "\uE726 Conflicts", color: "red" };
   return { text: "Unknown", color: "yellow" };
 }
 async function isGhInstalled() {
@@ -1554,7 +1554,7 @@ ${detail}
 
 // src/components/github/PRDetailsBox.tsx
 import open from "open";
-import { useRef as useRef2 } from "react";
+import React, { useRef as useRef2 } from "react";
 import { Box as Box4, Text as Text4, useInput } from "ink";
 import { ScrollView } from "ink-scroll-view";
 import Spinner from "ink-spinner";
@@ -1701,7 +1701,7 @@ function renderInlineToString(tokens) {
 }
 
 // src/components/ui/TitledBox.tsx
-import { Box as Box3, Spacer, Text as Text3, useStdout } from "ink";
+import { Box as Box3, Text as Text3, useStdout } from "ink";
 import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function TitledBox({
   title,
@@ -1730,7 +1730,7 @@ function TitledBox({
   ] });
   return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", flexGrow: 1, children: [
     topBorder,
-    /* @__PURE__ */ jsxs3(
+    /* @__PURE__ */ jsx4(
       Box3,
       {
         flexDirection: "column",
@@ -1740,13 +1740,10 @@ function TitledBox({
         borderStyle: "round",
         borderTop: false,
         borderColor,
-        children: [
-          children,
-          footer && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-            /* @__PURE__ */ jsx4(Spacer, {}),
-            footer
-          ] })
-        ]
+        children: footer ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
+          /* @__PURE__ */ jsx4(Box3, { flexDirection: "column", flexGrow: 1, flexBasis: 0, overflow: "hidden", children }),
+          footer
+        ] }) : children
       }
     )
   ] });
@@ -1777,6 +1774,83 @@ function PRDetailsBox({ pr, loading, error, isActive, title = "[3] PR Details",
     },
     { isActive }
   );
+  const sections = [];
+  if (pr) {
+    if ((((_a = pr.assignees) == null ? void 0 : _a.length) ?? 0) > 0) {
+      sections.push({
+        key: "assignees",
+        content: /* @__PURE__ */ jsxs4(Box4, { children: [
+          /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Assignees: " }),
+          /* @__PURE__ */ jsx5(Text4, { children: pr.assignees.map((a) => a.login).join(", ") })
+        ] })
+      });
+    }
+    if ((((_b = pr.reviews) == null ? void 0 : _b.length) ?? 0) > 0 || (((_c = pr.reviewRequests) == null ? void 0 : _c.length) ?? 0) > 0) {
+      sections.push({
+        key: "reviews",
+        content: /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", children: [
+          /* @__PURE__ */ jsxs4(Box4, { children: [
+            /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Reviews: " }),
+            /* @__PURE__ */ jsx5(Text4, { color: reviewDisplay.color, children: reviewDisplay.text })
+          ] }),
+          (_d = pr.reviews) == null ? void 0 : _d.map((review, idx) => {
+            const color = review.state === "APPROVED" ? "green" : review.state === "CHANGES_REQUESTED" ? "red" : review.state === "COMMENTED" ? "blue" : "yellow";
+            const icon = review.state === "APPROVED" ? "\uF00C" : review.state === "CHANGES_REQUESTED" ? "\uF00D" : review.state === "COMMENTED" ? "\uF075" : "\uF10C";
+            return /* @__PURE__ */ jsxs4(Text4, { color, children: [
+              "  ",
+              icon,
+              " ",
+              review.author.login
+            ] }, idx);
+          }),
+          (_e = pr.reviewRequests) == null ? void 0 : _e.map((r, idx) => /* @__PURE__ */ jsxs4(Text4, { color: "yellow", children: [
+            "  ",
+            "\u25CB ",
+            r.login ?? r.name ?? r.slug ?? "Team",
+            " ",
+            /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "(pending)" })
+          ] }, `pending-${idx}`))
+        ] })
+      });
+    }
+    if ((((_f = pr.statusCheckRollup) == null ? void 0 : _f.length) ?? 0) > 0) {
+      sections.push({
+        key: "checks",
+        content: /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Checks:" }),
+          Array.from(
+            ((_g = pr.statusCheckRollup) == null ? void 0 : _g.reduce((acc, check) => {
+              const key = check.name ?? check.context ?? "";
+              const existing = acc.get(key);
+              if (!existing || (check.startedAt ?? "") > (existing.startedAt ?? "")) {
+                acc.set(key, check);
+              }
+              return acc;
+            }, /* @__PURE__ */ new Map()).values()) ?? []
+          ).sort((a, b) => CHECK_SORT_ORDER[resolveCheckStatus(a)] - CHECK_SORT_ORDER[resolveCheckStatus(b)]).map((check, idx) => {
+            const jobName = check.name ?? check.context;
+            const displayName = check.workflowName ? `${check.workflowName} / ${jobName}` : jobName;
+            const status = resolveCheckStatus(check);
+            return /* @__PURE__ */ jsxs4(Text4, { color: CHECK_COLORS[status], children: [
+              "  ",
+              CHECK_ICONS[status],
+              " ",
+              displayName
+            ] }, idx);
+          })
+        ] })
+      });
+    }
+    if (pr.body) {
+      sections.push({
+        key: "description",
+        content: /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Description:" }),
+          /* @__PURE__ */ jsx5(Markdown, { children: pr.body })
+        ] })
+      });
+    }
+  }
   return /* @__PURE__ */ jsx5(TitledBox, { title: displayTitle, borderColor, footer, children: /* @__PURE__ */ jsx5(Box4, { flexDirection: "column", flexGrow: 1, flexBasis: 0, overflow: "hidden", children: /* @__PURE__ */ jsx5(ScrollView, { ref: scrollRef, children: /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", paddingX: 1, children: [
     loading && /* @__PURE__ */ jsxs4(Text4, { color: "yellow", children: [
       /* @__PURE__ */ jsx5(Spinner, { type: "dots" }),
@@ -1798,9 +1872,9 @@ function PRDetailsBox({ pr, loading, error, isActive, title = "[3] PR Details",
           " \u2190 ",
           pr.headRefName,
           " | by ",
-          ((_a = pr.author) == null ? void 0 : _a.login) ?? "unknown",
+          ((_h = pr.author) == null ? void 0 : _h.login) ?? "unknown",
           " | ",
-          ((_b = pr.commits) == null ? void 0 : _b.length) ?? 0,
+          ((_i = pr.commits) == null ? void 0 : _i.length) ?? 0,
           " ",
           "commits",
           pr.createdAt && ` | opened ${timeAgo(pr.createdAt)}`,
@@ -1817,64 +1891,11 @@ function PRDetailsBox({ pr, loading, error, isActive, title = "[3] PR Details",
           pr.deletions
         ] })
       ] }),
-      (((_c = pr.labels) == null ? void 0 : _c.length) ?? 0) > 0 && /* @__PURE__ */ jsx5(Box4, { gap: 1, children: pr.labels.map((l) => /* @__PURE__ */ jsx5(Box4, { children: /* @__PURE__ */ jsx5(Badge, { color: "black", background: "gray", children: l.name }) }, l.name)) }),
-      /* @__PURE__ */ jsx5(Box4, { marginTop: 1, children: /* @__PURE__ */ jsx5(Divider, {}) }),
-      (((_d = pr.assignees) == null ? void 0 : _d.length) ?? 0) > 0 && /* @__PURE__ */ jsxs4(Box4, { marginTop: 1, children: [
-        /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Assignees: " }),
-        /* @__PURE__ */ jsx5(Text4, { children: pr.assignees.map((a) => a.login).join(", ") })
-      ] }),
-      ((((_e = pr.reviews) == null ? void 0 : _e.length) ?? 0) > 0 || (((_f = pr.reviewRequests) == null ? void 0 : _f.length) ?? 0) > 0) && /* @__PURE__ */ jsxs4(Box4, { marginTop: 1, flexDirection: "column", children: [
-        /* @__PURE__ */ jsxs4(Box4, { children: [
-          /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Reviews: " }),
-          /* @__PURE__ */ jsx5(Text4, { color: reviewDisplay.color, children: reviewDisplay.text })
-        ] }),
-        (_g = pr.reviews) == null ? void 0 : _g.map((review, idx) => {
-          const color = review.state === "APPROVED" ? "green" : review.state === "CHANGES_REQUESTED" ? "red" : review.state === "COMMENTED" ? "blue" : "yellow";
-          const icon = review.state === "APPROVED" ? "\u2713" : review.state === "CHANGES_REQUESTED" ? "\u2717" : review.state === "COMMENTED" ? "\u{1F4AC}" : "\u25CB";
-          return /* @__PURE__ */ jsxs4(Text4, { color, children: [
-            "  ",
-            icon,
-            " ",
-            review.author.login
-          ] }, idx);
-        }),
-        (_h = pr.reviewRequests) == null ? void 0 : _h.map((r, idx) => /* @__PURE__ */ jsxs4(Text4, { color: "yellow", children: [
-          "  ",
-          "\u25CB ",
-          r.login ?? r.name ?? r.slug ?? "Team",
-          " ",
-          /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "(pending)" })
-        ] }, `pending-${idx}`))
-      ] }),
-      (((_i = pr.statusCheckRollup) == null ? void 0 : _i.length) ?? 0) > 0 && /* @__PURE__ */ jsxs4(Box4, { marginTop: 1, flexDirection: "column", children: [
-        /* @__PURE__ */ jsx5(Divider, {}),
-        /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Checks:" }),
-        Array.from(
-          ((_j = pr.statusCheckRollup) == null ? void 0 : _j.reduce((acc, check) => {
-            const key = check.name ?? check.context ?? "";
-            const existing = acc.get(key);
-            if (!existing || (check.startedAt ?? "") > (existing.startedAt ?? "")) {
-              acc.set(key, check);
-            }
-            return acc;
-          }, /* @__PURE__ */ new Map()).values()) ?? []
-        ).sort((a, b) => CHECK_SORT_ORDER[resolveCheckStatus(a)] - CHECK_SORT_ORDER[resolveCheckStatus(b)]).map((check, idx) => {
-          const jobName = check.name ?? check.context;
-          const displayName = check.workflowName ? `${check.workflowName} / ${jobName}` : jobName;
-          const status = resolveCheckStatus(check);
-          return /* @__PURE__ */ jsxs4(Text4, { color: CHECK_COLORS[status], children: [
-            "  ",
-            CHECK_ICONS[status],
-            " ",
-            displayName
-          ] }, idx);
-        })
-      ] }),
-      pr.body && /* @__PURE__ */ jsxs4(Box4, { marginTop: 1, flexDirection: "column", children: [
-        /* @__PURE__ */ jsx5(Divider, {}),
-        /* @__PURE__ */ jsx5(Text4, { dimColor: true, children: "Description:" }),
-        /* @__PURE__ */ jsx5(Markdown, { children: pr.body })
-      ] })
+      (((_j = pr.labels) == null ? void 0 : _j.length) ?? 0) > 0 && /* @__PURE__ */ jsx5(Box4, { gap: 1, children: pr.labels.map((l) => /* @__PURE__ */ jsx5(Box4, { children: /* @__PURE__ */ jsx5(Badge, { color: "black", background: "gray", children: l.name }) }, l.name)) }),
+      sections.map((section) => /* @__PURE__ */ jsxs4(React.Fragment, { children: [
+        /* @__PURE__ */ jsx5(Box4, { marginTop: 1, children: /* @__PURE__ */ jsx5(Divider, {}) }),
+        section.content
+      ] }, section.key))
     ] })
   ] }) }) }) });
 }
@@ -5705,18 +5726,14 @@ function AllPullRequestsView({ isActive, onModalChange }) {
   const borderColor = isActive ? "yellow" : void 0;
   const scrollRatio = isActive && prs.length > 1 ? highlightedIndex / (prs.length - 1) : null;
   const stateColor = (pr) => {
-    const display = resolveMergeDisplay({
-      state: pr.state,
-      isDraft: pr.isDraft,
-      mergeable: "UNKNOWN"
-    });
-    return display.color;
+    if (pr.state === "MERGED") return "magenta";
+    if (pr.state === "CLOSED") return "red";
+    if (pr.isDraft) return "gray";
+    return "green";
   };
-  const stateLabel = (pr) => {
-    if (pr.isDraft) return "Draft";
-    if (pr.state === "MERGED") return "Merged";
-    if (pr.state === "CLOSED") return "Closed";
-    return "Open";
+  const stateIcon = (pr) => {
+    if (pr.state === "MERGED") return "\uE727";
+    return "\uE726";
   };
   if (detailPR) {
     const hintFooter = checkoutLoading ? /* @__PURE__ */ jsx24(Box22, { paddingX: 1, children: /* @__PURE__ */ jsxs22(Text21, { color: "yellow", children: [
@@ -5769,25 +5786,19 @@ function AllPullRequestsView({ isActive, onModalChange }) {
             cursor,
             " "
           ] }),
-          /* @__PURE__ */ jsxs22(Text21, { children: [
-            "#",
-            pr.number
-          ] }),
-          /* @__PURE__ */ jsxs22(Text21, { children: [
-            " ",
-            pr.title,
+          /* @__PURE__ */ jsxs22(Text21, { color: stateColor(pr), children: [
+            stateIcon(pr),
             " "
           ] }),
-          (pr.state !== "OPEN" || pr.isDraft) && /* @__PURE__ */ jsxs22(Text21, { color: stateColor(pr), children: [
-            "[",
-            stateLabel(pr),
-            "]"
-          ] })
+          /* @__PURE__ */ jsx24(Text21, { children: pr.title })
         ] }),
         /* @__PURE__ */ jsxs22(Box22, { children: [
           /* @__PURE__ */ jsx24(Text21, { children: " " }),
           /* @__PURE__ */ jsxs22(Text21, { dimColor: true, children: [
             " ",
+            "#",
+            pr.number,
+            " \xB7 ",
             pr.author.login,
             " \xB7 ",
             timeAgo(pr.createdAt)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clairo",
-  "version": "3.1.2",
+  "version": "3.1.4",
   "license": "MIT",
   "repository": {
     "type": "git",