From 95dbf9558d310ebca58b4bf24e3dffc6ac7e3eda Mon Sep 17 00:00:00 2001 From: gsxdsm Date: Thu, 16 Jul 2026 20:11:06 -0700 Subject: [PATCH] FN-8150: expand mobile import issue lists Allow mobile issue lists to fill the available import-sheet height. - Make the mobile import pane a constrained flex column with internal scrolling. - Remove the 50vh list cap while preserving pagination and action access. - Cover the responsive list sizing rules with a regression test. Files changed: .../dashboard/app/components/GitHubImportModal.css | 18 +++++++++++++++++- .../components/__tests__/GitHubImportModal.test.tsx | 17 +++++++++++++++++ 2 files changed, 34 insertions(+), 1 deletion(-) Fusion-Task-Id: FN-8150 Fusion-Task-Lineage: 92841921-7769-4304-b1f3-8c91aa18efb6 Co-authored-by: Fusion (runfusion.ai) --- .../app/components/GitHubImportModal.css | 18 +++++++++++++++++- .../__tests__/GitHubImportModal.test.tsx | 17 +++++++++++++++++ 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/packages/dashboard/app/components/GitHubImportModal.css b/packages/dashboard/app/components/GitHubImportModal.css index cef0f4aa69..53f3aa8730 100644 --- a/packages/dashboard/app/components/GitHubImportModal.css +++ b/packages/dashboard/app/components/GitHubImportModal.css @@ -1567,8 +1567,24 @@ counterpart added later cannot silently reintroduce the band. align-self: flex-start; } + /* + FNXC:GitHubImport 2026-07-16-19:00: + FN-8150 requires populated GitHub, pull request, and GitLab lists to use the remaining height of + the mobile full-screen sheet rather than stopping at a 50vh cap. The GitHub list pane becomes a + constrained flex column so the list owns internal scrolling while pagination and the Cancel bar + remain reachable; the shared list rule also lets the stretched GitLab workspace list fill its row. + */ + .github-import-list-pane .github-import-pane-content { + display: flex; + flex-direction: column; + min-height: 0; + overflow: hidden; + } + .issues-list { - max-height: 50vh; + flex: 1 1 auto; + min-height: 0; + max-height: none; } diff --git a/packages/dashboard/app/components/__tests__/GitHubImportModal.test.tsx b/packages/dashboard/app/components/__tests__/GitHubImportModal.test.tsx index 96a2a843aa..5c31e362e1 100644 --- a/packages/dashboard/app/components/__tests__/GitHubImportModal.test.tsx +++ b/packages/dashboard/app/components/__tests__/GitHubImportModal.test.tsx @@ -114,6 +114,23 @@ describe("GitHubImportModal", () => { + it("lets mobile issues lists fill the sheet without a 50vh cap", () => { + const source = readFileSync(resolve(__dirname, "../GitHubImportModal.css"), "utf8"); + const mobileStyles = source.slice( + source.indexOf("@media (max-width: 640px)"), + source.indexOf("@keyframes github-import-spinner-spin"), + ); + + expect(mobileStyles).not.toContain("max-height: 50vh"); + expect(mobileStyles).toContain(".github-import-list-pane .github-import-pane-content {"); + expect(mobileStyles).toContain("display: flex;"); + expect(mobileStyles).toContain("flex-direction: column;"); + expect(mobileStyles).toContain(".issues-list {"); + expect(mobileStyles).toContain("flex: 1 1 auto;"); + expect(mobileStyles).toContain("min-height: 0;"); + expect(mobileStyles).toContain("max-height: none;"); + }); + it("keeps the non-embedded modal body and dialog sizing rules unchanged", () => { const source = readFileSync(resolve(__dirname, "../GitHubImportModal.css"), "utf8"); const baseModalBodyRule = source.match(/(?:^|\n)\.github-import-modal__body\s*\{[^}]*\}/)?.[0] ?? "";