Skip to content

Commit fa654c6

Browse files
FrozenPandazFrozenPandaz
authored
fix(core): prefer vertical layout categorically if there are less tha… (#31221)
…n 75 characters of width <!-- Please make sure you have read the submission guidelines before posting an PR --> <!-- https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr --> <!-- Please make sure that your commit message follows our format --> <!-- Example: `fix(nx): must begin with lowercase` --> <!-- If this is a particularly complex change or feature addition, you can request a dedicated Nx release for this pull request branch. Mention someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they will confirm if the PR warrants its own release for testing purposes, and generate it for you if appropriate. --> ## Current Behavior <!-- This is the behavior we have today --> Auto layout is always based on an aspect ratio which lead to horizontal layout even when there is very little horizontal space. ## Expected Behavior <!-- This is the behavior we should expect with the changes in this PR --> Auto layout prefers vertical layout with less than 75 characters of width which will allow 50 characters (75 * 2/3) for terminal output. It should be enough to show a URL in most cases: ![image](https://github.com/user-attachments/assets/0804d7ff-02aa-45e1-89f8-bd86b478f88e) ![image](https://github.com/user-attachments/assets/f2f04e3a-c306-4dea-bfca-66052dc28f20) ## Related Issue(s) <!-- Please link the issue being fixed so it gets closed when this is merged. --> Fixes #
1 parent c92b4a3 commit fa654c6

4 files changed

+160
-0
lines changed

‎packages/nx/src/native/tui/components/layout_manager.rs

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -400,6 +400,11 @@ impl LayoutManager {
400400
/// - Number of tasks (single task prefers vertical layout)
401401
/// - Minimum dimensions requirements
402402
fn is_vertical_layout_preferred(&self, terminal_width: u16, terminal_height: u16) -> bool {
403+
// Screen is pretty narrow so always prefer vertical layout
404+
if terminal_width < 75 {
405+
return true;
406+
}
407+
403408
// Calculate aspect ratio (width/height)
404409
let aspect_ratio = terminal_width as f32 / terminal_height as f32;
405410

@@ -865,6 +870,29 @@ mod tests {
865870
insta::assert_snapshot!(terminal.backend());
866871
}
867872

873+
/// Visual test for narrow screen rendering (width < 75)
874+
#[test]
875+
fn test_visualize_narrow_screen_layout() {
876+
// Create layout with auto mode, which should pick vertical layout for narrow screens
877+
let mut layout_manager = LayoutManager::new(5);
878+
layout_manager.set_mode(LayoutMode::Auto);
879+
layout_manager.set_task_list_visibility(TaskListVisibility::Visible);
880+
layout_manager.set_pane_arrangement(PaneArrangement::Single);
881+
layout_manager.set_task_count(5);
882+
883+
// Test with a narrow screen (width < 75)
884+
let terminal = render_layout(74, 40, &layout_manager);
885+
insta::assert_snapshot!("narrow_screen_layout", terminal.backend());
886+
887+
// Also test with extremely narrow screen
888+
let terminal = render_layout(50, 40, &layout_manager);
889+
insta::assert_snapshot!("extremely_narrow_screen_layout", terminal.backend());
890+
891+
// Also test with slightly narrow screen
892+
let terminal = render_layout(80, 40, &layout_manager);
893+
insta::assert_snapshot!("slightly_narrow_screen_layout", terminal.backend());
894+
}
895+
868896
// These tests will run even without the snapshot feature enabled
869897
// to verify layout calculations are correct
870898

‎packages/nx/src/native/tui/components/snapshots/nx__native__tui__components__layout_manager__tests__visual_tests__extremely_narrow_screen_layout.snap

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
source: packages/nx/src/native/tui/components/layout_manager.rs
3+
expression: terminal.backend()
4+
---
5+
"┌Task List───────────────────────────────────────┐"
6+
"│ │"
7+
"│ │"
8+
"│ │"
9+
"│ │"
10+
"│ │"
11+
"│ │"
12+
"│ │"
13+
"│ │"
14+
"│ │"
15+
"│ │"
16+
"│ │"
17+
"└────────────────────────────────────────────────┘"
18+
" "
19+
"┌Terminal Pane 1─────────────────────────────────┐"
20+
"│ │"
21+
"│ │"
22+
"│ │"
23+
"│ │"
24+
"│ │"
25+
"│ │"
26+
"│ │"
27+
"│ │"
28+
"│ │"
29+
"│ │"
30+
"│ │"
31+
"│ │"
32+
"│ │"
33+
"│ │"
34+
"│ │"
35+
"│ │"
36+
"│ │"
37+
"│ │"
38+
"│ │"
39+
"│ │"
40+
"│ │"
41+
"│ │"
42+
"│ │"
43+
"│ │"
44+
"└────────────────────────────────────────────────┘"

‎packages/nx/src/native/tui/components/snapshots/nx__native__tui__components__layout_manager__tests__visual_tests__narrow_screen_layout.snap

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
source: packages/nx/src/native/tui/components/layout_manager.rs
3+
expression: terminal.backend()
4+
---
5+
"┌Task List───────────────────────────────────────────────────────────────┐"
6+
"│ │"
7+
"│ │"
8+
"│ │"
9+
"│ │"
10+
"│ │"
11+
"│ │"
12+
"│ │"
13+
"│ │"
14+
"│ │"
15+
"│ │"
16+
"│ │"
17+
"└────────────────────────────────────────────────────────────────────────┘"
18+
" "
19+
"┌Terminal Pane 1─────────────────────────────────────────────────────────┐"
20+
"│ │"
21+
"│ │"
22+
"│ │"
23+
"│ │"
24+
"│ │"
25+
"│ │"
26+
"│ │"
27+
"│ │"
28+
"│ │"
29+
"│ │"
30+
"│ │"
31+
"│ │"
32+
"│ │"
33+
"│ │"
34+
"│ │"
35+
"│ │"
36+
"│ │"
37+
"│ │"
38+
"│ │"
39+
"│ │"
40+
"│ │"
41+
"│ │"
42+
"│ │"
43+
"│ │"
44+
"└────────────────────────────────────────────────────────────────────────┘"

‎packages/nx/src/native/tui/components/snapshots/nx__native__tui__components__layout_manager__tests__visual_tests__slightly_narrow_screen_layout.snap

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
source: packages/nx/src/native/tui/components/layout_manager.rs
3+
expression: terminal.backend()
4+
---
5+
"┌Task List───────────────┐ ┌Terminal Pane 1───────────────────────────────────┐"
6+
"│ │ │ │"
7+
"│ │ │ │"
8+
"│ │ │ │"
9+
"│ │ │ │"
10+
"│ │ │ │"
11+
"│ │ │ │"
12+
"│ │ │ │"
13+
"│ │ │ │"
14+
"│ │ │ │"
15+
"│ │ │ │"
16+
"│ │ │ │"
17+
"│ │ │ │"
18+
"│ │ │ │"
19+
"│ │ │ │"
20+
"│ │ │ │"
21+
"│ │ │ │"
22+
"│ │ │ │"
23+
"│ │ │ │"
24+
"│ │ │ │"
25+
"│ │ │ │"
26+
"│ │ │ │"
27+
"│ │ │ │"
28+
"│ │ │ │"
29+
"│ │ │ │"
30+
"│ │ │ │"
31+
"│ │ │ │"
32+
"│ │ │ │"
33+
"│ │ │ │"
34+
"│ │ │ │"
35+
"│ │ │ │"
36+
"│ │ │ │"
37+
"│ │ │ │"
38+
"│ │ │ │"
39+
"│ │ │ │"
40+
"│ │ │ │"
41+
"│ │ │ │"
42+
"│ │ │ │"
43+
"│ │ │ │"
44+
"└────────────────────────┘ └──────────────────────────────────────────────────┘"

0 commit comments

Comments
 (0)