Skip to content

fix: widen Pull Requests linked-issues column#156

Open
glorydavid03023 wants to merge 2 commits into
MkDev11:mainfrom
glorydavid03023:fix/issue-108-pulls-issues-column
Open

fix: widen Pull Requests linked-issues column#156
glorydavid03023 wants to merge 2 commits into
MkDev11:mainfrom
glorydavid03023:fix/issue-108-pulls-issues-column

Conversation

@glorydavid03023
Copy link
Copy Markdown

@glorydavid03023 glorydavid03023 commented May 26, 2026

Summary

Fixes clipping of the Issues column on /pulls where RelatedIssuesCell chips were truncated under table-layout: fixed.

  • Set a dedicated ISSUES_COL_WIDTH (88px) on the header and body cells
  • Bump table minWidth by the same delta so horizontal scroll reveals the full column

Related Issues

Fixes #108

Type of Change

  • Bug fix
  • New feature
  • Enhancement
  • Refactor
  • Documentation

Testing

  • pnpm run lint (CI)
  • pnpm build (CI)
  • Manual: verified Issues column header and linked-issue chips fit at 88px width

Checklist

  • Self-reviewed the diff
  • Follows existing code patterns and naming
  • No unrelated changes included
  • Documentation updated if behavior changed

Summary by CodeRabbit

  • Style
    • Improved the Pull Requests table layout by establishing a consistent, fixed width for the "Issues" column to prevent content clipping and ensure better visual alignment across all rows and loading states.

Review Change Stack

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented May 26, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: c60ceb9b-ccbd-489c-a0ab-570baa8c4f55

📥 Commits

Reviewing files that changed from the base of the PR and between e015a7d and aa1b288.

📒 Files selected for processing (1)
  • src/app/pulls/page.tsx

📝 Walkthrough

Walkthrough

The Pull Requests table's Issues column width is standardized using a new constant (88px) to prevent content truncation. The table minimum width is adjusted accordingly, and the constant is applied consistently across the column header, loading skeleton, and all row cells.

Changes

Issues Column Width Standardization

Layer / File(s) Summary
Column width constant and table baseline adjustment
src/app/pulls/page.tsx
New ISSUES_COL_WIDTH constant (88) prevents clipping. Table minWidth is increased by the width delta (ISSUES_COL_WIDTH - 64) to reserve space without overflow.
Apply column width consistently across header, skeleton, and rows
src/app/pulls/page.tsx
Issues column header, loading skeleton column, and row cells all use ISSUES_COL_WIDTH for consistent width/minWidth/maxWidth with centered, no-wrap styling and preserved click-event handling.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

A column once cramped and too tight,
Now stretches to eighty-eight's right,
From header to skeleton's row,
The issues now clearly do show! 🐰✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately and concisely describes the main change: widening the Pull Requests linked-issues (ISSUES) column to fix clipping issues.
Linked Issues check ✅ Passed The code changes directly address issue #108 by implementing the suggested fix: adding a dedicated ISSUES_COL_WIDTH (88px) to header and body cells and increasing table minWidth accordingly.
Out of Scope Changes check ✅ Passed All changes are scoped to fixing the ISSUES column width in the Pull Requests table; no unrelated modifications were introduced.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

src/app/pulls/page.tsx

ESLint skipped: missing config or dependency (missing-dependency). The ESLint configuration references a package that is not available in the sandbox.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@glorydavid03023 glorydavid03023 force-pushed the fix/issue-108-pulls-issues-column branch 2 times, most recently from c5c8534 to 20c1d86 Compare May 26, 2026 04:28
Give the Issues column enough fixed width for RelatedIssuesCell chips and bump table min-width so the column is not clipped (MkDev11#108).

Fixes MkDev11#108
@glorydavid03023 glorydavid03023 force-pushed the fix/issue-108-pulls-issues-column branch from 20c1d86 to 0fc7327 Compare May 26, 2026 04:28
@MkDev11
Copy link
Copy Markdown
Owner

MkDev11 commented May 26, 2026

Please add screenshots

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ISSUES column in Pull Requests table is cut off/truncated

2 participants