feat: add configurable code editor line numbers (#10012)

Closes #9816

## Description
- Add a persisted `text_editing.code_editor_line_number_mode` setting
with `Absolute` and `Relative` modes.
- Add a Text Editing settings dropdown for code editor line-number mode.
- Render relative code editor gutter line numbers for the active
editor/active diff section while keeping inactive diff/review sections
absolute.
- Repaint line gutters on setting and cursor changes, and add focused
helper tests for display-value behavior.

## Linked Issue
- [x] The linked issue is labeled `ready-to-spec` or
`ready-to-implement`.
- [ ] Where appropriate, screenshots or a short video of the
implementation are included below (especially for user-visible or UI
changes).

## Screenshots / Videos
Not included; this implementation was validated through code-level
checks in the sandbox.

## Testing
- `cargo fmt`
- `cargo check -p warp --no-default-features`
- `cargo clippy -p warp --no-default-features -- -D warnings`
- `cargo check -p warp --lib --all-features`
- Attempted `cargo test -p warp code::editor::element::tests
--no-default-features`, but `rustc` compiling `warp` lib tests was
killed by SIGKILL (signal 9) before tests ran in this sandbox.

## Agent Mode
- [x] Warp Agent Mode - This PR was created via Warp's AI Agent Mode

CHANGELOG-IMPROVEMENT: Add configurable absolute and relative line
numbers for code editors.

---------

Co-authored-by: Oz <oz-agent@warp.dev>
Co-authored-by: Narley Brittes <narley@users.noreply.github.com>
Co-authored-by: Lili Wilson <56806227+liliwilson@users.noreply.github.com>
Co-authored-by: liliwilson <lilimmwilson@gmail.com>

Author: 4 people

app/src/code/editor/element.rs

@@ -38,6 +38,7 @@ use super::model::DiffNavigationState;
 use crate::code::editor::element::gutter_button::GutterButton;
 use crate::code::editor::line::EditorLineLocation;
 use crate::code::editor::view::{CodeEditorViewAction, SavedComment};
+use crate::settings::CodeEditorLineNumberMode;
 use crate::view_components::action_button::{ActionButtonTheme, SecondaryTheme};
 
 pub const GUTTER_WIDTH: f32 = 94.;
@@ -348,6 +349,28 @@ pub struct LineNumberConfig {
     pub text_color: ColorU,
     pub highlight_text_color: ColorU,
     pub starting_line_number: Option<usize>,
+    pub mode: CodeEditorLineNumberMode,
+    pub active_line_number: Option<LineCount>,
+    pub active_cursor_is_visible: bool,
+}
+impl LineNumberConfig {
+    pub fn absolute_line_number(&self, line_count: LineCount) -> usize {
+        line_count.as_usize() + self.starting_line_number.unwrap_or(1)
+    }
+
+    pub fn display_line_number(&self, line_count: LineCount) -> usize {
+        if self.mode == CodeEditorLineNumberMode::Relative {
+            if let Some(active_line_number) = self.active_line_number {
+                if active_line_number != line_count {
+                    return active_line_number
+                        .as_usize()
+                        .abs_diff(line_count.as_usize());
+                }
+            }
+        }
+
+        self.absolute_line_number(line_count)
+    }
 }
 
 struct CommentBox {
@@ -548,6 +571,21 @@ impl<V: EditorView> EditorWrapper<V> {
             .cloned()
     }
 
+    fn should_display_relative_line_number(&self) -> bool {
+        let Some(line_number_config) = &self.line_number_config else {
+            return false;
+        };
+        if line_number_config.mode != CodeEditorLineNumberMode::Relative
+            || line_number_config.active_line_number.is_none()
+        {
+            return false;
+        }
+
+        // Relative numbers follow the cursor: only show them when a cursor is
+        // actually drawn (editor focused and editable).
+        line_number_config.active_cursor_is_visible
+    }
+
     /// Returning **no** gutter means the gutter shouldn't be rendered at all.
     /// Returning an **empty** gutter means the gutter should be rendered with no contents.
     fn gutter_elements(&self, app: &AppContext) -> Option<Vec<GutterElement>> {
@@ -583,8 +621,11 @@ impl<V: EditorView> EditorWrapper<V> {
             let diff_hunk = self.diff_status.diff_hunk(line_count, appearance);
             let is_removal = matches!(diff_hunk, Some(DiffHunkDisplay::Remove(_)));
 
-            let current_line =
-                line_count.as_usize() + line_number_config.starting_line_number.unwrap_or(1);
+            let current_line = if self.should_display_relative_line_number() {
+                line_number_config.display_line_number(line_count)
+            } else {
+                line_number_config.absolute_line_number(line_count)
+            };
 
             // If the block is temporary, don't render line number.
             // Currently, all temporary blocks are removal hunks, either from a deleted section,
@@ -1643,3 +1684,7 @@ impl<V: EditorView> NewScrollableElement for EditorWrapper<V> {
         ScrollableAxis::Both
     }
 }
+
+#[cfg(test)]
+#[path = "element_tests.rs"]
+mod tests;

app/src/code/editor/element_tests.rs

@@ -0,0 +1,71 @@
+use super::*;
+fn config(
+    mode: CodeEditorLineNumberMode,
+    starting_line_number: Option<usize>,
+    active_line_number: Option<LineCount>,
+) -> LineNumberConfig {
+    LineNumberConfig {
+        font_family: FamilyId(0),
+        font_size: 0.,
+        text_color: ColorU::transparent_black(),
+        highlight_text_color: ColorU::transparent_black(),
+        starting_line_number,
+        mode,
+        active_line_number,
+        active_cursor_is_visible: true,
+    }
+}
+
+#[test]
+fn absolute_line_numbers_default_to_one_based_values() {
+    let config = config(CodeEditorLineNumberMode::Absolute, None, None);
+
+    assert_eq!(config.absolute_line_number(LineCount::from(0)), 1);
+    assert_eq!(config.absolute_line_number(LineCount::from(4)), 5);
+}
+
+#[test]
+fn absolute_line_numbers_honor_starting_line_number() {
+    let config = config(CodeEditorLineNumberMode::Absolute, Some(10), None);
+
+    assert_eq!(config.absolute_line_number(LineCount::from(0)), 10);
+    assert_eq!(config.absolute_line_number(LineCount::from(4)), 14);
+}
+
+#[test]
+fn relative_line_numbers_show_absolute_value_on_active_line() {
+    let config = config(
+        CodeEditorLineNumberMode::Relative,
+        None,
+        Some(LineCount::from(4)),
+    );
+    assert_eq!(config.display_line_number(LineCount::from(4)), 5);
+}
+
+#[test]
+fn relative_line_numbers_show_distance_above_and_below_active_line() {
+    let config = config(
+        CodeEditorLineNumberMode::Relative,
+        None,
+        Some(LineCount::from(5)),
+    );
+    assert_eq!(config.display_line_number(LineCount::from(2)), 3);
+    assert_eq!(config.display_line_number(LineCount::from(8)), 3);
+}
+
+#[test]
+fn relative_line_numbers_fall_back_to_absolute_without_active_line() {
+    let config = config(CodeEditorLineNumberMode::Relative, None, None);
+    assert_eq!(config.display_line_number(LineCount::from(4)), 5);
+}
+
+#[test]
+fn relative_line_numbers_use_starting_line_number_for_active_line_only() {
+    let config = config(
+        CodeEditorLineNumberMode::Relative,
+        Some(10),
+        Some(LineCount::from(4)),
+    );
+    assert_eq!(config.display_line_number(LineCount::from(4)), 14);
+    assert_eq!(config.display_line_number(LineCount::from(1)), 3);
+}

app/src/code/editor/view.rs

@@ -1,6 +1,5 @@
 #![cfg_attr(target_family = "wasm", allow(dead_code, unused_imports))]
 // Adding this file level gate as some of the code around editability is not used in WASM yet.
-
 use std::collections::{HashMap, HashSet};
 use std::fmt::Debug;
 use std::ops::Range;
@@ -11,6 +10,7 @@ use ai::diff_validation::DiffDelta;
 use lazy_static::lazy_static;
 use num_traits::SaturatingSub;
 use pathfinder_geometry::vector::vec2f;
+use settings::Setting as _;
 use string_offset::CharOffset;
 use vec1::{vec1, Vec1};
 use vim::vim::{Direction, InsertPosition, VimMode, VimModel, VimState, VimSubscriber};
@@ -78,7 +78,7 @@ use crate::code_review::comments::{CommentId, CommentOrigin};
 use crate::editor::InteractionState;
 use crate::features::FeatureFlag;
 use crate::notebooks::editor::rich_text_styles;
-use crate::settings::{AppEditorSettings, FontSettings};
+use crate::settings::{AppEditorSettings, CodeEditorLineNumberMode, FontSettings};
 use crate::view_components::find::FindDirection;
 
 mod actions;
@@ -308,6 +308,10 @@ impl CodeEditorView {
         ctx.subscribe_to_model(&font_settings_handle, |me, _, _, ctx| {
             me.handle_appearance_or_font_change(ctx);
         });
+        let app_editor_settings_handle = AppEditorSettings::handle(ctx);
+        ctx.subscribe_to_model(&app_editor_settings_handle, |_, _, _, ctx| {
+            ctx.notify();
+        });
 
         let model = ctx.add_model(|ctx| {
             CodeEditorModel::new(
@@ -1203,18 +1207,32 @@ impl CodeEditorView {
         let appearance = Appearance::as_ref(ctx);
         let theme = appearance.theme();
         if self.display_options.show_line_numbers {
+            let editor_settings = AppEditorSettings::as_ref(ctx);
             Some(LineNumberConfig {
                 font_family: appearance.monospace_font_family(),
                 font_size: appearance.monospace_font_size(),
                 text_color: theme.sub_text_color(theme.background()).into(),
                 highlight_text_color: theme.main_text_color(theme.background()).into(),
                 starting_line_number: self.display_options.starting_line_number,
+                mode: *editor_settings.code_editor_line_number_mode.value(),
+                active_line_number: self.active_cursor_line_for_line_numbers(ctx),
+                active_cursor_is_visible: self.is_focused(ctx) && self.is_editable(ctx),
             })
         } else {
             None
         }
     }
 
+    fn active_cursor_line_for_line_numbers(&self, ctx: &AppContext) -> Option<LineCount> {
+        let model = self.model.as_ref(ctx);
+        let selection = *model.selections(ctx).first();
+        let buffer = model.content().as_ref(ctx);
+        let point = selection.head.to_buffer_point(buffer);
+        // `LineCount`s used by render blocks are zero-based, while buffer points report rows using
+        // the editor's one-based convention.
+        Some(LineCount::from(point.row.saturating_sub(1) as usize))
+    }
+
     fn run_find(&mut self, query: &str, ctx: &mut ViewContext<Self>) {
         self.searcher.update(ctx, |searcher, ctx| {
             searcher.set_query(query.to_string(), ctx);
@@ -1240,6 +1258,14 @@ impl CodeEditorView {
                 self.reset_for_editing_change();
                 self.vim_maybe_enforce_cursor_line_cap(ctx);
                 ctx.emit(CodeEditorEvent::SelectionChanged);
+                if *AppEditorSettings::as_ref(ctx)
+                    .code_editor_line_number_mode
+                    .value()
+                    == CodeEditorLineNumberMode::Relative
+                {
+                    // Repaint relative line-number gutters when the cursor origin changes.
+                    ctx.notify();
+                }
             }
             CodeEditorModelEvent::ContentChanged { origin } => {
                 if origin.from_user() {
@@ -2425,6 +2451,17 @@ impl CodeEditorView {
         };
         self.handle_goto_line_event(&event, ctx);
     }
+
+    pub fn displayed_line_number_for_test(
+        &self,
+        one_based_line_number: usize,
+        ctx: &AppContext,
+    ) -> Option<usize> {
+        let line_number_config = self.line_number_config(ctx)?;
+        let line_count = LineCount::from(one_based_line_number.checked_sub(1)?);
+
+        Some(line_number_config.display_line_number(line_count))
+    }
 }
 
 #[cfg(test)]

app/src/integration_testing/goto_line.rs

@@ -1,9 +1,11 @@
+use settings::Setting as _;
 use warp_editor::content::buffer::ToBufferPoint;
 use warpui::integration::AssertionCallback;
-use warpui::{async_assert, async_assert_eq, App, ViewHandle, WindowId};
+use warpui::{async_assert, async_assert_eq, App, SingletonEntity, ViewHandle, WindowId};
 
 use crate::code::editor::goto_line::view::GoToLineView;
 use crate::code::editor::view::CodeEditorView;
+use crate::settings::{AppEditorSettings, CodeEditorLineNumberMode};
 
 fn file_code_editor_view(app: &App, window_id: WindowId) -> ViewHandle<CodeEditorView> {
     let views = app
@@ -39,6 +41,43 @@ pub fn goto_line_confirm(app: &mut App, window_id: WindowId, input: &str) {
         view.goto_line_confirm_for_test(&input_owned, ctx);
     });
 }
+pub fn set_code_editor_line_number_mode(app: &mut App, mode: CodeEditorLineNumberMode) {
+    app.update(|ctx| {
+        AppEditorSettings::handle(ctx).update(ctx, |settings, ctx| {
+            settings
+                .code_editor_line_number_mode
+                .set_value(mode, ctx)
+                .expect("failed to serialize CodeEditorLineNumberModeSetting");
+            ctx.notify();
+        });
+    });
+}
+
+/// Asserts code editor line numbers with `(logical_line_number, expected_displayed_line_number)` pairs.
+pub fn assert_code_editor_line_numbers(expected: Vec<(usize, usize)>) -> AssertionCallback {
+    Box::new(move |app, window_id| {
+        let editor = file_code_editor_view(app, window_id);
+        let actual = editor.read(app, |editor, ctx| {
+            expected
+                .iter()
+                .map(|(line, _)| {
+                    (
+                        *line,
+                        editor
+                            .displayed_line_number_for_test(*line, ctx)
+                            .expect("line numbers should be enabled for file code editor"),
+                    )
+                })
+                .collect::<Vec<_>>()
+        });
+
+        async_assert_eq!(
+            actual,
+            expected,
+            "Expected code editor line numbers to match"
+        )
+    })
+}
 
 pub fn assert_goto_line_dialog_is_open(expected: bool) -> AssertionCallback {
     Box::new(move |app, window_id| {

app/src/settings/editor.rs

@@ -78,6 +78,38 @@ impl Display for CursorDisplayType {
     }
 }
 
+#[derive(
+    Clone,
+    Copy,
+    Debug,
+    Default,
+    Eq,
+    PartialEq,
+    Deserialize,
+    Serialize,
+    Sequence,
+    schemars::JsonSchema,
+    settings_value::SettingsValue,
+)]
+#[schemars(
+    description = "How line numbers are displayed in code editors.",
+    rename_all = "snake_case"
+)]
+pub enum CodeEditorLineNumberMode {
+    #[default]
+    Absolute,
+    Relative,
+}
+
+impl CodeEditorLineNumberMode {
+    pub fn dropdown_item_label(&self) -> &'static str {
+        match self {
+            Self::Absolute => "Absolute",
+            Self::Relative => "Relative",
+        }
+    }
+}
+
 #[derive(Clone, Copy, Default, Debug, Serialize, Deserialize, PartialEq)]
 pub enum TabBehavior {
     #[default]
@@ -194,6 +226,15 @@ define_settings_group!(AppEditorSettings, settings: [
         toml_path: "text_editing.vim_status_bar",
         description: "Whether the Vim status bar is displayed.",
     },
+    code_editor_line_number_mode: CodeEditorLineNumberModeSetting {
+        type: CodeEditorLineNumberMode,
+        default: CodeEditorLineNumberMode::default(),
+        supported_platforms: SupportedPlatforms::ALL,
+        sync_to_cloud: SyncToCloud::Globally(RespectUserSyncSetting::Yes),
+        private: false,
+        toml_path: "text_editing.code_editor_line_number_mode",
+        description: "How line numbers are displayed in code editors.",
+    },
     autocomplete_symbols: AutocompleteSymbols {
         type: bool,
         default: true,