From cd85419d1da6e187c451e2bdc6803b90f547b48a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9B=B7=E7=94=B5=E8=8A=BD=E8=A1=A3?=
 <zhangyanghaha0407@outlook.com>
Date: Thu, 16 Apr 2026 23:08:44 -0400
Subject: [PATCH] oauth/inbox: use native ordered list; explicit severity
 fallback (P2-45, P2-48)

---
 src/renderer/components/inbox/Inbox.tsx       |  4 +-
 .../components/inbox/inbox-helpers.tsx        |  5 ++
 .../settings/dialogs/OAuthPromptDialog.tsx    | 51 ++++++++-----------
 3 files changed, 28 insertions(+), 32 deletions(-)

diff --git a/src/renderer/components/inbox/Inbox.tsx b/src/renderer/components/inbox/Inbox.tsx
index 6c6796cb..ee23c85d 100644
--- a/src/renderer/components/inbox/Inbox.tsx
+++ b/src/renderer/components/inbox/Inbox.tsx
@@ -9,7 +9,7 @@ import {
 import type { InboxItem, InboxItemType, SectionId } from "@shared/types";
 import { timeAgo } from "../../lib/formatters";
 import { useT } from "../../i18n";
-import { typeConfig, severityColors } from "./inbox-helpers";
+import { typeConfig, severityBorderClass } from "./inbox-helpers";
 
 interface InboxProps {
   items: InboxItem[];
@@ -115,7 +115,7 @@ export function Inbox({ items, onNavigate }: InboxProps) {
                   initial={{ opacity: 0, y: -8 }}
                   animate={{ opacity: 1, y: 0 }}
                   exit={{ opacity: 0, x: 20 }}
-                  className={`group flex items-center gap-3 rounded-lg border border-l-[3px] border-border bg-card px-4 py-3 transition duration-150 hover:border-border hover:shadow-md hover:-translate-y-px ${severityColors[item.severity] ?? ""}`}
+                  className={`group flex items-center gap-3 rounded-lg border border-l-[3px] border-border bg-card px-4 py-3 transition duration-150 hover:border-border hover:shadow-md hover:-translate-y-px ${severityBorderClass(item.severity)}`}
                 >
                   <div
                     className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg"
diff --git a/src/renderer/components/inbox/inbox-helpers.tsx b/src/renderer/components/inbox/inbox-helpers.tsx
index 2a4d0ffd..4946646f 100644
--- a/src/renderer/components/inbox/inbox-helpers.tsx
+++ b/src/renderer/components/inbox/inbox-helpers.tsx
@@ -25,6 +25,11 @@ export const severityColors: Record<string, string> = {
   low: "border-l-[color:var(--border)]",
 };
 
+export function severityBorderClass(severity: string | null | undefined): string {
+  if (!severity) return "border-l-[color:var(--border)]";
+  return severityColors[severity] ?? "border-l-[color:var(--border)]";
+}
+
 export function CompactMetric({ label, value, tone = "default", subtitle }: {
   label: string;
   value: string | number;
diff --git a/src/renderer/components/settings/dialogs/OAuthPromptDialog.tsx b/src/renderer/components/settings/dialogs/OAuthPromptDialog.tsx
index 7b7ec2d8..fef5d7f0 100644
--- a/src/renderer/components/settings/dialogs/OAuthPromptDialog.tsx
+++ b/src/renderer/components/settings/dialogs/OAuthPromptDialog.tsx
@@ -102,37 +102,28 @@ export function OAuthPromptDialog() {
           </div>
 
           {isManualCode ? (
-            <div className="mb-5 space-y-3 text-[13px] leading-relaxed text-muted-foreground">
-              <ol className="space-y-2 pl-0">
-                <li className="flex gap-2">
-                  <span className="font-mono text-[11px] text-muted-foreground/70">1</span>
-                  <span>
-                    {pending.authUrl ? (
-                      <>
-                        Open{" "}
-                        <a
-                          href={pending.authUrl}
-                          target="_blank"
-                          rel="noreferrer"
-                          className="text-foreground underline decoration-dotted underline-offset-4 hover:text-accent-foreground"
-                        >
-                          the authorization page
-                        </a>{" "}
-                        and click <strong className="text-foreground">Authorize</strong>.
-                      </>
-                    ) : (
-                      <>Complete authorization in the browser window that opened.</>
-                    )}
-                  </span>
-                </li>
-                <li className="flex gap-2">
-                  <span className="font-mono text-[11px] text-muted-foreground/70">2</span>
-                  <span>Copy the authorization code shown on the confirmation page.</span>
-                </li>
-                <li className="flex gap-2">
-                  <span className="font-mono text-[11px] text-muted-foreground/70">3</span>
-                  <span>Paste it below and press <strong className="text-foreground">Submit</strong>.</span>
+            <div className="mb-5 text-[13px] leading-relaxed text-muted-foreground">
+              <ol className="list-decimal space-y-2 pl-5 marker:text-[11px] marker:font-mono marker:text-muted-foreground/70">
+                <li>
+                  {pending.authUrl ? (
+                    <>
+                      Open{" "}
+                      <a
+                        href={pending.authUrl}
+                        target="_blank"
+                        rel="noreferrer"
+                        className="text-foreground underline decoration-dotted underline-offset-4 hover:text-accent-foreground"
+                      >
+                        the authorization page
+                      </a>{" "}
+                      and click <strong className="text-foreground">Authorize</strong>.
+                    </>
+                  ) : (
+                    <>Complete authorization in the browser window that opened.</>
+                  )}
                 </li>
+                <li>Copy the authorization code shown on the confirmation page.</li>
+                <li>Paste it below and press <strong className="text-foreground">Submit</strong>.</li>
               </ol>
             </div>
           ) : (