From 3b74ff4813773f1b6f61bddc64955b6667bce029 Mon Sep 17 00:00:00 2001 From: Hardik Dholariya <66554974+webdevdot@users.noreply.github.com> Date: Wed, 12 Aug 2026 05:04:42 +0530 Subject: [PATCH] fix(ui): use issuePrefix instead of name-derived prefix in create dialog badges (#8550) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Thinking Path > - Paperclip is the open source app people use to manage AI agents at work > - Paperclip stores an `issuePrefix` on each company (e.g. "OPS") used for issue identifiers (`OPS-1`) and company-prefixed routes (`/OPS/dashboard`) > - The create-dialog badges in NewIssueDialog, NewProjectDialog, and NewGoalDialog were derived from the company display name using `company.name.slice(0, 3).toUpperCase()` — so "Acme Labs" showed "ACM" > - This is misleading because the badge visually represents the issue prefix, but actually shows an unrelated 3-letter slice of the display name > - When a company has `issuePrefix = "OPS"` but `name = "Acme Labs"`, the badge showed "ACM" while issues use "OPS-1" > - This pull request replaces `name.slice(0, 3).toUpperCase()` with `company.issuePrefix` in all three dialog badge components > - The benefit is that the badge now matches the actual prefix used for issues and routes, eliminating confusion ## Linked Issues or Issue Description Fixes: #8501 ## What Changed - `ui/src/components/NewIssueDialog.tsx` (line ~1339): Replaced `company.name.slice(0, 3).toUpperCase()` with `company.issuePrefix` in the selected-company header badge - `ui/src/components/NewIssueDialog.tsx`: Replaced `company.name.slice(0, 3).toUpperCase()` with `company.issuePrefix` in the company picker list badge - `ui/src/components/NewProjectDialog.tsx`: Replaced `selectedCompany.name.slice(0, 3).toUpperCase()` with `selectedCompany.issuePrefix` in the selected-company header badge - `ui/src/components/NewGoalDialog.tsx`: Replaced `selectedCompany.name.slice(0, 3).toUpperCase()` with `selectedCompany.issuePrefix` in the selected-company header badge ## Verification 1. Create or configure a company whose `issuePrefix` differs from the first 3 letters of its display name (e.g. name = "Acme Labs", issuePrefix = "OPS") 2. Open the New Task dialog — the selected-company header badge should show "OPS", not "ACM" 3. Open the company picker dropdown inside the New Task dialog — each company list badge should show the actual `issuePrefix` 4. Open the New Project dialog — the selected-company header badge should show "OPS" 5. Open the New Goal dialog — the selected-company header badge should show "OPS" 6. Verify that companies whose prefix matches the first 3 letters (e.g. name="Ops Team", prefix="OPS") still display correctly **Before/After:** - Before: Company "Acme Labs" with `issuePrefix = "OPS"` showed badge "ACM" - After: Same company shows badge "OPS" (Screenshots require running the UI locally against a test instance with the relevant company configuration.) ## Risks Low risk — this is a purely visual change to 3 React component badge labels. No API changes, no schema changes, no behavioral changes to issue creation or routing. The `issuePrefix` field is already loaded on the company objects used by these components. ## Model Used - **Provider:** OpenCode - **Model:** MiMo v2.5 Free - **Reasoning:** N/A (standard code generation) ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I searched GitHub for duplicate or related PRs and found none targeting the same badge code - [x] I have linked the existing issue with Fixes: #8501 - [x] I have not referenced internal/instance-local Paperclip issues or links - [x] My branch name describes the change (`fix/issue-8501`) - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [x] All Paperclip CI gates are green - [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge Co-authored-by: Claude Sonnet 4.6 --- ui/src/components/NewGoalDialog.tsx | 2 +- ui/src/components/NewIssueDialog.test.tsx | 31 +++++++++++++++++++++++ ui/src/components/NewIssueDialog.tsx | 4 +-- ui/src/components/NewProjectDialog.tsx | 2 +- 4 files changed, 35 insertions(+), 4 deletions(-) diff --git a/ui/src/components/NewGoalDialog.tsx b/ui/src/components/NewGoalDialog.tsx index a589cfae8d..a41ea3e4e5 100644 --- a/ui/src/components/NewGoalDialog.tsx +++ b/ui/src/components/NewGoalDialog.tsx @@ -124,7 +124,7 @@ export function NewGoalDialog() {
{selectedCompany && ( - {selectedCompany.name.slice(0, 3).toUpperCase()} + {selectedCompany.issuePrefix} )} › diff --git a/ui/src/components/NewIssueDialog.test.tsx b/ui/src/components/NewIssueDialog.test.tsx index 5b11679b0f..a41c886b2a 100644 --- a/ui/src/components/NewIssueDialog.test.tsx +++ b/ui/src/components/NewIssueDialog.test.tsx @@ -1362,4 +1362,35 @@ describe("NewIssueDialog", () => { act(() => root.unmount()); }); }); + + describe("PAP-8501: company badge shows issuePrefix", () => { + it("displays issuePrefix instead of name-derived prefix", async () => { + // Override company data to have mismatched name/prefix + companyState.companies = [ + { + id: "company-1", + name: "Acme Labs", + status: "active", + brandColor: "#123456", + issuePrefix: "OPS", + }, + ]; + companyState.selectedCompany = { + id: "company-1", + name: "Acme Labs", + status: "active", + brandColor: "#123456", + issuePrefix: "OPS", + }; + + const { root } = renderDialog(container); + await waitForAssertion(() => { + const text = container.textContent ?? ""; + // Should show OPS (issuePrefix), not ACM (name.slice(0,3)) + expect(text).toContain("OPS"); + }); + + act(() => root.unmount()); + }); + }); }); diff --git a/ui/src/components/NewIssueDialog.tsx b/ui/src/components/NewIssueDialog.tsx index 35d1f627ba..8c88565239 100644 --- a/ui/src/components/NewIssueDialog.tsx +++ b/ui/src/components/NewIssueDialog.tsx @@ -1336,7 +1336,7 @@ export function NewIssueDialog() { : undefined } > - {(dialogCompany?.name ?? "").slice(0, 3).toUpperCase()} + {dialogCompany?.issuePrefix ?? ""} @@ -1366,7 +1366,7 @@ export function NewIssueDialog() { : undefined } > - {c.name.slice(0, 3).toUpperCase()} + {c.issuePrefix} {c.name} diff --git a/ui/src/components/NewProjectDialog.tsx b/ui/src/components/NewProjectDialog.tsx index f7268c4d43..7bb3158f7d 100644 --- a/ui/src/components/NewProjectDialog.tsx +++ b/ui/src/components/NewProjectDialog.tsx @@ -219,7 +219,7 @@ export function NewProjectDialog() {
{selectedCompany && ( - {selectedCompany.name.slice(0, 3).toUpperCase()} + {selectedCompany.issuePrefix} )} ›