refactor(prs): replace hardcoded colors with theme tokens

[bittoby]

Summary

Replace all hardcoded color values in PR viewer components (PRFilesChanged.tsx, PRHeader.tsx) with centralized theme tokens.

Add CODE_VIEWER_COLORS constant to theme.ts for GitHub-style diff viewer colors (background, border, text, added, removed, modified, addBg, delBg, focus, etc.) and REPO_OWNER_AVATAR_BACKGROUNDS for owner avatar background colors.

Files changed: PRFilesChanged.tsx, PRHeader.tsx, theme.ts

What was replaced:

• GitHub diff colors (#0d1117, #161b22, #30363d, #c9d1d9, etc.) → CODE_VIEWER_COLORS.*
• Diff status colors (#2da44e, #cf222e, #d29922) → CODE_VIEWER_COLORS.added/removed/modified
• Diff backgrounds (rgba(46,160,67,0.15), rgba(248,81,73,0.15)) → CODE_VIEWER_COLORS.addBg/delBg
• Focus/selection colors (#388bfd, rgba(56,139,253,0.15)) → CODE_VIEWER_COLORS.focus/focusBg
• Tooltip backgrounds (rgba(30,30,30,0.95)) → theme.palette.surface.tooltip
• Text opacity variants → alpha(common.white, TEXT_OPACITY.*)
• Owner avatar colors → REPO_OWNER_AVATAR_BACKGROUNDS.*
• Collateral warning color → RISK_COLORS.exceeded

No visual changes. Pure refactor.

Related Issues

Type of Change

• Bug fix
• New feature
• Refactor
• Documentation
• Other (describe below)

Checklist

• New components are modularized/separated where sensible
• Uses predefined theme (e.g. no hardcoded colors)
• Responsive/mobile checked
• Tested against the test API
• npm run format and npm run lint:fix have been run
• npm run build passes
• Screenshots included for any UI/visual changes

[anderdc]

The component-level fixes are good — replacing raw hex values in PRFilesChanged and PRHeader with existing tokens is the right cleanup.

Two things to change:

• Minimize theme.ts additions. Only add new constants/palette entries if the color genuinely doesn't exist yet. If an existing token covers it (e.g. STATUS_COLORS.success for #2da44e, DIFF_COLORS.deletions for #cf222e), use that instead of creating CODE_VIEWER_COLORS. If a few truly new diff-viewer-specific colors are needed (like addBg/delBg backgrounds), that's fine — but keep it minimal.
• Convention for theme access:
  • In MUI sx props: use string paths — 'text.primary', 'border.light', 'status.merged'
  • In non-MUI contexts (echarts configs, inline styles, pure functions): import the exported constants — STATUS_COLORS.merged, CHART_COLORS.open, DIFF_COLORS.additions
  • Don't use useTheme() to access values that are already available as exported constants

This avoids the dual-system problem — string paths for MUI, constants for everything else, both backed by the same values.

[bittoby]

@anderdc I updated all following your feedback.

[anderdc]

Previous feedback addressed — no unnecessary theme.ts additions, token swaps look correct.

One remaining issue: the ownerAvatarBackground logic in PRHeader.tsx is now copy-pasted in three places (TopPRsTable, TopRepositoriesTable, PRHeader). Extract it to a shared util — you're already doing this work across all three files so it makes sense to do it in one of these PRs.

[bittoby]

Previous feedback addressed — no unnecessary theme.ts additions, token swaps look correct.

One remaining issue: the ownerAvatarBackground logic in PRHeader.tsx is now copy-pasted in three places (TopPRsTable, TopRepositoriesTable, PRHeader). Extract it to a shared util — you're already doing this work across all three files so it makes sense to do it in one of these PRs.

Thanks for your feedback. First pls merge #256 PR then I will update this pr.

[anderdc]

The import of getRepositoryOwnerAvatarBackground from leaderboard/types will break the build — that function doesn't exist in types.ts on test. Either add it to types.ts in this PR, or coordinate with #256 to land it there first.

[anderdc]

Previous feedback addressed. Token swaps look correct, ownerAvatarBackground extracted to shared util. Looks good.

False flag — the import is valid on current test branch. Sorry for the noise.