fixed, removed log library

login waiting dialog works, THIS COMMIT NEEDS TO BE REFACTORED
canvas edit mode movement fixed
2025-04-18 14:58:05 +02:00 · 2025-04-18 14:44:04 +02:00 · 2025-04-18 13:10:39 +02:00 · 2025-04-18 12:29:29 +02:00 · 2025-04-18 12:20:08 +02:00 · 2025-04-18 11:35:15 +02:00
127 changed files with 10169 additions and 1889 deletions
--- a/.env_template
+++ b/.env_template
@@ -4,3 +4,5 @@ RUST_DB_USER=multi_psql_dev
 RUST_DB_PASSWORD=3
 RUST_DB_HOST=localhost
 RUST_DB_PORT=5432
+
+JWT_SECRET=<YOUR-JWT-HERE>
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -170,9 +170,9 @@ dependencies = [

 [[package]]
 name = "async-trait"
-version = "0.1.87"
+version = "0.1.88"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d556ec1359574147ec0c4fc5eb525f3f23263a592b1a9c07e0a75b427de55c97"
+checksum = "e539d3fca749fcee5236ab05e93a52867dd549cc157c8cb7f99595f3cedffdb5"
 dependencies = [
 "proc-macro2",
 "quote",
@@ -274,6 +274,19 @@ version = "1.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "8c3c1a368f70d6cf7302d78f8f7093da241fb8e8807c05cc9e51a125895a6d5b"

+[[package]]
+name = "bcrypt"
+version = "0.17.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "92758ad6077e4c76a6cadbce5005f666df70d4f13b19976b1a8062eef880040f"
+dependencies = [
+ "base64",
+ "blowfish",
+ "getrandom 0.3.1",
+ "subtle",
+ "zeroize",
+]
+
 [[package]]
 name = "bigdecimal"
 version = "0.4.7"
@@ -323,6 +336,16 @@ dependencies = [
 "generic-array",
 ]

+[[package]]
+name = "blowfish"
+version = "0.9.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e412e2cd0f2b2d93e02543ceae7917b3c70331573df19ee046bcbc35e45e87d7"
+dependencies = [
+ "byteorder",
+ "cipher",
+]
+
 [[package]]
 name = "bumpalo"
 version = "3.17.0"
@@ -387,20 +410,35 @@ dependencies = [
 ]

 [[package]]
-name = "client"
-version = "0.1.0"
+name = "cipher"
+version = "0.4.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "773f3b9af64447d2ce9850330c473515014aa235e6a783b02db81ff39e4a3dad"
 dependencies = [
+ "crypto-common",
+ "inout",
+]
+
+[[package]]
+name = "client"
+version = "0.3.13"
+dependencies = [
+ "async-trait",
 "common",
 "crossterm",
 "dirs 6.0.0",
 "dotenvy",
+ "lazy_static",
 "prost",
 "ratatui",
 "serde",
+ "time",
 "tokio",
 "toml",
 "tonic",
 "tracing",
+ "unicode-segmentation",
+ "unicode-width 0.2.0",
 ]

 [[package]]
@@ -424,7 +462,7 @@ dependencies = [

 [[package]]
 name = "common"
-version = "0.1.0"
+version = "0.3.13"
 dependencies = [
 "prost",
 "serde",
@@ -676,9 +714,9 @@ dependencies = [

 [[package]]
 name = "deranged"
-version = "0.3.11"
+version = "0.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b42b6fa04a440b495c8b04d0e71b707c585f83cb9cb28cf8cd0d976c315e31b4"
+checksum = "9c9e6a11ca8224451684bc0d7d5a7adbf8f2fd6887261a1cfc3c0432f9d4068e"
 dependencies = [
 "powerfmt",
 ]
@@ -782,7 +820,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "33d852cb9b869c2a9b3df2f71a3074817f01e1844f839a144f5fcef059a4eb5d"
 dependencies = [
 "libc",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -991,8 +1029,10 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "c4567c8db10ae91089c99af84c68c38da3ec2f087c3f82960bcdbf3656b6f4d7"
 dependencies = [
 "cfg-if",
+ "js-sys",
 "libc",
 "wasi 0.11.0+wasi-snapshot-preview1",
+ "wasm-bindgen",
 ]

 [[package]]
@@ -1452,6 +1492,15 @@ version = "2.0.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f4c7245a08504955605670dbf141fceab975f15ca21570696aebe9d2e71576bd"

+[[package]]
+name = "inout"
+version = "0.1.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "879f10e63c20629ecabbb64a8010319738c66a5cd0c29b02d63d272b03751d01"
+dependencies = [
+ "generic-array",
+]
+
 [[package]]
 name = "instability"
 version = "0.3.7"
@@ -1499,6 +1548,21 @@ dependencies = [
 "wasm-bindgen",
 ]

+[[package]]
+name = "jsonwebtoken"
+version = "9.3.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5a87cc7a48537badeae96744432de36f4be2b4a34a05a5ef32e9dd8a1c169dde"
+dependencies = [
+ "base64",
+ "js-sys",
+ "pem",
+ "ring",
+ "serde",
+ "serde_json",
+ "simple_asn1",
+]
+
 [[package]]
 name = "lasso"
 version = "0.7.3"
@@ -1592,9 +1656,9 @@ dependencies = [

 [[package]]
 name = "log"
-version = "0.4.26"
+version = "0.4.27"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "30bde2b3dc3671ae49d8e2e9f044c7c005836e7a023ee57cffa25ab82764bb9e"
+checksum = "13dc2df351e3202783a1fe0d44375f7295ffb4049267b0f3018346dc122a1d94"

 [[package]]
 name = "lru"
@@ -1886,6 +1950,16 @@ version = "1.0.15"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "57c0d7b74b563b49d38dae00a0c37d4d6de9b432382b2892f0574ddcae73fd0a"

+[[package]]
+name = "pem"
+version = "3.0.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "38af38e8470ac9dee3ce1bae1af9c1671fffc44ddfd8bd1d0a3445bf349a8ef3"
+dependencies = [
+ "base64",
+ "serde",
+]
+
 [[package]]
 name = "pem-rfc7468"
 version = "0.7.0"
@@ -2030,6 +2104,28 @@ dependencies = [
 "toml_edit",
 ]

+[[package]]
+name = "proc-macro-error-attr2"
+version = "2.0.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "96de42df36bb9bba5542fe9f1a054b8cc87e172759a1868aa05c1f3acc89dfc5"
+dependencies = [
+ "proc-macro2",
+ "quote",
+]
+
+[[package]]
+name = "proc-macro-error2"
+version = "2.0.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "11ec05c52be0a07b08061f7dd003e7d7092e0472bc731b4af7bb1ef876109802"
+dependencies = [
+ "proc-macro-error-attr2",
+ "proc-macro2",
+ "quote",
+ "syn 2.0.99",
+]
+
 [[package]]
 name = "proc-macro2"
 version = "1.0.94"
@@ -2281,6 +2377,20 @@ dependencies = [
 "tstr",
 ]

+[[package]]
+name = "ring"
+version = "0.17.14"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a4689e6c2294d81e88dc6261c768b63bc4fcdb852be6d1352498b114f61383b7"
+dependencies = [
+ "cc",
+ "cfg-if",
+ "getrandom 0.2.15",
+ "libc",
+ "untrusted",
+ "windows-sys 0.52.0",
+]
+
 [[package]]
 name = "rsa"
 version = "0.9.7"
@@ -2356,7 +2466,7 @@ dependencies = [
 "errno",
 "libc",
 "linux-raw-sys 0.4.15",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -2369,7 +2479,7 @@ dependencies = [
 "errno",
 "libc",
 "linux-raw-sys 0.9.2",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -2483,12 +2593,14 @@ dependencies = [

 [[package]]
 name = "server"
-version = "0.1.0"
+version = "0.3.13"
 dependencies = [
+ "bcrypt",
 "chrono",
 "common",
 "dashmap",
 "dotenvy",
+ "jsonwebtoken",
 "lazy_static",
 "prost",
 "regex",
@@ -2504,6 +2616,8 @@ dependencies = [
 "tonic",
 "tonic-reflection",
 "tracing",
+ "uuid",
+ "validator",
 ]

 [[package]]
@@ -2574,6 +2688,18 @@ dependencies = [
 "rand_core 0.6.4",
 ]

+[[package]]
+name = "simple_asn1"
+version = "0.6.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "297f631f50729c8c99b84667867963997ec0b50f32b2a7dbcab828ef0541e8bb"
+dependencies = [
+ "num-bigint",
+ "num-traits",
+ "thiserror 2.0.12",
+ "time",
+]
+
 [[package]]
 name = "sized-chunks"
 version = "0.6.5"
@@ -2678,6 +2804,7 @@ dependencies = [
 "tokio-stream",
 "tracing",
 "url",
+ "uuid",
 ]

 [[package]]
@@ -2760,6 +2887,7 @@ dependencies = [
 "thiserror 2.0.12",
 "time",
 "tracing",
+ "uuid",
 "whoami",
 ]

@@ -2799,6 +2927,7 @@ dependencies = [
 "thiserror 2.0.12",
 "time",
 "tracing",
+ "uuid",
 "whoami",
 ]

@@ -2825,6 +2954,7 @@ dependencies = [
 "time",
 "tracing",
 "url",
+ "uuid",
 ]

 [[package]]
@@ -3029,7 +3159,7 @@ dependencies = [
 "getrandom 0.3.1",
 "once_cell",
 "rustix 1.0.1",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -3083,9 +3213,9 @@ dependencies = [

 [[package]]
 name = "time"
-version = "0.3.39"
+version = "0.3.41"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "dad298b01a40a23aac4580b67e3dbedb7cc8402f3592d7f49469de2ea4aecdd8"
+checksum = "8a7619e19bc266e0f9c5e6686659d394bc57973859340060a69221e57dbc0c40"
 dependencies = [
 "deranged",
 "itoa",
@@ -3100,15 +3230,15 @@ dependencies = [

 [[package]]
 name = "time-core"
-version = "0.1.3"
+version = "0.1.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "765c97a5b985b7c11d7bc27fa927dc4fe6af3a6dfb021d28deb60d3bf51e76ef"
+checksum = "c9e9a38711f559d9e3ce1cdb06dd7c5b8ea546bc90052da6d06bb76da74bb07c"

 [[package]]
 name = "time-macros"
-version = "0.2.20"
+version = "0.2.22"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e8093bc3e81c3bc5f7879de09619d06c9a5a5e45ca44dfeeb7225bae38005c5c"
+checksum = "3526739392ec93fd8b359c8e98514cb3e8e021beb4e5f597b00a0221f8ed8a49"
 dependencies = [
 "num-conv",
 "time-core",
@@ -3450,6 +3580,12 @@ version = "0.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1fc81956842c57dac11422a97c3b8195a1ff727f06e85c84ed2e8aa277c9a0fd"

+[[package]]
+name = "untrusted"
+version = "0.9.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8ecb6da28b8a351d773b68d5825ac39017e680750f980f3a1a85cd8dd28a47c1"
+
 [[package]]
 name = "url"
 version = "2.5.4"
@@ -3473,6 +3609,46 @@ version = "1.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b6c140620e7ffbb22c2dee59cafe6084a59b5ffc27a8859a5f0d494b5d52b6be"

+[[package]]
+name = "uuid"
+version = "1.16.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "458f7a779bf54acc9f347480ac654f68407d3aab21269a6e3c9f922acd9e2da9"
+dependencies = [
+ "getrandom 0.3.1",
+ "serde",
+]
+
+[[package]]
+name = "validator"
+version = "0.20.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "43fb22e1a008ece370ce08a3e9e4447a910e92621bb49b85d6e48a45397e7cfa"
+dependencies = [
+ "idna",
+ "once_cell",
+ "regex",
+ "serde",
+ "serde_derive",
+ "serde_json",
+ "url",
+ "validator_derive",
+]
+
+[[package]]
+name = "validator_derive"
+version = "0.20.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b7df16e474ef958526d1205f6dda359fdfab79d9aa6d54bafcb92dcd07673dca"
+dependencies = [
+ "darling",
+ "once_cell",
+ "proc-macro-error2",
+ "proc-macro2",
+ "quote",
+ "syn 2.0.99",
+]
+
 [[package]]
 name = "vcpkg"
 version = "0.2.15"
@@ -3623,7 +3799,7 @@ version = "0.1.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "cf221c93e13a30d793f7645a0e7762c55d169dbb0a49671918a2319d289b10bb"
 dependencies = [
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -5,7 +5,7 @@ resolver = "2"
 [workspace.package]
 # TODO: idk how to do the name, fix later
 # name = "Multieko2"
-version = "0.1.0"
+version = "0.3.13"
 edition = "2021"
 license = "GPL-3.0-or-later"
 authors = ["Filip Priečinský <filippriec@gmail.com>"]
--- a/README.md
+++ b/README.md
@@ -1,5 +1,7 @@
 # Hey

+This is only work in progress, until release 1.0.0 this is for development use cases only.
+
 I run development like this:

 Server:
--- a/client/Cargo.toml
+++ b/client/Cargo.toml
@@ -5,15 +5,20 @@ edition.workspace = true
 license.workspace = true

 [dependencies]
+async-trait = "0.1.88"
 common = { path = "../common" }

 crossterm = "0.28.1"
 dirs = "6.0.0"
 dotenvy = "0.15.7"
+lazy_static = "1.5.0"
 prost = "0.13.5"
 ratatui = "0.29.0"
 serde = { version = "1.0.218", features = ["derive"] }
+time = "0.3.41"
 tokio = { version = "1.43.0", features = ["full", "macros"] }
 toml = "0.8.20"
 tonic = "0.12.3"
 tracing = "0.1.41"
+unicode-segmentation = "1.12.0"
+unicode-width = "0.2.0"
--- a/client/config.toml
+++ b/client/config.toml
@@ -2,15 +2,20 @@
 [keybindings]

 enter_command_mode = [":", "ctrl+;"]
+next_buffer = ["ctrl+l"]
+previous_buffer = ["ctrl+h"] 

-[keybindings.intro]
-next_option = ["j", "Right"]
-previous_option = ["k", "Left"]
+[keybindings.general]
+move_up = ["k", "Up"]
+move_down = ["j", "Down"]
+next_option = ["l", "Right"]
+previous_option = ["h", "Left"]
 select = ["Enter"]
-
-[keybindings.admin]
-move_up = ["k"]
-move_down = ["j"]
+toggle_sidebar = ["ctrl+t"]
+toggle_buffer_list = ["ctrl+b"]
+next_field = ["Tab"]
+prev_field = ["Shift+Tab"]
+exit_table_scroll = ["esc"]

 [keybindings.common]
 save = ["ctrl+s"]
@@ -23,6 +28,7 @@ save_and_quit = ["ctrl+shift+s"]
 move_up = ["Up"]
 move_down = ["Down"]
 toggle_sidebar = ["ctrl+t"]
+toggle_buffer_list = ["ctrl+b"]

 # MODE SPECIFIC
 # READ ONLY MODE
@@ -44,15 +50,28 @@ move_line_start = ["0"]
 move_line_end = ["$"]
 move_first_line = ["gg"]
 move_last_line = ["x"]
+enter_highlight_mode = ["v"]
+enter_highlight_mode_linewise = ["ctrl+v"]
+
+[keybindings.highlight]
+exit_highlight_mode = ["esc"]
+enter_highlight_mode_linewise = ["ctrl+v"]

 [keybindings.edit]
-exit_edit_mode = ["esc","ctrl+e"]
+# BIG CHANGES NOW EXIT HANDLES EITHER IF THOSE
+# exit_edit_mode = ["esc","ctrl+e"]
+# exit_suggestion_mode = ["esc"]
+# select_suggestion = ["enter"]
+# next_field = ["enter"]
+enter_decider = ["enter"]
+prev_field = ["shift+enter"]
+exit = ["esc", "ctrl+e"]
 delete_char_forward = ["delete"]
 delete_char_backward = ["backspace"]
-next_field = ["tab", "enter"]
-prev_field = ["shift+tab", "backtab"]
 move_left = ["left"]
 move_right = ["right"]
+suggestion_down = ["ctrl+n", "tab"]
+suggestion_up = ["ctrl+p", "shift+tab"]

 [keybindings.command]
 exit_command_mode = ["ctrl+g", "esc"]
--- a/client/src/components/admin.rs
+++ b/client/src/components/admin.rs
@@ -1,4 +1,8 @@
 // src/components/admin.rs
 pub mod admin_panel;
+pub mod admin_panel_admin;
+pub mod add_table;

 pub use admin_panel::*;
+pub use admin_panel_admin::*;
+pub use add_table::*;
--- a/client/src/components/admin/add_table.rs
+++ b/client/src/components/admin/add_table.rs
@@ -0,0 +1,501 @@
+// src/components/admin/add_table.rs
+use crate::config::colors::themes::Theme;
+use crate::state::app::highlight::HighlightState;
+use crate::state::app::state::AppState;
+use crate::state::pages::add_table::{AddTableFocus, AddTableState};
+use crate::state::pages::canvas_state::CanvasState;
+// use crate::state::pages::add_table::{ColumnDefinition, LinkDefinition}; // Not directly used here
+use ratatui::{
+    layout::{Alignment, Constraint, Direction, Layout, Rect},
+    style::{Modifier, Style},
+    text::{Line, Span},
+    widgets::{Block, BorderType, Borders, Cell, Paragraph, Row, Table},
+    Frame,
+};
+use crate::components::handlers::canvas::render_canvas;
+use crate::components::common::dialog;
+
+/// Renders the Add New Table page layout, structuring the display of table information,
+/// input fields, and action buttons. Adapts layout based on terminal width.
+pub fn render_add_table(
+    f: &mut Frame,
+    area: Rect,
+    theme: &Theme,
+    app_state: &AppState, // Currently unused, might be needed later
+    add_table_state: &mut AddTableState,
+    is_edit_mode: bool, // Determines if canvas inputs are in edit mode
+    highlight_state: &HighlightState, // For text highlighting in canvas
+) {
+    // --- Configuration ---
+    // Threshold width to switch between wide and narrow layouts
+    const NARROW_LAYOUT_THRESHOLD: u16 = 120; // Adjust this value as needed
+
+    // --- State Checks ---
+    let focus_on_canvas_inputs = matches!(
+        add_table_state.current_focus,
+        AddTableFocus::InputTableName
+            | AddTableFocus::InputColumnName
+            | AddTableFocus::InputColumnType
+    );
+
+    // --- Main Page Block ---
+    let main_block = Block::default()
+        .title(" Add New Table ")
+        .title_alignment(Alignment::Center)
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(Style::default().fg(theme.border))
+        .style(Style::default().bg(theme.bg));
+    let inner_area = main_block.inner(area);
+    f.render_widget(main_block, area);
+
+    // --- Fullscreen Columns Table Check (Narrow Screens Only) ---
+    if area.width < NARROW_LAYOUT_THRESHOLD && add_table_state.current_focus == AddTableFocus::InsideColumnsTable {
+        // Render ONLY the columns table taking the full inner area
+        let columns_border_style = Style::default().fg(theme.highlight); // Always highlighted when fullscreen
+        let column_rows: Vec<Row<'_>> = add_table_state
+            .columns
+            .iter()
+            .map(|col_def| {
+                Row::new(vec![
+                    Cell::from(if col_def.selected { "[*]" } else { "[ ]" }),
+                    Cell::from(col_def.name.clone()),
+                    Cell::from(col_def.data_type.clone()),
+                ])
+                .style(Style::default().fg(theme.fg))
+            })
+            .collect();
+        let header_cells = ["Sel", "Name", "Type"]
+            .iter()
+            .map(|h| Cell::from(*h).style(Style::default().fg(theme.accent)));
+        let header = Row::new(header_cells).height(1).bottom_margin(1);
+        let columns_table = Table::new(column_rows, [Constraint::Length(5), Constraint::Percentage(50), Constraint::Percentage(50)])
+            .header(header)
+            .block(
+                Block::default()
+                    .title(Span::styled(" Columns (Fullscreen) ", theme.fg)) // Indicate fullscreen
+                    .title_alignment(Alignment::Center)
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Rounded)
+                    .border_style(columns_border_style),
+            )
+            .row_highlight_style(
+                Style::default()
+                .add_modifier(Modifier::REVERSED)
+                .fg(theme.highlight),
+            )
+            .highlight_symbol(" > "); // Use the inside symbol
+        f.render_stateful_widget(columns_table, inner_area, &mut add_table_state.column_table_state);
+        return; // IMPORTANT: Stop rendering here for fullscreen mode
+    }
+
+    // --- Area Variable Declarations ---
+    let top_info_area: Rect;
+    let columns_area: Rect;
+    let canvas_area: Rect;
+    let add_button_area: Rect;
+    let indexes_area: Rect;
+    let links_area: Rect;
+    let bottom_buttons_area: Rect;
+
+    // --- Layout Decision ---
+    if area.width >= NARROW_LAYOUT_THRESHOLD {
+        // --- WIDE Layout (Based on first screenshot) ---
+        let main_chunks = Layout::default()
+            .direction(Direction::Vertical)
+            .constraints([
+                Constraint::Length(3), // Top Info (Profile/Table Name) - Increased to 3 lines
+                Constraint::Min(10),   // Middle Area (Columns | Right Pane)
+                Constraint::Length(3), // Bottom Buttons
+            ])
+            .split(inner_area);
+
+        top_info_area = main_chunks[0];
+        let middle_area = main_chunks[1];
+        bottom_buttons_area = main_chunks[2];
+
+        // Split Middle Horizontally
+        let middle_chunks = Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([
+                Constraint::Percentage(50), // Left: Columns Table
+                Constraint::Percentage(50), // Right: Inputs etc.
+            ])
+            .split(middle_area);
+
+        columns_area = middle_chunks[0];
+        let right_pane_area = middle_chunks[1];
+
+        // Split Right Pane Vertically
+        let right_pane_chunks = Layout::default()
+            .direction(Direction::Vertical)
+            .constraints([
+                Constraint::Length(5), // Input Canvas Area
+                Constraint::Length(3), // Add Button Area
+                Constraint::Min(5),    // Indexes & Links Area
+            ])
+            .split(right_pane_area);
+
+        canvas_area = right_pane_chunks[0];
+        add_button_area = right_pane_chunks[1];
+        let indexes_links_area = right_pane_chunks[2];
+
+        // Split Indexes/Links Horizontally
+        let indexes_links_chunks = Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([
+                Constraint::Percentage(50), // Indexes Table
+                Constraint::Percentage(50), // Links Table
+            ])
+            .split(indexes_links_area);
+        indexes_area = indexes_links_chunks[0];
+        links_area = indexes_links_chunks[1];
+
+        // --- Top Info Rendering (Wide - 2 lines) ---
+        let profile_text = Paragraph::new(vec![
+            Line::from(Span::styled(
+                format!("Profile: {}", add_table_state.profile_name),
+                theme.fg,
+            )),
+            Line::from(Span::styled(
+                format!("Table name: {}", add_table_state.table_name),
+                theme.fg,
+            )),
+        ])
+        .block(
+            Block::default()
+                .borders(Borders::BOTTOM)
+                .border_style(Style::default().fg(theme.secondary)),
+        );
+        f.render_widget(profile_text, top_info_area);
+    } else {
+        // --- NARROW Layout (Based on second screenshot) ---
+        let main_chunks = Layout::default()
+            .direction(Direction::Vertical)
+            .constraints([
+                Constraint::Length(1), // Top: Profile & Table Name (Single Row)
+                Constraint::Length(5), // Column Definition Input Canvas Area
+                Constraint::Length(3), // Add Button Area
+                Constraint::Min(5),    // Columns Table Area
+                Constraint::Min(5),    // Indexes & Links Area
+                Constraint::Length(3), // Bottom: Save/Cancel Buttons
+            ])
+            .split(inner_area);
+
+        top_info_area = main_chunks[0];
+        canvas_area = main_chunks[1];
+        add_button_area = main_chunks[2];
+        columns_area = main_chunks[3];
+        let indexes_links_area = main_chunks[4];
+        bottom_buttons_area = main_chunks[5];
+
+        // Split Indexes/Links Horizontally
+        let indexes_links_chunks = Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([
+                Constraint::Percentage(50), // Indexes Table
+                Constraint::Percentage(50), // Links Table
+            ])
+            .split(indexes_links_area);
+        indexes_area = indexes_links_chunks[0];
+        links_area = indexes_links_chunks[1];
+
+        // --- Top Info Rendering (Narrow - 1 line) ---
+        let top_info_chunks = Layout::default()
+            .direction(Direction::Horizontal)
+            .constraints([
+                Constraint::Percentage(50),
+                Constraint::Percentage(50),
+            ])
+            .split(top_info_area);
+
+        let profile_text = Paragraph::new(Span::styled(
+            format!("Profile: {}", add_table_state.profile_name),
+            theme.fg,
+        ))
+        .alignment(Alignment::Left);
+        f.render_widget(profile_text, top_info_chunks[0]);
+
+        let table_name_text = Paragraph::new(Span::styled(
+            format!("Table: {}", add_table_state.table_name),
+            theme.fg,
+        ))
+        .alignment(Alignment::Left);
+        f.render_widget(table_name_text, top_info_chunks[1]);
+    }
+
+    // --- Common Widget Rendering (Uses calculated areas) ---
+
+    // --- Columns Table Rendering ---
+    let columns_focused = matches!(add_table_state.current_focus, AddTableFocus::ColumnsTable | AddTableFocus::InsideColumnsTable);
+    let columns_border_style = if columns_focused {
+        Style::default().fg(theme.highlight)
+    } else {
+        Style::default().fg(theme.secondary)
+    };
+    let column_rows: Vec<Row<'_>> = add_table_state
+        .columns
+        .iter()
+        .map(|col_def| {
+            Row::new(vec![
+                Cell::from(if col_def.selected { "[*]" } else { "[ ]" }),
+                Cell::from(col_def.name.clone()),
+                Cell::from(col_def.data_type.clone()),
+            ])
+            .style(Style::default().fg(theme.fg))
+        })
+        .collect();
+    let header_cells = ["Sel", "Name", "Type"]
+        .iter()
+        .map(|h| Cell::from(*h).style(Style::default().fg(theme.accent)));
+    let header = Row::new(header_cells).height(1).bottom_margin(1);
+    let columns_highlight_symbol = if add_table_state.current_focus == AddTableFocus::InsideColumnsTable { " > " } else { "   " };
+    let columns_table = Table::new(
+        column_rows,
+        [ // Define constraints for 3 columns: Sel, Name, Type
+            Constraint::Length(5),
+            Constraint::Percentage(60),
+            Constraint::Percentage(35),
+        ],
+    )
+    .header(header)
+    .block(
+        Block::default()
+            .title(Span::styled(" Columns ", theme.fg))
+            .title_alignment(Alignment::Center)
+            .borders(Borders::ALL)
+            .border_type(BorderType::Rounded)
+            .border_style(columns_border_style),
+    )
+    .row_highlight_style(
+        Style::default()
+            .add_modifier(Modifier::REVERSED)
+            .fg(theme.highlight),
+    )
+    .highlight_symbol(" > ");
+    f.render_stateful_widget(
+        columns_table,
+        columns_area,
+        &mut add_table_state.column_table_state,
+    );
+
+    // --- Canvas Rendering (Column Definition Input) ---
+    let _active_field_rect = render_canvas(
+        f,
+        canvas_area,
+        add_table_state,
+        &add_table_state.fields(),
+        &add_table_state.current_field(),
+        &add_table_state.inputs(),
+        theme,
+        is_edit_mode && focus_on_canvas_inputs,
+        highlight_state,
+    );
+
+    // --- Button Style Helpers ---
+    let get_button_style = |button_focus: AddTableFocus, current_focus| {
+        // Only handles text style (FG + Bold) now, no BG
+        let is_focused = current_focus == button_focus;
+        let base_style = Style::default().fg(if is_focused {
+            theme.highlight // Highlighted text color
+        } else {
+            theme.secondary // Normal text color
+        });
+        if is_focused {
+            base_style.add_modifier(Modifier::BOLD)
+        } else {
+            base_style
+        }
+    };
+    // Updated signature to accept bool and theme
+    let get_button_border_style = |is_focused: bool, theme: &Theme| {
+        if is_focused {
+            Style::default().fg(theme.highlight)
+        } else {
+            Style::default().fg(theme.secondary)
+        }
+    };
+
+    // --- Add Button Rendering ---
+    // Determine if the add button is focused
+    let is_add_button_focused = add_table_state.current_focus == AddTableFocus::AddColumnButton;
+
+    // Create the Add button Paragraph widget
+    let add_button = Paragraph::new(" Add ")
+        .style(get_button_style(AddTableFocus::AddColumnButton, add_table_state.current_focus)) // Use existing closure
+        .alignment(Alignment::Center)
+        .block(
+            Block::default()
+            .borders(Borders::ALL)
+            .border_type(BorderType::Rounded)
+            .border_style(get_button_border_style(is_add_button_focused, theme)), // Pass bool and theme
+        );
+
+    // Render the button in its designated area
+    f.render_widget(add_button, add_button_area);
+
+    // --- Indexes Table Rendering ---
+    let indexes_focused = matches!(add_table_state.current_focus, AddTableFocus::IndexesTable | AddTableFocus::InsideIndexesTable);
+    let indexes_border_style = if indexes_focused {
+        Style::default().fg(theme.highlight)
+    } else {
+        Style::default().fg(theme.secondary)
+    };
+    let index_rows: Vec<Row<'_>> = add_table_state
+        .indexes
+        .iter()
+        .map(|index_name| {
+            Row::new(vec![Cell::from(index_name.clone())])
+                .style(Style::default().fg(theme.fg))
+        })
+        .collect();
+    let index_header_cells = ["Column Name"]
+        .iter()
+        .map(|h| Cell::from(*h).style(Style::default().fg(theme.accent)));
+    let index_header = Row::new(index_header_cells).height(1).bottom_margin(1);
+    let indexes_highlight_symbol = if add_table_state.current_focus == AddTableFocus::InsideIndexesTable { " > " } else { "   " };
+    let indexes_table =
+        Table::new(index_rows, [Constraint::Percentage(100)])
+            .header(index_header)
+            .block(
+                Block::default()
+                    .title(Span::styled(" Indexes ", theme.fg))
+                    .title_alignment(Alignment::Center)
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Rounded)
+                    .border_style(indexes_border_style),
+            )
+            .row_highlight_style(
+                Style::default()
+                    .add_modifier(Modifier::REVERSED)
+                    .fg(theme.highlight),
+            )
+            .highlight_symbol(" > ");
+    f.render_stateful_widget(
+        indexes_table,
+        indexes_area,
+        &mut add_table_state.index_table_state,
+    );
+
+    // --- Links Table Rendering ---
+    let links_focused = matches!(add_table_state.current_focus, AddTableFocus::LinksTable | AddTableFocus::InsideLinksTable);
+    let links_border_style = if links_focused {
+        Style::default().fg(theme.highlight)
+    } else {
+        Style::default().fg(theme.secondary)
+    };
+    let link_rows: Vec<Row<'_>> = add_table_state
+        .links
+        .iter()
+        .map(|link_def| {
+            Row::new(vec![
+                Cell::from(link_def.linked_table_name.clone()),
+                Cell::from(if link_def.is_required { "[X]" } else { "[ ]" }),
+            ])
+            .style(Style::default().fg(theme.fg))
+        })
+        .collect();
+    let link_header_cells = ["Linked Table", "Selected"]
+        .iter()
+        .map(|h| Cell::from(*h).style(Style::default().fg(theme.accent)));
+    let link_header = Row::new(link_header_cells).height(1).bottom_margin(1);
+    let links_highlight_symbol = if add_table_state.current_focus == AddTableFocus::InsideLinksTable { " > " } else { "   " };
+    let links_table =
+        Table::new(link_rows, [Constraint::Percentage(80), Constraint::Min(5)])
+            .header(link_header)
+            .block(
+                Block::default()
+                    .title(Span::styled(" Links ", theme.fg))
+                    .title_alignment(Alignment::Center)
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Rounded)
+                    .border_style(links_border_style),
+            )
+            .row_highlight_style(
+                Style::default()
+                    .add_modifier(Modifier::REVERSED)
+                    .fg(theme.highlight),
+            )
+            .highlight_symbol(" > ");
+    f.render_stateful_widget(
+        links_table,
+        links_area,
+        &mut add_table_state.link_table_state,
+    );
+
+    // --- Save/Cancel Buttons Rendering ---
+    let bottom_button_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([
+            Constraint::Percentage(33), // Save Button
+            Constraint::Percentage(34), // Delete Button
+            Constraint::Percentage(33), // Cancel Button
+        ])
+        .split(bottom_buttons_area);
+
+    let save_button = Paragraph::new(" Save table ")
+        .style(get_button_style(
+            AddTableFocus::SaveButton,
+            add_table_state.current_focus,
+        ))
+        .alignment(Alignment::Center)
+        .block(
+            Block::default()
+                .borders(Borders::ALL)
+                .border_type(BorderType::Rounded)
+                .border_style(get_button_border_style(
+                    add_table_state.current_focus == AddTableFocus::SaveButton, // Pass bool
+                    theme,
+                )),
+        );
+    f.render_widget(save_button, bottom_button_chunks[0]);
+
+    let delete_button = Paragraph::new(" Delete Selected ")
+        .style(get_button_style(
+            AddTableFocus::DeleteSelectedButton,
+            add_table_state.current_focus,
+        ))
+        .alignment(Alignment::Center)
+        .block(
+            Block::default()
+                .borders(Borders::ALL)
+                .border_type(BorderType::Rounded)
+                .border_style(get_button_border_style(
+                    add_table_state.current_focus == AddTableFocus::DeleteSelectedButton, // Pass bool
+                    theme,
+                )),
+        );
+    f.render_widget(delete_button, bottom_button_chunks[1]);
+
+    let cancel_button = Paragraph::new(" Cancel ")
+        .style(get_button_style(
+            AddTableFocus::CancelButton,
+            add_table_state.current_focus,
+        ))
+        .alignment(Alignment::Center)
+        .block(
+            Block::default()
+                .borders(Borders::ALL)
+                .border_type(BorderType::Rounded)
+                .border_style(get_button_border_style(
+                    add_table_state.current_focus == AddTableFocus::CancelButton, // Pass bool
+                    theme,
+                )),
+        );
+    f.render_widget(cancel_button, bottom_button_chunks[2]);
+
+    // --- DIALOG ---
+    // Render the dialog overlay if it's active
+    if app_state.ui.dialog.dialog_show { // Use the passed-in app_state
+        dialog::render_dialog(
+            f,
+            f.area(), // Render over the whole frame area
+            theme,
+            &app_state.ui.dialog.dialog_title,
+            &app_state.ui.dialog.dialog_message,
+            &app_state.ui.dialog.dialog_buttons,
+            app_state.ui.dialog.dialog_active_button_index,
+            app_state.ui.dialog.is_loading,
+        );
+    }
+}
--- a/client/src/components/admin/admin_panel.rs
+++ b/client/src/components/admin/admin_panel.rs
@@ -1,118 +1,131 @@
 // src/components/admin/admin_panel.rs

+use crate::config::colors::themes::Theme;
+use crate::state::pages::auth::AuthState;
+use crate::state::app::state::AppState;
+use crate::state::pages::admin::AdminState;
+use common::proto::multieko2::table_definition::ProfileTreeResponse;
 use ratatui::{
-    widgets::{Block, BorderType, Borders, List, ListItem, ListState, Paragraph},
+    layout::{Alignment, Constraint, Direction, Layout, Rect},
    style::Style,
    text::{Line, Span, Text},
-    layout::{Alignment, Constraint, Direction, Layout, Rect},
+    widgets::{Block, BorderType, Borders, List, ListItem, Paragraph, Wrap},
    Frame,
 };
-use common::proto::multieko2::table_definition::ProfileTreeResponse;
-use crate::config::colors::themes::Theme;
+use super::admin_panel_admin::render_admin_panel_admin;

-pub struct AdminPanelState {
-    pub list_state: ListState,
-    pub profiles: Vec<String>,
+pub fn render_admin_panel(
+    f: &mut Frame,
+    app_state: &AppState,
+    auth_state: &AuthState,
+    admin_state: &mut AdminState,
+    area: Rect,
+    theme: &Theme,
+    profile_tree: &ProfileTreeResponse,
+    selected_profile: &Option<String>,
+) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(Style::default().fg(theme.accent))
+        .style(Style::default().bg(theme.bg));
+
+    let inner_area = block.inner(area);
+    f.render_widget(block, area);
+
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Length(3), Constraint::Min(1)])
+        .split(inner_area);
+
+    // Content
+    let content_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([Constraint::Percentage(30), Constraint::Percentage(70)])
+        .split(chunks[1]);
+
+    if auth_state.role.as_deref() != Some("admin") {
+        render_admin_panel_non_admin(
+            f,
+            admin_state,
+            &content_chunks,
+            theme,
+            profile_tree,
+            selected_profile,
+        );
+    } else {
+        render_admin_panel_admin(
+            f,
+            chunks[1],
+            app_state,
+            admin_state,
+            theme,
+        );
+    }
 }

-impl AdminPanelState {
-    pub fn new(profiles: Vec<String>) -> Self {
-        let mut list_state = ListState::default();
-        if !profiles.is_empty() {
-            list_state.select(Some(0));
-        }
-        Self { list_state, profiles }
-    }
-
-    pub fn next(&mut self) {
-        let i = self.list_state.selected().map_or(0, |i| 
-            if i >= self.profiles.len() - 1 { 0 } else { i + 1 });
-        self.list_state.select(Some(i));
-    }
-
-    pub fn previous(&mut self) {
-        let i = self.list_state.selected().map_or(0, |i| 
-            if i == 0 { self.profiles.len() - 1 } else { i - 1 });
-        self.list_state.select(Some(i));
-    }
-
-    pub fn render(
-        &mut self,
-        f: &mut Frame,
-        area: Rect,
-        theme: &Theme,
-        profile_tree: &ProfileTreeResponse,
-        selected_profile: &Option<String>,
-    ) {
-        let block = Block::default()
-            .borders(Borders::ALL)
-            .border_type(BorderType::Rounded)
-            .border_style(Style::default().fg(theme.accent))
-            .style(Style::default().bg(theme.bg));
-
-        let inner_area = block.inner(area);
-        f.render_widget(block, area);
-
-        let chunks = Layout::default()
-            .direction(Direction::Vertical)
-            .constraints([Constraint::Length(3), Constraint::Min(1)])
-            .split(inner_area);
-
-        // Title
-        let title = Line::from(Span::styled("Admin Panel", Style::default().fg(theme.highlight)));
-        let title_widget = Paragraph::new(title).alignment(Alignment::Center);
-        f.render_widget(title_widget, chunks[0]);
-
-        // Content
-        let content_chunks = Layout::default()
-            .direction(Direction::Horizontal)
-            .constraints([Constraint::Percentage(30), Constraint::Percentage(70)])
-            .split(chunks[1]);
-
-        // Profile list
-        let items: Vec<ListItem> = self.profiles.iter()
-            .map(|p| ListItem::new(Line::from(vec![
+/// Renders the view for non-admin users (profile list and details).
+fn render_admin_panel_non_admin(
+    f: &mut Frame,
+    admin_state: &AdminState,
+    content_chunks: &[Rect],
+    theme: &Theme,
+    profile_tree: &ProfileTreeResponse,
+    selected_profile: &Option<String>,
+) {
+    // Profile list - Use data from admin_state
+    let items: Vec<ListItem> = admin_state
+        .profiles
+        .iter()
+        .map(|p| {
+            ListItem::new(Line::from(vec![
                Span::styled(
                    if Some(p) == selected_profile.as_ref() { "✓ " } else { "  " },
-                    Style::default().fg(theme.accent)
+                    Style::default().fg(theme.accent),
                ),
                Span::styled(p, Style::default().fg(theme.fg)),
-            ])))
-            .collect();
+            ]))
+        })
+        .collect();

-        let list = List::new(items)
-            .block(Block::default().title("Profiles"))
-            .highlight_style(Style::default().bg(theme.highlight).fg(theme.bg));
-        
-        f.render_stateful_widget(list, content_chunks[0], &mut self.list_state);
+    let list = List::new(items)
+        .block(Block::default().title("Profiles"))
+        .highlight_style(Style::default().bg(theme.highlight).fg(theme.bg));

-        // Profile details
-        if let Some(profile) = self.list_state.selected()
-            .and_then(|i| profile_tree.profiles.get(i)) 
-        {
-            let mut text = Text::default();
-            text.lines.push(Line::from(vec![
-                Span::styled("Profile: ", Style::default().fg(theme.accent)),
-                Span::styled(&profile.name, Style::default().fg(theme.highlight)),
-            ]));
+    let mut profile_list_state_clone = admin_state.profile_list_state.clone();
+    f.render_stateful_widget(list, content_chunks[0], &mut profile_list_state_clone);

-            text.lines.push(Line::from(""));
-            text.lines.push(Line::from(Span::styled("Tables:", Style::default().fg(theme.accent))));
-            
-            for table in &profile.tables {
-                let mut line = vec![Span::styled(format!("├─ {}", table.name), theme.fg)];
-                if !table.depends_on.is_empty() {
-                    line.push(Span::styled(
-                        format!(" → {}", table.depends_on.join(", ")),
-                        Style::default().fg(theme.secondary)
-                    ));
-                }
-                text.lines.push(Line::from(line));
+    // Profile details - Use selection info from admin_state
+    if let Some(profile) = admin_state
+        .get_selected_index()
+        .and_then(|i| profile_tree.profiles.get(i))
+    {
+        let mut text = Text::default();
+        text.lines.push(Line::from(vec![
+            Span::styled("Profile: ", Style::default().fg(theme.accent)),
+            Span::styled(&profile.name, Style::default().fg(theme.highlight)),
+        ]));
+
+        text.lines.push(Line::from(""));
+        text.lines.push(Line::from(Span::styled(
+            "Tables:",
+            Style::default().fg(theme.accent),
+        )));
+
+        for table in &profile.tables {
+            let mut line = vec![Span::styled(format!("├─ {}", table.name), theme.fg)];
+            if !table.depends_on.is_empty() {
+                line.push(Span::styled(
+                    format!(" → {}", table.depends_on.join(", ")),
+                    Style::default().fg(theme.secondary),
+                ));
            }
-
-            let details_widget = Paragraph::new(text)
-                .block(Block::default().title("Details"));
-            f.render_widget(details_widget, content_chunks[1]);
+            text.lines.push(Line::from(line));
        }
+
+        let details_widget = Paragraph::new(text)
+            .block(Block::default().title("Details"))
+            .wrap(Wrap { trim: true });
+        f.render_widget(details_widget, content_chunks[1]);
    }
 }
--- a/client/src/components/admin/admin_panel_admin.rs
+++ b/client/src/components/admin/admin_panel_admin.rs
@@ -0,0 +1,243 @@
+// src/components/admin/admin_panel_admin.rs
+
+use crate::config::colors::themes::Theme;
+use crate::state::pages::admin::{AdminFocus, AdminState};
+use crate::state::app::state::AppState;
+use ratatui::{
+    layout::{Alignment, Constraint, Direction, Layout, Rect},
+    style::Style,
+    text::{Line, Span, Text}, // Added Text
+    widgets::{Block, BorderType, Borders, List, ListItem, ListState, Paragraph},
+    Frame,
+};
+
+/// Renders the view specific to admin users with a three-pane layout.
+pub fn render_admin_panel_admin(
+    f: &mut Frame,
+    area: Rect,
+    app_state: &AppState,
+    admin_state: &mut AdminState,
+    theme: &Theme,
+) {
+    // Split vertically: Top for panes, Bottom for buttons
+    let main_chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Min(0), Constraint::Length(1)].as_ref()) // 1 line for buttons
+        .split(area);
+    let panes_area = main_chunks[0];
+    let buttons_area = main_chunks[1];
+
+    // Split the top area into three panes: Profiles | Tables | Dependencies
+    let pane_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([
+            Constraint::Percentage(25), // Profiles
+            Constraint::Percentage(40), // Tables
+            Constraint::Percentage(35), // Dependencies
+        ].as_ref())
+        .split(panes_area); // Use the whole area directly
+
+    let profiles_pane = pane_chunks[0];
+    let tables_pane = pane_chunks[1];
+    let deps_pane = pane_chunks[2];
+
+    // --- Profiles Pane (Left) ---
+    let profile_focus = admin_state.current_focus == AdminFocus::Profiles;
+    let profile_border_style = if profile_focus {
+        Style::default().fg(theme.highlight)
+    } else {
+        Style::default().fg(theme.border)
+    };
+
+    // Block for the profiles pane
+    let profiles_block = Block::default()
+        .title(" Profiles ")
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(profile_border_style);
+    let profiles_inner_area = profiles_block.inner(profiles_pane); // Get inner area for list
+    f.render_widget(profiles_block, profiles_pane); // Render the block itself
+
+    // Create profile list items
+    let profile_list_items: Vec<ListItem> = app_state
+        .profile_tree
+        .profiles
+        .iter()
+        .enumerate()
+        .map(|(idx, profile)| {
+            // Check persistent selection for prefix, navigation state for style/highlight
+            let is_selected = admin_state.selected_profile_index == Some(idx); // Use persistent state for [*]
+            let is_navigated = admin_state.profile_list_state.selected() == Some(idx); // Use nav state for highlight/>
+            let prefix = if is_selected { "[*] " } else { "[ ] " };
+            let style = if is_selected { // Style based on selection too
+                Style::default().fg(theme.highlight).add_modifier(ratatui::style::Modifier::BOLD)
+            } else {
+                Style::default().fg(theme.fg)
+            };
+            ListItem::new(Line::from(vec![
+                    Span::styled(prefix, style),
+                    Span::styled(&profile.name, style)
+            ]))
+        })
+    .collect();
+
+    // Build and render profile list inside the block's inner area
+    let profile_list = List::new(profile_list_items)
+        // Highlight style depends on focus AND navigation state
+        .highlight_style(if profile_focus { // Use focus state
+            Style::default().add_modifier(ratatui::style::Modifier::REVERSED)
+        } else {
+            Style::default()
+        })
+    .highlight_symbol(if profile_focus { "> " } else { "  " });
+
+    f.render_stateful_widget(profile_list, profiles_inner_area, &mut admin_state.profile_list_state);
+
+    // --- Tables Pane (Middle) ---
+    let table_focus = admin_state.current_focus == AdminFocus::Tables;
+    let table_border_style = if table_focus {
+        Style::default().fg(theme.highlight)
+    } else {
+        Style::default().fg(theme.border)
+    };
+
+    // Get selected profile information
+    let navigated_profile_idx = admin_state.profile_list_state.selected(); // Use nav state for display
+    let selected_profile_name = app_state
+        .profile_tree
+        .profiles
+        .get(navigated_profile_idx.unwrap_or(usize::MAX)) // Use nav state for title
+        .map_or("None", |p| &p.name);
+
+    // Block for the tables pane
+    let tables_block = Block::default()
+        .title(format!(" Tables (Profile: {}) ", selected_profile_name))
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(table_border_style);
+    let tables_inner_area = tables_block.inner(tables_pane); // Get inner area for list
+    f.render_widget(tables_block, tables_pane); // Render the block itself
+
+    // Create table list items and get dependencies for the selected table
+    let (table_list_items, selected_table_deps): (Vec<ListItem>, Vec<String>) = if let Some(
+        profile, // Get profile based on NAVIGATED profile index
+    ) = navigated_profile_idx.and_then(|idx| app_state.profile_tree.profiles.get(idx)) {
+        let items: Vec<ListItem> = profile
+            .tables
+            .iter()
+            .enumerate()
+            .map(|(idx, table)| { // Renamed i to idx for clarity
+                                  // Check persistent selection for prefix, navigation state for style/highlight
+                let is_selected = admin_state.selected_table_index == Some(idx); // Use persistent state for [*]
+                let is_navigated = admin_state.table_list_state.selected() == Some(idx); // Use nav state for highlight/>
+                let prefix = if is_selected { "[*] " } else { "[ ] " };
+                let style = if is_navigated { // Style based on navigation highlight
+                    Style::default().fg(theme.highlight).add_modifier(ratatui::style::Modifier::BOLD)
+                } else {
+                    Style::default().fg(theme.fg)
+                };
+                ListItem::new(Line::from(vec![
+                        Span::styled(prefix, style),
+                        Span::styled(&table.name, style),
+                ]))
+            })
+        .collect();
+
+        // Get dependencies only for the PERSISTENTLY selected table in the PERSISTENTLY selected profile
+        let chosen_profile_idx = admin_state.selected_profile_index; // Use persistent profile selection
+        let deps = chosen_profile_idx // Start with the chosen profile index
+            .and_then(|p_idx| app_state.profile_tree.profiles.get(p_idx)) // Get the chosen profile
+            .and_then(|p| admin_state.selected_table_index.and_then(|t_idx| p.tables.get(t_idx))) // Get the chosen table using its index
+            .map_or(Vec::new(), |t| t.depends_on.clone()); // If found, clone its depends_on, otherwise return empty Vec
+
+        (items, deps)
+    } else {
+        // Default when no profile is selected
+        (vec![ListItem::new("Select a profile to see tables")], vec![])
+    };
+
+    // Build and render table list inside the block's inner area
+    let table_list = List::new(table_list_items)
+        // Highlight style depends on focus AND navigation state
+        .highlight_style(if table_focus { // Use focus state
+            Style::default().add_modifier(ratatui::style::Modifier::REVERSED)
+        } else {
+            Style::default()
+        })
+    .highlight_symbol(if table_focus { "> " } else { "  " }); // Focus indicator
+
+    f.render_stateful_widget(table_list, tables_inner_area, &mut admin_state.table_list_state);
+
+    // --- Dependencies Pane (Right) ---
+    // Get name based on PERSISTENT selections
+    let chosen_profile_idx = admin_state.selected_profile_index; // Use persistent profile selection
+    let selected_table_name = chosen_profile_idx
+        .and_then(|p_idx| app_state.profile_tree.profiles.get(p_idx))
+        .and_then(|p| admin_state.selected_table_index.and_then(|t_idx| p.tables.get(t_idx))) // Use persistent table selection
+        .map_or("N/A", |t| &t.name); // Get name of the selected table
+
+    // Block for the dependencies pane
+    let deps_block = Block::default()
+        .title(format!(" Dependencies (Table: {}) ", selected_table_name))
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(Style::default().fg(theme.border)); // No focus highlight for deps pane
+    let deps_inner_area = deps_block.inner(deps_pane); // Get inner area for content
+    f.render_widget(deps_block, deps_pane); // Render the block itself
+
+    // Prepare content for the dependencies paragraph
+    let mut deps_content = Text::default();
+    deps_content.lines.push(Line::from(Span::styled(
+                "Depends On:",
+                Style::default().fg(theme.accent), // Use accent color for the label
+    )));
+
+    if !selected_table_deps.is_empty() {
+        for dep in selected_table_deps {
+            // List each dependency
+            deps_content.lines.push(Line::from(Span::styled(format!("- {}", dep), theme.fg)));
+        }
+    } else {
+        // Indicate if there are no dependencies
+        deps_content.lines.push(Line::from(Span::styled("  None", theme.secondary)));
+    }
+
+    // Build and render dependencies paragraph inside the block's inner area
+    let deps_paragraph = Paragraph::new(deps_content);
+    f.render_widget(deps_paragraph, deps_inner_area);
+
+    // --- Buttons Row ---
+    let button_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([
+            Constraint::Percentage(33),
+            Constraint::Percentage(34),
+            Constraint::Percentage(33),
+        ].as_ref())
+        .split(buttons_area);
+
+    let btn_base_style = Style::default().fg(theme.secondary);
+
+    // Define the helper closure to get style based on focus
+    let get_btn_style = |button_focus: AdminFocus| {
+        if admin_state.current_focus == button_focus {
+            // Apply highlight style if this button is focused
+            btn_base_style.add_modifier(ratatui::style::Modifier::REVERSED)
+        } else {
+            btn_base_style // Use base style otherwise
+        }
+    };
+    let btn1 = Paragraph::new("Add Logic")
+        .style(get_btn_style(AdminFocus::Button1))
+        .alignment(Alignment::Center);
+    let btn2 = Paragraph::new("Add Table")
+        .style(get_btn_style(AdminFocus::Button2))
+        .alignment(Alignment::Center);
+    let btn3 = Paragraph::new("Change Table")
+        .style(get_btn_style(AdminFocus::Button3))
+        .alignment(Alignment::Center);
+
+    f.render_widget(btn1, button_chunks[0]);
+    f.render_widget(btn2, button_chunks[1]);
+    f.render_widget(btn3, button_chunks[2]);
+}
--- a/client/src/components/auth.rs
+++ b/client/src/components/auth.rs
@@ -0,0 +1,6 @@
+// src/components/form.rs
+pub mod login;
+pub mod register;
+
+pub use login::*;
+pub use register::*;
--- a/client/src/components/auth/login.rs
+++ b/client/src/components/auth/login.rs
@@ -0,0 +1,149 @@
+// src/components/auth/login.rs
+
+use crate::{
+    config::colors::themes::Theme,
+    state::pages::auth::LoginState,
+    components::common::dialog,
+    state::app::state::AppState,
+};
+use ratatui::{
+    layout::{Alignment, Constraint, Direction, Layout, Rect, Margin},
+    style::{Style, Modifier, Color},
+    widgets::{Block, BorderType, Borders, Paragraph},
+    Frame,
+};
+use crate::state::app::highlight::HighlightState;
+
+pub fn render_login(
+    f: &mut Frame,
+    area: Rect,
+    theme: &Theme,
+    login_state: &LoginState,
+    app_state: &AppState,
+    is_edit_mode: bool,
+    highlight_state: &HighlightState,
+) {
+    // Main container
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .border_type(BorderType::Plain)
+        .border_style(Style::default().fg(theme.border))
+        .title(" Login ")
+        .style(Style::default().bg(theme.bg));
+
+    f.render_widget(block, area);
+
+    let inner_area = area.inner(Margin {
+        horizontal: 1,
+        vertical: 1,
+    });
+
+    // Layout chunks
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([
+            Constraint::Length(4),  // Form (2 fields + padding)
+            Constraint::Length(1),  // Error message
+            Constraint::Length(3),  // Buttons
+        ])
+        .split(inner_area);
+
+    // --- FORM RENDERING ---
+    crate::components::handlers::canvas::render_canvas(
+        f,
+        chunks[0],
+        login_state,
+        &["Username/Email", "Password"],
+        &login_state.current_field,
+        &[&login_state.username, &login_state.password],
+        theme,
+        is_edit_mode,
+        highlight_state,
+    );
+
+    // --- ERROR MESSAGE ---
+    if let Some(err) = &login_state.error_message {
+        f.render_widget(
+            Paragraph::new(err.as_str())
+                .style(Style::default().fg(Color::Red))
+                .alignment(Alignment::Center),
+            chunks[1],
+        );
+    }
+
+    // --- BUTTONS ---
+    let button_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([Constraint::Percentage(50), Constraint::Percentage(50)])
+        .split(chunks[2]);
+
+    // Login Button
+    let login_button_index = 0;
+    let login_active = if app_state.ui.focus_outside_canvas {
+        app_state.focused_button_index== login_button_index
+    } else {
+        false
+    };    
+    let mut login_style = Style::default().fg(theme.fg);
+    let mut login_border = Style::default().fg(theme.border);
+    if login_active {
+        login_style = login_style.fg(theme.highlight).add_modifier(Modifier::BOLD);
+        login_border = login_border.fg(theme.accent);
+    }
+
+    f.render_widget(
+        Paragraph::new("Login")
+            .style(login_style)
+            .alignment(Alignment::Center)
+            .block(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Plain)
+                    .border_style(login_border),
+            ),
+        button_chunks[0],
+    );
+
+    // Return Button
+    let return_button_index = 1; // Assuming Return is the second general element
+    let return_active = if app_state.ui.focus_outside_canvas {
+        app_state.focused_button_index== return_button_index
+    } else {
+        false // Not active if focus is in canvas or other modes
+    };    
+    let mut return_style = Style::default().fg(theme.fg);
+    let mut return_border = Style::default().fg(theme.border);
+    if return_active {
+        return_style = return_style.fg(theme.highlight).add_modifier(Modifier::BOLD);
+        return_border = return_border.fg(theme.accent);
+    }
+
+    f.render_widget(
+        Paragraph::new("Return")
+            .style(return_style)
+            .alignment(Alignment::Center)
+            .block(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Plain)
+                    .border_style(return_border),
+            ),
+        button_chunks[1],
+    );
+
+    // --- DIALOG ---
+    // Check the correct field name for showing the dialog
+    if app_state.ui.dialog.dialog_show {
+        // Pass all 7 arguments correctly
+        dialog::render_dialog(
+            f,
+            f.area(),
+            theme,
+            &app_state.ui.dialog.dialog_title,
+            &app_state.ui.dialog.dialog_message,
+            &app_state.ui.dialog.dialog_buttons, // Pass buttons slice
+            app_state.ui.dialog.dialog_active_button_index, 
+            app_state.ui.dialog.is_loading,
+        );
+    }
+}
--- a/client/src/components/auth/register.rs
+++ b/client/src/components/auth/register.rs
@@ -0,0 +1,174 @@
+// src/components/auth/register.rs
+
+use crate::{
+    config::colors::themes::Theme,
+    state::pages::auth::RegisterState, // Use RegisterState
+    components::common::{dialog, autocomplete},    
+    state::app::state::AppState,
+    state::pages::canvas_state::CanvasState,
+    modes::handlers::mode_manager::AppMode,
+};
+use ratatui::{
+    layout::{Alignment, Constraint, Direction, Layout, Rect, Margin},
+    style::{Style, Modifier, Color},
+    widgets::{Block, BorderType, Borders, Paragraph},
+    Frame,
+};
+use crate::state::app::highlight::HighlightState;
+
+pub fn render_register(
+    f: &mut Frame,
+    area: Rect,
+    theme: &Theme,
+    state: &RegisterState, // Use RegisterState
+    app_state: &AppState,
+    is_edit_mode: bool,
+    highlight_state: &HighlightState,
+) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .border_type(BorderType::Plain)
+        .border_style(Style::default().fg(theme.border))
+        .title(" Register ") // Update title
+        .style(Style::default().bg(theme.bg));
+
+    f.render_widget(block, area);
+
+    let inner_area = area.inner(Margin {
+        horizontal: 1,
+        vertical: 1,
+    });
+
+    // Adjust constraints for 4 fields + error + buttons
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([
+            Constraint::Length(7), // Form (5 fields + padding)
+            Constraint::Length(1), // Help text line
+            Constraint::Length(1), // Error message
+            Constraint::Length(3), // Buttons
+        ])
+        .split(inner_area);
+
+    // --- FORM RENDERING (Using render_canvas) ---
+    let active_field_rect = crate::components::handlers::canvas::render_canvas(
+        f,
+        chunks[0], // Area for the canvas
+        state,     // The state object (RegisterState)
+        &[         // Field labels
+            "Username",
+            "Email*",
+            "Password*",
+            "Confirm Password",
+            "Role* (Tab)",
+        ],
+        &state.current_field(), // Pass current field index
+        &state.inputs().iter().map(|s| *s).collect::<Vec<&String>>(), // Pass inputs directly
+        theme,
+        is_edit_mode,
+        highlight_state,
+    );
+
+    // --- HELP TEXT ---
+    let help_text = Paragraph::new("* are optional fields")
+        .style(Style::default().fg(theme.fg))
+        .alignment(Alignment::Center);
+    f.render_widget(help_text, chunks[1]);
+
+   
+    // --- ERROR MESSAGE ---
+    if let Some(err) = &state.error_message {
+        f.render_widget(
+            Paragraph::new(err.as_str())
+                .style(Style::default().fg(Color::Red))
+                .alignment(Alignment::Center),
+            chunks[2],
+        );
+    }
+
+    // --- BUTTONS ---
+    let button_chunks = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([Constraint::Percentage(50), Constraint::Percentage(50)])
+        .split(chunks[3]);
+
+    // Register Button
+    let register_button_index = 0;
+    let register_active = if app_state.ui.focus_outside_canvas {
+        app_state.focused_button_index== register_button_index
+    } else {
+        false
+    };
+    let mut register_style = Style::default().fg(theme.fg);
+    let mut register_border = Style::default().fg(theme.border);
+    if register_active {
+        register_style = register_style.fg(theme.highlight).add_modifier(Modifier::BOLD);
+        register_border = register_border.fg(theme.accent);
+    }
+
+    f.render_widget(
+        Paragraph::new("Register") // Update button text
+            .style(register_style)
+            .alignment(Alignment::Center)
+            .block(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Plain)
+                    .border_style(register_border),
+            ),
+        button_chunks[0],
+    );
+
+    // Return Button (logic remains similar)
+    let return_button_index = 1;
+    let return_active = if app_state.ui.focus_outside_canvas {
+        app_state.focused_button_index== return_button_index
+    } else {
+        false
+    };
+    let mut return_style = Style::default().fg(theme.fg);
+    let mut return_border = Style::default().fg(theme.border);
+    if return_active {
+        return_style = return_style.fg(theme.highlight).add_modifier(Modifier::BOLD);
+        return_border = return_border.fg(theme.accent);
+    }
+
+    f.render_widget(
+        Paragraph::new("Return")
+            .style(return_style)
+            .alignment(Alignment::Center)
+            .block(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Plain)
+                    .border_style(return_border),
+            ),
+        button_chunks[1],
+    );
+
+    // --- Render Autocomplete Dropdown (Draw AFTER buttons) ---
+    if app_state.current_mode == AppMode::Edit {
+        if let Some(suggestions) = state.get_suggestions() {
+            let selected = state.get_selected_suggestion_index();
+            if !suggestions.is_empty() {
+                if let Some(input_rect) = active_field_rect {
+                    autocomplete::render_autocomplete_dropdown(f, input_rect, f.size(), theme, suggestions, selected);
+                }    
+            }
+        }
+    }
+
+    // --- DIALOG --- (Keep dialog logic)
+    if app_state.ui.dialog.dialog_show {
+        dialog::render_dialog(
+            f,
+            f.area(),
+            theme,
+            &app_state.ui.dialog.dialog_title,
+            &app_state.ui.dialog.dialog_message,
+            &app_state.ui.dialog.dialog_buttons,
+            app_state.ui.dialog.dialog_active_button_index,
+            app_state.ui.dialog.is_loading,
+        );
+    }
+}
--- a/client/src/components/common.rs
+++ b/client/src/components/common.rs
@@ -2,7 +2,11 @@
 pub mod command_line;
 pub mod status_line;
 pub mod background;
+pub mod dialog;
+pub mod autocomplete;

 pub use command_line::*;
 pub use status_line::*;
 pub use background::*;
+pub use dialog::*;
+pub use autocomplete::*;
--- a/client/src/components/common/autocomplete.rs
+++ b/client/src/components/common/autocomplete.rs
@@ -0,0 +1,90 @@
+// src/components/common/autocomplete.rs
+
+use crate::config::colors::themes::Theme;
+use ratatui::{
+    layout::Rect,
+    style::{Color, Modifier, Style},
+    widgets::{Block, List, ListItem, ListState},
+    Frame,
+};
+use unicode_width::UnicodeWidthStr;
+
+/// Renders an opaque dropdown list for autocomplete suggestions.
+pub fn render_autocomplete_dropdown(
+    f: &mut Frame,
+    input_rect: Rect,
+    frame_area: Rect,
+    theme: &Theme,
+    suggestions: &[String],
+    selected_index: Option<usize>,
+) {
+    if suggestions.is_empty() {
+        return;
+    }
+    // --- Calculate Dropdown Size & Position ---
+    let max_suggestion_width = suggestions.iter().map(|s| s.width()).max().unwrap_or(0) as u16;
+    let horizontal_padding: u16 = 2;
+    let dropdown_width = (max_suggestion_width + horizontal_padding).max(10);
+    let dropdown_height = (suggestions.len() as u16).min(5);
+
+    let mut dropdown_area = Rect {
+        x: input_rect.x, // Align horizontally with input
+        y: input_rect.y + 1, // Position directly below input
+        width: dropdown_width,
+        height: dropdown_height,
+    };
+
+    // --- Clamping Logic (prevent rendering off-screen) ---
+    // Clamp vertically (if it goes below the frame)
+    if dropdown_area.bottom() > frame_area.height {
+        dropdown_area.y = input_rect.y.saturating_sub(dropdown_height); // Try rendering above
+    }
+    // Clamp horizontally (if it goes past the right edge)
+    if dropdown_area.right() > frame_area.width {
+        dropdown_area.x = frame_area.width.saturating_sub(dropdown_width);
+    }
+    // Ensure x is not negative (if clamping pushes it left)
+    dropdown_area.x = dropdown_area.x.max(0);
+    // Ensure y is not negative (if clamping pushes it up)
+    dropdown_area.y = dropdown_area.y.max(0);
+    // --- End Clamping ---
+
+    // Render a solid background block first to ensure opacity
+    let background_block = Block::default().style(Style::default().bg(Color::DarkGray));
+    f.render_widget(background_block, dropdown_area);
+
+    // Create list items, ensuring each has a defined background
+    let items: Vec<ListItem> = suggestions
+        .iter()
+        .enumerate()
+        .map(|(i, s)| {
+            let is_selected = selected_index == Some(i);
+            let s_width = s.width() as u16;
+            let padding_needed = dropdown_width.saturating_sub(s_width);
+            let padded_s = format!("{}{}", s, " ".repeat(padding_needed as usize));
+
+            ListItem::new(padded_s).style(if is_selected {
+                Style::default()
+                    .fg(theme.bg) // Text color on highlight
+                    .bg(theme.highlight) // Highlight background
+                    .add_modifier(Modifier::BOLD)
+            } else {
+                // Style for non-selected items (matching background block)
+                Style::default()
+                    .fg(theme.fg) // Text color on gray
+                    .bg(Color::DarkGray) // Explicit gray background
+            })
+        })
+        .collect();
+
+    // Create the list widget (without its own block)
+    let list = List::new(items);
+
+    // State for managing selection highlight (still needed for logic)
+    let mut profile_list_state = ListState::default();
+    profile_list_state.select(selected_index);
+
+    // Render the list statefully *over* the background block
+    f.render_stateful_widget(list, dropdown_area, &mut profile_list_state);
+}
+
--- a/client/src/components/common/dialog.rs
+++ b/client/src/components/common/dialog.rs
@@ -0,0 +1,183 @@
+use crate::config::colors::themes::Theme;
+use ratatui::{
+    layout::{Constraint, Direction, Layout, Margin, Rect},
+    prelude::Alignment,
+    style::{Modifier, Style},
+    text::{Line, Span, Text},
+    widgets::{Block, BorderType, Borders, Paragraph, Clear},
+    Frame,
+};
+use unicode_segmentation::UnicodeSegmentation; // For grapheme clusters
+use unicode_width::UnicodeWidthStr; // For accurate width calculation
+
+pub fn render_dialog(
+    f: &mut Frame,
+    area: Rect,
+    theme: &Theme,
+    dialog_title: &str,
+    dialog_message: &str,
+    dialog_buttons: &[String],
+    dialog_active_button_index: usize,
+    is_loading: bool,
+) {
+    // Calculate required height based on the actual number of lines in the message
+    let message_lines: Vec<_> = dialog_message.lines().collect();
+    let message_height = message_lines.len() as u16;
+    let button_row_height = if dialog_buttons.is_empty() { 0 } else { 3 };
+    let vertical_padding = 2; // Block borders (top/bottom)
+    let inner_vertical_margin = 2; // Margin inside block (top/bottom)
+
+    // Calculate required height based on actual message lines
+    let required_inner_height =
+        message_height + button_row_height + inner_vertical_margin;
+    let required_total_height = required_inner_height + vertical_padding;
+
+    // Use a fixed percentage width, clamped to min/max
+    let width_percentage: u16 = 60;
+    let dialog_width = (area.width * width_percentage / 100)
+        .max(20) // Minimum width
+        .min(area.width); // Maximum width
+
+    // Ensure height doesn't exceed available area
+    let dialog_height = required_total_height.min(area.height);
+
+    // Calculate centered area manually
+    let dialog_x = area.x + (area.width.saturating_sub(dialog_width)) / 2;
+    let dialog_y = area.y + (area.height.saturating_sub(dialog_height)) / 2;
+    let dialog_area = Rect::new(dialog_x, dialog_y, dialog_width, dialog_height);
+
+    // Clear the area first before drawing the dialog
+    f.render_widget(Clear, dialog_area);
+
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(Style::default().fg(theme.accent))
+        .title(format!(" {} ", dialog_title)) // Add padding to title
+        .style(Style::default().bg(theme.bg));
+
+    f.render_widget(block, dialog_area);
+
+    // Calculate inner area *after* defining the block
+    let inner_area = dialog_area.inner(Margin {
+        horizontal: 2, // Left/Right padding inside border
+        vertical: 1,   // Top/Bottom padding inside border
+    });
+
+    if is_loading {
+        // --- Loading State ---
+        let loading_text = Paragraph::new(dialog_message) // Use the message passed for loading
+            .style(Style::default().fg(theme.fg).add_modifier(Modifier::ITALIC))
+            .alignment(Alignment::Center);
+        // Render loading message centered in the inner area
+        f.render_widget(loading_text, inner_area);
+    } else {
+        // --- Normal State (Message + Buttons) ---
+
+        // Layout for Message and Buttons based on actual message height
+        let mut constraints = vec![
+            // Allocate space for message, ensuring at least 1 line height
+            Constraint::Length(message_height.max(1)), // Use actual calculated height
+        ];
+        if button_row_height > 0 {
+            constraints.push(Constraint::Length(button_row_height));
+        }
+
+        let chunks = Layout::default()
+            .direction(Direction::Vertical)
+            .constraints(constraints)
+            .split(inner_area);
+
+        // Render Message
+        let available_width = inner_area.width as usize;
+        let ellipsis = "...";
+        let ellipsis_width = UnicodeWidthStr::width(ellipsis);
+
+        let processed_lines: Vec<Line> = message_lines
+            .into_iter()
+            .map(|line| {
+                let line_width = UnicodeWidthStr::width(line);
+                if line_width > available_width {
+                    // Truncate with ellipsis
+                    let mut truncated_len = 0;
+                    let mut current_width = 0;
+                    for (idx, grapheme) in line.grapheme_indices(true) {
+                        let grapheme_width = UnicodeWidthStr::width(grapheme);
+                        if current_width + grapheme_width
+                            > available_width.saturating_sub(ellipsis_width)
+                        {
+                            break;
+                        }
+                        current_width += grapheme_width;
+                        truncated_len = idx + grapheme.len();
+                    }
+                    let truncated_line =
+                        format!("{}{}", &line[..truncated_len], ellipsis);
+                    Line::from(Span::styled(
+                            truncated_line,
+                            Style::default().fg(theme.fg),
+                    ))
+                } else {
+                    Line::from(Span::styled(line, Style::default().fg(theme.fg)))
+                }
+            })
+        .collect();
+
+        let message_paragraph =
+            Paragraph::new(Text::from(processed_lines)).alignment(Alignment::Center);
+        f.render_widget(message_paragraph, chunks[0]); // Render message in the first chunk
+
+        // Render Buttons if they exist and there's a chunk for them
+        if !dialog_buttons.is_empty() && chunks.len() > 1 {
+            let button_area = chunks[1];
+            let button_count = dialog_buttons.len();
+
+            let button_constraints = std::iter::repeat(Constraint::Ratio(
+                    1,
+                    button_count as u32,
+            ))
+                .take(button_count)
+                .collect::<Vec<_>>();
+
+            let button_chunks = Layout::default()
+                .direction(Direction::Horizontal)
+                .constraints(button_constraints)
+                .horizontal_margin(1) // Add space between buttons
+                .split(button_area);
+
+            for (i, button_label) in dialog_buttons.iter().enumerate() {
+                if i >= button_chunks.len() {
+                    break;
+                }
+
+                let is_active = i == dialog_active_button_index;
+                let (button_style, border_style) = if is_active {
+                    (
+                        Style::default()
+                        .fg(theme.highlight)
+                        .add_modifier(Modifier::BOLD),
+                        Style::default().fg(theme.accent),
+                    )
+                } else {
+                    (
+                        Style::default().fg(theme.fg),
+                        Style::default().fg(theme.border),
+                    )
+                };
+
+                let button_block = Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Plain)
+                    .border_style(border_style);
+
+                f.render_widget(
+                    Paragraph::new(button_label.as_str())
+                    .block(button_block)
+                    .style(button_style)
+                    .alignment(Alignment::Center),
+                    button_chunks[i],
+                );
+            }
+        }
+    }
+}
--- a/client/src/components/common/status_line.rs
+++ b/client/src/components/common/status_line.rs
@@ -1,11 +1,11 @@
-// src/client/components/handlers/status_line.rs
 use ratatui::{
-    widgets::Paragraph,
    style::Style,
    layout::Rect,
    Frame,
    text::{Line, Span},
+    widgets::Paragraph,
 };
+use unicode_width::UnicodeWidthStr;
 use crate::config::colors::themes::Theme;
 use std::path::Path;

@@ -15,17 +15,11 @@ pub fn render_status_line(
    current_dir: &str,
    theme: &Theme,
    is_edit_mode: bool,
+    current_fps: f64,
 ) {
-    // Program name and version
    let program_info = format!("multieko2 v{}", env!("CARGO_PKG_VERSION"));
+    let mode_text = if is_edit_mode { "[EDIT]" } else { "[READ-ONLY]" };

-    let mode_text = if is_edit_mode {
-        "[EDIT]"
-    } else {
-        "[READ-ONLY]"
-    };
-
-    // Shorten the current directory path
    let home_dir = dirs::home_dir().map(|p| p.to_string_lossy().into_owned()).unwrap_or_default();
    let display_dir = if current_dir.starts_with(&home_dir) {
        current_dir.replacen(&home_dir, "~", 1)
@@ -33,47 +27,51 @@ pub fn render_status_line(
        current_dir.to_string()
    };

-    // Create the full status line text
-    let full_text = format!("{} | {} | {}", mode_text, display_dir, program_info);
-
-    // Check if the full text fits in the available width
    let available_width = area.width as usize;
-    let mut display_text = if full_text.len() <= available_width {
-        // If it fits, use the full text
-        full_text
+    let mode_width = UnicodeWidthStr::width(mode_text);
+    let program_info_width = UnicodeWidthStr::width(program_info.as_str());
+    let fps_text = format!("{:.0} FPS", current_fps);
+    let fps_width = UnicodeWidthStr::width(fps_text.as_str());
+    let separator = " | ";
+    let separator_width = UnicodeWidthStr::width(separator);
+
+    let fixed_width_with_fps = mode_width + separator_width + separator_width + 
+        program_info_width + separator_width + fps_width;
+    let show_fps = fixed_width_with_fps < available_width;
+
+    let remaining_width_for_dir = available_width.saturating_sub(
+        mode_width + separator_width + separator_width + program_info_width +
+        if show_fps { separator_width + fps_width } else { 0 }
+    );
+
+    let dir_display_text = if UnicodeWidthStr::width(display_dir.as_str()) <= remaining_width_for_dir {
+        display_dir
    } else {
-        // If it doesn't fit, prioritize mode and program info, and show only the directory name
        let dir_name = Path::new(current_dir)
            .file_name()
            .and_then(|n| n.to_str())
            .unwrap_or(current_dir);
-        format!("{} | {} | {}", mode_text, dir_name, program_info)
+        if UnicodeWidthStr::width(dir_name) <= remaining_width_for_dir {
+            dir_name.to_string()
+        } else {
+            dir_name.chars().take(remaining_width_for_dir).collect()
+        }
    };

-    // If even the shortened version overflows, truncate it
-    if display_text.len() > available_width {
-        display_text = display_text.chars().take(available_width).collect();
-    }
-
-    // Create the status line text using Line and Span
-    let status_line = Line::from(vec![
+    let mut spans = vec![
        Span::styled(mode_text, Style::default().fg(theme.accent)),
        Span::styled(" | ", Style::default().fg(theme.border)),
-        Span::styled(
-            display_text.split(" | ").nth(1).unwrap_or(""), // Directory part
-            Style::default().fg(theme.fg),
-        ),
+        Span::styled(dir_display_text, Style::default().fg(theme.fg)),
        Span::styled(" | ", Style::default().fg(theme.border)),
-        Span::styled(
-            program_info,
-            Style::default()
-                .fg(theme.secondary)
-                .add_modifier(ratatui::style::Modifier::BOLD),
-        ),
-    ]);
+        Span::styled(program_info, Style::default().fg(theme.secondary)),
+    ];

-    // Render the status line
-    let paragraph = Paragraph::new(status_line)
+    if show_fps {
+        spans.push(Span::styled(" | ", Style::default().fg(theme.border)));
+        spans.push(Span::styled(fps_text, Style::default().fg(theme.secondary)));
+    }
+
+    let paragraph = Paragraph::new(Line::from(spans))
        .style(Style::default().bg(theme.bg));

    f.render_widget(paragraph, area);
--- a/client/src/components/form.rs
+++ b/client/src/components/form.rs
@@ -0,0 +1,4 @@
+// src/components/form.rs
+pub mod form;
+
+pub use form::*;
--- a/client/src/components/handlers/form.rs
+++ b/client/src/components/handlers/form.rs
@@ -1,4 +1,4 @@
-// src/components/handlers/form.rs
+// src/components/form/form.rs
 use ratatui::{
    widgets::{Paragraph, Block, Borders},
    layout::{Layout, Constraint, Direction, Rect, Margin, Alignment},
@@ -6,18 +6,20 @@ use ratatui::{
    Frame,
 };
 use crate::config::colors::themes::Theme;
-use crate::ui::form::FormState;
-use super::canvas::render_canvas;  // Changed to canvas
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::app::highlight::HighlightState;
+use crate::components::handlers::canvas::render_canvas;

 pub fn render_form(
    f: &mut Frame,
    area: Rect,
-    form_state: &FormState,
+    form_state: &impl CanvasState,
    fields: &[&str],
    current_field: &usize,
    inputs: &[&String],
    theme: &Theme,
    is_edit_mode: bool,
+    highlight_state: &HighlightState,
    total_count: u64,
    current_position: u64,
 ) {
@@ -62,5 +64,6 @@ pub fn render_form(
        inputs,
        theme,
        is_edit_mode,
+        highlight_state,
    );
 }
--- a/client/src/components/handlers.rs
+++ b/client/src/components/handlers.rs
@@ -1,8 +1,8 @@
 // src/components/handlers.rs
-pub mod form;
 pub mod canvas;
 pub mod sidebar;
+pub mod buffer_list;

-pub use form::*;
 pub use canvas::*;
 pub use sidebar::*;
+pub use buffer_list::*;
--- a/client/src/components/handlers/buffer_list.rs
+++ b/client/src/components/handlers/buffer_list.rs
@@ -0,0 +1,76 @@
+// src/components/handlers/buffer_list.rs
+
+use crate::config::colors::themes::Theme;
+use crate::state::app::buffer::BufferState;
+use ratatui::{
+    layout::{Alignment, Rect},
+    style::{Style, Stylize},
+    text::{Line, Span},
+    widgets::Paragraph,
+    Frame,
+};
+use unicode_width::UnicodeWidthStr;
+use crate::functions::common::buffer::get_view_layer;
+
+pub fn render_buffer_list(
+    f: &mut Frame,
+    area: Rect,
+    theme: &Theme,
+    buffer_state: &BufferState,
+) {
+    // --- Style Definitions ---
+    let active_style = Style::default()
+        .fg(theme.bg)
+        .bg(theme.highlight);
+
+    let inactive_style = Style::default()
+        .fg(theme.fg)
+        .bg(theme.bg);
+
+    // --- Determine Active Layer ---
+    let active_layer = match buffer_state.history.get(buffer_state.active_index) {
+        Some(view) => get_view_layer(view),
+        None => 1,
+    };
+
+    // --- Create Spans ---
+    let mut spans = Vec::new();
+    let mut current_width = 0;
+
+    for (original_index, view) in buffer_state.history.iter().enumerate() {
+        // Filter: Only process views matching the active layer
+        if get_view_layer(view) != active_layer {
+            continue;
+        }
+
+        let is_active = original_index == buffer_state.active_index;
+        let buffer_name = view.display_name();
+        let buffer_text = format!(" {} ", buffer_name);
+        let text_width = UnicodeWidthStr::width(buffer_text.as_str());
+
+        // Calculate width needed for this buffer (separator + text)
+        let needed_width = text_width;
+        if current_width + needed_width > area.width as usize {
+            break;
+        }
+
+        // Add the buffer text itself
+        let text_style = if is_active { active_style } else { inactive_style };
+        spans.push(Span::styled(buffer_text, text_style));
+        current_width += text_width;
+    }
+
+    // --- Filler Span ---
+    let remaining_width = area.width.saturating_sub(current_width as u16);
+    if !spans.is_empty() || remaining_width > 0 {
+        spans.push(Span::styled(
+                " ".repeat(remaining_width as usize),
+                inactive_style,
+        ));
+    }
+
+    // --- Render ---
+    let buffer_line = Line::from(spans);
+    let paragraph = Paragraph::new(buffer_line).alignment(Alignment::Left);
+    f.render_widget(paragraph, area);
+}
--- a/client/src/components/handlers/canvas.rs
+++ b/client/src/components/handlers/canvas.rs
@@ -2,41 +2,45 @@
 use ratatui::{
    widgets::{Paragraph, Block, Borders},
    layout::{Layout, Constraint, Direction, Rect},
-    style::Style,
+    style::{Style, Modifier},
    text::{Line, Span},
    Frame,
    prelude::Alignment,
 };
 use crate::config::colors::themes::Theme;
-use crate::ui::form::FormState;
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::app::highlight::HighlightState; // Ensure correct import path
+use std::cmp::{min, max};

 pub fn render_canvas(
    f: &mut Frame,
    area: Rect,
-    form_state: &FormState,
+    form_state: &impl CanvasState,
    fields: &[&str],
-    current_field: &usize,
+    current_field_idx: &usize,
    inputs: &[&String],
    theme: &Theme,
    is_edit_mode: bool,
-) {
-    // Split area into columns
+    highlight_state: &HighlightState, // Using the enum state
+) -> Option<Rect> {
+    // ... (setup code remains the same) ...
    let columns = Layout::default()
        .direction(Direction::Horizontal)
        .constraints([Constraint::Percentage(30), Constraint::Percentage(70)])
        .split(area);

-    // Input container styling
+    let border_style = if form_state.has_unsaved_changes() {
+        Style::default().fg(theme.warning)
+    } else if is_edit_mode {
+        Style::default().fg(theme.accent)
+    } else {
+        Style::default().fg(theme.secondary)
+    };
    let input_container = Block::default()
        .borders(Borders::ALL)
-        .border_style(if is_edit_mode {
-            form_state.has_unsaved_changes.then(|| theme.warning).unwrap_or(theme.accent)
-        } else {
-            theme.secondary
-        })
+        .border_style(border_style)
        .style(Style::default().bg(theme.bg));

-    // Input block dimensions
    let input_block = Rect {
        x: columns[1].x,
        y: columns[1].y,
@@ -46,13 +50,14 @@ pub fn render_canvas(

    f.render_widget(&input_container, input_block);

-    // Input rows layout
    let input_area = input_container.inner(input_block);
    let input_rows = Layout::default()
        .direction(Direction::Vertical)
        .constraints(vec![Constraint::Length(1); fields.len()])
        .split(input_area);

+    let mut active_field_input_rect = None;
+
    // Render labels
    for (i, field) in fields.iter().enumerate() {
        let label = Paragraph::new(Line::from(Span::styled(
@@ -67,23 +72,123 @@ pub fn render_canvas(
        });
    }

+
    // Render inputs and cursor
    for (i, input) in inputs.iter().enumerate() {
-        let is_active = i == *current_field;
-        let input_display = Paragraph::new(input.as_str())
-            .alignment(Alignment::Left)
-            .style(if is_active {
-                Style::default().fg(theme.highlight)
-            } else {
-                Style::default().fg(theme.fg)
-            });
+        let is_active = i == *current_field_idx;
+        let current_cursor_pos = form_state.current_cursor_pos();
+        let text = input.as_str();
+        let text_len = text.chars().count();

+        let line: Line;
+
+        // --- Use match on the highlight_state enum ---
+        match highlight_state {
+            HighlightState::Off => {
+                // Not in highlight mode, render normally
+                line = Line::from(Span::styled(
+                    text,
+                    if is_active { Style::default().fg(theme.highlight) } else { Style::default().fg(theme.fg) }
+                ));
+            }
+            HighlightState::Characterwise { anchor } => {
+                // --- Character-wise Highlight Logic ---
+                let (anchor_field, anchor_char) = *anchor;
+                let start_field = min(anchor_field, *current_field_idx);
+                let end_field = max(anchor_field, *current_field_idx);
+
+                // Use start_char and end_char consistently
+                let (start_char, end_char) = if anchor_field == *current_field_idx {
+                    (min(anchor_char, current_cursor_pos), max(anchor_char, current_cursor_pos))
+                } else if anchor_field < *current_field_idx {
+                    (anchor_char, current_cursor_pos)
+                } else {
+                    (current_cursor_pos, anchor_char)
+                };
+
+                let highlight_style = Style::default().fg(theme.highlight).bg(theme.highlight_bg).add_modifier(Modifier::BOLD);
+                let normal_style_in_highlight = Style::default().fg(theme.highlight);
+                let normal_style_outside = Style::default().fg(theme.fg);
+
+                if i >= start_field && i <= end_field {
+                    // This line is within the character-wise highlight range
+                    if start_field == end_field { // Case 1: Single Line Highlight
+                        // Use start_char and end_char here
+                        let clamped_start = start_char.min(text_len);
+                        let clamped_end = end_char.min(text_len); // Use text_len for slicing logic
+
+                        let before: String = text.chars().take(clamped_start).collect();
+                        let highlighted: String = text.chars().skip(clamped_start).take(clamped_end.saturating_sub(clamped_start) + 1).collect();
+                        // Define 'after' here
+                        let after: String = text.chars().skip(clamped_end + 1).collect();
+
+                        line = Line::from(vec![
+                            Span::styled(before, normal_style_in_highlight),
+                            Span::styled(highlighted, highlight_style),
+                            Span::styled(after, normal_style_in_highlight), // Use defined 'after'
+                        ]);
+                    } else if i == start_field { // Case 2: Multi-Line Highlight - Start Line
+                        // Use start_char here
+                        let safe_start = start_char.min(text_len);
+                        let before: String = text.chars().take(safe_start).collect();
+                        let highlighted: String = text.chars().skip(safe_start).collect();
+                        line = Line::from(vec![
+                            Span::styled(before, normal_style_in_highlight),
+                            Span::styled(highlighted, highlight_style),
+                        ]);
+                    } else if i == end_field { // Case 3: Multi-Line Highlight - End Line (Corrected index)
+                        // Use end_char here
+                        let safe_end_inclusive = if text_len > 0 { end_char.min(text_len - 1) } else { 0 };
+                        let highlighted: String = text.chars().take(safe_end_inclusive + 1).collect();
+                        let after: String = text.chars().skip(safe_end_inclusive + 1).collect();
+                        line = Line::from(vec![
+                            Span::styled(highlighted, highlight_style),
+                            Span::styled(after, normal_style_in_highlight),
+                        ]);
+                    } else { // Case 4: Multi-Line Highlight - Middle Line (Corrected index)
+                        line = Line::from(Span::styled(text, highlight_style)); // Highlight whole line
+                    }
+                } else { // Case 5: Line Outside Character-wise Highlight Range
+                    line = Line::from(Span::styled(
+                        text,
+                        // Use normal styling (active or inactive)
+                        if is_active { normal_style_in_highlight } else { normal_style_outside }
+                    ));
+                }
+            }
+            HighlightState::Linewise { anchor_line } => {
+                // --- Linewise Highlight Logic ---
+                let start_field = min(*anchor_line, *current_field_idx);
+                let end_field = max(*anchor_line, *current_field_idx);
+                let highlight_style = Style::default().fg(theme.highlight).bg(theme.highlight_bg).add_modifier(Modifier::BOLD);
+                let normal_style_in_highlight = Style::default().fg(theme.highlight);
+                let normal_style_outside = Style::default().fg(theme.fg);
+
+                if i >= start_field && i <= end_field {
+                    // Highlight the entire line
+                    line = Line::from(Span::styled(text, highlight_style));
+                } else {
+                    // Line outside linewise highlight range
+                    line = Line::from(Span::styled(
+                        text,
+                        // Use normal styling (active or inactive)
+                        if is_active { normal_style_in_highlight } else { normal_style_outside }
+                    ));
+                }
+            }
+        } // End match highlight_state
+
+        let input_display = Paragraph::new(line).alignment(Alignment::Left);
        f.render_widget(input_display, input_rows[i]);

        if is_active {
-            let cursor_x = input_rows[i].x + form_state.current_cursor_pos as u16;
+            active_field_input_rect = Some(input_rows[i]);
+            let cursor_x = input_rows[i].x + form_state.current_cursor_pos() as u16;
            let cursor_y = input_rows[i].y;
            f.set_cursor_position((cursor_x, cursor_y));
        }
    }
+
+    active_field_input_rect
 }
+
--- a/client/src/components/handlers/sidebar.rs
+++ b/client/src/components/handlers/sidebar.rs
@@ -9,7 +9,8 @@ use crate::config::colors::themes::Theme;
 use common::proto::multieko2::table_definition::{ProfileTreeResponse};
 use ratatui::text::{Span, Line};

-const SIDEBAR_WIDTH: u16 = 16;
+// Reduced sidebar width
+const SIDEBAR_WIDTH: u16 = 12;

 pub fn calculate_sidebar_layout(show_sidebar: bool, main_content_area: Rect) -> (Option<Rect>, Rect) {
    if show_sidebar {
@@ -37,46 +38,72 @@ pub fn render_sidebar(
    let mut items = Vec::new();

    if let Some(profile_name) = selected_profile {
-        if let Some(profile) = profile_tree.profiles.iter()
-            .find(|p| &p.name == profile_name)
-        {
-            // Profile header
+        // Existing code for when a profile is selected...
+    } else {
+        // Show full profile tree when no profile is selected (compact version)
+        for (profile_idx, profile) in profile_tree.profiles.iter().enumerate() {
+            // Profile header - more compact
            items.push(ListItem::new(Line::from(vec![
-                Span::styled("📁 ", Style::default().fg(theme.accent)),
+                Span::styled("◆", Style::default().fg(theme.accent)),
                Span::styled(&profile.name, Style::default().fg(theme.highlight)),
            ])));

-            // Tables
+            // Tables with compact prefixes
            for (table_idx, table) in profile.tables.iter().enumerate() {
-                let is_last = table_idx == profile.tables.len() - 1;
-                let prefix = if is_last { "└─ " } else { "├─ " };
+                let is_last_table = table_idx == profile.tables.len() - 1;
+                let is_last_profile = profile_idx == profile_tree.profiles.len() - 1;
+
+                // Shorter prefix characters
+                let prefix = match (is_last_profile, is_last_table) {
+                    (true, true) => " └",
+                    (true, false) => " ├",
+                    (false, true) => "│└",
+                    (false, false) => "│├",
+                };
+
+                // Get table name without year prefix to save space
+                let display_name = if table.name.starts_with("2025_") {
+                    &table.name[5..] // Skip "2025_" prefix
+                } else {
+                    &table.name
+                };

                let mut line = vec![
-                    Span::styled(format!("  {}", prefix), Style::default().fg(theme.fg)),
-                    Span::styled(&table.name, Style::default().fg(theme.fg)),
+                    Span::styled(prefix, Style::default().fg(theme.fg)),
+                    Span::styled(display_name, Style::default().fg(theme.fg)),
                ];

+                // Show a simple indicator for dependencies instead of listing them
                if !table.depends_on.is_empty() {
                    line.push(Span::styled(
-                        format!(" → {}", table.depends_on.join(", ")),
+                        "→",
                        Style::default().fg(theme.secondary)
                    ));
                }

                items.push(ListItem::new(Line::from(line)));
            }
+
+            // Compact separator between profiles
+            if profile_idx < profile_tree.profiles.len() - 1 {
+                items.push(ListItem::new(Line::from(
+                    Span::styled("│", Style::default().fg(theme.secondary))
+                )));
+            }
+        }
+
+        if profile_tree.profiles.is_empty() {
+            items.push(ListItem::new(Span::styled(
+                "No profiles",
+                Style::default().fg(theme.secondary)
+            )));
        }
-    } else {
-        items.push(ListItem::new(Span::styled(
-            "No profile selected",
-            Style::default().fg(theme.secondary)
-        )));
    }

    let list = List::new(items)
        .block(sidebar_block)
        .highlight_style(Style::default().fg(theme.highlight))
-        .highlight_symbol(">>");
+        .highlight_symbol(">");

    f.render_widget(list, area);
 }
--- a/client/src/components/intro/intro.rs
+++ b/client/src/components/intro/intro.rs
@@ -1,4 +1,4 @@
-// src/components/handlers/intro.rs
+// src/components/intro/intro.rs
 use ratatui::{
    layout::{Alignment, Constraint, Direction, Layout, Rect},
    style::Style,
@@ -8,103 +8,80 @@ use ratatui::{
    Frame,
 };
 use crate::config::colors::themes::Theme;
+use crate::state::pages::intro::IntroState;

-pub struct IntroState {
-    pub selected_option: usize,
+pub fn render_intro(f: &mut Frame, intro_state: &IntroState, area: Rect, theme: &Theme) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
+        .border_style(Style::default().fg(theme.accent))
+        .style(Style::default().bg(theme.bg));
+
+    let inner_area = block.inner(area);
+    f.render_widget(block, area);
+
+    // Center layout
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([
+            Constraint::Percentage(40),
+            Constraint::Length(5),
+            Constraint::Percentage(40),
+        ])
+        .split(inner_area);
+
+    // Title
+    let title = Line::from(vec![
+        Span::styled("multieko2", Style::default().fg(theme.highlight)),
+        Span::styled(" v", Style::default().fg(theme.fg)),
+        Span::styled(env!("CARGO_PKG_VERSION"), Style::default().fg(theme.secondary)),
+    ]);
+    let title_para = Paragraph::new(title)
+        .alignment(Alignment::Center);
+    f.render_widget(title_para, chunks[1]);
+
+    // Buttons - now with 4 options
+    let button_area = Layout::default()
+        .direction(Direction::Horizontal)
+        .constraints([
+            Constraint::Percentage(25),
+            Constraint::Percentage(25),
+            Constraint::Percentage(25),
+            Constraint::Percentage(25),
+        ])
+        .split(chunks[1].inner(Margin {
+            horizontal: 1,
+            vertical: 1
+        }));
+
+    let buttons = ["Continue", "Admin", "Login", "Register"];
+    for (i, &text) in buttons.iter().enumerate() {
+        render_button(f, button_area[i], text, intro_state.selected_option == i, theme);
+    }
 }

-impl IntroState {
-    pub fn new() -> Self {
-        Self { selected_option: 0 }
-    }
-
-    pub fn render(&self, f: &mut Frame, area: Rect, theme: &Theme) {
-        let block = Block::default()
-            .borders(Borders::ALL)
-            .border_type(BorderType::Rounded)
-            .border_style(Style::default().fg(theme.accent))
-            .style(Style::default().bg(theme.bg));
-
-        let inner_area = block.inner(area);
-        f.render_widget(block, area);
-
-        // Center layout
-        let chunks = Layout::default()
-            .direction(Direction::Vertical)
-            .constraints([
-                Constraint::Percentage(35),
-                Constraint::Length(5),
-                Constraint::Percentage(35),
-            ])
-            .split(inner_area);
-
-        // Title
-        let title = Line::from(vec![
-            Span::styled("multieko2", Style::default().fg(theme.highlight)),
-            Span::styled(" v", Style::default().fg(theme.fg)),
-            Span::styled(env!("CARGO_PKG_VERSION"), Style::default().fg(theme.secondary)),
-        ]);
-        let title_para = Paragraph::new(title)
-            .alignment(Alignment::Center);
-        f.render_widget(title_para, chunks[1]);
-
-        // Buttons
-        let button_area = Layout::default()
-            .direction(Direction::Horizontal)
-            .constraints([Constraint::Percentage(50), Constraint::Percentage(50)])
-            .split(chunks[1].inner(Margin {
-                horizontal: 1,
-                vertical: 1
-            }));
-
-        self.render_button(
-            f,
-            button_area[0],
-            "Continue",
-            self.selected_option == 0,
-            theme,
-        );
-        self.render_button(
-            f,
-            button_area[1],
-            "Admin",
-            self.selected_option == 1,
-            theme,
-        );
-    }
-
-    fn render_button(&self, f: &mut Frame, area: Rect, text: &str, selected: bool, theme: &Theme) {
-        let button_style = if selected {
-            Style::default()
-                .fg(theme.highlight)
-                .bg(theme.bg)
-                .add_modifier(ratatui::style::Modifier::BOLD)
+fn render_button(f: &mut Frame, area: Rect, text: &str, selected: bool, theme: &Theme) {
+    let button_style = Style::default()
+        .fg(if selected { theme.highlight } else { theme.fg })
+        .bg(theme.bg)
+        .add_modifier(if selected {
+            ratatui::style::Modifier::BOLD
        } else {
-            Style::default().fg(theme.fg).bg(theme.bg)
-        };
+            ratatui::style::Modifier::empty()
+        });

-        let button = Paragraph::new(text)
-            .style(button_style)
-            .alignment(Alignment::Center)
-            .block(
-                Block::default()
-                    .borders(Borders::ALL)
-                    .border_type(BorderType::Double)
-                    .border_style(if selected {
-                        Style::default().fg(theme.accent)
-                    } else {
-                        Style::default().fg(theme.border)
-                    }),
-            );
+    let border_style = Style::default()
+        .fg(if selected { theme.accent } else { theme.border });

-        f.render_widget(button, area);
-    }
+    let button = Paragraph::new(text)
+        .style(button_style)
+        .alignment(Alignment::Center)
+        .block(
+            Block::default()
+            .borders(Borders::ALL)
+            .border_type(BorderType::Double)
+            .border_style(border_style),
+        );

-    pub fn next_option(&mut self) {
-        self.selected_option = (self.selected_option + 1) % 2;
-    }
-
-    pub fn previous_option(&mut self) {
-        self.selected_option = if self.selected_option == 0 { 1 } else { 0 };
-    }
+    f.render_widget(button, area);
 }
--- a/client/src/components/mod.rs
+++ b/client/src/components/mod.rs
@@ -3,8 +3,12 @@ pub mod handlers;
 pub mod intro;
 pub mod admin;
 pub mod common;
+pub mod form;
+pub mod auth;

 pub use handlers::*;
 pub use intro::*;
 pub use admin::*;
 pub use common::*;
+pub use form::*;
+pub use auth::*;
--- a/client/src/config/binds/config.rs
+++ b/client/src/config/binds/config.rs
@@ -26,14 +26,14 @@ pub struct Config {
 #[derive(Debug, Deserialize)]
 pub struct ModeKeybindings {
    #[serde(default)]
-    pub intro: HashMap<String, Vec<String>>,
-    #[serde(default)]
-    pub admin: HashMap<String, Vec<String>>,
+    pub general: HashMap<String, Vec<String>>,
    #[serde(default)]
    pub read_only: HashMap<String, Vec<String>>,
    #[serde(default)]
    pub edit: HashMap<String, Vec<String>>,
    #[serde(default)]
+    pub highlight: HashMap<String, Vec<String>>,
+    #[serde(default)]
    pub command: HashMap<String, Vec<String>>,
    #[serde(default)]
    pub common: HashMap<String, Vec<String>>,
@@ -52,19 +52,16 @@ impl Config {
        Ok(config)
    }

-    /// Gets an action for a key in Intro mode, only checking intro and global bindings
-    pub fn get_intro_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
-        self.get_action_for_key_in_mode(&self.keybindings.intro, key, modifiers)
+
+    pub fn get_general_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_for_key_in_mode(&self.keybindings.general, key, modifiers)
            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.global, key, modifiers))
    }

-    /// Gets an action for a key in Admin mode, checking common and global bindings
-    pub fn get_admin_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
-        self.get_action_for_key_in_mode(&self.keybindings.admin, key, modifiers)
-            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.common, key, modifiers))
-            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.intro, key, modifiers))
-            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.global, key, modifiers))
-    }    
+    /// Common actions for Edit/Read-only modes
+    pub fn get_common_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_for_key_in_mode(&self.keybindings.common, key, modifiers)
+    }

    /// Gets an action for a key in Read-Only mode, also checking common keybindings.
    pub fn get_read_only_action_for_key(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
@@ -80,6 +77,14 @@ impl Config {
            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.global, key, modifiers))
    }

+    /// Gets an action for a key in Highlight mode, also checking common/global keybindings.
+    pub fn get_highlight_action_for_key(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_for_key_in_mode(&self.keybindings.highlight, key, modifiers)
+            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.common, key, modifiers))
+            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.read_only, key, modifiers))
+            .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.global, key, modifiers))
+    }
+
    /// Gets an action for a key in Command mode, also checking common keybindings.
    pub fn get_command_action_for_key(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
        self.get_action_for_key_in_mode(&self.keybindings.command, key, modifiers)
@@ -92,17 +97,17 @@ impl Config {
        &self,
        is_edit_mode: bool,
        command_mode: bool,
-        show_intro: bool,
-        show_admin: bool,
        key: KeyCode,
        modifiers: KeyModifiers
    ) -> Option<&str> {
-        match (show_intro, show_admin, command_mode, is_edit_mode) {
-            (true, _, _, _) => self.get_intro_action(key, modifiers),
-            (_, true, _, _) => self.get_admin_action(key, modifiers),
-            (_, _, true, _) => self.get_command_action_for_key(key, modifiers),
-            (_, _, _, true) => self.get_edit_action_for_key(key, modifiers),
-            _ => self.get_read_only_action_for_key(key, modifiers),
+        match (command_mode, is_edit_mode) {
+            (true, _) => self.get_command_action_for_key(key, modifiers),
+            (_, true) => self.get_edit_action_for_key(key, modifiers)
+                .or_else(|| self.get_common_action(key, modifiers)),
+            _ => self.get_read_only_action_for_key(key, modifiers)
+                .or_else(|| self.get_common_action(key, modifiers))
+                // Add global bindings check for read-only mode
+                .or_else(|| self.get_action_for_key_in_mode(&self.keybindings.global, key, modifiers)),
        }
    }

--- a/client/src/config/colors/themes.rs
+++ b/client/src/config/colors/themes.rs
@@ -10,6 +10,8 @@ pub struct Theme {
    pub highlight: Color,
    pub warning: Color,
    pub border: Color,
+    pub highlight_bg: Color,
+    pub inactive_highlight_bg: Color,// admin panel no idea what it really is
 }

 impl Theme {
@@ -31,6 +33,8 @@ impl Theme {
            highlight: Color::Rgb(152, 251, 152), // Pastel green
            warning: Color::Rgb(255, 182, 193), // Pastel pink
            border: Color::Rgb(220, 220, 220), // Light gray border
+            highlight_bg: Color::Rgb(70, 70, 70), // Darker grey for highlight background
+            inactive_highlight_bg: Color::Rgb(50, 50, 50),
        }
    }

@@ -44,6 +48,8 @@ impl Theme {
            highlight: Color::Rgb(50, 205, 50), // Bright green
            warning: Color::Rgb(255, 99, 71), // Bright red
            border: Color::Rgb(100, 100, 100), // Medium gray border
+            highlight_bg: Color::Rgb(180, 180, 180), // Lighter grey for highlight background
+            inactive_highlight_bg: Color::Rgb(50, 50, 50),
        }
    }

@@ -57,6 +63,8 @@ impl Theme {
            highlight: Color::Rgb(0, 128, 0), // Green
            warning: Color::Rgb(255, 0, 0), // Red
            border: Color::Rgb(0, 0, 0),   // Black border
+            highlight_bg: Color::Rgb(180, 180, 180), // Lighter grey for highlight background
+            inactive_highlight_bg: Color::Rgb(50, 50, 50),
        }
    }
 }
--- a/client/src/functions/common.rs
+++ b/client/src/functions/common.rs
@@ -0,0 +1,5 @@
+// src/functions/common.rs
+
+pub mod buffer;
+
+pub use buffer::*;
--- a/client/src/functions/common/buffer.rs
+++ b/client/src/functions/common/buffer.rs
@@ -0,0 +1,35 @@
+// src/functions/common/buffer.rs
+
+use crate::state::app::buffer::BufferState;
+use crate::state::app::buffer::AppView;
+
+pub fn get_view_layer(view: &AppView) -> u8 {
+    match view {
+        AppView::Intro => 1,
+        AppView::Login | AppView::Register | AppView::Admin | AppView::AddTable => 2,
+        AppView::Form(_) | AppView::Scratch => 3,
+    }
+}
+
+/// Switches the active buffer index.
+pub fn switch_buffer(buffer_state: &mut BufferState, next: bool) -> bool {
+    if buffer_state.history.len() <= 1 {
+        return false;
+    }
+
+    let len = buffer_state.history.len();
+    let current_index = buffer_state.active_index;
+    let new_index = if next {
+        (current_index + 1) % len
+    } else {
+        (current_index + len - 1) % len
+    };
+
+    if new_index != current_index {
+        buffer_state.active_index = new_index;
+        true
+    } else {
+        false
+    }
+}
+
--- a/client/src/functions/mod.rs
+++ b/client/src/functions/mod.rs
@@ -0,0 +1,6 @@
+// src/functions/mod.rs
+
+pub mod common;
+pub mod modes;
+
+pub use modes::*;
--- a/client/src/functions/modes.rs
+++ b/client/src/functions/modes.rs
@@ -0,0 +1,9 @@
+// src/functions/modes.rs
+
+pub mod read_only;
+pub mod edit;
+pub mod navigation;
+
+pub use read_only::*;
+pub use edit::*;
+pub use navigation::*;
--- a/client/src/functions/modes/edit.rs
+++ b/client/src/functions/modes/edit.rs
@@ -0,0 +1,5 @@
+// src/functions/modes/edit.rs
+
+pub mod form_e;
+pub mod auth_e;
+pub mod add_table_e;
--- a/client/src/functions/modes/edit/add_table_e.rs
+++ b/client/src/functions/modes/edit/add_table_e.rs
@@ -0,0 +1,341 @@
+// src/functions/modes/edit/add_table_e.rs
+use crate::state::pages::add_table::AddTableState;
+use crate::state::pages::canvas_state::CanvasState; // Use trait
+use crossterm::event::{KeyCode, KeyEvent};
+use std::error::Error;
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos >= len {
+        return len;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < len && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < len && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+
+    if get_char_type(chars[pos]) == CharType::Whitespace {
+        pos = find_next_word_start(text, pos);
+    }
+
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    pos
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+    if pos == 0 && get_char_type(chars[pos]) != CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}
+
+/// Executes edit actions for the AddTable view canvas.
+pub async fn execute_edit_action(
+    action: &str,
+    key: KeyEvent, // Needed for insert_char
+    state: &mut AddTableState,
+    ideal_cursor_column: &mut usize,
+    // Add other params like grpc_client if needed for future actions (e.g., validation)
+) -> Result<String, Box<dyn Error>> {
+    // Use the CanvasState trait methods implemented for AddTableState
+    match action {
+        "insert_char" => {
+            if let KeyCode::Char(c) = key.code {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.insert(cursor_pos, c);
+                    *field_value = chars.into_iter().collect();
+                    state.set_current_cursor_pos(cursor_pos + 1);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = state.current_cursor_pos();
+                }
+            } else {
+                return Ok("Error: insert_char called without a char key.".to_string());
+            }
+            Ok("".to_string()) // No message needed for char insertion
+        }
+        "delete_char_backward" => {
+            if state.current_cursor_pos() > 0 {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.remove(cursor_pos - 1);
+                    *field_value = chars.into_iter().collect();
+                    let new_pos = cursor_pos - 1;
+                    state.set_current_cursor_pos(new_pos);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = new_pos;
+                }
+            }
+            Ok("".to_string())
+        }
+        "delete_char_forward" => {
+            let cursor_pos = state.current_cursor_pos();
+            let field_value = state.get_current_input_mut();
+            let mut chars: Vec<char> = field_value.chars().collect();
+            if cursor_pos < chars.len() {
+                chars.remove(cursor_pos);
+                *field_value = chars.into_iter().collect();
+                state.set_has_unsaved_changes(true);
+                *ideal_cursor_column = cursor_pos;
+            }
+            Ok("".to_string())
+        }
+        "next_field" => {
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let last_field_index = num_fields - 1;
+                // Prevent cycling forward
+                if current_field < last_field_index {
+                    state.set_current_field(current_field + 1);
+                }
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok("".to_string())
+        }
+        "prev_field" => {
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                if current_field > 0 {
+                    state.set_current_field(current_field - 1);
+                }
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok("".to_string())
+        }
+        "move_left" => {
+            let new_pos = state.current_cursor_pos().saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if current_pos < current_input.len() {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_up" => {
+            let current_field = state.current_field();
+            // Prevent moving up from the first field
+            if current_field > 0 {
+                let new_field = current_field - 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok("ahoj".to_string())
+        }
+        "move_down" => {
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let last_field_index = num_fields - 1;
+                if current_field < last_field_index {
+                    let new_field = current_field + 1;
+                    state.set_current_field(new_field);
+                    let current_input = state.get_current_input();
+                    let max_pos = current_input.len();
+                    state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+                }
+            }
+            Ok("".to_string())
+        }
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            let new_pos = current_input.len();
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_first_line" => {
+            if AddTableState::INPUT_FIELD_COUNT > 0 {
+                state.set_current_field(0);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok("".to_string())
+        }
+        "move_last_line" => {
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields > 0 {
+                let new_field = num_fields - 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok("".to_string())
+        }
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_next_word_start(current_input, state.current_cursor_pos());
+                let final_pos = new_pos.min(current_input.len());
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos == current_pos {
+                    find_word_end(current_input, new_pos + 1)
+                } else {
+                    new_pos
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(current_input, state.current_cursor_pos());
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(current_input, state.current_cursor_pos());
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        // Actions handled by main event loop (mode changes, save, revert)
+        "exit_edit_mode" | "save" | "revert" => {
+            Ok("Action handled by main loop".to_string())
+        }
+        _ => Ok(format!("Unknown or unhandled edit action: {}", action)),
+    }
+}
--- a/client/src/functions/modes/edit/auth_e.rs
+++ b/client/src/functions/modes/edit/auth_e.rs
@@ -0,0 +1,483 @@
+// src/functions/modes/edit/auth_e.rs
+
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::pages::form::FormState;
+use crate::state::pages::auth::RegisterState;
+use crate::tui::functions::common::form::{revert, save};
+use crossterm::event::{KeyCode, KeyEvent};
+use std::any::Any;
+
+pub async fn execute_common_action<S: CanvasState + Any>(
+    action: &str,
+    state: &mut S,
+    grpc_client: &mut GrpcClient,
+    current_position: &mut u64,
+    total_count: u64,
+) -> Result<String, Box<dyn std::error::Error>> {
+    match action {
+        "save" | "revert" => {
+            if !state.has_unsaved_changes() {
+                return Ok("No changes to save or revert.".to_string());
+            }
+            if let Some(form_state) =
+                (state as &mut dyn Any).downcast_mut::<FormState>()
+            {
+                match action {
+                    "save" => {
+                        let outcome = save(
+                            form_state,
+                            grpc_client,
+                            current_position,
+                            total_count,
+                        )
+                        .await?;
+                        let message = format!("Save successful: {:?}", outcome); // Simple message for now
+                        Ok(message)
+                    }
+                    "revert" => {
+                        revert(
+                            form_state,
+                            grpc_client,
+                            current_position,
+                            total_count,
+                        )
+                        .await
+                    }
+                    _ => unreachable!(),
+                }
+            } else {
+                Ok(format!(
+                    "Action '{}' not implemented for this state type.",
+                    action
+                ))
+            }
+        }
+        _ => Ok(format!("Common action '{}' not handled here.", action)),
+    }
+}
+
+pub async fn execute_edit_action<S: CanvasState + Any + Send>(
+    action: &str,
+    key: KeyEvent,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+    grpc_client: &mut GrpcClient,
+    current_position: &mut u64,
+    total_count: u64,
+) -> Result<String, Box<dyn std::error::Error>> {
+    match action {
+        "insert_char" => {
+            if let KeyCode::Char(c) = key.code {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.insert(cursor_pos, c);
+                    *field_value = chars.into_iter().collect();
+                    state.set_current_cursor_pos(cursor_pos + 1);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = state.current_cursor_pos();
+                }
+            } else {
+                return Ok("Error: insert_char called without a char key."
+                    .to_string());
+            }
+            Ok("working?".to_string())
+        }
+
+        "delete_char_backward" => {
+            if state.current_cursor_pos() > 0 {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.remove(cursor_pos - 1);
+                    *field_value = chars.into_iter().collect();
+                    let new_pos = cursor_pos - 1;
+                    state.set_current_cursor_pos(new_pos);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = new_pos;
+                }
+            }
+            Ok("".to_string())
+        }
+
+        "delete_char_forward" => {
+            let cursor_pos = state.current_cursor_pos();
+            let field_value = state.get_current_input_mut();
+            let mut chars: Vec<char> = field_value.chars().collect();
+            if cursor_pos < chars.len() {
+                chars.remove(cursor_pos);
+                *field_value = chars.into_iter().collect();
+                state.set_has_unsaved_changes(true);
+                *ideal_cursor_column = cursor_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "next_field" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = (current_field + 1) % num_fields;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "prev_field" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = if current_field == 0 {
+                    num_fields - 1
+                } else {
+                    current_field - 1
+                };
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_left" => {
+            let new_pos = state.current_cursor_pos().saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if current_pos < current_input.len() {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_up" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = current_field.saturating_sub(1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_down" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = (state.current_field() + 1).min(num_fields - 1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            let new_pos = current_input.len();
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+
+        "move_first_line" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                state.set_current_field(0);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("Moved to first field".to_string())
+        }
+
+        "move_last_line" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = num_fields - 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("Moved to last field".to_string())
+        }
+
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_next_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                let final_pos = new_pos.min(current_input.len());
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos == current_pos {
+                    find_word_end(current_input, new_pos + 1)
+                } else {
+                    new_pos
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("Moved to previous word end".to_string())
+        }
+
+        // --- Autocomplete Actions ---
+        "suggestion_down" | "suggestion_up" | "select_suggestion" | "exit_suggestion_mode" => {
+            // Attempt to downcast to RegisterState to handle suggestion logic here
+            if let Some(register_state) = (state as &mut dyn Any).downcast_mut::<RegisterState>() {
+                // Only handle if it's the role field (index 4)
+                if register_state.current_field() == 4 {
+                    match action {
+                        "suggestion_down" if register_state.in_suggestion_mode => {
+                            let max_index = register_state.role_suggestions.len().saturating_sub(1);
+                            let current_index = register_state.selected_suggestion_index.unwrap_or(0);
+                            register_state.selected_suggestion_index = Some(if current_index >= max_index { 0 } else { current_index + 1 });
+                            Ok("Suggestion changed down".to_string())
+                        }
+                        "suggestion_up" if register_state.in_suggestion_mode => {
+                            let max_index = register_state.role_suggestions.len().saturating_sub(1);
+                            let current_index = register_state.selected_suggestion_index.unwrap_or(0);
+                            register_state.selected_suggestion_index = Some(if current_index == 0 { max_index } else { current_index.saturating_sub(1) });
+                            Ok("Suggestion changed up".to_string())
+                        }
+                        "select_suggestion" if register_state.in_suggestion_mode => {
+                            if let Some(index) = register_state.selected_suggestion_index {
+                                if let Some(selected_role) = register_state.role_suggestions.get(index).cloned() {
+                                    register_state.role = selected_role.clone(); // Update the role field
+                                    register_state.in_suggestion_mode = false; // Exit suggestion mode
+                                    register_state.show_role_suggestions = false; // Hide suggestions
+                                    register_state.selected_suggestion_index = None; // Clear selection
+                                    Ok(format!("Selected role: {}", selected_role)) // Return success message
+                                } else {
+                                    Ok("Selected suggestion index out of bounds.".to_string()) // Error case
+                                }
+                            } else {
+                                Ok("No suggestion selected".to_string())
+                            }
+                        }
+                        "exit_suggestion_mode" => { // Handle Esc or other conditions
+                            register_state.show_role_suggestions = false;
+                            register_state.selected_suggestion_index = None;
+                            register_state.in_suggestion_mode = false;
+                            Ok("Suggestions hidden".to_string())
+                        }
+                        _ => {
+                            // Action is suggestion-related but state doesn't match (e.g., not in suggestion mode)
+                            Ok("Suggestion action ignored: State mismatch.".to_string())
+                        }
+                    }
+                } else {
+                    // It's RegisterState, but not the role field
+                    Ok("Suggestion action ignored: Not on role field.".to_string())
+                 }
+            } else {
+                // Downcast failed - this action is only for RegisterState
+                Ok(format!("Action '{}' not applicable for this state type.", action))
+            }
+        }
+        // --- End Autocomplete Actions ---
+
+
+        _ => Ok(format!("Unknown or unhandled edit action: {}", action)),
+    }
+}
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos >= len {
+        return len;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < len && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < len && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+
+    if get_char_type(chars[pos]) == CharType::Whitespace {
+        pos = find_next_word_start(text, pos);
+    }
+
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    pos
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+    if pos == 0 && get_char_type(chars[pos]) != CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}
--- a/client/src/functions/modes/edit/form_e.rs
+++ b/client/src/functions/modes/edit/form_e.rs
@@ -0,0 +1,440 @@
+// src/functions/modes/edit/form_e.rs
+
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::pages::form::FormState;
+use crate::tui::functions::common::form::{revert, save};
+use crate::tui::functions::common::form::SaveOutcome;
+use crate::modes::handlers::event::EventOutcome;
+use crossterm::event::{KeyCode, KeyEvent};
+use std::any::Any;
+
+pub async fn execute_common_action<S: CanvasState + Any>(
+    action: &str,
+    state: &mut S,
+    grpc_client: &mut GrpcClient,
+    current_position: &mut u64,
+    total_count: u64,
+) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+    match action {
+        "save" | "revert" => {
+            if !state.has_unsaved_changes() {
+                return Ok(EventOutcome::Ok("No changes to save or revert.".to_string()));
+            }
+            if let Some(form_state) =
+                (state as &mut dyn Any).downcast_mut::<FormState>()
+            {
+                match action {
+                    "save" => {
+                        let save_result = save(
+                            form_state,
+                            grpc_client,
+                            current_position,
+                            total_count,
+                        ).await;
+                        
+                        match save_result {
+                            Ok(save_outcome) => {
+                                let message = match save_outcome {
+                                    SaveOutcome::NoChange => "No changes to save.".to_string(),
+                                    SaveOutcome::UpdatedExisting => "Entry updated.".to_string(),
+                                    SaveOutcome::CreatedNew(_) => "New entry created.".to_string(),
+                                };
+                                Ok(EventOutcome::DataSaved(save_outcome, message))
+                            }
+                            Err(e) => Err(e),
+                        }
+                    }
+                    "revert" => {
+                        let revert_result = revert(
+                            form_state,
+                            grpc_client,
+                            current_position,
+                            total_count,
+                        ).await;
+                        
+                        match revert_result {
+                            Ok(message) => Ok(EventOutcome::Ok(message)),
+                            Err(e) => Err(e),
+                        }
+                    }
+                    _ => unreachable!(),
+                }
+            } else {
+                Ok(EventOutcome::Ok(format!(
+                    "Action '{}' not implemented for this state type.",
+                    action
+                )))
+            }
+        }
+        _ => Ok(EventOutcome::Ok(format!("Common action '{}' not handled here.", action))),
+    }
+}
+
+pub async fn execute_edit_action<S: CanvasState>(
+    action: &str,
+    key: KeyEvent,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+    grpc_client: &mut GrpcClient,
+    current_position: &mut u64,
+    total_count: u64,
+) -> Result<String, Box<dyn std::error::Error>> {
+    match action {
+        "insert_char" => {
+            if let KeyCode::Char(c) = key.code {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.insert(cursor_pos, c);
+                    *field_value = chars.into_iter().collect();
+                    state.set_current_cursor_pos(cursor_pos + 1);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = state.current_cursor_pos();
+                }
+            } else {
+                return Ok("Error: insert_char called without a char key."
+                    .to_string());
+            }
+            Ok("".to_string())
+        }
+
+        "delete_char_backward" => {
+            if state.current_cursor_pos() > 0 {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                if cursor_pos <= chars.len() {
+                    chars.remove(cursor_pos - 1);
+                    *field_value = chars.into_iter().collect();
+                    let new_pos = cursor_pos - 1;
+                    state.set_current_cursor_pos(new_pos);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = new_pos;
+                }
+            }
+            Ok("".to_string())
+        }
+
+        "delete_char_forward" => {
+            let cursor_pos = state.current_cursor_pos();
+            let field_value = state.get_current_input_mut();
+            let mut chars: Vec<char> = field_value.chars().collect();
+            if cursor_pos < chars.len() {
+                chars.remove(cursor_pos);
+                *field_value = chars.into_iter().collect();
+                state.set_has_unsaved_changes(true);
+                *ideal_cursor_column = cursor_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "next_field" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = (current_field + 1) % num_fields;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "prev_field" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = if current_field == 0 {
+                    num_fields - 1
+                } else {
+                    current_field - 1
+                };
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_left" => {
+            let new_pos = state.current_cursor_pos().saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if current_pos < current_input.len() {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_up" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = current_field.saturating_sub(1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_down" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = (state.current_field() + 1).min(num_fields - 1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("".to_string())
+        }
+
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            let new_pos = current_input.len();
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+
+        "move_first_line" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                state.set_current_field(0);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("Moved to first field".to_string())
+        }
+
+        "move_last_line" => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = num_fields - 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos(
+                    (*ideal_cursor_column).min(max_pos),
+                );
+            }
+            Ok("Moved to last field".to_string())
+        }
+
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_next_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                let final_pos = new_pos.min(current_input.len());
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos == current_pos {
+                    find_word_end(current_input, new_pos + 1)
+                } else {
+                    new_pos
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("Moved to previous word end".to_string())
+        }
+
+        _ => Ok(format!("Unknown or unhandled edit action: {}", action)),
+    }
+}
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos >= len {
+        return len;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < len && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < len && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+
+    if get_char_type(chars[pos]) == CharType::Whitespace {
+        pos = find_next_word_start(text, pos);
+    }
+
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    pos
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+    if pos == 0 && get_char_type(chars[pos]) != CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}
--- a/client/src/functions/modes/navigation.rs
+++ b/client/src/functions/modes/navigation.rs
@@ -0,0 +1,4 @@
+// src/functions/modes/navigation.rs
+
+pub mod admin_nav;
+pub mod add_table_nav;
--- a/client/src/functions/modes/navigation/add_table_nav.rs
+++ b/client/src/functions/modes/navigation/add_table_nav.rs
@@ -0,0 +1,377 @@
+// src/functions/modes/navigation/add_table_nav.rs
+use crate::config::binds::config::Config;
+use crate::state::{
+    app::state::AppState,
+    pages::add_table::{AddTableFocus, AddTableState},
+};
+use crossterm::event::{KeyEvent};
+use ratatui::widgets::TableState;
+use crate::tui::functions::common::add_table::handle_add_column_action;
+use crate::ui::handlers::context::DialogPurpose;
+
+/// Handles navigation events specifically for the Add Table view.
+/// Returns true if the event was handled, false otherwise.
+pub fn handle_add_table_navigation(
+    key: KeyEvent,
+    config: &Config,
+    app_state: &mut AppState,
+    add_table_state: &mut AddTableState,
+    command_message: &mut String,
+) -> bool {
+    let action = config.get_general_action(key.code, key.modifiers);
+    let current_focus = add_table_state.current_focus;
+    let mut handled = true; // Assume handled unless logic determines otherwise
+    let mut new_focus = current_focus; // Initialize new_focus
+
+    // Define focus groups for horizontal navigation
+    let is_left_pane_block_focus = matches!(current_focus, // Focus on the table blocks
+        AddTableFocus::ColumnsTable | AddTableFocus::IndexesTable | AddTableFocus::LinksTable
+    );
+    let is_inside_table_focus = matches!(current_focus, // Focus inside for scrolling
+        AddTableFocus::InsideColumnsTable | AddTableFocus::InsideIndexesTable | AddTableFocus::InsideLinksTable
+    );
+    let is_right_pane_general_focus = matches!(current_focus, // Non-canvas elements in right pane
+         AddTableFocus::AddColumnButton | AddTableFocus::SaveButton | AddTableFocus::DeleteSelectedButton | AddTableFocus::CancelButton
+     );
+    let is_canvas_input_focus = matches!(current_focus,
+        AddTableFocus::InputTableName | AddTableFocus::InputColumnName | AddTableFocus::InputColumnType
+    );
+
+    match action.as_deref() {
+       // --- Handle Exiting Table Scroll Mode ---
+       Some("exit_table_scroll") => {
+           match current_focus {
+               AddTableFocus::InsideColumnsTable => {
+                   add_table_state.column_table_state.select(None);
+                   new_focus = AddTableFocus::ColumnsTable;
+                   *command_message = "Exited Columns Table".to_string();
+               }
+               AddTableFocus::InsideIndexesTable => {
+                   add_table_state.index_table_state.select(None);
+                   new_focus = AddTableFocus::IndexesTable;
+                   *command_message = "Exited Indexes Table".to_string();
+               }
+               AddTableFocus::InsideLinksTable => {
+                   add_table_state.link_table_state.select(None);
+                   new_focus = AddTableFocus::LinksTable;
+                   *command_message = "Exited Links Table".to_string();
+               }
+               _ => {
+                   // Action triggered but not applicable in this focus state
+                   handled = false;
+               }
+           }
+           // If handled (i.e., focus changed), handled remains true.
+           // If not handled, handled becomes false.
+       }
+
+        // --- Vertical Navigation (Up/Down) ---
+        Some("move_up") => {
+            match current_focus {
+                AddTableFocus::InputTableName => new_focus = AddTableFocus::CancelButton,
+                AddTableFocus::InputColumnName => new_focus = AddTableFocus::InputTableName,
+                AddTableFocus::InputColumnType => new_focus = AddTableFocus::InputColumnName,
+                AddTableFocus::AddColumnButton => new_focus = AddTableFocus::InputColumnType,
+                // Navigate between blocks when focus is on the table block itself
+                AddTableFocus::ColumnsTable => new_focus = AddTableFocus::AddColumnButton, // Move up to right pane
+                AddTableFocus::IndexesTable => new_focus = AddTableFocus::ColumnsTable,
+                AddTableFocus::LinksTable => new_focus = AddTableFocus::IndexesTable,
+                // Scroll inside the table when focus is internal
+                AddTableFocus::InsideColumnsTable => {
+                    navigate_table_up(&mut add_table_state.column_table_state, add_table_state.columns.len());
+                    // Stay inside the table, don't change new_focus
+                }
+                AddTableFocus::InsideIndexesTable => {
+                    navigate_table_up(&mut add_table_state.index_table_state, add_table_state.indexes.len());
+                    // Stay inside the table
+                }
+                AddTableFocus::InsideLinksTable => {
+                    navigate_table_up(&mut add_table_state.link_table_state, add_table_state.links.len());
+                    // Stay inside the table
+                }
+                AddTableFocus::SaveButton => new_focus = AddTableFocus::LinksTable,
+                AddTableFocus::DeleteSelectedButton => new_focus = AddTableFocus::SaveButton,
+                AddTableFocus::CancelButton => new_focus = AddTableFocus::DeleteSelectedButton,
+            }
+        }
+        Some("move_down") => {
+            match current_focus {
+                AddTableFocus::InputTableName => new_focus = AddTableFocus::InputColumnName,
+                AddTableFocus::InputColumnName => new_focus = AddTableFocus::InputColumnType,
+                AddTableFocus::InputColumnType => new_focus = AddTableFocus::AddColumnButton,
+                AddTableFocus::AddColumnButton => new_focus = AddTableFocus::ColumnsTable,
+                // Navigate between blocks when focus is on the table block itself
+                AddTableFocus::ColumnsTable => new_focus = AddTableFocus::IndexesTable,
+                AddTableFocus::IndexesTable => new_focus = AddTableFocus::LinksTable,
+                AddTableFocus::LinksTable => new_focus = AddTableFocus::SaveButton, // Move down to right pane
+                // Scroll inside the table when focus is internal
+                AddTableFocus::InsideColumnsTable => {
+                    navigate_table_down(&mut add_table_state.column_table_state, add_table_state.columns.len());
+                    // Stay inside the table
+                }
+                AddTableFocus::InsideIndexesTable => {
+                    navigate_table_down(&mut add_table_state.index_table_state, add_table_state.indexes.len());
+                    // Stay inside the table
+                }
+                AddTableFocus::InsideLinksTable => {
+                    navigate_table_down(&mut add_table_state.link_table_state, add_table_state.links.len());
+                    // Stay inside the table
+                }
+                AddTableFocus::SaveButton => new_focus = AddTableFocus::DeleteSelectedButton,
+                AddTableFocus::DeleteSelectedButton => new_focus = AddTableFocus::CancelButton,
+                AddTableFocus::CancelButton => new_focus = AddTableFocus::InputTableName,
+            }
+        }
+
+        // --- Horizontal Navigation (Left/Right) ---
+        Some("next_option") => { // 'l' or Right: Move from Left Pane to Right Pane
+            // Horizontal nav within bottom buttons
+            if current_focus == AddTableFocus::SaveButton {
+                new_focus = AddTableFocus::DeleteSelectedButton;
+            } else if current_focus == AddTableFocus::DeleteSelectedButton {
+                new_focus = AddTableFocus::CancelButton;
+            }        
+        }
+        Some("previous_option") => { // 'h' or Left: Move from Right Pane to Left Pane
+            // Horizontal nav within bottom buttons
+            if current_focus == AddTableFocus::CancelButton {
+                new_focus = AddTableFocus::DeleteSelectedButton;
+            } else if current_focus == AddTableFocus::DeleteSelectedButton {
+                new_focus = AddTableFocus::SaveButton;
+            }        
+        }
+
+        // --- Tab / Shift+Tab Navigation (Keep as vertical cycle) ---
+        Some("next_field") => { // Tab
+            new_focus = match current_focus {
+                AddTableFocus::InputTableName => AddTableFocus::InputColumnName,
+                AddTableFocus::InputColumnName => AddTableFocus::InputColumnType,
+                AddTableFocus::InputColumnType => AddTableFocus::AddColumnButton,
+                AddTableFocus::AddColumnButton => AddTableFocus::ColumnsTable,
+                // Treat Inside* same as block focus for tabbing out
+                AddTableFocus::ColumnsTable | AddTableFocus::InsideColumnsTable => AddTableFocus::IndexesTable,
+                AddTableFocus::IndexesTable | AddTableFocus::InsideIndexesTable => AddTableFocus::LinksTable,
+                AddTableFocus::LinksTable | AddTableFocus::InsideLinksTable => AddTableFocus::SaveButton,
+                AddTableFocus::SaveButton => AddTableFocus::DeleteSelectedButton,
+                AddTableFocus::DeleteSelectedButton => AddTableFocus::CancelButton,
+                AddTableFocus::CancelButton => AddTableFocus::InputTableName, // Wrap
+            };
+        }
+        Some("prev_field") => { // Shift+Tab
+            new_focus = match current_focus {
+                AddTableFocus::InputTableName => AddTableFocus::CancelButton, // Wrap
+                AddTableFocus::InputColumnName => AddTableFocus::InputTableName,
+                AddTableFocus::InputColumnType => AddTableFocus::InputColumnName,
+                AddTableFocus::AddColumnButton => AddTableFocus::InputColumnType,
+                // Treat Inside* same as block focus for tabbing out
+                AddTableFocus::ColumnsTable | AddTableFocus::InsideColumnsTable => AddTableFocus::AddColumnButton,
+                AddTableFocus::IndexesTable | AddTableFocus::InsideIndexesTable => AddTableFocus::ColumnsTable,
+                AddTableFocus::LinksTable | AddTableFocus::InsideLinksTable => AddTableFocus::IndexesTable,
+                AddTableFocus::SaveButton => AddTableFocus::LinksTable,
+                AddTableFocus::DeleteSelectedButton => AddTableFocus::SaveButton,
+                AddTableFocus::CancelButton => AddTableFocus::DeleteSelectedButton,
+            };
+        }
+
+        // --- Selection ---
+        Some("select") => {
+            match current_focus {
+                // --- Enter/Exit Table Focus ---
+                AddTableFocus::ColumnsTable => {
+                    new_focus = AddTableFocus::InsideColumnsTable;
+                    // Select first item if none selected when entering
+                    if add_table_state.column_table_state.selected().is_none() && !add_table_state.columns.is_empty() {
+                        add_table_state.column_table_state.select(Some(0));
+                    }
+                    *command_message = "Entered Columns Table (Scroll with Up/Down, Select to exit)".to_string();
+                }
+                AddTableFocus::IndexesTable => {
+                    new_focus = AddTableFocus::InsideIndexesTable;
+                    if add_table_state.index_table_state.selected().is_none() && !add_table_state.indexes.is_empty() {
+                        add_table_state.index_table_state.select(Some(0));
+                    }
+                    *command_message = "Entered Indexes Table (Scroll with Up/Down, Select to exit)".to_string();
+                }
+                AddTableFocus::LinksTable => {
+                    new_focus = AddTableFocus::InsideLinksTable;
+                    if add_table_state.link_table_state.selected().is_none() && !add_table_state.links.is_empty() {
+                        add_table_state.link_table_state.select(Some(0));
+                    }
+                    *command_message = "Entered Links Table (Scroll with Up/Down, Select to toggle/exit)".to_string();
+                }
+                AddTableFocus::InsideColumnsTable => {
+                    // Toggle selection when pressing select *inside* the columns table
+                    if let Some(index) = add_table_state.column_table_state.selected() {
+                        if let Some(col) = add_table_state.columns.get_mut(index) {
+                            col.selected = !col.selected;
+                            add_table_state.has_unsaved_changes = true;
+                            *command_message = format!(
+                                "Toggled selection for column: {} to {}",
+                                col.name, col.selected
+                            );
+                        }
+                    } else {
+                        *command_message = "No column highlighted to toggle selection".to_string();
+                    }
+                }
+                AddTableFocus::InsideIndexesTable => {
+                    // Select does nothing here anymore, only Esc exits.
+                    if let Some(index) = add_table_state.index_table_state.selected() {
+                        *command_message = format!("Selected index index {} (Press Esc to exit scroll mode)", index);
+                    } else {
+                        *command_message = "No index selected (Press Esc to exit scroll mode)".to_string();
+                    }
+                }
+                AddTableFocus::InsideLinksTable => {
+                    // Toggle selection when pressing select *inside* the links table
+                    if let Some(index) = add_table_state.link_table_state.selected() {
+                        if let Some(link) = add_table_state.links.get_mut(index) {
+                            link.selected = !link.selected; // Toggle the selected state
+                            add_table_state.has_unsaved_changes = true; // Mark changes
+                            *command_message = format!(
+                                "Toggled selection for link: {} to {}",
+                                link.linked_table_name, link.selected
+                            );
+                        } else {
+                            *command_message = "Error: Selected link index out of bounds".to_string();
+                        }
+                    } else {
+                        *command_message = "No link selected to toggle".to_string();
+                    }
+                    // Stay inside the links table after toggling
+                    new_focus = AddTableFocus::InsideLinksTable;
+                    // Alternative: Exit after toggle:
+                    // new_focus = AddTableFocus::LinksTable;
+                    // *command_message = format!("{} - Exited Links Table", command_message);
+                }
+                // --- Other Select Actions ---
+                AddTableFocus::AddColumnButton => {
+                    if let Some(focus_after_add) = handle_add_column_action(add_table_state, command_message) {
+                        new_focus = focus_after_add;
+                    }
+                }
+                AddTableFocus::SaveButton => {
+                    *command_message = "Action: Save Table (Not Implemented)".to_string();
+                    // TODO: Implement logic
+                }
+                AddTableFocus::DeleteSelectedButton => {
+                    // --- Show Confirmation Dialog ---
+                    // Collect tuples of (index, name, type) for selected columns
+                    let columns_to_delete: Vec<(usize, String, String)> = add_table_state
+                        .columns
+                        .iter()
+                        .enumerate() // Get index along with the column
+                        .filter(|(_index, col)| col.selected) // Filter based on selection
+                        .map(|(index, col)| (index, col.name.clone(), col.data_type.clone())) // Map to (index, name, type)
+                        .collect();
+
+                    if columns_to_delete.is_empty() {
+                        *command_message = "No columns selected for deletion.".to_string();
+                    } else {
+                        // Format the message to include index, name, and type
+                        let column_details: String = columns_to_delete
+                            .iter()
+                            // Add 1 to index for 1-based numbering for user display
+                            .map(|(index, name, dtype)| format!("{}. {} ({})", index + 1, name, dtype))
+                            .collect::<Vec<String>>()
+                            .join("\n");
+
+                        // Use the formatted column_details string in the message
+                        let message = format!(
+                            "Delete the following columns?\n\n{}",
+                            column_details
+                        );
+                        let buttons = vec!["Confirm".to_string(), "Cancel".to_string()];
+                        app_state.show_dialog(
+                            "Confirm Deletion",
+                            &message,
+                            buttons,
+                            DialogPurpose::ConfirmDeleteColumns,
+                        );
+                    }
+                }
+                AddTableFocus::CancelButton => {
+                    *command_message = "Action: Cancel Add Table".to_string();
+                    // TODO: Implement logic
+                }
+                _ => { // Input fields
+                    *command_message = format!("Select on {:?}", current_focus);
+                    handled = false; // Let main loop handle edit mode toggle maybe
+                }
+            }
+            // Keep handled = true for select actions unless specifically set to false
+        }
+
+        // --- Other General Keys ---
+        Some("toggle_sidebar") | Some("toggle_buffer_list") => {
+            handled = false;
+        }
+
+        // --- No matching action ---
+        _ => handled = false,
+    }
+
+    // Update focus state if it changed and was handled
+    if handled && current_focus != new_focus {
+        add_table_state.current_focus = new_focus;
+        // Avoid overwriting specific messages set during 'select' handling
+        if command_message.is_empty() || command_message.starts_with("Focus set to") {
+             *command_message = format!("Focus set to {:?}", add_table_state.current_focus);
+        }
+
+        // Check if the *new* focus target is one of the canvas input fields
+        let new_is_canvas_input_focus = matches!(new_focus,
+            AddTableFocus::InputTableName | AddTableFocus::InputColumnName | AddTableFocus::InputColumnType
+        );
+        // Focus is outside canvas if it's not an input field
+        app_state.ui.focus_outside_canvas = !new_is_canvas_input_focus;
+    } else if !handled {
+        // command_message.clear(); // Optional: Clear message if not handled here
+    }
+
+    handled
+}
+
+
+// Helper function for navigating up within a table state
+// Returns true if navigation happened within the table, false if it reached the top
+fn navigate_table_up(table_state: &mut TableState, item_count: usize) -> bool {
+    if item_count == 0 { return false; }
+    let current_selection = table_state.selected();
+    match current_selection {
+        Some(index) => {
+            if index > 0 {
+                table_state.select(Some(index - 1));
+                true // Navigation happened
+            } else {
+                false // Was at the top
+            }
+        }
+        None => { // No item selected, select the last one
+            table_state.select(Some(item_count - 1));
+            true // Navigation happened (selection set)
+        }
+    }
+}
+
+// Helper function for navigating down within a table state
+// Returns true if navigation happened within the table, false if it reached the bottom
+fn navigate_table_down(table_state: &mut TableState, item_count: usize) -> bool {
+     if item_count == 0 { return false; }
+    let current_selection = table_state.selected();
+    match current_selection {
+        Some(index) => {
+            if index < item_count - 1 {
+                table_state.select(Some(index + 1));
+                true // Navigation happened
+            } else {
+                false // Was at the bottom
+            }
+        }
+        None => { // No item selected, select the first one
+             table_state.select(Some(0));
+             true // Navigation happened (selection set)
+        }
+    }
+}
+
--- a/client/src/functions/modes/navigation/admin_nav.rs
+++ b/client/src/functions/modes/navigation/admin_nav.rs
@@ -0,0 +1,213 @@
+// src/functions/modes/navigation/admin_nav.rs
+
+use crate::config::binds::config::Config;
+use crate::state::{
+    app::state::AppState,
+    pages::admin::{AdminFocus, AdminState},
+};
+use crossterm::event::{KeyCode, KeyEvent, KeyModifiers};
+use crate::state::app::buffer::AppView;
+use crate::state::app::buffer::BufferState;
+use crate::state::pages::add_table::AddTableState;
+
+/// Handles navigation events specifically for the Admin Panel view.
+/// Returns true if the event was handled, false otherwise.
+pub fn handle_admin_navigation(
+    key: KeyEvent,
+    config: &Config,
+    app_state: &mut AppState,
+    admin_state: &mut AdminState,
+    buffer_state: &mut BufferState,
+    command_message: &mut String,
+) -> bool {
+    let action = config.get_general_action(key.code, key.modifiers);
+    let current_focus = admin_state.current_focus;
+    let profile_count = app_state.profile_tree.profiles.len();
+
+    match action {
+        // --- Vertical Navigation (Up/Down) ---
+        Some("move_up") => {
+            match current_focus {
+                AdminFocus::Profiles => {
+                    if profile_count > 0 {
+                        // Updates navigation state, resets table state
+                        admin_state.previous_profile(profile_count);
+                        *command_message = "Navigated profiles".to_string();
+                    }
+                }
+                AdminFocus::Tables => {
+                    // Updates table navigation state
+                    if let Some(nav_profile_idx) = admin_state.profile_list_state.selected() {
+                        if let Some(profile) = app_state.profile_tree.profiles.get(nav_profile_idx) {
+                            let table_count = profile.tables.len();
+                            if table_count > 0 {
+                                admin_state.previous_table(table_count);
+                                *command_message = "Navigated tables".to_string();
+                            }
+                        }
+                    }
+                }
+                AdminFocus::Button1 | AdminFocus::Button2 | AdminFocus::Button3 => {}
+            }
+            true // Event handled
+        }
+        Some("move_down") => {
+            match current_focus {
+                AdminFocus::Profiles => {
+                    if profile_count > 0 {
+                        // Updates navigation state, resets table state
+                        admin_state.next_profile(profile_count);
+                        *command_message = "Navigated profiles".to_string();
+                    }
+                }
+                AdminFocus::Tables => {
+                    if let Some(nav_profile_idx) = admin_state.profile_list_state.selected() {
+                        if let Some(profile) = app_state.profile_tree.profiles.get(nav_profile_idx) {
+                            let table_count = profile.tables.len();
+                            if table_count > 0 {
+                                admin_state.next_table(table_count);
+                                *command_message = "Navigated tables".to_string();
+                            }
+                        }
+                    }
+                }
+                AdminFocus::Button1 | AdminFocus::Button2 | AdminFocus::Button3 => {}
+            }
+            true // Event handled
+        }
+
+        // --- Horizontal Navigation (Focus Change) ---
+        Some("next_option") | Some("previous_option") => {
+            let old_focus = admin_state.current_focus;
+            let is_next = action == Some("next_option"); // Check if 'l' or 'h'
+
+            admin_state.current_focus = match old_focus {
+                AdminFocus::Profiles => if is_next { AdminFocus::Tables } else { AdminFocus::Button3 }, // P -> T (l) or P -> B3 (h)
+                AdminFocus::Tables => if is_next { AdminFocus::Button1 } else { AdminFocus::Profiles }, // T -> B1 (l) or T -> P (h)
+                AdminFocus::Button1 => if is_next { AdminFocus::Button2 } else { AdminFocus::Tables },   // B1 -> B2 (l) or B1 -> T (h)
+                AdminFocus::Button2 => if is_next { AdminFocus::Button3 } else { AdminFocus::Button1 },   // B2 -> B3 (l) or B2 -> B1 (h)
+                AdminFocus::Button3 => if is_next { AdminFocus::Profiles } else { AdminFocus::Button2 }, // B3 -> P (l) or B3 -> B2 (h)
+            };
+
+            let new_focus = admin_state.current_focus;
+            *command_message = format!("Focus set to {:?}", new_focus);
+            // Auto-select first item only when moving from Profiles to Tables via 'l'
+            if old_focus == AdminFocus::Profiles && new_focus == AdminFocus::Tables && is_next {
+                 if let Some(profile_idx) = admin_state.profile_list_state.selected() {
+                     if let Some(profile) = app_state.profile_tree.profiles.get(profile_idx) {
+                         if !profile.tables.is_empty() {
+                             admin_state.table_list_state.select(Some(0));
+                         } else {
+                             admin_state.table_list_state.select(None);
+                         }
+                     } else {
+                          admin_state.table_list_state.select(None);
+                     }
+                 } else {
+                      admin_state.table_list_state.select(None);
+                 }
+            }
+            // Clear table nav selection if moving away from Tables
+            if old_focus == AdminFocus::Tables && new_focus != AdminFocus::Tables {
+                 admin_state.table_list_state.select(None);
+            }
+            // Clear profile nav selection if moving away from Profiles
+            if old_focus == AdminFocus::Profiles && new_focus != AdminFocus::Profiles {
+                 // Maybe keep profile nav highlight? Let's try clearing it.
+                 // admin_state.profile_list_state.select(None); // Optional: clear profile nav highlight
+            }
+
+            true // Event handled
+        }
+
+        // --- Selection ---
+        Some("select") => {
+            match current_focus {
+                AdminFocus::Profiles => {
+                    // Set the persistent selection to the currently navigated item
+                    if let Some(nav_idx) = admin_state.profile_list_state.selected() {
+                        admin_state.selected_profile_index = Some(nav_idx); // Set persistent selection
+
+                        // Move focus to Tables (like pressing 'l')
+                        admin_state.current_focus = AdminFocus::Tables;
+
+                        // Select the first table for navigation highlight
+                        admin_state.table_list_state.select(None); // Clear table nav first
+                        admin_state.selected_table_index = None;   // Clear persistent table selection
+                        if let Some(profile) = app_state.profile_tree.profiles.get(nav_idx) {
+                                  if !profile.tables.is_empty() {
+                                      // Set table nav highlight
+                                      admin_state.table_list_state.select(Some(0));
+                                  }
+                              }
+
+                        *command_message = format!("Selected profile idx {}, focus on Tables", nav_idx);
+                    } else {
+                        *command_message = "No profile selected".to_string();
+                    }
+                }
+                AdminFocus::Tables => {
+                    // Set the persistent selection to the currently navigated item
+                    if let Some(nav_idx) = admin_state.table_list_state.selected() {
+                         admin_state.selected_table_index = Some(nav_idx); // Set persistent selection
+                         *command_message = format!("Selected table index {}", nav_idx);
+                     } else {
+                         *command_message = "No table highlighted".to_string();
+                     }
+                    // We don't change focus here for now.
+                }
+                AdminFocus::Button1 => {
+                    *command_message = "Action: Add Logic (Not Implemented)".to_string();
+                    // TODO: Trigger action for Button 1
+                }
+                AdminFocus::Button2 => {
+                   // --- Prepare AddTableState based on persistent selections ---
+                   if let Some(p_idx) = admin_state.selected_profile_index {
+                       if let Some(profile) = app_state.profile_tree.profiles.get(p_idx) {
+                           let selected_profile_name = profile.name.clone();
+
+
+                           // Create and populate the new AddTableState
+                           let new_add_table_state = AddTableState {
+                               profile_name: selected_profile_name,
+                               // Reset other fields to defaults for a fresh start
+                               ..AddTableState::default()
+                           };
+
+                           // Assign the prepared state
+                           admin_state.add_table_state = new_add_table_state;
+
+                           // Switch view
+                           buffer_state.update_history(AppView::AddTable);
+                           app_state.ui.focus_outside_canvas = false;
+                           *command_message = format!(
+                               "Navigating to Add Table for profile '{}'...",
+                               admin_state.add_table_state.profile_name
+                           );
+
+                       } else {
+                           *command_message = "Error: Selected profile index out of bounds.".to_string();
+                       }
+                   } else {
+                       *command_message = "Please select a profile ([*]) first.".to_string();
+                   }
+                   // --- End preparation ---
+                }
+                AdminFocus::Button3 => {
+                    *command_message = "Action: Change Table (Not Implemented)".to_string();
+                    // TODO: Trigger action for Button 3
+                }
+            }
+            true // Event handled
+        }
+
+        // --- Other General Keys (Ignore for admin nav) ---
+        Some("toggle_sidebar") | Some("toggle_buffer_list") | Some("next_field") | Some("prev_field") => {
+            // These are handled globally or not applicable here.
+            false
+        }
+
+        // --- No matching action ---
+        _ => false, // Event not handled by admin navigation
+    }
+}
--- a/client/src/functions/modes/read_only.rs
+++ b/client/src/functions/modes/read_only.rs
@@ -0,0 +1,5 @@
+// src/functions/modes/read_only.rs
+
+pub mod auth_ro;
+pub mod form_ro;
+pub mod add_table_ro;
--- a/client/src/functions/modes/read_only/add_table_ro.rs
+++ b/client/src/functions/modes/read_only/add_table_ro.rs
@@ -0,0 +1,244 @@
+// src/functions/modes/read_only/add_table_ro.rs
+use crate::config::binds::key_sequences::KeySequenceTracker;
+use crate::state::pages::add_table::AddTableState;
+use crate::state::pages::canvas_state::CanvasState; // Use trait for common actions
+use crate::state::app::state::AppState;
+use std::error::Error;
+
+// Re-use word navigation helpers if they are public or move them to a common module
+// For now, duplicating them here for simplicity. Consider refactoring later.
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() { CharType::Whitespace }
+    else if c.is_alphanumeric() { CharType::Alphanumeric }
+    else { CharType::Punctuation }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos >= len { return len; }
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == initial_type { pos += 1; }
+    while pos < len && get_char_type(chars[pos]) == CharType::Whitespace { pos += 1; }
+    pos
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 { return 0; }
+    let mut pos = current_pos.min(len - 1);
+    if get_char_type(chars[pos]) == CharType::Whitespace {
+        pos = find_next_word_start(text, pos);
+    }
+    if pos >= len { return len.saturating_sub(1); }
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type { pos += 1; }
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 { return 0; }
+    let mut pos = current_pos.saturating_sub(1);
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace { pos -= 1; }
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace { return 0; }
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type { pos -= 1; }
+    pos
+}
+
+// Note: find_prev_word_end might need adjustments based on desired behavior.
+// This version finds the end of the word *before* the previous word start.
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+    let prev_start = find_prev_word_start(text, current_pos);
+    if prev_start == 0 { return 0; }
+    // Find the end of the word that starts at prev_start - 1
+    find_word_end(text, prev_start.saturating_sub(1))
+}
+
+
+/// Executes read-only actions for the AddTable view canvas.
+pub async fn execute_action(
+    action: &str,
+    app_state: &mut AppState, // Needed for focus_outside_canvas
+    state: &mut AddTableState,
+    ideal_cursor_column: &mut usize,
+    key_sequence_tracker: &mut KeySequenceTracker,
+    command_message: &mut String, // Keep for potential messages
+) -> Result<String, Box<dyn Error>> {
+    // Use the CanvasState trait methods implemented for AddTableState
+    match action {
+        "move_up" => {
+            key_sequence_tracker.reset();
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields == 0 { return Ok("No fields.".to_string()); }
+            let current_field = state.current_field(); // Gets the index (0, 1, or 2)
+
+            if current_field > 0 {
+                // This handles moving from field 2 -> 1, or 1 -> 0
+                let new_field = current_field - 1;
+                state.set_current_field(new_field);
+                // ... (rest of the logic to set cursor position) ...
+            } else {
+                // --- THIS IS WHERE THE FIX GOES ---
+                // current_field is 0 (InputTableName), and user pressed Up.
+                // We need to move focus *outside* the canvas.
+
+                // Set the flag to indicate focus is leaving the canvas
+                app_state.ui.focus_outside_canvas = true;
+
+                // Decide which element gets focus. Based on your layout and the
+                // downward navigation (CancelButton wraps to InputTableName),
+                // moving up from InputTableName should likely go to CancelButton.
+                state.current_focus = crate::state::pages::add_table::AddTableFocus::CancelButton;
+
+                // Reset the sequence tracker as the action is complete
+                key_sequence_tracker.reset();
+
+                // Return a message indicating the focus change
+                return Ok("Focus moved above canvas".to_string());
+                // --- END FIX ---
+            }
+            // If we moved within the canvas (e.g., 1 -> 0), return empty string
+            Ok("".to_string())
+        }
+        "move_down" => {
+            key_sequence_tracker.reset();
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields == 0 { return Ok("No fields.".to_string()); }
+            let current_field = state.current_field();
+            let last_field_index = num_fields - 1;
+
+            if current_field < last_field_index {
+                let new_field = current_field + 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_cursor_pos = current_input.len(); // Allow cursor at end
+                let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+                state.set_current_cursor_pos(new_pos);
+            } else {
+                // Move focus outside canvas when moving down from the last field
+                app_state.ui.focus_outside_canvas = true;
+                // Set focus to the first element outside canvas (AddColumnButton)
+                state.current_focus = crate::state::pages::add_table::AddTableFocus::AddColumnButton;
+                key_sequence_tracker.reset();
+                return Ok("Focus moved below canvas".to_string());
+            }
+            Ok("".to_string())
+        }
+        "move_first_line" => {
+            key_sequence_tracker.reset();
+            if AddTableState::INPUT_FIELD_COUNT > 0 {
+                state.set_current_field(0);
+                let current_input = state.get_current_input();
+                let max_cursor_pos = current_input.len();
+                let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos; // Update ideal column
+            }
+            Ok("".to_string())
+        }
+        "move_last_line" => {
+            key_sequence_tracker.reset();
+            let num_fields = AddTableState::INPUT_FIELD_COUNT;
+            if num_fields > 0 {
+                let last_field_index = num_fields - 1;
+                state.set_current_field(last_field_index);
+                let current_input = state.get_current_input();
+                let max_cursor_pos = current_input.len();
+                let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos; // Update ideal column
+            }
+            Ok("".to_string())
+        }
+        "move_left" => {
+            let current_pos = state.current_cursor_pos();
+            let new_pos = current_pos.saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            // Allow moving cursor one position past the end
+            if current_pos < current_input.len() {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            let new_pos = find_next_word_start(current_input, state.current_cursor_pos());
+            let final_pos = new_pos.min(current_input.len()); // Allow cursor at end
+            state.set_current_cursor_pos(final_pos);
+            *ideal_cursor_column = final_pos;
+            Ok("".to_string())
+        }
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            let new_pos = find_word_end(current_input, current_pos);
+            // If find_word_end returns current_pos, try starting search from next char
+            let final_pos = if new_pos == current_pos && current_pos < current_input.len() {
+                find_word_end(current_input, current_pos + 1)
+            } else {
+                new_pos
+            };
+            let max_valid_index = current_input.len(); // Allow cursor at end
+            let clamped_pos = final_pos.min(max_valid_index);
+            state.set_current_cursor_pos(clamped_pos);
+            *ideal_cursor_column = clamped_pos;
+            Ok("".to_string())
+        }
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            let new_pos = find_prev_word_start(current_input, state.current_cursor_pos());
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            let new_pos = find_prev_word_end(current_input, state.current_cursor_pos());
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            let new_pos = current_input.len(); // Allow cursor at end
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        // Actions handled by main event loop (mode changes)
+        "enter_edit_mode_before" | "enter_edit_mode_after" | "enter_command_mode" | "exit_highlight_mode" => {
+             key_sequence_tracker.reset();
+             Ok("Mode change handled by main loop".to_string())
+        }
+        _ => {
+             key_sequence_tracker.reset();
+             command_message.clear(); // Clear message for unhandled actions
+             Ok(format!("Unknown read-only action: {}", action))
+        },
+    }
+}
+
--- a/client/src/functions/modes/read_only/auth_ro.rs
+++ b/client/src/functions/modes/read_only/auth_ro.rs
@@ -0,0 +1,367 @@
+// src/functions/modes/read_only/auth_ro.rs
+
+use crate::config::binds::key_sequences::KeySequenceTracker;
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::app::state::AppState;
+use std::error::Error;
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+pub async fn execute_action<S: CanvasState>(
+    action: &str,
+    app_state: &mut AppState,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+    key_sequence_tracker: &mut KeySequenceTracker,
+    command_message: &mut String,
+) -> Result<String, Box<dyn Error>> {
+    match action {
+        "previous_entry" | "next_entry" => {
+            key_sequence_tracker.reset();
+            Ok(format!(
+                "Action '{}' should be handled by context-specific logic",
+                action
+            ))
+        }
+        "move_up" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate.".to_string());
+            }
+            let current_field = state.current_field();
+            let new_field = current_field.saturating_sub(1);
+            state.set_current_field(new_field);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+
+            Ok("move up from functions/modes/read_only/auth_ro.rs".to_string())
+        }
+        "move_down" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate.".to_string());
+            }
+            let current_field = state.current_field();
+            let last_field_index = num_fields - 1;
+
+            if current_field == last_field_index {
+                // Already on the last field, move focus outside
+                app_state.ui.focus_outside_canvas = true;
+                app_state.focused_button_index= 0;
+                key_sequence_tracker.reset();
+                Ok("Focus moved below canvas".to_string())
+            } else {
+                // Move to the next field within the canvas
+                let new_field = (current_field + 1).min(last_field_index);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_cursor_pos = if current_input.is_empty() {
+                    0
+                } else {
+                    current_input.len().saturating_sub(1)
+                };
+                let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+                state.set_current_cursor_pos(new_pos);
+                Ok("".to_string()) // Clear previous debug message
+            }
+        }
+        "move_first_line" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate to.".to_string());
+            }
+            state.set_current_field(0);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_last_line" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate to.".to_string());
+            }
+            let last_field_index = num_fields - 1;
+            state.set_current_field(last_field_index);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "exit_edit_mode" => {
+            key_sequence_tracker.reset();
+            command_message.clear();
+            Ok("".to_string())
+        }
+        "move_left" => {
+            let current_pos = state.current_cursor_pos();
+            let new_pos = current_pos.saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if !current_input.is_empty()
+                && current_pos < current_input.len().saturating_sub(1)
+            {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos =
+                    find_next_word_start(current_input, state.current_cursor_pos());
+                let final_pos = new_pos.min(current_input.len().saturating_sub(1));
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos != current_pos {
+                    new_pos
+                } else {
+                    find_word_end(current_input, new_pos + 1)
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("Moved to previous word end".to_string())
+        }
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = current_input.len().saturating_sub(1);
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            } else {
+                state.set_current_cursor_pos(0);
+                *ideal_cursor_column = 0;
+            }
+            Ok("".to_string())
+        }
+        _ => {
+             key_sequence_tracker.reset();
+             Ok(format!("Unknown read-only action: {}", action))
+        },
+    }
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+    let current_pos = current_pos.min(chars.len());
+
+    if current_pos == chars.len() {
+        return current_pos;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < chars.len() && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_next_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let next_start = find_next_word_start(text, current_pos);
+
+    if next_start >= chars.len() {
+        return chars.len().saturating_sub(1);
+    }
+
+    let mut pos = next_start;
+    let word_type = get_char_type(chars[pos]);
+
+    while pos < chars.len() && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(chars.len().saturating_sub(1))
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+    let original_pos = pos;
+
+    let current_type = get_char_type(chars[pos]);
+    if current_type != CharType::Whitespace {
+        while pos < len && get_char_type(chars[pos]) == current_type {
+            pos += 1;
+        }
+        return pos.saturating_sub(1);
+    }
+
+    pos = find_next_word_start(text, pos);
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if get_char_type(chars[pos]) != CharType::Whitespace {
+        let word_type = get_char_type(chars[pos]);
+        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+            pos -= 1;
+        }
+    }
+
+    if pos == 0 && get_char_type(chars[0]) == CharType::Whitespace {
+         0
+    } else {
+        pos
+    }
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+     let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[0]) == CharType::Whitespace {
+        return 0;
+    }
+     if pos == 0 && get_char_type(chars[0]) != CharType::Whitespace {
+         return 0;
+     }
+
+    let word_type = get_char_type(chars[pos]);
+     while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}
--- a/client/src/functions/modes/read_only/form_ro.rs
+++ b/client/src/functions/modes/read_only/form_ro.rs
@@ -0,0 +1,353 @@
+// src/functions/modes/read_only/form_ro.rs
+
+use crate::config::binds::key_sequences::KeySequenceTracker;
+use crate::state::pages::canvas_state::CanvasState;
+use std::error::Error;
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+pub async fn execute_action<S: CanvasState>(
+    action: &str,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+    key_sequence_tracker: &mut KeySequenceTracker,
+    command_message: &mut String,
+) -> Result<String, Box<dyn Error>> {
+    match action {
+        "previous_entry" | "next_entry" => {
+            key_sequence_tracker.reset();
+            Ok(format!(
+                "Action '{}' should be handled by context-specific logic",
+                action
+            ))
+        }
+        "move_up" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate.".to_string());
+            }
+            let current_field = state.current_field();
+            let new_field = current_field.saturating_sub(1);
+            state.set_current_field(new_field);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            Ok("".to_string())
+        }
+        "move_down" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate.".to_string());
+            }
+            let current_field = state.current_field();
+            let new_field = (current_field + 1).min(num_fields - 1);
+            state.set_current_field(new_field);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            Ok("".to_string())
+        }
+        "move_first_line" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate to.".to_string());
+            }
+            state.set_current_field(0);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_last_line" => {
+            key_sequence_tracker.reset();
+            let num_fields = state.fields().len();
+            if num_fields == 0 {
+                return Ok("No fields to navigate to.".to_string());
+            }
+            let last_field_index = num_fields - 1;
+            state.set_current_field(last_field_index);
+            let current_input = state.get_current_input();
+            let max_cursor_pos = if current_input.is_empty() {
+                0
+            } else {
+                current_input.len().saturating_sub(1)
+            };
+            let new_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "exit_edit_mode" => {
+            key_sequence_tracker.reset();
+            command_message.clear();
+            Ok("".to_string())
+        }
+        "move_left" => {
+            let current_pos = state.current_cursor_pos();
+            let new_pos = current_pos.saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok("".to_string())
+        }
+        "move_right" => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if !current_input.is_empty()
+                && current_pos < current_input.len().saturating_sub(1)
+            {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_next" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos =
+                    find_next_word_start(current_input, state.current_cursor_pos());
+                let final_pos = new_pos.min(current_input.len().saturating_sub(1));
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos != current_pos {
+                    new_pos
+                } else {
+                    find_word_end(current_input, new_pos + 1)
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("".to_string())
+        }
+        "move_word_end_prev" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(
+                    current_input,
+                    state.current_cursor_pos(),
+                );
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok("Moved to previous word end".to_string())
+        }
+        "move_line_start" => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok("".to_string())
+        }
+        "move_line_end" => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = current_input.len().saturating_sub(1);
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            } else {
+                state.set_current_cursor_pos(0);
+                *ideal_cursor_column = 0;
+            }
+            Ok("".to_string())
+        }
+        _ => {
+             key_sequence_tracker.reset();
+             Ok(format!("Unknown read-only action: {}", action))
+        },
+    }
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+    let current_pos = current_pos.min(chars.len());
+
+    if current_pos == chars.len() {
+        return current_pos;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < chars.len() && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_next_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let next_start = find_next_word_start(text, current_pos);
+
+    if next_start >= chars.len() {
+        return chars.len().saturating_sub(1);
+    }
+
+    let mut pos = next_start;
+    let word_type = get_char_type(chars[pos]);
+
+    while pos < chars.len() && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(chars.len().saturating_sub(1))
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+    let original_pos = pos;
+
+    let current_type = get_char_type(chars[pos]);
+    if current_type != CharType::Whitespace {
+        while pos < len && get_char_type(chars[pos]) == current_type {
+            pos += 1;
+        }
+        return pos.saturating_sub(1);
+    }
+
+    pos = find_next_word_start(text, pos);
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if get_char_type(chars[pos]) != CharType::Whitespace {
+        let word_type = get_char_type(chars[pos]);
+        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+            pos -= 1;
+        }
+    }
+
+    if pos == 0 && get_char_type(chars[0]) == CharType::Whitespace {
+         0
+    } else {
+        pos
+    }
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+     let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[0]) == CharType::Whitespace {
+        return 0;
+    }
+     if pos == 0 && get_char_type(chars[0]) != CharType::Whitespace {
+         return 0;
+     }
+
+    let word_type = get_char_type(chars[pos]);
+     while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}
--- a/client/src/lib.rs
+++ b/client/src/lib.rs
@@ -5,6 +5,8 @@ pub mod config;
 pub mod state;
 pub mod components;
 pub mod modes;
+pub mod functions;
+pub mod services;

 pub use ui::run_ui;

--- a/client/src/modes/canvas.rs
+++ b/client/src/modes/canvas.rs
@@ -1,4 +1,4 @@
 // src/client/modes/canvas.rs
 pub mod edit;
-pub mod common;
+pub mod common_mode;
 pub mod read_only;
--- a/client/src/modes/canvas/common_mode.rs
+++ b/client/src/modes/canvas/common_mode.rs
@@ -0,0 +1,96 @@
+// src/modes/canvas/common_mode.rs
+
+use crate::tui::terminal::core::TerminalCore;
+use crate::state::pages::{form::FormState, auth::LoginState, auth::RegisterState, auth::AuthState};
+use crate::state::app::state::AppState;
+use crate::services::grpc_client::GrpcClient;
+use crate::services::auth::AuthClient;
+use crate::modes::handlers::event::EventOutcome;
+use crate::tui::functions::common::form::SaveOutcome;
+use crate::tui::functions::common::{
+    form::{save as form_save, revert as form_revert},
+    login::{save as login_save, revert as login_revert},
+    register::{save as register_save, revert as register_revert},
+};
+
+pub async fn handle_core_action(
+    action: &str,
+    form_state: &mut FormState,
+    auth_state: &mut AuthState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    grpc_client: &mut GrpcClient,
+    auth_client: &mut AuthClient,
+    terminal: &mut TerminalCore,
+    app_state: &mut AppState,
+    current_position: &mut u64,
+    total_count: u64,
+) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+    match action {
+        "save" => {
+            if app_state.ui.show_login {
+                let message = login_save(auth_state, login_state, auth_client, app_state).await?;
+                Ok(EventOutcome::Ok(message))
+            } else if app_state.ui.show_register {
+                let message = register_save(register_state, auth_client, app_state).await?;
+                Ok(EventOutcome::Ok(message))
+            } else {
+                let save_outcome = form_save(
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                ).await?;
+                let message = match save_outcome {
+                    SaveOutcome::NoChange => "No changes to save.".to_string(),
+                    SaveOutcome::UpdatedExisting => "Entry updated.".to_string(),
+                    SaveOutcome::CreatedNew(_) => "New entry created.".to_string(),
+                };
+                Ok(EventOutcome::DataSaved(save_outcome, message))
+            }
+        },
+        "force_quit" => {
+            terminal.cleanup()?;
+            Ok(EventOutcome::Exit("Force exiting without saving.".to_string()))
+        },
+        "save_and_quit" => {
+            let message = if app_state.ui.show_login {
+                login_save(auth_state, login_state, auth_client, app_state).await?
+            } else if app_state.ui.show_register {
+                register_save(register_state, auth_client, app_state).await?
+            } else {
+                let save_outcome = form_save(
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                ).await?;
+                match save_outcome {
+                    SaveOutcome::NoChange => "No changes to save.".to_string(),
+                    SaveOutcome::UpdatedExisting => "Entry updated.".to_string(),
+                    SaveOutcome::CreatedNew(_) => "New entry created.".to_string(),
+                }
+            };
+            terminal.cleanup()?;
+            Ok(EventOutcome::Exit(format!("{}. Exiting application.", message)))
+        },
+        "revert" => {
+            if app_state.ui.show_login {
+                let message = login_revert(login_state, app_state).await;
+                Ok(EventOutcome::Ok(message))
+            } else if app_state.ui.show_register {
+                let message = register_revert(register_state, app_state).await;
+                Ok(EventOutcome::Ok(message))
+            } else {
+                let message = form_revert(
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                ).await?;
+                Ok(EventOutcome::Ok(message))
+            }
+        },
+        _ => Ok(EventOutcome::Ok(format!("Core action not handled: {}", action))),
+    }
+}
--- a/client/src/modes/canvas/edit.rs
+++ b/client/src/modes/canvas/edit.rs
@@ -1,473 +1,381 @@
 // src/modes/canvas/edit.rs
-
-use crossterm::event::{KeyEvent, KeyCode, KeyModifiers};
-use crate::tui::terminal::{
-    grpc_client::GrpcClient,
-};
 use crate::config::binds::config::Config;
-use crate::ui::handlers::form::FormState;
-use crate::modes::canvas::common;
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::{
+    auth::{LoginState, RegisterState},
+    canvas_state::CanvasState,
+};
+use crate::state::pages::form::FormState;
+use crate::state::pages::add_table::AddTableState;
+use crate::modes::handlers::event::EventOutcome;
+use crate::functions::modes::edit::{auth_e, form_e};
+use crate::functions::modes::edit::add_table_e;
+use crate::state::app::state::AppState;
+use crossterm::event::{KeyCode, KeyEvent, KeyModifiers};

-pub async fn handle_edit_event_internal(
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum EditEventOutcome {
+    Message(String), // Return a message, stay in Edit mode
+    ExitEditMode,    // Signal to exit Edit mode
+}
+
+pub async fn handle_edit_event(
    key: KeyEvent,
    config: &Config,
    form_state: &mut FormState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    add_table_state: &mut AddTableState,
    ideal_cursor_column: &mut usize,
-    command_message: &mut String,
-    is_saved: &mut bool,
    current_position: &mut u64,
    total_count: u64,
    grpc_client: &mut GrpcClient,
-) -> Result<String, Box<dyn std::error::Error>> {
-    if let Some("enter_command_mode") = config.get_action_for_key_in_mode(&config.keybindings.global, key.code, key.modifiers) {
-        // Ignore in edit mode and process as normal input
-        handle_edit_specific_input(key, form_state, ideal_cursor_column);
-        return Ok(command_message.clone());
+    app_state: &AppState,
+) -> Result<EditEventOutcome, Box<dyn std::error::Error>> {
+    // Global command mode check (should ideally be handled before calling this function)
+    if let Some("enter_command_mode") = config.get_action_for_key_in_mode(
+        &config.keybindings.global,
+        key.code,
+        key.modifiers,
+    ) {
+        return Ok(EditEventOutcome::Message(
+            "Command mode entry handled globally.".to_string(),
+        ));
    }

-    // Check common actions first
-    if let Some(action) = config.get_action_for_key_in_mode(&config.keybindings.common, key.code, key.modifiers) {
-        return execute_common_action(
-            action,
-            form_state,
-            grpc_client,
-            is_saved,
-            current_position,
-            total_count,
-        ).await;
-    }
-
-    if let Some(action) = config.get_edit_action_for_key(key.code, key.modifiers) {
-        return execute_edit_action(
-            action,
-            form_state,
-            ideal_cursor_column,
-            grpc_client,  // Changed from AppTerminal
-            is_saved,
-            current_position,
-            total_count,
-        ).await;
-    }
-
-    handle_edit_specific_input(
-        key,
-        form_state,
-        ideal_cursor_column,
-    );
-
-    Ok(command_message.clone())
-}
-
-async fn execute_common_action(
-    action: &str,
-    form_state: &mut FormState,
-    grpc_client: &mut GrpcClient,
-    is_saved: &mut bool,
-    current_position: &mut u64,
-    total_count: u64,
-) -> Result<String, Box<dyn std::error::Error>> {
-    match action {
-        "save" => {
-            common::save(
-                form_state,
-                grpc_client,
-                is_saved,
-                current_position,
-                total_count,
-            ).await
-        },
-        "revert" => {
-            common::revert(
-                form_state,
-                grpc_client,
-                current_position,
-                total_count,
-            ).await
-        },
-        "move_up" | "move_down" => {
-            // Reuse edit mode's existing logic
-            execute_edit_action(
-                action,
-                form_state,
-                &mut 0, // Dummy ideal_cursor_column (not used here)
-                grpc_client,
-                is_saved,
-                current_position,
-                total_count,
-            ).await
-        },
-        _ => Ok(format!("Common action not handled: {}", action)),
-    }
-}
-
-fn handle_edit_specific_input(
-    key: KeyEvent,
-    form_state: &mut FormState,
-    ideal_cursor_column: &mut usize,
-) {
-    match key.code {
-        KeyCode::Char(c) => {
-            let cursor_pos = form_state.current_cursor_pos;
-            let field_value = form_state.get_current_input_mut();
-            let mut chars: Vec<char> = field_value.chars().collect();
-            if cursor_pos <= chars.len() {
-                chars.insert(cursor_pos, c);
-                *field_value = chars.into_iter().collect();
-                form_state.current_cursor_pos = cursor_pos + 1;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-                form_state.has_unsaved_changes = true;
-            }
-        }
-        KeyCode::Backspace => {
-            if form_state.current_cursor_pos > 0 {
-                let cursor_pos = form_state.current_cursor_pos;
-                let field_value = form_state.get_current_input_mut();
-                let mut chars: Vec<char> = field_value.chars().collect();
-                if cursor_pos <= chars.len() && cursor_pos > 0 {
-                    chars.remove(cursor_pos - 1);
-                    *field_value = chars.into_iter().collect();
-                    form_state.current_cursor_pos = cursor_pos - 1;
-                    *ideal_cursor_column = form_state.current_cursor_pos;
-                    form_state.has_unsaved_changes = true;
+    if let Some(action) = config.get_action_for_key_in_mode(
+        &config.keybindings.common,
+        key.code,
+        key.modifiers,
+    ).as_deref() {
+        if matches!(action, "save" | "revert") {
+            let message_string: String = if app_state.ui.show_login {
+                auth_e::execute_common_action(
+                    action,
+                    login_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?
+            } else if app_state.ui.show_register {
+                auth_e::execute_common_action(
+                    action,
+                    register_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?
+            } else if app_state.ui.show_add_table {
+                format!(
+                    "Action '{}' not fully implemented for Add Table view here.",
+                    action
+                )
+            } else {
+                let outcome = form_e::execute_common_action(
+                    action,
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?;
+                match outcome {
+                    EventOutcome::Ok(msg) => msg,
+                    EventOutcome::DataSaved(_, msg) => msg,
+                    _ => format!(
+                        "Unexpected outcome from common action: {:?}",
+                        outcome
+                    ),
                }
+            };
+            return Ok(EditEventOutcome::Message(message_string));
+        }
+    }
+
+    // Edit-specific actions
+    if let Some(action) =
+        config.get_edit_action_for_key(key.code, key.modifiers)
+            .as_deref() {
+        // Handle enter_decider first
+        if action == "enter_decider" {
+            let effective_action = if app_state.ui.show_register 
+                && register_state.in_suggestion_mode 
+                && register_state.current_field() == 4 {
+                "select_suggestion"
+            } else {
+                "next_field"
+            };
+            
+            let msg = if app_state.ui.show_login {
+                auth_e::execute_edit_action(
+                    effective_action,
+                    key,
+                    login_state,
+                    ideal_cursor_column,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?
+            } else if app_state.ui.show_add_table {
+                add_table_e::execute_edit_action(
+                    effective_action,
+                    key,
+                    add_table_state,
+                    ideal_cursor_column,
+                )
+                .await?
+            } else if app_state.ui.show_register {
+                auth_e::execute_edit_action(
+                    effective_action,
+                    key,
+                    register_state,
+                    ideal_cursor_column,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?
+            } else {
+                form_e::execute_edit_action(
+                    effective_action,
+                    key,
+                    form_state,
+                    ideal_cursor_column,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?
+            };
+            return Ok(EditEventOutcome::Message(msg));
+        }
+
+        if action == "exit" {
+            if app_state.ui.show_register && register_state.in_suggestion_mode {
+                let msg = auth_e::execute_edit_action(
+                    "exit_suggestion_mode",
+                    key,
+                    register_state,
+                    ideal_cursor_column,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?;
+                return Ok(EditEventOutcome::Message(msg));
+            } else {
+                return Ok(EditEventOutcome::ExitEditMode);
            }
        }
-        KeyCode::Delete => {
-            let cursor_pos = form_state.current_cursor_pos;
-            let field_value = form_state.get_current_input_mut();
-            let chars: Vec<char> = field_value.chars().collect();
-            if cursor_pos < chars.len() {
-                let mut new_chars = chars.clone();
-                new_chars.remove(cursor_pos);
-                *field_value = new_chars.into_iter().collect();
-                form_state.has_unsaved_changes = true;
-            }
-        }
-        KeyCode::Tab => {
-            if key.modifiers.contains(KeyModifiers::SHIFT) {
-                if form_state.current_field == 0 {
-                    form_state.current_field = form_state.fields.len() - 1;
+
+        // Special handling for role field suggestions (Register view only)
+        if app_state.ui.show_register && register_state.current_field() == 4 {
+            if !register_state.in_suggestion_mode
+                && key.code == KeyCode::Tab
+                && key.modifiers == KeyModifiers::NONE
+            {
+                register_state.update_role_suggestions();
+                if !register_state.role_suggestions.is_empty() {
+                    register_state.in_suggestion_mode = true;
+                    register_state.selected_suggestion_index = Some(0);
+                    return Ok(EditEventOutcome::Message(
+                        "Suggestions shown".to_string(),
+                    ));
                } else {
-                    form_state.current_field = form_state.current_field.saturating_sub(1);
+                    return Ok(EditEventOutcome::Message(
+                        "No suggestions available".to_string(),
+                    ));
                }
-            } else {
-                form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
            }
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
+            if register_state.in_suggestion_mode
+                && matches!(
+                    action,
+                    "suggestion_down" | "suggestion_up"
+                )
+            {
+                let msg = auth_e::execute_edit_action(
+                    action,
+                    key,
+                    register_state,
+                    ideal_cursor_column,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                )
+                .await?;
+                return Ok(EditEventOutcome::Message(msg));
+            }
        }
-        KeyCode::Enter => {
-            form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-        }
-        _ => {}
-    }
-}

-async fn execute_edit_action(
-    action: &str,
-    form_state: &mut FormState,
-    ideal_cursor_column: &mut usize,
-    grpc_client: &mut GrpcClient,  // Changed from AppTerminal
-    is_saved: &mut bool,
-    current_position: &mut u64,
-    total_count: u64,
-) -> Result<String, Box<dyn std::error::Error>> {
-    match action {
-        "save" => {
-            common::save(
-                form_state,
-                grpc_client,  // Changed from AppTerminal
-                is_saved,
+        // Execute other edit actions based on the current view
+        let msg = if app_state.ui.show_login {
+            auth_e::execute_edit_action(
+                action,
+                key,
+                login_state,
+                ideal_cursor_column,
+                grpc_client,
                current_position,
                total_count,
-            ).await
-        },
-        "move_left" => {
-            form_state.current_cursor_pos = form_state.current_cursor_pos.saturating_sub(1);
-            *ideal_cursor_column = form_state.current_cursor_pos;
-            Ok("".to_string())
-        }
-        "move_right" => {
-            let current_input = form_state.get_current_input();
-            if form_state.current_cursor_pos < current_input.len() {
-                form_state.current_cursor_pos += 1;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_up" => {
-            if form_state.current_field == 0 {
-                form_state.current_field = form_state.fields.len() - 1;
-            } else {
-                form_state.current_field = form_state.current_field.saturating_sub(1);
-            }
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        "move_down" => {
-            form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        "move_line_start" => {
-            form_state.current_cursor_pos = 0;
-            *ideal_cursor_column = form_state.current_cursor_pos;
-            Ok("".to_string())
-        }
-        "move_line_end" => {
-            let current_input = form_state.get_current_input();
-            form_state.current_cursor_pos = current_input.len();
-            *ideal_cursor_column = form_state.current_cursor_pos;
-            Ok("".to_string())
-        }
-        "move_first_line" => {
-            form_state.current_field = 0;
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("Moved to first line".to_string())
-        }
-        "move_last_line" => {
-            form_state.current_field = form_state.fields.len() - 1;
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("Moved to last line".to_string())
-        }
-        // Word movement actions
-        "move_word_next" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_next_word_start(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos.min(current_input.len());
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_end" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_word_end(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos.min(current_input.len());
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_prev" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_prev_word_start(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_end_prev" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_prev_word_end(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        // Edit-specific actions that can be bound to keys
-        "delete_char_forward" => {
-            let cursor_pos = form_state.current_cursor_pos;
-            let field_value = form_state.get_current_input_mut();
-            let chars: Vec<char> = field_value.chars().collect();
-            if cursor_pos < chars.len() {
-                let mut new_chars = chars.clone();
-                new_chars.remove(cursor_pos);
-                *field_value = new_chars.into_iter().collect();
-                form_state.has_unsaved_changes = true;
-            }
-            Ok("".to_string())
-        }
-        "delete_char_backward" => {
-            if form_state.current_cursor_pos > 0 {
-                let cursor_pos = form_state.current_cursor_pos;
-                let field_value = form_state.get_current_input_mut();
-                let mut chars: Vec<char> = field_value.chars().collect();
-                if cursor_pos <= chars.len() && cursor_pos > 0 {
-                    chars.remove(cursor_pos - 1);
-                    *field_value = chars.into_iter().collect();
-                    form_state.current_cursor_pos = cursor_pos - 1;
-                    *ideal_cursor_column = form_state.current_cursor_pos;
-                    form_state.has_unsaved_changes = true;
-                }
-            }
-            Ok("".to_string())
-        }
-        "insert_char" => {
-            // This could be expanded to allow configurable character insertion
-            // For now, it's a placeholder that would need additional parameters
-            Ok("Character insertion requires configuration".to_string())
-        }
-        "next_field" => {
-            form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        "prev_field" => {
-            if form_state.current_field == 0 {
-                form_state.current_field = form_state.fields.len() - 1;
-            } else {
-                form_state.current_field = form_state.current_field.saturating_sub(1);
-            }
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = current_input.len();
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        // Fallback for unrecognized actions
-        _ => Ok(format!("Unknown action: {}", action)),
+            )
+            .await?
+        } else if app_state.ui.show_add_table {
+            add_table_e::execute_edit_action(
+                action,
+                key,
+                add_table_state,
+                ideal_cursor_column,
+            )
+            .await?
+        } else if app_state.ui.show_register {
+            auth_e::execute_edit_action(
+                action,
+                key,
+                register_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        } else {
+            form_e::execute_edit_action(
+                action,
+                key,
+                form_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        };
+        return Ok(EditEventOutcome::Message(msg));
    }
-}
-
-// Reuse these character and word navigation helper functions
-#[derive(PartialEq)]
-enum CharType {
-    Whitespace,
-    Alphanumeric,
-    Punctuation,
-}
-
-fn get_char_type(c: char) -> CharType {
-    if c.is_whitespace() {
-        CharType::Whitespace
-    } else if c.is_alphanumeric() {
-        CharType::Alphanumeric
-    } else {
-        CharType::Punctuation
-    }
-}
-
-fn find_next_word_start(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos >= chars.len() {
-        return current_pos;
-    }
-
-    let mut pos = current_pos;
-    let initial_type = get_char_type(chars[pos]);
-    while pos < chars.len() && get_char_type(chars[pos]) == initial_type {
-        pos += 1;
-    }
-
-    while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos += 1;
-    }
-
-    pos
-}
-
-fn find_word_end(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() {
-        return 0;
-    }
-
-    if current_pos >= chars.len() - 1 {
-        return chars.len() - 1;
-    }
-
-    let mut pos = current_pos;
-
-    if get_char_type(chars[pos]) == CharType::Whitespace {
-        while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-            pos += 1;
-        }
-    } else {
-        let current_type = get_char_type(chars[pos]);
-        if pos + 1 < chars.len() && get_char_type(chars[pos + 1]) != current_type {
-            pos += 1;
-            while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-                pos += 1;
-            }
-        }
-    }
-
-    if pos >= chars.len() {
-        return chars.len() - 1;
-    }
-
-    let word_type = get_char_type(chars[pos]);
-    while pos + 1 < chars.len() && get_char_type(chars[pos + 1]) == word_type {
-        pos += 1;
-    }
-
-    pos
-}
-
-fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos == 0 {
-        return 0;
-    }
-
-    let mut pos = current_pos.saturating_sub(1);
-
-    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos -= 1;
-    }
-
-    if get_char_type(chars[pos]) != CharType::Whitespace {
-        let word_type = get_char_type(chars[pos]);
-        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
-            pos -= 1;
-        }
-    }
-
-    pos
-}
-
-fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos <= 1 {
-        return 0;
-    }
-
-    let mut pos = current_pos.saturating_sub(1);
-
-    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos -= 1;
-    }
-
-    if pos > 0 && get_char_type(chars[pos]) != CharType::Whitespace {
-        let word_type = get_char_type(chars[pos]);
-
-        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
-            pos -= 1;
-        }
-
-        while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
-            pos -= 1;
-        }
-
-        if pos > 0 {
-            pos -= 1;
-            let prev_word_type = get_char_type(chars[pos]);
-            while pos > 0 && get_char_type(chars[pos - 1]) == prev_word_type {
-                pos -= 1;
-            }
-
-            while pos < chars.len() - 1 &&
-                  get_char_type(chars[pos + 1]) == prev_word_type {
-                pos += 1;
-            }
-        }
-    }
-
-    pos
+
+    // --- Character insertion ---
+    if let KeyCode::Char(c) = key.code {
+        if app_state.ui.show_register && register_state.in_suggestion_mode {
+            register_state.in_suggestion_mode = false;
+            register_state.show_role_suggestions = false;
+            register_state.selected_suggestion_index = None;
+        }
+
+        let msg = if app_state.ui.show_login {
+            auth_e::execute_edit_action(
+                "insert_char",
+                key,
+                login_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        } else if app_state.ui.show_add_table {
+            add_table_e::execute_edit_action(
+                "insert_char",
+                key,
+                add_table_state,
+                ideal_cursor_column,
+            )
+            .await?
+        } else if app_state.ui.show_register {
+            auth_e::execute_edit_action(
+                "insert_char",
+                key,
+                register_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        } else {
+            form_e::execute_edit_action(
+                "insert_char",
+                key,
+                form_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        };
+        
+        if app_state.ui.show_register && register_state.current_field() == 4 {
+             register_state.update_role_suggestions();
+        }
+
+        return Ok(EditEventOutcome::Message(msg));
+    }
+
+    // --- Handle Backspace/Delete ---
+    if matches!(key.code, KeyCode::Backspace | KeyCode::Delete) {
+        if app_state.ui.show_register && register_state.in_suggestion_mode {
+            register_state.in_suggestion_mode = false;
+            register_state.show_role_suggestions = false;
+            register_state.selected_suggestion_index = None;
+        }
+
+        let action_str = if key.code == KeyCode::Backspace {
+            "delete_char_backward"
+        } else {
+            "delete_char_forward"
+        };
+
+        let result_msg: String = if app_state.ui.show_login {
+            auth_e::execute_edit_action(
+                action_str,
+                key,
+                login_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        } else if app_state.ui.show_add_table {
+            add_table_e::execute_edit_action(
+                action_str,
+                key,
+                add_table_state,
+                ideal_cursor_column,
+            )
+            .await?
+        } else if app_state.ui.show_register {
+            auth_e::execute_edit_action(
+                action_str,
+                key,
+                register_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count,
+            )
+            .await?
+        } else {
+            form_e::execute_edit_action(
+                action_str,
+                key,
+                form_state,
+                ideal_cursor_column,
+                grpc_client,
+                current_position,
+                total_count
+            ).await?
+        };
+         
+        if app_state.ui.show_register && register_state.current_field() == 4 {
+             register_state.update_role_suggestions();
+        }
+
+        return Ok(EditEventOutcome::Message(result_msg));
+    }
+
+    Ok(EditEventOutcome::Message("".to_string()))
 }
--- a/client/src/modes/canvas/read_only.rs
+++ b/client/src/modes/canvas/read_only.rs
@@ -1,22 +1,24 @@
-// src/modes/handlers/read_only.rs
+// src/modes/canvas/read_only.rs

-use crossterm::event::{KeyEvent};
 use crate::config::binds::config::Config;
-use crate::ui::handlers::form::FormState;
 use crate::config::binds::key_sequences::KeySequenceTracker;
-use crate::tui::terminal::grpc_client::GrpcClient;
-
-#[derive(PartialEq)]
-enum CharType {
-    Whitespace,
-    Alphanumeric,
-    Punctuation,
-}
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::{canvas_state::CanvasState, auth::RegisterState};
+use crate::state::pages::auth::LoginState;
+use crate::state::pages::form::FormState;
+use crate::state::pages::add_table::AddTableState;
+use crate::state::app::state::AppState;
+use crate::functions::modes::read_only::{auth_ro, form_ro, add_table_ro};
+use crossterm::event::KeyEvent;

 pub async fn handle_read_only_event(
+    app_state: &mut AppState,
    key: KeyEvent,
    config: &Config,
    form_state: &mut FormState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    add_table_state: &mut AddTableState,
    key_sequence_tracker: &mut KeySequenceTracker,
    current_position: &mut u64,
    total_count: u64,
@@ -25,7 +27,6 @@ pub async fn handle_read_only_event(
    edit_mode_cooldown: &mut bool,
    ideal_cursor_column: &mut usize,
 ) -> Result<(bool, String), Box<dyn std::error::Error>> {
-    // Check for entering Edit mode from Read-Only mode
    if config.is_enter_edit_mode_before(key.code, key.modifiers) {
        *edit_mode_cooldown = true;
        *command_message = "Entering Edit mode".to_string();
@@ -33,426 +34,227 @@ pub async fn handle_read_only_event(
    }

    if config.is_enter_edit_mode_after(key.code, key.modifiers) {
-        let current_input = form_state.get_current_input();
-        if !current_input.is_empty() && form_state.current_cursor_pos < current_input.len() {
-            form_state.current_cursor_pos += 1;
-            *ideal_cursor_column = form_state.current_cursor_pos;
+        // Determine target state to adjust cursor
+        let target_state: &mut dyn CanvasState = if app_state.ui.show_login { login_state }
+            else if app_state.ui.show_register { register_state }
+            else if app_state.ui.show_add_table { add_table_state }
+            else { form_state };
+        let current_input = target_state.get_current_input();
+        let current_pos = target_state.current_cursor_pos();
+
+        if !current_input.is_empty() && current_pos < current_input.len() {
+            target_state.set_current_cursor_pos(current_pos + 1);
+            *ideal_cursor_column = target_state.current_cursor_pos();
        }
        *edit_mode_cooldown = true;
        *command_message = "Entering Edit mode (after cursor)".to_string();
        return Ok((false, command_message.clone()));
    }

-    // Handle Read-Only mode keybindings
+    const CONTEXT_ACTIONS_FORM: &[&str] = &[
+        "previous_entry",
+        "next_entry",
+    ];
+    const CONTEXT_ACTIONS_LOGIN: &[&str] = &[
+        "previous_entry",
+        "next_entry",
+    ];
+    // Add context actions specific to register if needed, otherwise reuse login/form ones
+    const CONTEXT_ACTIONS_REGISTER: &[&str] = &[
+        // Add actions like "next_field", "prev_field" if handled differently than general read-only
+    ];
+
    if key.modifiers.is_empty() {
        key_sequence_tracker.add_key(key.code);
        let sequence = key_sequence_tracker.get_sequence();

-        // Try to match the current sequence against Read-Only mode bindings
-        if let Some(action) = config.matches_key_sequence_generalized(&sequence) {
-            let result = execute_action(
-                action,
-                form_state,
-                ideal_cursor_column,
-                key_sequence_tracker,
-                command_message,
-                current_position,
-                total_count,
-                grpc_client,
-            ).await?;
-            key_sequence_tracker.reset();
-            return Ok((false, result));
-        }
-
-        // Check if this might be a prefix of a longer sequence
-        if config.is_key_sequence_prefix(&sequence) {
-            return Ok((false, command_message.clone()));
-        }
-
-        // Since it's not part of a multi-key sequence, check for a direct action
-        if sequence.len() == 1 && !config.is_key_sequence_prefix(&sequence) {
-            if let Some(action) = config.get_read_only_action_for_key(key.code, key.modifiers) {
-                let result = execute_action(
+        if let Some(action) = config.matches_key_sequence_generalized(&sequence).as_deref() {
+            let result = if app_state.ui.show_form && CONTEXT_ACTIONS_FORM.contains(&action) {
+                crate::tui::functions::form::handle_action(
+                    action,
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                    ideal_cursor_column,
+                )
+                .await?
+            } else if app_state.ui.show_login && CONTEXT_ACTIONS_LOGIN.contains(&action) { // Handle login context actions
+                crate::tui::functions::login::handle_action(action).await?
+            } else if app_state.ui.show_add_table {
+                add_table_ro::execute_action(
+                    action,
+                    app_state,
+                    add_table_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                ).await?
+            } else if app_state.ui.show_register{
+                auth_ro::execute_action(
+                    action,
+                    app_state,
+                    register_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                ).await?
+            } else if app_state.ui.show_login {
+                auth_ro::execute_action(
+                    action,
+                    app_state,
+                    login_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                )
+                .await?
+            } else {
+                form_ro::execute_action(
                    action,
                    form_state,
                    ideal_cursor_column,
                    key_sequence_tracker,
                    command_message,
-                    current_position,
-                    total_count,
-                    grpc_client,
-                ).await?;
+                )
+                .await?
+            };
+            key_sequence_tracker.reset();
+            return Ok((false, result));
+        }
+
+        if config.is_key_sequence_prefix(&sequence) {
+            return Ok((false, command_message.clone()));
+        }
+
+        if sequence.len() == 1 && !config.is_key_sequence_prefix(&sequence) {
+            if let Some(action) = config.get_read_only_action_for_key(key.code, key.modifiers).as_deref() {
+                let result = if app_state.ui.show_form && CONTEXT_ACTIONS_FORM.contains(&action) {
+                    crate::tui::functions::form::handle_action(
+                        action,
+                        form_state,
+                        grpc_client,
+                        current_position,
+                        total_count,
+                        ideal_cursor_column,
+                    )
+                    .await?
+                } else if app_state.ui.show_login && CONTEXT_ACTIONS_LOGIN.contains(&action) { // Handle login context actions
+                    crate::tui::functions::login::handle_action(action).await?
+                } else if app_state.ui.show_add_table {
+                    add_table_ro::execute_action(
+                        action,
+                        app_state,
+                        add_table_state,
+                        ideal_cursor_column,
+                        key_sequence_tracker,
+                        command_message,
+                    ).await?
+                } else if app_state.ui.show_register /* && CONTEXT_ACTIONS_REGISTER.contains(&action) */ { // Handle register general actions
+                    auth_ro::execute_action(
+                        action,
+                        app_state,
+                        register_state,
+                        ideal_cursor_column,
+                        key_sequence_tracker,
+                        command_message,
+                    ).await?
+                } else if app_state.ui.show_login { // Handle login general actions
+                    auth_ro::execute_action(
+                        action,
+                        app_state,
+                        login_state,
+                        ideal_cursor_column,
+                        key_sequence_tracker,
+                        command_message,
+                    )
+                    .await?
+                } else {
+                    form_ro::execute_action(
+                        action,
+                        form_state,
+                        ideal_cursor_column,
+                        key_sequence_tracker,
+                        command_message,
+                    )
+                    .await?
+                };
                key_sequence_tracker.reset();
                return Ok((false, result));
            }
        }
+        key_sequence_tracker.reset();
    } else {
-        // If modifiers are pressed, check for direct key bindings
        key_sequence_tracker.reset();

-        if let Some(action) = config.get_read_only_action_for_key(key.code, key.modifiers) {
-            let result = execute_action(
-                action,
-                form_state,
-                ideal_cursor_column,
-                key_sequence_tracker,
-                command_message,
-                current_position,
-                total_count,
-                grpc_client,
-            ).await?;
+        if let Some(action) = config.get_read_only_action_for_key(key.code, key.modifiers).as_deref() {
+            let result = if app_state.ui.show_form && CONTEXT_ACTIONS_FORM.contains(&action) {
+                crate::tui::functions::form::handle_action(
+                    action,
+                    form_state,
+                    grpc_client,
+                    current_position,
+                    total_count,
+                    ideal_cursor_column,
+                )
+                .await?
+            } else if app_state.ui.show_login && CONTEXT_ACTIONS_LOGIN.contains(&action) {
+                crate::tui::functions::login::handle_action(action).await?
+            } else if app_state.ui.show_add_table {
+                add_table_ro::execute_action(
+                    action,
+                    app_state,
+                    add_table_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                ).await?
+            } else if app_state.ui.show_register /* && CONTEXT_ACTIONS_REGISTER.contains(&action) */ { // Handle register general actions
+                auth_ro::execute_action(
+                    action,
+                    app_state,
+                    register_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                ).await?
+            } else if app_state.ui.show_login { // Handle login general actions
+                auth_ro::execute_action(
+                    action,
+                    app_state,
+                    login_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                )
+                .await?
+            } else {
+                form_ro::execute_action(
+                    action,
+                    form_state,
+                    ideal_cursor_column,
+                    key_sequence_tracker,
+                    command_message,
+                )
+                .await?
+            };
            return Ok((false, result));
        }
    }

-    // Show a helpful message when no binding was found
    if !*edit_mode_cooldown {
        let default_key = "i".to_string();
-        let edit_key = config.keybindings.read_only.get("enter_edit_mode_before")
+        let edit_key = config
+            .keybindings
+            .read_only
+            .get("enter_edit_mode_before")
            .and_then(|keys| keys.first())
-            .unwrap_or(&default_key);
+            .map(|k| k.to_string())
+            .unwrap_or(default_key);
        *command_message = format!("Read-only mode - press {} to edit", edit_key);
    }

+    *edit_mode_cooldown = false;
+
    Ok((false, command_message.clone()))
 }
-
-async fn execute_action(
-    action: &str,
-    form_state: &mut FormState,
-    ideal_cursor_column: &mut usize,
-    key_sequence_tracker: &mut KeySequenceTracker,
-    command_message: &mut String,
-    current_position: &mut u64,
-    total_count: u64,
-    grpc_client: &mut GrpcClient,
-) -> Result<String, Box<dyn std::error::Error>> {
-    match action {
-        "previous_entry" => {
-            let new_position = current_position.saturating_sub(1);
-            if new_position >= 1 {
-                *current_position = new_position;
-                match grpc_client.get_adresar_by_position(*current_position).await {
-                    Ok(response) => {
-                        form_state.id = response.id;
-                        form_state.values = vec![
-                            response.firma, response.kz, response.drc,
-                            response.ulica, response.psc, response.mesto,
-                            response.stat, response.banka, response.ucet,
-                            response.skladm, response.ico, response.kontakt,
-                            response.telefon, response.skladu, response.fax,
-                        ];
-                        let current_input = form_state.get_current_input();
-                        let max_cursor_pos = if !current_input.is_empty() {
-                            current_input.len() - 1
-                        } else { 0 };
-                        form_state.current_cursor_pos = std::cmp::min(*ideal_cursor_column, max_cursor_pos);
-                        form_state.has_unsaved_changes = false;
-                        *command_message = format!("Loaded entry {}", *current_position);
-                    }
-                    Err(e) => {
-                        *command_message = format!("Error loading entry: {}", e);
-                    }
-                }
-                key_sequence_tracker.reset();
-            }
-            Ok(command_message.clone())
-        }
-        "next_entry" => {
-            if *current_position <= total_count {
-                *current_position += 1;
-                if *current_position <= total_count {
-                    match grpc_client.get_adresar_by_position(*current_position).await {
-                        Ok(response) => {
-                            form_state.id = response.id;
-                            form_state.values = vec![
-                                response.firma, response.kz, response.drc,
-                                response.ulica, response.psc, response.mesto,
-                                response.stat, response.banka, response.ucet,
-                                response.skladm, response.ico, response.kontakt,
-                                response.telefon, response.skladu, response.fax,
-                            ];
-                            let current_input = form_state.get_current_input();
-                            let max_cursor_pos = if !current_input.is_empty() {
-                                current_input.len() - 1
-                            } else { 0 };
-                            form_state.current_cursor_pos = std::cmp::min(*ideal_cursor_column, max_cursor_pos);
-                            form_state.has_unsaved_changes = false;
-                            *command_message = format!("Loaded entry {}", *current_position);
-                        }
-                        Err(e) => {
-                            *command_message = format!("Error loading entry: {}", e);
-                        }
-                    }
-                } else {
-                    form_state.reset_to_empty();
-                    form_state.current_field = 0;
-                    form_state.current_cursor_pos = 0;
-                    *ideal_cursor_column = 0;
-                    *command_message = "New entry mode".to_string();
-                }
-                key_sequence_tracker.reset();
-            }
-            Ok(command_message.clone())
-        }
-        "exit_edit_mode" => {
-            key_sequence_tracker.reset();
-            command_message.clear();
-            Ok("".to_string())
-        }
-        "move_left" => {
-            let current_pos = form_state.current_cursor_pos;
-            form_state.current_cursor_pos = current_pos.saturating_sub(1);
-            *ideal_cursor_column = form_state.current_cursor_pos;
-            Ok("".to_string())
-        }
-        "move_right" => {
-            let current_input = form_state.get_current_input();
-            let current_pos = form_state.current_cursor_pos;
-            if !current_input.is_empty() && current_pos < current_input.len() - 1 {
-                form_state.current_cursor_pos += 1;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_up" => {
-            // Change field first
-            if form_state.current_field == 0 {
-                form_state.current_field = form_state.fields.len() - 1;
-            } else {
-                form_state.current_field = form_state.current_field.saturating_sub(1);
-            }
-
-            // Get current input AFTER changing field
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = if !current_input.is_empty() {
-                current_input.len() - 1
-            } else {
-                0
-            };
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        "move_down" => {
-            // Change field first
-            form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
-
-            // Get current input AFTER changing field
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = if !current_input.is_empty() {
-                current_input.len() - 1
-            } else {
-                0
-            };
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("".to_string())
-        }
-        "move_word_next" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_next_word_start(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos.min(current_input.len().saturating_sub(1));
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_end" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_word_end(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos.min(current_input.len().saturating_sub(1));
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_prev" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_prev_word_start(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_word_end_prev" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                let new_pos = find_prev_word_end(current_input, form_state.current_cursor_pos);
-                form_state.current_cursor_pos = new_pos;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("Moved to previous word end".to_string())
-        }
-        "move_line_start" => {
-            form_state.current_cursor_pos = 0;
-            *ideal_cursor_column = form_state.current_cursor_pos;
-            Ok("".to_string())
-        }
-        "move_line_end" => {
-            let current_input = form_state.get_current_input();
-            if !current_input.is_empty() {
-                form_state.current_cursor_pos = current_input.len() - 1;
-                *ideal_cursor_column = form_state.current_cursor_pos;
-            }
-            Ok("".to_string())
-        }
-        "move_first_line" => {
-            // Change field first
-            form_state.current_field = 0;
-
-            // Get current input AFTER changing field
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = if !current_input.is_empty() {
-                current_input.len() - 1
-            } else {
-                current_input.len()
-            };
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("Moved to first line".to_string())
-        }
-        "move_last_line" => {
-            // Change field first
-            form_state.current_field = form_state.fields.len() - 1;
-
-            // Get current input AFTER changing field
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = if !current_input.is_empty() {
-                current_input.len() - 1
-            } else {
-                current_input.len()
-            };
-            form_state.current_cursor_pos = (*ideal_cursor_column).min(max_cursor_pos);
-            Ok("Moved to last line".to_string())
-        }
-        _ => Ok(format!("Unknown action: {}", action)),
-    }
-}
-
-fn get_char_type(c: char) -> CharType {
-    if c.is_whitespace() {
-        CharType::Whitespace
-    } else if c.is_alphanumeric() {
-        CharType::Alphanumeric
-    } else {
-        CharType::Punctuation
-    }
-}
-
-fn find_next_word_start(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos >= chars.len() {
-        return current_pos;
-    }
-
-    let mut pos = current_pos;
-    let initial_type = get_char_type(chars[pos]);
-    while pos < chars.len() && get_char_type(chars[pos]) == initial_type {
-        pos += 1;
-    }
-
-    while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos += 1;
-    }
-
-    pos
-}
-
-fn find_word_end(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() {
-        return 0;
-    }
-
-    if current_pos >= chars.len() - 1 {
-        return chars.len() - 1;
-    }
-
-    let mut pos = current_pos;
-
-    if get_char_type(chars[pos]) == CharType::Whitespace {
-        while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-            pos += 1;
-        }
-    } else {
-        let current_type = get_char_type(chars[pos]);
-        if pos + 1 < chars.len() && get_char_type(chars[pos + 1]) != current_type {
-            pos += 1;
-            while pos < chars.len() && get_char_type(chars[pos]) == CharType::Whitespace {
-                pos += 1;
-            }
-        }
-    }
-
-    if pos >= chars.len() {
-        return chars.len() - 1;
-    }
-
-    let word_type = get_char_type(chars[pos]);
-    while pos + 1 < chars.len() && get_char_type(chars[pos + 1]) == word_type {
-        pos += 1;
-    }
-
-    pos
-}
-
-fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos == 0 {
-        return 0;
-    }
-
-    let mut pos = current_pos.saturating_sub(1);
-
-    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos -= 1;
-    }
-
-    if get_char_type(chars[pos]) != CharType::Whitespace {
-        let word_type = get_char_type(chars[pos]);
-        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
-            pos -= 1;
-        }
-    }
-
-    pos
-}
-
-fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
-    let chars: Vec<char> = text.chars().collect();
-    if chars.is_empty() || current_pos <= 1 {
-        return 0;
-    }
-
-    let mut pos = current_pos.saturating_sub(1);
-
-    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
-        pos -= 1;
-    }
-
-    if pos > 0 && get_char_type(chars[pos]) != CharType::Whitespace {
-        let word_type = get_char_type(chars[pos]);
-
-        while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
-            pos -= 1;
-        }
-
-        while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
-            pos -= 1;
-        }
-
-        if pos > 0 {
-            pos -= 1;
-            let prev_word_type = get_char_type(chars[pos]);
-            while pos > 0 && get_char_type(chars[pos - 1]) == prev_word_type {
-                pos -= 1;
-            }
-
-            while pos < chars.len() - 1 &&
-                  get_char_type(chars[pos + 1]) == prev_word_type {
-                pos += 1;
-            }
-        }
-    }
-
-    pos
-}
--- a/client/src/modes/common.rs
+++ b/client/src/modes/common.rs
@@ -0,0 +1,6 @@
+// src/client/modes/common.rs
+pub mod command_mode;
+pub mod highlight;
+pub mod commands;
+
+pub use commands::*;
--- a/client/src/modes/handlers/command_mode.rs
+++ b/client/src/modes/handlers/command_mode.rs
@@ -1,32 +1,37 @@
-// src/modes/handlers/command_mode.rs
+// src/modes/common/command_mode.rs

 use crossterm::event::{KeyEvent, KeyCode, KeyModifiers};
-use crate::tui::terminal::grpc_client::GrpcClient;
 use crate::config::binds::config::Config;
-use crate::ui::handlers::form::FormState;
-use crate::modes::{
-    canvas::{common},
-};
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::form::FormState;
+use crate::state::{app::state::AppState, pages::auth::LoginState, pages::auth::RegisterState};
+use crate::modes::common::commands::CommandHandler;
+use crate::tui::terminal::core::TerminalCore;
+use crate::tui::functions::common::form::{save, revert};
+use crate::modes::handlers::event::EventOutcome;
+use crate::tui::functions::common::form::SaveOutcome;
+use std::error::Error;

 pub async fn handle_command_event(
    key: KeyEvent,
    config: &Config,
+    app_state: &AppState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
    form_state: &mut FormState,
    command_input: &mut String,
    command_message: &mut String,
    grpc_client: &mut GrpcClient,
-    is_saved: &mut bool,
+    command_handler: &mut CommandHandler,
+    terminal: &mut TerminalCore,
    current_position: &mut u64,
    total_count: u64,
-) -> Result<(bool, String, bool), Box<dyn std::error::Error>> {
-
-    // Return value: (should_exit, message, should_exit_command_mode)
-
+) -> Result<EventOutcome, Box<dyn Error>> {
    // Exit command mode (via configurable keybinding)
    if config.is_exit_command_mode(key.code, key.modifiers) {
        command_input.clear();
        *command_message = "".to_string();
-        return Ok((false, "".to_string(), true));
+        return Ok(EventOutcome::Ok("Exited command mode".to_string()));
    }

    // Execute command (via configurable keybinding, defaults to Enter)
@@ -34,10 +39,14 @@ pub async fn handle_command_event(
        return process_command(
            config,
            form_state,
+            app_state,
+            login_state,
+            register_state,
            command_input,
            command_message,
            grpc_client,
-            is_saved,
+            command_handler,
+            terminal,
            current_position,
            total_count,
        ).await;
@@ -46,7 +55,7 @@ pub async fn handle_command_event(
    // Backspace (via configurable keybinding, defaults to Backspace)
    if config.is_command_backspace(key.code, key.modifiers) {
        command_input.pop();
-        return Ok((false, "".to_string(), false));
+        return Ok(EventOutcome::Ok("".to_string()));
    }

    // Regular character input - accept any character in command mode
@@ -54,29 +63,33 @@ pub async fn handle_command_event(
        // Accept regular or shifted characters (e.g., 'a' or 'A')
        if key.modifiers.is_empty() || key.modifiers == KeyModifiers::SHIFT {
            command_input.push(c);
-            return Ok((false, "".to_string(), false));
+            return Ok(EventOutcome::Ok("".to_string()));
        }
    }

    // Ignore all other keys
-    Ok((false, "".to_string(), false))
+    Ok(EventOutcome::Ok("".to_string()))
 }

 async fn process_command(
    config: &Config,
    form_state: &mut FormState,
+    app_state: &AppState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
    command_input: &mut String,
    command_message: &mut String,
    grpc_client: &mut GrpcClient,
-    is_saved: &mut bool,
+    command_handler: &mut CommandHandler,
+    terminal: &mut TerminalCore,
    current_position: &mut u64,
    total_count: u64,
-) -> Result<(bool, String, bool), Box<dyn std::error::Error>> {
+) -> Result<EventOutcome, Box<dyn Error>> {
    // Clone the trimmed command to avoid borrow issues
    let command = command_input.trim().to_string();
    if command.is_empty() {
        *command_message = "Empty command".to_string();
-        return Ok((false, command_message.clone(), false));
+        return Ok(EventOutcome::Ok(command_message.clone()));
    }

    // Get the action for the command (now checks global and common bindings too)
@@ -84,51 +97,53 @@ async fn process_command(
        .unwrap_or("unknown");

    match action {
+        "force_quit" | "save_and_quit" | "quit" => {
+            let (should_exit, message) = command_handler
+                .handle_command(
+                    action,
+                    terminal,
+                    app_state,
+                    form_state,
+                    login_state,
+                    register_state,
+                )
+                .await?;
+            command_input.clear();
+            if should_exit {
+                Ok(EventOutcome::Exit(message))
+            } else {
+                Ok(EventOutcome::Ok(message))
+            }
+        },
        "save" => {
-            let message = common::save(
-                form_state,
-                grpc_client,
-                is_saved,
-                current_position,
-                total_count,
-            ).await?;
-            command_input.clear();
-            return Ok((false, message, true));
-        },
-        "force_quit" => {
-            let (should_exit, message) = common::force_quit();
-            command_input.clear();
-            return Ok((should_exit, message, true));
-        },
-        "save_and_quit" => {
-            let (should_exit, message) = common::save_and_quit(
+            let outcome = save(
                form_state,
                grpc_client,
                current_position,
                total_count,
            ).await?;
+            let message = match outcome {
+                SaveOutcome::CreatedNew(_) => "New entry created".to_string(),
+                SaveOutcome::UpdatedExisting => "Entry updated".to_string(),
+                SaveOutcome::NoChange => "No changes to save".to_string(),
+            };
            command_input.clear();
-            return Ok((should_exit, message, true));
+            Ok(EventOutcome::DataSaved(outcome, message))
        },
        "revert" => {
-            let message = common::revert(
+            let message = revert(
                form_state,
                grpc_client,
                current_position,
                total_count,
            ).await?;
            command_input.clear();
-            return Ok((false, message, true));
-        },
-        "unknown" => {
-            let message = format!("Unknown command: {}", command);
-            command_input.clear();
-            return Ok((false, message, true));
+            Ok(EventOutcome::Ok(message))
        },
        _ => {
            let message = format!("Unhandled action: {}", action);
            command_input.clear();
-            return Ok((false, message, true));
+            Ok(EventOutcome::Ok(message))
        }
    }
 }
--- a/client/src/modes/common/commands.rs
+++ b/client/src/modes/common/commands.rs
@@ -0,0 +1,71 @@
+// src/modes/common/commands.rs
+use crate::tui::terminal::core::TerminalCore;
+use crate::state::app::state::AppState;
+use crate::state::pages::{form::FormState, auth::LoginState, auth::RegisterState};
+use crate::state::pages::canvas_state::CanvasState;
+
+pub struct CommandHandler;
+
+impl CommandHandler {
+    pub fn new() -> Self {
+        Self
+    }
+
+    pub async fn handle_command(
+        &mut self,
+        action: &str,
+        terminal: &mut TerminalCore,
+        app_state: &AppState,
+        form_state: &FormState,
+        login_state: &LoginState,
+        register_state: &RegisterState,
+    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
+        match action {
+            "quit" => self.handle_quit(terminal, app_state, form_state, login_state, register_state).await,
+            "force_quit" => self.handle_force_quit(terminal).await,
+            "save_and_quit" => self.handle_save_quit(terminal).await,
+            _ => Ok((false, format!("Unknown command: {}", action))),
+        }
+    }
+
+    async fn handle_quit(
+        &self,
+        terminal: &mut TerminalCore,
+        app_state: &AppState,
+        form_state: &FormState,
+        login_state: &LoginState,
+        register_state: &RegisterState,
+    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
+        // Use actual unsaved changes state instead of is_saved flag
+        let has_unsaved = if app_state.ui.show_login {
+            login_state.has_unsaved_changes()
+        } else if app_state.ui.show_register {
+            register_state.has_unsaved_changes()
+        } else {
+            form_state.has_unsaved_changes
+        };
+
+        if !has_unsaved {
+            terminal.cleanup()?;
+            Ok((true, "Exiting.".into()))
+        } else {
+            Ok((false, "No changes saved. Use :q! to force quit.".into()))
+        }
+    }
+
+    async fn handle_force_quit(
+        &self,
+        terminal: &mut TerminalCore,
+    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
+        terminal.cleanup()?;
+        Ok((true, "Force exiting without saving.".into()))
+    }
+
+    async fn handle_save_quit(
+        &mut self,
+        terminal: &mut TerminalCore,
+    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
+        terminal.cleanup()?;
+        Ok((true, "State saved. Exiting.".into()))
+    }
+}
--- a/client/src/modes/handlers/highlight.rs
+++ b/client/src/modes/handlers/highlight.rs
--- a/client/src/modes/general.rs
+++ b/client/src/modes/general.rs
@@ -0,0 +1,3 @@
+// src/client/modes/general.rs
+pub mod navigation;
+pub mod dialog;
--- a/client/src/modes/general/dialog.rs
+++ b/client/src/modes/general/dialog.rs
@@ -0,0 +1,144 @@
+// src/modes/general/dialog.rs
+
+use crossterm::event::{Event, KeyCode};
+use crate::config::binds::config::Config;
+use crate::ui::handlers::context::DialogPurpose;
+use crate::state::app::state::AppState;
+use crate::state::app::buffer::BufferState;
+use crate::state::pages::auth::AuthState;
+use crate::state::pages::auth::{LoginState, RegisterState};
+use crate::state::pages::admin::AdminState;
+use crate::modes::handlers::event::EventOutcome;
+use crate::tui::functions::common::{login, register};
+use crate::tui::functions::common::add_table::handle_delete_selected_columns;
+
+/// Handles key events specifically when a dialog is active.
+/// Returns Some(Result<EventOutcome, Error>) if the event was handled (consumed),
+/// otherwise returns None.
+pub async fn handle_dialog_event(
+    event: &Event,
+    config: &Config,
+    app_state: &mut AppState,
+    auth_state: &mut AuthState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    buffer_state: &mut BufferState,
+    admin_state: &mut AdminState,
+) -> Option<Result<EventOutcome, Box<dyn std::error::Error>>> {
+    if let Event::Key(key) = event {
+        // Always allow Esc to dismiss
+        if key.code == KeyCode::Esc {
+            app_state.hide_dialog();
+            return Some(Ok(EventOutcome::Ok("Dialog dismissed".to_string())));
+        }
+
+        // Check general bindings for dialog actions
+        if let Some(action) = config.get_general_action(key.code, key.modifiers) {
+            match action {
+                "move_down" | "next_option" => {
+                    let current_index = app_state.ui.dialog.dialog_active_button_index;
+                    let num_buttons = app_state.ui.dialog.dialog_buttons.len();
+                    if num_buttons > 0 && current_index < num_buttons - 1 {
+                        app_state.ui.dialog.dialog_active_button_index += 1;
+                    }
+                    return Some(Ok(EventOutcome::Ok(String::new())));
+                }
+                "move_up" | "previous_option" => {
+                    let current_index = app_state.ui.dialog.dialog_active_button_index;
+                    if current_index > 0 {
+                        app_state.ui.dialog.dialog_active_button_index -= 1;
+                    }
+                    return Some(Ok(EventOutcome::Ok(String::new())));
+                }
+                "select" => {
+                    let selected_index = app_state.ui.dialog.dialog_active_button_index;
+                    let purpose = match app_state.ui.dialog.purpose {
+                        Some(p) => p,
+                        None => {
+                            app_state.hide_dialog();
+                            return Some(Ok(EventOutcome::Ok("Internal Error: Dialog context lost".to_string())));
+                        }
+                    };
+
+                    // Handle Dialog Actions Directly Here
+                    match purpose {
+                        DialogPurpose::LoginSuccess => {
+                            match selected_index {
+                                0 => { // "Menu" button selected
+                                    app_state.hide_dialog();
+                                    let message = login::back_to_main(login_state, app_state, buffer_state).await;
+                                    return Some(Ok(EventOutcome::Ok(message)));
+                                }
+                                1 => {
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Exiting dialog".to_string())));
+                                }
+                                _ => {
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Unknown dialog button selected".to_string())));
+                                }
+                            }
+                        }
+                        DialogPurpose::LoginFailed => {
+                            match selected_index {
+                                0 => { // "OK" button selected
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Login failed dialog dismissed".to_string())));
+                                }
+                                _ => {
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Unknown dialog button selected".to_string())));
+                                }
+                            }
+                        }
+                        DialogPurpose::RegisterSuccess => { // Add this arm
+                            match selected_index {
+                                0 => { // "OK" button for RegisterSuccess
+                                    app_state.hide_dialog();
+                                    let message = register::back_to_login(register_state, app_state, buffer_state).await;
+                                    return Some(Ok(EventOutcome::Ok(message)));
+                                }
+                                _ => { // Default for RegisterSuccess
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Unknown dialog button selected".to_string())));
+                                }
+                            }
+                        }
+                        DialogPurpose::RegisterFailed => { // Add this arm
+                             match selected_index {
+                                0 => { // "OK" button for RegisterFailed
+                                    app_state.hide_dialog(); // Just dismiss
+                                    return Some(Ok(EventOutcome::Ok("Register failed dialog dismissed".to_string())));
+                                }
+                                _ => { // Default for RegisterFailed
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Unknown dialog button selected".to_string())));
+                                }
+                            }
+                        }
+                        DialogPurpose::ConfirmDeleteColumns => {
+                            match selected_index {
+                                0 => { // "Confirm" button selected
+                                    let outcome_message = handle_delete_selected_columns(&mut admin_state.add_table_state);
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok(outcome_message)));
+                                }
+                                1 => { // "Cancel" button selected
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok("Deletion cancelled.".to_string())));
+                                }
+                                _ => { /* Handle unexpected index */ }
+                            }
+                        }
+                    }
+                }
+                _ => {} // Ignore other general actions when dialog is shown
+            }
+        }
+        // If it was a key event but not handled above, consume it
+        Some(Ok(EventOutcome::Ok(String::new())))
+    } else {
+        // If it wasn't a key event, consume it too while dialog is active
+        Some(Ok(EventOutcome::Ok(String::new())))
+    }
+}
--- a/client/src/modes/general/navigation.rs
+++ b/client/src/modes/general/navigation.rs
@@ -0,0 +1,161 @@
+// src/modes/general/navigation.rs
+
+use crossterm::event::KeyEvent;
+use crate::config::binds::config::Config;
+use crate::state::app::state::AppState;
+use crate::state::pages::form::FormState;
+use crate::state::pages::auth::LoginState;
+use crate::state::pages::auth::RegisterState;
+use crate::state::pages::intro::IntroState;
+use crate::state::pages::admin::AdminState;
+use crate::state::pages::canvas_state::CanvasState;
+use crate::ui::handlers::context::UiContext;
+use crate::modes::handlers::event::EventOutcome;
+
+pub async fn handle_navigation_event(
+    key: KeyEvent,
+    config: &Config,
+    form_state: &mut FormState,
+    app_state: &mut AppState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    intro_state: &mut IntroState,
+    admin_state: &mut AdminState,
+    command_mode: &mut bool,
+    command_input: &mut String,
+    command_message: &mut String,
+) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+    if let Some(action) = config.get_general_action(key.code, key.modifiers) {
+        match action {
+            "move_up" => {
+                move_up(app_state, login_state, register_state, intro_state, admin_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "move_down" => {
+                move_down(app_state, intro_state, admin_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "next_option" => {
+                next_option(app_state, intro_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "previous_option" => {
+                previous_option(app_state, intro_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "next_field" => {
+                next_field(form_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "prev_field" => {
+                prev_field(form_state);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "enter_command_mode" => {
+                handle_enter_command_mode(command_mode, command_input, command_message);
+                return Ok(EventOutcome::Ok(String::new()));
+            }
+            "select" => {
+                let (context, index) = if app_state.ui.show_intro {
+                    (UiContext::Intro, intro_state.selected_option)
+                } else if app_state.ui.show_login && app_state.ui.focus_outside_canvas {
+                    (UiContext::Login, app_state.focused_button_index)
+                } else if app_state.ui.show_register && app_state.ui.focus_outside_canvas {
+                    (UiContext::Register, app_state.focused_button_index)
+                } else if app_state.ui.show_admin {
+                    (UiContext::Admin, admin_state.get_selected_index().unwrap_or(0))
+                } else if app_state.ui.dialog.dialog_show {
+                     (UiContext::Dialog, app_state.ui.dialog.dialog_active_button_index)
+                } else {
+                    return Ok(EventOutcome::Ok("Select (No Action)".to_string()));
+                };
+                return Ok(EventOutcome::ButtonSelected { context, index });
+            }
+            _ => {}
+        }
+    }
+    Ok(EventOutcome::Ok(String::new()))
+}
+
+pub fn move_up(app_state: &mut AppState, login_state: &mut LoginState, register_state: &mut RegisterState, intro_state: &mut IntroState, admin_state: &mut AdminState) {
+    if app_state.ui.focus_outside_canvas && app_state.ui.show_login || app_state.ui.show_register{
+        if app_state.focused_button_index == 0 {
+            app_state.ui.focus_outside_canvas = false;
+            if app_state.ui.show_login {
+                let last_field_index = login_state.fields().len().saturating_sub(1);
+                login_state.set_current_field(last_field_index);
+            } else {
+                let last_field_index = register_state.fields().len().saturating_sub(1);
+                register_state.set_current_field(last_field_index);
+            }
+        } else {
+            app_state.focused_button_index = app_state.focused_button_index.saturating_sub(1);
+        }
+    } else if app_state.ui.show_intro {
+        intro_state.previous_option();
+    } else if app_state.ui.show_admin {
+        admin_state.previous();
+    }
+}
+
+pub fn move_down(app_state: &mut AppState, intro_state: &mut IntroState, admin_state: &mut AdminState) {
+    if app_state.ui.focus_outside_canvas && app_state.ui.show_login || app_state.ui.show_register {
+        let num_general_elements = 2;
+        if app_state.focused_button_index < num_general_elements - 1 {
+            app_state.focused_button_index += 1;
+        }
+    } else if app_state.ui.show_intro {
+        intro_state.next_option();
+    } else if app_state.ui.show_admin {
+        admin_state.next();
+    }
+}
+
+pub fn next_option(app_state: &mut AppState, intro_state: &mut IntroState) { 
+    if app_state.ui.show_intro {
+        intro_state.next_option();
+    } else {
+        // Get option count from state instead of parameter
+        let option_count = app_state.profile_tree.profiles.len();
+        app_state.focused_button_index = (app_state.focused_button_index + 1) % option_count;
+    }
+}
+
+pub fn previous_option(app_state: &mut AppState, intro_state: &mut IntroState) {
+    if app_state.ui.show_intro {
+        intro_state.previous_option();
+    } else {
+        let option_count = app_state.profile_tree.profiles.len();
+        app_state.focused_button_index = if app_state.focused_button_index == 0 {
+            option_count.saturating_sub(1)
+        } else {
+            app_state.focused_button_index - 1
+        };
+    }
+}
+
+pub fn next_field(form_state: &mut FormState) {
+    if !form_state.fields.is_empty() {
+        form_state.current_field = (form_state.current_field + 1) % form_state.fields.len();
+    }
+}
+
+pub fn prev_field(form_state: &mut FormState) {
+    if !form_state.fields.is_empty() {
+        if form_state.current_field == 0 {
+            form_state.current_field = form_state.fields.len() - 1;
+        } else {
+            form_state.current_field -= 1;
+        }
+    }
+}
+
+pub fn handle_enter_command_mode(
+    command_mode: &mut bool,
+    command_input: &mut String,
+    command_message: &mut String
+) {
+    *command_mode = true;
+    command_input.clear();
+    command_message.clear();
+}
--- a/client/src/modes/handlers.rs
+++ b/client/src/modes/handlers.rs
@@ -1,3 +1,3 @@
 // src/client/modes/handlers.rs
 pub mod event;
-pub mod command_mode;
+pub mod mode_manager;
--- a/client/src/modes/handlers/event.rs
+++ b/client/src/modes/handlers/event.rs
@@ -1,41 +1,82 @@
 // src/modes/handlers/event.rs
 use crossterm::event::Event;
 use crossterm::cursor::SetCursorStyle;
-use crate::tui::terminal::{
-    core::TerminalCore,
-    grpc_client::GrpcClient,
-    commands::CommandHandler,
-};
+use crate::services::grpc_client::GrpcClient;
+use crate::services::auth::AuthClient;
 use crate::config::binds::config::Config;
-use crate::ui::handlers::form::FormState;
 use crate::ui::handlers::rat_state::UiStateHandler;
-use crate::modes::{
-    handlers::{command_mode},
-    canvas::{edit, read_only, common},
+use crate::ui::handlers::context::UiContext;
+use crate::ui::handlers::context::DialogPurpose;
+use crate::functions::common::buffer;
+use crate::tui::{
+    terminal::core::TerminalCore,
+    functions::{
+        common::{
+            form::SaveOutcome,
+            login,
+            register,
+        },
+    },
+    {intro, admin},
 };
+use crate::state::{
+    app::{
+        highlight::HighlightState,
+        state::AppState,
+        buffer::{AppView, BufferState},
+    },
+    pages::{
+        auth::{AuthState, LoginState, RegisterState},
+        admin::AdminState,
+        canvas_state::CanvasState,
+        add_table::AddTableState,
+        form::FormState,
+        intro::IntroState,
+    },
+};
+use crate::modes::{
+    common::{command_mode, commands::CommandHandler},
+    handlers::mode_manager::{ModeManager, AppMode},
+    canvas::{edit, read_only, common_mode},
+    highlight::highlight,
+    general::{navigation, dialog},
+};
+use crate::functions::modes::navigation::{admin_nav, add_table_nav};
 use crate::config::binds::key_sequences::KeySequenceTracker;

+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum EventOutcome {
+    Ok(String),
+    Exit(String),
+    DataSaved(SaveOutcome, String),
+    ButtonSelected { context: UiContext, index: usize },
+}
+
 pub struct EventHandler {
    pub command_mode: bool,
    pub command_input: String,
    pub command_message: String,
    pub is_edit_mode: bool,
+    pub highlight_state: HighlightState,
    pub edit_mode_cooldown: bool,
    pub ideal_cursor_column: usize,
    pub key_sequence_tracker: KeySequenceTracker,
+    pub auth_client: AuthClient,
 }

 impl EventHandler {
-    pub fn new() -> Self {
-        EventHandler {
+    pub async fn new() -> Result<Self, Box<dyn std::error::Error>> {
+        Ok(EventHandler {
            command_mode: false,
            command_input: String::new(),
            command_message: String::new(),
            is_edit_mode: false,
+            highlight_state: HighlightState::Off,
            edit_mode_cooldown: false,
            ideal_cursor_column: 0,
            key_sequence_tracker: KeySequenceTracker::new(800),
-        }
+            auth_client: AuthClient::new().await?,
+        })
    }

    pub async fn handle_event(
@@ -46,216 +87,451 @@ impl EventHandler {
        grpc_client: &mut GrpcClient,
        command_handler: &mut CommandHandler,
        form_state: &mut FormState,
-        app_state: &mut crate::state::state::AppState,
+        auth_state: &mut AuthState,
+        login_state: &mut LoginState,
+        register_state: &mut RegisterState,
+        intro_state: &mut IntroState,
+        admin_state: &mut AdminState,
+        buffer_state: &mut BufferState,
+        app_state: &mut AppState,
        total_count: u64,
        current_position: &mut u64,
-        intro_state: &mut crate::components::intro::intro::IntroState,
-    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
-        if app_state.ui.show_intro {
-            if let Event::Key(key) = event {
-                let action = config.get_intro_action(key.code, key.modifiers);
+    ) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+        let current_mode = ModeManager::derive_mode(app_state, self);
+        app_state.update_mode(current_mode);

-                match action {
-                    Some("previous_option") => intro_state.previous_option(),
-                    Some("next_option") => intro_state.next_option(),
-                    Some("select") => {
-                        app_state.ui.show_intro = false;
-                        app_state.ui.show_admin = intro_state.selected_option == 1;
-                    },
-                    _ => {} // Ignore all other keys
-                }
+        let current_view = {
+            let ui = &app_state.ui;
+            if ui.show_intro { AppView::Intro }
+            else if ui.show_login { AppView::Login }
+            else if ui.show_register { AppView::Register }
+            else if ui.show_admin { AppView::Admin }
+            else if ui.show_add_table { AppView::AddTable }
+            else if ui.show_form {
+                let form_name = app_state.selected_profile.clone().unwrap_or_else(|| "Data Form".to_string());
+                AppView::Form(form_name)
            }
-            return Ok((false, String::new()));
+            else { AppView::Scratch }
+        };
+        buffer_state.update_history(current_view);
+
+        if app_state.ui.dialog.dialog_show {
+            if let Some(dialog_result) = dialog::handle_dialog_event(
+                &event,
+                config,
+                app_state,
+                auth_state,
+                login_state,
+                register_state,
+                buffer_state,
+                admin_state,
+            ).await {
+                return dialog_result;
+            }
+            return Ok(EventOutcome::Ok(String::new()));
        }

-            if let Event::Key(key) = event {
-                let key_code = key.code;
-                let modifiers = key.modifiers;
+        if let Event::Key(key) = event {
+            let key_code = key.code;
+            let modifiers = key.modifiers;

-                // Handle admin panel mode
-                if app_state.ui.show_admin {
-                    if let Some(action) = config.get_admin_action(key_code, modifiers) {
-                        match action {
-                            "move_up" => {
-                                // Handle up movement using app_state directly
-                                app_state.admin_selected_item = app_state.admin_selected_item.saturating_sub(1);
-                            }
-                            "move_down" => {
-                                // Handle down movement using app_state
-                                app_state.admin_selected_item = app_state.admin_selected_item.saturating_add(1);
-                            }
-                            _ => {}
-                        }
-                        return Ok((false, format!("Admin: {}", action)));
-                    }
-                    return Ok((false, String::new()));
-                }
-                if UiStateHandler::toggle_sidebar(
-                    &mut app_state.ui,
-                    config,
-                    key_code,
-                    modifiers,
-                ) {
-                    return Ok((false, format!("Sidebar {}",
-                        if app_state.ui.show_sidebar { "shown" } else { "hidden" }
-                    )));
-                }
-
-                // Handle edit mode first to allow normal character input
-                if self.is_edit_mode {
-                    if config.is_exit_edit_mode(key_code, modifiers) {
-                        if form_state.has_unsaved_changes {
-                            self.command_message = "Unsaved changes! Use :w to save or :q! to discard".to_string();
-                            return Ok((false, self.command_message.clone()));
-                        }
-                        self.is_edit_mode = false;
-                        self.edit_mode_cooldown = true;
-                        self.command_message = "Read-only mode".to_string();
-                        terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?;
-
-                        let current_input = form_state.get_current_input();
-                        if !current_input.is_empty() && form_state.current_cursor_pos >= current_input.len() {
-                            form_state.current_cursor_pos = current_input.len() - 1;
-                            self.ideal_cursor_column = form_state.current_cursor_pos;
-                        }
-                        return Ok((false, self.command_message.clone()));
-                    }
-
-                    let result = edit::handle_edit_event_internal(
-                        key,
-                        config,
-                        form_state,
-                        &mut self.ideal_cursor_column,
-                        &mut self.command_message,
-                        &mut app_state.ui.is_saved,
-                        current_position,
-                        total_count,
-                        grpc_client,
-                    ).await?;
-
-                    self.key_sequence_tracker.reset();
-                    return Ok((false, result));
-                }
-
-                // Global command mode activation
-                let context_action = config.get_action_for_current_context(
-                    self.is_edit_mode,
-                    self.command_mode,
-                    app_state.ui.show_intro,
-                    app_state.ui.show_admin,
-                    key_code,
-                    modifiers
+            if UiStateHandler::toggle_sidebar(&mut app_state.ui, config, key_code, modifiers) {
+                let message = format!("Sidebar {}",
+                    if app_state.ui.show_sidebar { "shown" } else { "hidden" }
                );
+                return Ok(EventOutcome::Ok(message));
+            }
+            if UiStateHandler::toggle_buffer_list(&mut app_state.ui, config, key_code, modifiers) {
+                let message = format!("Buffer {}",
+                    if app_state.ui.show_buffer_list { "shown" } else { "hidden" }
+                );
+                return Ok(EventOutcome::Ok(message));
+            }

-                if let Some("enter_command_mode") = context_action {
-                    self.command_mode = true;
-                    self.command_input.clear();
-                    self.command_message.clear();
-                    return Ok((false, String::new()));
-                }
-
+            if !matches!(current_mode, AppMode::Edit | AppMode::Command) {
                if let Some(action) = config.get_action_for_key_in_mode(
-                    &config.keybindings.common,
-                    key_code,
-                    modifiers
+                    &config.keybindings.global, key_code, modifiers
                ) {
                    match action {
-                        "save" => {
-                            let message = common::save(
-                                form_state,
-                                grpc_client,
-                                &mut app_state.ui.is_saved,
-                                current_position,
-                                total_count,
-                            ).await?;
-                            return Ok((false, message));
-                        },
-                        "force_quit" => {
-                            let (should_exit, message) = command_handler.handle_command("force_quit", terminal).await?;
-                            return Ok((should_exit, message));
-                        },
-                        "save_and_quit" => {
-                            let (should_exit, message) = command_handler.handle_command("save_and_quit", terminal).await?;
-                            return Ok((should_exit, message));
-                        },
-                        "revert" => {
-                            let message = common::revert(
-                                form_state,
-                                grpc_client,
-                                current_position,
-                                total_count,
-                            ).await?;
-                            return Ok((false, message));
-                        },
+                        "next_buffer" => {
+                            if buffer::switch_buffer(buffer_state, true) {
+                                return Ok(EventOutcome::Ok("Switched to next buffer".to_string()));
+                            }
+                        }
+                        "previous_buffer" => {
+                            if buffer::switch_buffer(buffer_state, false) {
+                                return Ok(EventOutcome::Ok("Switched to previous buffer".to_string()));
+                            }
+                        }
                        _ => {}
                    }
                }
+            }

-                if self.command_mode {
-                    let (should_exit, message, exit_command_mode) = command_mode::handle_command_event(
+            match current_mode {
+                AppMode::General => {
+                    // Prioritize Admin Panel navigation if it's visible
+                    if app_state.ui.show_admin
+                        && auth_state.role.as_deref() == Some("admin") {
+                        if admin_nav::handle_admin_navigation(
+                            key,
+                            config,
+                            app_state,
+                            admin_state,
+                            buffer_state,
+                            &mut self.command_message,
+                        ) {
+                            return Ok(EventOutcome::Ok(self.command_message.clone()));
+                        }
+                    }
+                    // --- Add Table Page Navigation ---
+                    if app_state.ui.show_add_table {
+                        if let Some(action) = config.get_general_action(key.code, key.modifiers) {
+                            if add_table_nav::handle_add_table_navigation(
+                                key,
+                                config,
+                                app_state,
+                                &mut admin_state.add_table_state,
+                                &mut self.command_message,
+
+                            ) {
+                                return Ok(EventOutcome::Ok(self.command_message.clone()));
+                            }
+                        }
+                    }
+
+                    let nav_outcome = navigation::handle_navigation_event(
                        key,
                        config,
                        form_state,
+                        app_state,
+                        login_state,
+                        register_state,
+                        intro_state,
+                        admin_state,
+                        &mut self.command_mode,
+                        &mut self.command_input,
+                        &mut self.command_message,
+                    ).await;
+                    match nav_outcome {
+                        Ok(EventOutcome::ButtonSelected { context, index }) => {
+                            let mut message = String::from("Selected");
+                            match context {
+                                UiContext::Intro => {
+                                    intro::handle_intro_selection(app_state, buffer_state, index);
+                                    if app_state.ui.show_admin {
+                                        if !app_state.profile_tree.profiles.is_empty() {
+                                            admin_state.profile_list_state.select(Some(0));
+                                        }
+                                    }
+                                    message = format!("Intro Option {} selected", index);
+                                }
+                                UiContext::Login => {
+                                    let login_action_message = match index {
+                                        0 => { // Index 0 corresponds to the "Login" button
+                                            match login::initiate_login(app_state, login_state).await {
+                                                Ok(outcome) => return Ok(outcome),
+                                                Err(e) => {
+                                                    app_state.show_dialog("Error", &format!("Failed to initiate login: {}", e), vec!["OK".to_string()], DialogPurpose::LoginFailed);
+                                                    login_state.login_request_pending = false;
+                                                    "Error initiating login".to_string()
+                                                }
+                                            }
+                                        },
+                                        1 => login::back_to_main(login_state, app_state, buffer_state).await,
+                                        _ => "Invalid Login Option".to_string(),
+                                    };
+                                    message = login_action_message;
+                                }
+                                UiContext::Register => {
+                                    message = match index {
+                                        0 => register::save(register_state, &mut self.auth_client, app_state).await?,
+                                        1 => register::back_to_login(register_state, app_state, buffer_state).await,
+                                        _ => "Invalid Login Option".to_string(),
+                                    };
+                                }
+                                UiContext::Admin => {
+                                    admin::handle_admin_selection(app_state, admin_state);
+                                    message = format!("Admin Option {} selected", index);
+                                }
+                                UiContext::Dialog => {
+                                    message = "Internal error: Unexpected dialog state".to_string();
+                                }
+                            }
+                            return Ok(EventOutcome::Ok(message));
+                        }
+                        other => return other,
+                    }
+                },
+
+                AppMode::ReadOnly => {
+                    // Check for Linewise highlight first
+                    if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode_linewise")
+                        && ModeManager::can_enter_highlight_mode(current_mode)
+                    {
+                        let current_field_index = if app_state.ui.show_login { login_state.current_field() }
+                                              else if app_state.ui.show_register { register_state.current_field() }
+                                              else { form_state.current_field() };
+                        self.highlight_state = HighlightState::Linewise { anchor_line: current_field_index };
+                        self.command_message = "-- LINE HIGHLIGHT --".to_string();
+                        return Ok(EventOutcome::Ok(self.command_message.clone()));
+                    }
+                    // Check for Character-wise highlight
+                    else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode")
+                        && ModeManager::can_enter_highlight_mode(current_mode)
+                    {
+                        let current_field_index = if app_state.ui.show_login { login_state.current_field() }
+                                              else if app_state.ui.show_register { register_state.current_field() }
+                                              else { form_state.current_field() };
+                        let current_cursor_pos = if app_state.ui.show_login { login_state.current_cursor_pos() }
+                                             else if app_state.ui.show_register { register_state.current_cursor_pos() }
+                                             else { form_state.current_cursor_pos() };
+                        let anchor = (current_field_index, current_cursor_pos);
+                        self.highlight_state = HighlightState::Characterwise { anchor };
+                        self.command_message = "-- HIGHLIGHT --".to_string();
+                        return Ok(EventOutcome::Ok(self.command_message.clone()));
+                    }
+                    // Check for entering edit mode (before cursor)
+                    else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_before")
+                        && ModeManager::can_enter_edit_mode(current_mode) {
+                        self.is_edit_mode = true;
+                        self.edit_mode_cooldown = true;
+                        self.command_message = "Edit mode".to_string();
+                        terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
+                        return Ok(EventOutcome::Ok(self.command_message.clone()));
+                    }
+                    // Check for entering edit mode (after cursor)
+                    else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_after")
+                        && ModeManager::can_enter_edit_mode(current_mode) {
+                        let current_input = if app_state.ui.show_login || app_state.ui.show_register{
+                            login_state.get_current_input()
+                        } else {
+                            form_state.get_current_input()
+                        };
+                        let current_cursor_pos = if app_state.ui.show_login || app_state.ui.show_register{
+                            login_state.current_cursor_pos()
+                        } else {
+                            form_state.current_cursor_pos()
+                        };
+
+                        if !current_input.is_empty() && current_cursor_pos < current_input.len() {
+                             if app_state.ui.show_login || app_state.ui.show_register{
+                                login_state.set_current_cursor_pos(current_cursor_pos + 1);
+                                self.ideal_cursor_column = login_state.current_cursor_pos();
+                            } else {
+                                form_state.set_current_cursor_pos(current_cursor_pos + 1);
+                                self.ideal_cursor_column = form_state.current_cursor_pos();
+                            }
+                        }
+                        self.is_edit_mode = true;
+                        self.edit_mode_cooldown = true;
+                        app_state.ui.focus_outside_canvas = false;
+                        self.command_message = "Edit mode (after cursor)".to_string();
+                        terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
+                        return Ok(EventOutcome::Ok(self.command_message.clone()));
+                    }
+                    // Check for entering command mode
+                    else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_command_mode")
+                         && ModeManager::can_enter_command_mode(current_mode) {
+                            self.command_mode = true;
+                            self.command_input.clear();
+                            self.command_message.clear();
+                            return Ok(EventOutcome::Ok(String::new()));
+                    }
+
+                    // Check for common actions (save, quit, etc.) only if no mode change happened
+                    if let Some(action) = config.get_common_action(key_code, modifiers) {
+                        match action {
+                            "save" | "force_quit" | "save_and_quit" | "revert" => {
+                                return common_mode::handle_core_action(
+                                    action,
+                                    form_state,
+                                    auth_state,
+                                    login_state,
+                                    register_state,
+                                    grpc_client,
+                                    &mut self.auth_client,
+                                    terminal,
+                                    app_state,
+                                    current_position,
+                                    total_count,
+                                ).await;
+                            },
+                            _ => {}
+                        }
+                    }
+
+                    // If no mode change or specific common action handled, delegate to read_only handler
+                    let (_should_exit, message) = read_only::handle_read_only_event(
+                        app_state,
+                        key,
+                        config,
+                        form_state,
+                        login_state,
+                        register_state,
+                        &mut admin_state.add_table_state,
+                        &mut self.key_sequence_tracker,
+                        current_position,
+                        total_count,
+                        grpc_client,
+                        &mut self.command_message,
+                        &mut self.edit_mode_cooldown,
+                        &mut self.ideal_cursor_column,
+                    ).await?;
+                    // Note: handle_read_only_event should ignore mode entry keys internally now
+                    return Ok(EventOutcome::Ok(message));
+                }, // End AppMode::ReadOnly
+
+                AppMode::Highlight => {
+                     // --- Handle Highlight Mode Specific Keys ---
+                     // 1. Check for Exit first
+                     if config.get_highlight_action_for_key(key_code, modifiers) == Some("exit_highlight_mode") {
+                         self.highlight_state = HighlightState::Off;
+                         self.command_message = "Exited highlight mode".to_string();
+                         terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?;
+                         return Ok(EventOutcome::Ok(self.command_message.clone()));
+                     }
+                     // 2. Check for Switch to Linewise
+                     else if config.get_highlight_action_for_key(key_code, modifiers) == Some("enter_highlight_mode_linewise") {
+                         // Only switch if currently characterwise
+                         if let HighlightState::Characterwise { anchor } = self.highlight_state {
+                             self.highlight_state = HighlightState::Linewise { anchor_line: anchor.0 };
+                             self.command_message = "-- LINE HIGHLIGHT --".to_string();
+                             return Ok(EventOutcome::Ok(self.command_message.clone()));
+                         }
+                        return Ok(EventOutcome::Ok("".to_string()));
+                     }
+
+                    let (_should_exit, message) = read_only::handle_read_only_event(
+                        app_state, key, config, form_state, login_state,
+                        register_state, &mut admin_state.add_table_state, &mut self.key_sequence_tracker,
+                        current_position, total_count, grpc_client,
+                        &mut self.command_message, &mut self.edit_mode_cooldown,
+                        &mut self.ideal_cursor_column,
+                    )
+                    .await?;
+                    return Ok(EventOutcome::Ok(message));
+                }
+
+                AppMode::Edit => {
+                    // First, check for common actions (save, revert, etc.) that apply in Edit mode
+                    // These might take precedence or have different behavior than the edit handler
+                    if let Some(action) = config.get_common_action(key_code, modifiers) {
+                        // Handle common actions like save, revert, force_quit, save_and_quit
+                        // Ensure these actions return EventOutcome directly if they might exit the app
+                        match action {
+                            "save" | "force_quit" | "save_and_quit" | "revert" => {
+                                // This call likely returns EventOutcome, handle it directly
+                                return common_mode::handle_core_action(
+                                    action,
+                                    form_state,
+                                    auth_state,
+                                    login_state,
+                                    register_state,
+                                    grpc_client,
+                                    &mut self.auth_client,
+                                    terminal,
+                                    app_state,
+                                    current_position,
+                                    total_count,
+                                ).await;
+                            },
+                            // Handle other common actions if necessary
+                            _ => {}
+                        }
+                        // If a common action was handled but didn't return/exit,
+                        // we might want to stop further processing for this key event.
+                        // Depending on the action, you might return Ok(EventOutcome::Ok(...)) here.
+                        // For now, assume common actions either exit or don't prevent further processing.
+                    }
+
+                    // If no common action took precedence, delegate to the edit-specific handler
+                    let edit_result = edit::handle_edit_event(
+                        key,
+                        config,
+                        form_state,
+                        login_state,
+                        register_state,
+                        &mut admin_state.add_table_state,
+                        &mut self.ideal_cursor_column,
+                        current_position,
+                        total_count,
+                        grpc_client,
+                        app_state,
+                    ).await;
+
+                    match edit_result {
+                        Ok(edit::EditEventOutcome::ExitEditMode) => {
+                            // The edit handler signaled to exit the mode
+                            self.is_edit_mode = false;
+                            self.edit_mode_cooldown = true;
+                            let has_changes = if app_state.ui.show_login { login_state.has_unsaved_changes() }
+                                              else if app_state.ui.show_register { register_state.has_unsaved_changes() }
+                                              else { form_state.has_unsaved_changes() };
+                            self.command_message = if has_changes {
+                                "Exited edit mode (unsaved changes remain)".to_string()
+                            } else {
+                                "Read-only mode".to_string()
+                            };
+                            terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?;
+                            // Adjust cursor position if needed
+                            let current_input = if app_state.ui.show_login { login_state.get_current_input() }
+                                                else if app_state.ui.show_register { register_state.get_current_input() }
+                                                else { form_state.get_current_input() };
+                            let current_cursor_pos = if app_state.ui.show_login { login_state.current_cursor_pos() }
+                                                     else if app_state.ui.show_register { register_state.current_cursor_pos() }
+                                                     else { form_state.current_cursor_pos() };
+                            if !current_input.is_empty() && current_cursor_pos >= current_input.len() {
+                                let new_pos = current_input.len() - 1;
+                                let target_state: &mut dyn CanvasState = if app_state.ui.show_login { login_state } else if app_state.ui.show_register { register_state } else { form_state };
+                                target_state.set_current_cursor_pos(new_pos);
+                                self.ideal_cursor_column = new_pos;
+                            }
+                            return Ok(EventOutcome::Ok(self.command_message.clone()));
+                        }
+                        Ok(edit::EditEventOutcome::Message(msg)) => {
+                            // Stay in edit mode, update message if not empty
+                            if !msg.is_empty() {
+                                self.command_message = msg;
+                            }
+                            self.key_sequence_tracker.reset(); // Reset sequence tracker on successful edit action
+                            return Ok(EventOutcome::Ok(self.command_message.clone()));
+                        }
+                        Err(e) => {
+                            // Handle error from the edit handler
+                            return Err(e);
+                        }
+                    }
+                }, // End AppMode::Edit
+
+                AppMode::Command => {
+                    let outcome = command_mode::handle_command_event(
+                        key,
+                        config,
+                        app_state,
+                        login_state,
+                        register_state,
+                        form_state,
                        &mut self.command_input,
                        &mut self.command_message,
                        grpc_client,
-                        &mut app_state.ui.is_saved,
+                        command_handler,
+                        terminal,
                        current_position,
                        total_count,
                    ).await?;

-                    if exit_command_mode {
-                        self.command_mode = false;
+                    if let EventOutcome::Ok(msg) = &outcome {
+                        if msg == "Exited command mode" {
+                            self.command_mode = false;
+                        }
                    }
-
-                    return Ok((should_exit, message));
+                    return Ok(outcome);
                }
-
-                if let Some(action) = config.get_read_only_action_for_key(key_code, modifiers) {
-                    if action == "enter_command_mode" {
-                        self.command_mode = true;
-                        self.command_input.clear();
-                        self.command_message.clear();
-                        return Ok((false, String::new()));
-                    }
-                }
-
-                if config.is_enter_edit_mode_before(key_code, modifiers) {
-                    self.is_edit_mode = true;
-                    self.edit_mode_cooldown = true;
-                    self.command_message = "Edit mode".to_string();
-                    terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
-                    return Ok((false, self.command_message.clone()));
-                }
-
-                if config.is_enter_edit_mode_after(key_code, modifiers) {
-                    let current_input = form_state.get_current_input();
-                    if !current_input.is_empty() && form_state.current_cursor_pos < current_input.len() {
-                        form_state.current_cursor_pos += 1;
-                        self.ideal_cursor_column = form_state.current_cursor_pos;
-                    }
-                    self.is_edit_mode = true;
-                    self.edit_mode_cooldown = true;
-                    self.command_message = "Edit mode (after cursor)".to_string();
-                    terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
-                    return Ok((false, self.command_message.clone()));
-                }
-
-                return read_only::handle_read_only_event(
-                    key,
-                    config,
-                    form_state,
-                    &mut self.key_sequence_tracker,
-                    current_position,
-                    total_count,
-                    grpc_client,
-                    &mut self.command_message,
-                    &mut self.edit_mode_cooldown,
-                    &mut self.ideal_cursor_column,
-                ).await;
            }
+        }

        self.edit_mode_cooldown = false;
-        Ok((false, self.command_message.clone()))
+        Ok(EventOutcome::Ok(self.command_message.clone()))
    }
 }
--- a/client/src/modes/handlers/mode_manager.rs
+++ b/client/src/modes/handlers/mode_manager.rs
@@ -0,0 +1,70 @@
+// src/modes/handlers/mode_manager.rs
+use crate::state::app::state::AppState;
+use crate::modes::handlers::event::EventHandler;
+use crate::state::app::highlight::HighlightState;
+use crate::state::pages::add_table::AddTableFocus;
+use crate::state::pages::admin::AdminState;
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum AppMode {
+    General,   // For intro and admin screens
+    ReadOnly,  // Canvas read-only mode
+    Edit,      // Canvas edit mode
+    Highlight, // Cnavas highlight/visual mode
+    Command,   // Command mode overlay
+}
+
+pub struct ModeManager;
+
+impl ModeManager {
+    // Determine current mode based on app state
+    pub fn derive_mode(app_state: &AppState, event_handler: &EventHandler) -> AppMode {
+        if event_handler.command_mode {
+            return AppMode::Command;
+        }
+
+        if !matches!(event_handler.highlight_state, HighlightState::Off) {
+            return AppMode::Highlight;
+        }
+
+        if app_state.ui.focus_outside_canvas {
+            return AppMode::General;
+        }
+
+        let is_canvas_view = app_state.ui.show_login
+            || app_state.ui.show_register
+            || app_state.ui.show_form
+            || app_state.ui.show_add_table;
+
+        if is_canvas_view {
+            if app_state.ui.focus_outside_canvas {
+                AppMode::General
+            } else {
+                if event_handler.is_edit_mode { 
+                    AppMode::Edit 
+                } else { 
+                    AppMode::ReadOnly 
+                }
+            }
+        } else {
+            AppMode::General
+        }
+    }
+
+    // Mode transition rules
+    pub fn can_enter_command_mode(current_mode: AppMode) -> bool {
+        !matches!(current_mode, AppMode::Edit)  // Can't enter from Edit mode
+    }
+    
+    pub fn can_enter_edit_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::ReadOnly)  // Only from ReadOnly
+    }
+    
+    pub fn can_enter_read_only_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::Edit | AppMode::Command | AppMode::Highlight)
+    }
+
+    pub fn can_enter_highlight_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::ReadOnly)
+    }
+}
--- a/client/src/modes/highlight.rs
+++ b/client/src/modes/highlight.rs
@@ -0,0 +1,2 @@
+// src/client/modes/highlight.rs
+pub mod highlight;
--- a/client/src/modes/highlight/highlight.rs
+++ b/client/src/modes/highlight/highlight.rs
@@ -0,0 +1,65 @@
+// src/modes/highlight/highlight.rs
+// (This file is intentionally simple for now, reusing ReadOnly logic)
+
+use crate::config::binds::config::Config;
+use crate::config::binds::key_sequences::KeySequenceTracker;
+use crate::services::grpc_client::GrpcClient;
+use crate::state::app::state::AppState;
+use crate::state::pages::auth::{LoginState, RegisterState};
+use crate::state::pages::add_table::AddTableState;
+use crate::state::pages::form::FormState;
+use crate::modes::handlers::event::EventOutcome;
+use crate::modes::read_only; // Import the ReadOnly handler
+use crossterm::event::KeyEvent;
+
+/// Handles events when in Highlight mode.
+/// Currently, it mostly delegates to the read_only handler for movement.
+/// Exiting highlight mode is handled directly in the main event handler.
+pub async fn handle_highlight_event(
+    app_state: &mut AppState,
+    key: KeyEvent,
+    config: &Config,
+    form_state: &mut FormState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    add_table_state: &mut AddTableState,
+    key_sequence_tracker: &mut KeySequenceTracker,
+    current_position: &mut u64,
+    total_count: u64,
+    grpc_client: &mut GrpcClient,
+    command_message: &mut String,
+    edit_mode_cooldown: &mut bool,
+    ideal_cursor_column: &mut usize,
+) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+    // Delegate movement and other actions to the read_only handler
+    // The rendering logic will use the highlight_anchor to draw the selection
+    let (should_exit, message) = read_only::handle_read_only_event(
+        app_state,
+        key,
+        config,
+        form_state,
+        login_state,
+        register_state,
+        add_table_state,
+        key_sequence_tracker,
+        current_position,
+        total_count,
+        grpc_client,
+        command_message, // Pass the message buffer
+        edit_mode_cooldown,
+        ideal_cursor_column,
+    )
+    .await?;
+
+    // ReadOnly handler doesn't return EventOutcome directly, adapt if needed
+    // For now, assume Ok outcome unless ReadOnly signals an exit (which we ignore here)
+    if should_exit {
+        // This exit is likely for the whole app, let the main loop handle it
+        // We just return the message from read_only
+        Ok(EventOutcome::Ok(message))
+    } else {
+        Ok(EventOutcome::Ok(message))
+    }
+}
+
+
--- a/client/src/modes/mod.rs
+++ b/client/src/modes/mod.rs
@@ -1,6 +1,12 @@
 // src/client/modes/mod.rs
 pub mod handlers;
 pub mod canvas;
+pub mod general;
+pub mod common;
+pub mod highlight;

 pub use handlers::*;
 pub use canvas::*;
+pub use general::*;
+pub use common::*;
+pub use highlight::*;
--- a/client/src/services/auth.rs
+++ b/client/src/services/auth.rs
@@ -0,0 +1,45 @@
+// src/services/auth.rs
+use tonic::transport::Channel;
+use common::proto::multieko2::auth::{
+    auth_service_client::AuthServiceClient,
+    LoginRequest, LoginResponse,
+    RegisterRequest, AuthResponse,
+};
+
+pub struct AuthClient {
+    client: AuthServiceClient<Channel>,
+}
+
+impl AuthClient {
+    pub async fn new() -> Result<Self, Box<dyn std::error::Error>> {
+        let client = AuthServiceClient::connect("http://[::1]:50051").await?;
+        Ok(Self { client })
+    }
+
+    /// Login user via gRPC.
+    pub async fn login(&mut self, identifier: String, password: String) -> Result<LoginResponse, Box<dyn std::error::Error>> {
+        let request = tonic::Request::new(LoginRequest { identifier, password });
+        let response = self.client.login(request).await?.into_inner();
+        Ok(response)
+    }
+
+    /// Registers a new user via gRPC.
+    pub async fn register(
+        &mut self,
+        username: String,
+        email: String,
+        password: Option<String>,
+        password_confirmation: Option<String>,
+        role: Option<String>,
+    ) -> Result<AuthResponse, Box<dyn std::error::Error>> {
+        let request = tonic::Request::new(RegisterRequest {
+            username,
+            email,
+            password: password.unwrap_or_default(),
+            password_confirmation: password_confirmation.unwrap_or_default(),
+            role: role.unwrap_or_default(),
+        });
+        let response = self.client.register(request).await?.into_inner();
+        Ok(response)
+    }
+}
--- a/client/src/tui/terminal/grpc_client.rs
+++ b/client/src/tui/terminal/grpc_client.rs
@@ -1,4 +1,4 @@
-// src/tui/terminal/grpc_client.rs
+// src/services/grpc_client.rs

 use tonic::transport::Channel;
 use common::proto::multieko2::adresar::adresar_client::AdresarClient;
@@ -11,6 +11,7 @@ use common::proto::multieko2::table_definition::{
    ProfileTreeResponse
 };

+#[derive(Clone)]
 pub struct GrpcClient {
    adresar_client: AdresarClient<Channel>,
    table_structure_client: TableStructureServiceClient<Channel>,
--- a/client/src/services/mod.rs
+++ b/client/src/services/mod.rs
@@ -0,0 +1,9 @@
+// services/mod.rs
+
+pub mod grpc_client;
+pub mod auth;
+pub mod ui_service;
+
+pub use grpc_client::*;
+pub use ui_service::*;
+pub use auth::*;
--- a/client/src/services/ui_service.rs
+++ b/client/src/services/ui_service.rs
@@ -0,0 +1,112 @@
+// src/services/ui_service.rs
+
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::form::FormState;
+use crate::tui::functions::common::form::SaveOutcome;
+use crate::state::app::state::AppState;
+
+pub struct UiService;
+
+impl UiService {
+    pub async fn initialize_app_state(
+        grpc_client: &mut GrpcClient,
+        app_state: &mut AppState,
+    ) -> Result<Vec<String>, Box<dyn std::error::Error>> {
+        // Fetch profile tree
+        let profile_tree = grpc_client.get_profile_tree().await?;
+        app_state.profile_tree = profile_tree;
+
+        // Fetch table structure
+        let table_structure = grpc_client.get_table_structure().await?;
+
+        // Extract the column names from the response
+        let column_names: Vec<String> = table_structure
+            .columns
+            .iter()
+            .map(|col| col.name.clone())
+            .collect();
+
+        Ok(column_names)
+    }
+
+    pub async fn initialize_adresar_count(
+        grpc_client: &mut GrpcClient,
+        app_state: &mut AppState,
+    ) -> Result<(), Box<dyn std::error::Error>> {
+        let total_count = grpc_client.get_adresar_count().await?;
+        app_state.update_total_count(total_count);
+        app_state.update_current_position(total_count.saturating_add(1)); // Start in new entry mode
+        Ok(())
+    }
+
+    pub async fn update_adresar_count(
+        grpc_client: &mut GrpcClient,
+        app_state: &mut AppState,
+    ) -> Result<(), Box<dyn std::error::Error>> {
+        let total_count = grpc_client.get_adresar_count().await?;
+        app_state.update_total_count(total_count);
+        Ok(())
+    }
+
+    pub async fn load_adresar_by_position(
+        grpc_client: &mut GrpcClient,
+        app_state: &mut AppState,
+        form_state: &mut FormState,
+        position: u64,
+    ) -> Result<String, Box<dyn std::error::Error>> {
+        match grpc_client.get_adresar_by_position(position).await {
+            Ok(response) => {
+                // Set the ID properly
+                form_state.id = response.id;
+
+                // Update form values dynamically
+                form_state.values = vec![
+                    response.firma,
+                    response.kz,
+                    response.drc,
+                    response.ulica,
+                    response.psc,
+                    response.mesto,
+                    response.stat,
+                    response.banka,
+                    response.ucet,
+                    response.skladm,
+                    response.ico,
+                    response.kontakt,
+                    response.telefon,
+                    response.skladu,
+                    response.fax,
+                ];
+
+                form_state.has_unsaved_changes = false;
+                Ok(format!("Loaded entry {}", position))
+            }
+            Err(e) => {
+                Ok(format!("Error loading entry: {}", e))
+            }
+        }
+    }
+
+    /// Handles the consequences of a save operation, like updating counts.
+    pub async fn handle_save_outcome(
+        save_outcome: SaveOutcome,
+        grpc_client: &mut GrpcClient,
+        app_state: &mut AppState,
+        form_state: &mut FormState, // Needed to potentially update position/ID
+    ) -> Result<(), Box<dyn std::error::Error>> {
+        match save_outcome {
+            SaveOutcome::CreatedNew(new_id) => {
+                // A new record was created, update the count!
+                UiService::update_adresar_count(grpc_client, app_state).await?;
+                // Navigate to the new record (now that count is updated)
+                app_state.update_current_position(app_state.total_count);
+                form_state.id = new_id; // Ensure ID is set (might be redundant if save already did it)
+            }
+            SaveOutcome::UpdatedExisting | SaveOutcome::NoChange => {
+                // No count update needed for these outcomes
+            }
+        }
+        Ok(())
+    }
+}
+
--- a/client/src/state/app.rs
+++ b/client/src/state/app.rs
@@ -0,0 +1,5 @@
+// src/state/app.rs
+
+pub mod state;
+pub mod buffer;
+pub mod highlight;
--- a/client/src/state/app/buffer.rs
+++ b/client/src/state/app/buffer.rs
@@ -0,0 +1,94 @@
+// src/state/app/buffer.rs
+
+/// Represents the distinct views or "buffers" the user can navigate.
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum AppView {
+    Intro,
+    Login,
+    Register,
+    Admin,
+    AddTable,
+    Form(String),
+    Scratch,
+}
+
+impl AppView {
+    /// Returns the display name for the view.
+    pub fn display_name(&self) -> &str {
+        match self {
+            AppView::Intro => "Intro",
+            AppView::Login => "Login",
+            AppView::Register => "Register",
+            AppView::Admin => "Admin_Panel",
+            AppView::AddTable => "Add_Table",
+            AppView::Form(name) => name.as_str(),
+            AppView::Scratch => "*scratch*",
+        }
+    }
+}
+
+/// Holds the state related to buffer management (navigation history).
+#[derive(Debug, Clone)]
+pub struct BufferState {
+    pub history: Vec<AppView>,
+    pub active_index: usize,
+}
+
+impl Default for BufferState {
+    fn default() -> Self {
+        Self {
+            history: vec![AppView::Intro], // Start with Intro view
+            active_index: 0,
+        }
+    }
+}
+
+impl BufferState {
+    /// Updates the buffer history and active index.
+    /// If the view already exists, it sets it as active.
+    /// Otherwise, it adds the new view and makes it active.
+    pub fn update_history(&mut self, view: AppView) {
+        let existing_pos = self.history.iter().position(|v| v == &view);
+
+        match existing_pos {
+            Some(pos) => {
+                self.active_index = pos;
+            }
+            None => {
+                self.history.push(view.clone());
+                self.active_index = self.history.len() - 1;
+            }
+        }
+    }
+
+    /// Gets the currently active view.
+    pub fn get_active_view(&self) -> Option<&AppView> {
+        self.history.get(self.active_index)
+    }
+
+    /// Removes the currently active buffer from the history, unless it's the Intro buffer.
+    /// Sets the new active buffer to the one preceding the closed one.
+    /// # Returns
+    /// * `true` if a non-Intro buffer was closed.
+    /// * `false` if the active buffer was Intro or only Intro remained.
+    pub fn close_active_buffer(&mut self) -> bool {
+        let current_index = self.active_index;
+
+        // Rule 1: Cannot close Intro buffer.
+        if matches!(self.history.get(current_index), Some(AppView::Intro)) {
+            return false;
+        }
+
+        // Rule 2: Cannot close if only Intro would remain (or already remains).
+        // This check implicitly covers the case where len <= 1.
+        if self.history.len() <= 1 {
+             return false;
+        }
+
+        self.history.remove(current_index);
+        self.active_index = current_index.saturating_sub(1).min(self.history.len() - 1);
+
+        true
+    }
+}
+
--- a/client/src/state/app/highlight.rs
+++ b/client/src/state/app/highlight.rs
@@ -0,0 +1,20 @@
+// src/state/app/highlight.rs
+
+/// Represents the different states of text highlighting.
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum HighlightState {
+    /// Highlighting is inactive.
+    Off,
+    /// Highlighting character by character. Stores the anchor point (line index, char index).
+    Characterwise { anchor: (usize, usize) },
+    /// Highlighting line by line. Stores the anchor line index.
+    Linewise { anchor_line: usize },
+}
+
+impl Default for HighlightState {
+    /// The default state is no highlighting.
+    fn default() -> Self {
+        HighlightState::Off
+    }
+}
+
--- a/client/src/state/app/state.rs
+++ b/client/src/state/app/state.rs
@@ -0,0 +1,194 @@
+// src/state/state.rs
+
+use std::env;
+use common::proto::multieko2::table_definition::ProfileTreeResponse;
+use crate::modes::handlers::mode_manager::AppMode;
+use crate::ui::handlers::context::DialogPurpose;
+
+pub struct DialogState {
+    pub dialog_show: bool,
+    pub dialog_title: String,
+    pub dialog_message: String,
+    pub dialog_buttons: Vec<String>,
+    pub dialog_active_button_index: usize,
+    pub purpose: Option<DialogPurpose>,
+    pub is_loading: bool,
+}
+
+pub struct UiState {
+    pub show_sidebar: bool,
+    pub show_buffer_list: bool,
+    pub show_intro: bool,
+    pub show_admin: bool,
+    pub show_add_table: bool,
+    pub show_form: bool,
+    pub show_login: bool,
+    pub show_register: bool,
+    pub focus_outside_canvas: bool,
+    pub dialog: DialogState,
+}
+
+pub struct AppState {
+    // Core editor state
+    pub current_dir: String,
+    pub total_count: u64,
+    pub current_position: u64,
+    pub profile_tree: ProfileTreeResponse,
+    pub selected_profile: Option<String>,
+    pub current_mode: AppMode,
+    pub focused_button_index: usize,
+
+    // UI preferences
+    pub ui: UiState,
+}
+
+impl AppState {
+    pub fn new() -> Result<Self, Box<dyn std::error::Error>> {
+        let current_dir = env::current_dir()?
+            .to_string_lossy()
+            .to_string();
+        Ok(AppState {
+            current_dir,
+            total_count: 0,
+            current_position: 0,
+            profile_tree: ProfileTreeResponse::default(),
+            selected_profile: None,
+            current_mode: AppMode::General,
+            focused_button_index: 0,
+            ui: UiState::default(),
+        })
+    }
+
+    // Existing methods remain unchanged
+    pub fn update_total_count(&mut self, total_count: u64) {
+        self.total_count = total_count;
+    }
+
+    pub fn update_current_position(&mut self, current_position: u64) {
+        self.current_position = current_position;
+    }
+
+    pub fn update_mode(&mut self, mode: AppMode) {
+        self.current_mode = mode;
+    }
+
+    // Add dialog helper methods
+    /// Shows a dialog with the given title, message, and buttons.
+    /// The first button (index 0) is active by default.
+    pub fn show_dialog(
+        &mut self,
+        title: &str,
+        message: &str,
+        buttons: Vec<String>,
+        purpose: DialogPurpose,
+    ) {
+        self.ui.dialog.dialog_title = title.to_string();
+        self.ui.dialog.dialog_message = message.to_string();
+        self.ui.dialog.dialog_buttons = buttons;
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = Some(purpose);
+        self.ui.dialog.is_loading = false;
+        self.ui.dialog.dialog_show = true;
+        self.ui.focus_outside_canvas = true;
+    }
+
+    /// Shows a dialog specifically for loading states.
+    pub fn show_loading_dialog(&mut self, title: &str, message: &str) {
+        self.ui.dialog.dialog_title = title.to_string();
+        self.ui.dialog.dialog_message = message.to_string();
+        self.ui.dialog.dialog_buttons.clear(); // No buttons during loading
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = None; // Purpose is set when loading finishes
+        self.ui.dialog.is_loading = true;
+        self.ui.dialog.dialog_show = true;
+        self.ui.focus_outside_canvas = true; // Keep focus management consistent
+    }
+
+    /// Updates the content of an existing dialog, typically after loading.
+    pub fn update_dialog_content(
+        &mut self,
+        message: &str,
+        buttons: Vec<String>,
+        purpose: DialogPurpose,
+    ) {
+        if self.ui.dialog.dialog_show {
+            self.ui.dialog.dialog_message = message.to_string();
+            self.ui.dialog.dialog_buttons = buttons;
+            self.ui.dialog.dialog_active_button_index = 0; // Reset focus
+            self.ui.dialog.purpose = Some(purpose);
+            self.ui.dialog.is_loading = false; // Loading finished
+                                               // Keep dialog_show = true
+                                               // Keep focus_outside_canvas = true
+        }
+    }
+
+    /// Hides the dialog and clears its content.
+    pub fn hide_dialog(&mut self) {
+        self.ui.dialog.dialog_show = false;
+        self.ui.dialog.dialog_title.clear();
+        self.ui.dialog.dialog_message.clear();
+        self.ui.dialog.dialog_buttons.clear();
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = None;
+        self.ui.focus_outside_canvas = false;
+    }
+
+    /// Sets the active button index, wrapping around if necessary.
+    pub fn next_dialog_button(&mut self) {
+        if !self.ui.dialog.dialog_buttons.is_empty() {
+            let next_index = (self.ui.dialog.dialog_active_button_index + 1)
+                % self.ui.dialog.dialog_buttons.len();
+            self.ui.dialog.dialog_active_button_index = next_index; // Use new name
+        }
+    }
+
+    /// Sets the active button index, wrapping around if necessary.
+    pub fn previous_dialog_button(&mut self) {
+        if !self.ui.dialog.dialog_buttons.is_empty() {
+            let len = self.ui.dialog.dialog_buttons.len();
+            let prev_index =
+                (self.ui.dialog.dialog_active_button_index + len - 1) % len;
+            self.ui.dialog.dialog_active_button_index = prev_index; // Use new name
+        }
+    }
+
+    /// Gets the label of the currently active button, if any.
+    pub fn get_active_dialog_button_label(&self) -> Option<&str> {
+        self.ui.dialog
+            .dialog_buttons // Use new name
+            .get(self.ui.dialog.dialog_active_button_index) // Use new name
+            .map(|s| s.as_str())
+    }
+}
+
+impl Default for UiState {
+    fn default() -> Self {
+        Self {
+            show_sidebar: false,
+            show_intro: true,
+            show_admin: false,
+            show_add_table: false,
+            show_form: false,
+            show_login: false,
+            show_register: false,
+            show_buffer_list: true,
+            focus_outside_canvas: false,
+            dialog: DialogState::default(),
+        }
+    }
+}
+
+// Update the Default implementation for DialogState itself
+impl Default for DialogState {
+    fn default() -> Self {
+        Self {
+            dialog_show: false,
+            dialog_title: String::new(),
+            dialog_message: String::new(),
+            dialog_buttons: Vec::new(),
+            dialog_active_button_index: 0,
+            purpose: None,
+            is_loading: false,
+        }
+    }
+}
--- a/client/src/state/mod.rs
+++ b/client/src/state/mod.rs
@@ -1,2 +1,3 @@
 // src/state/mod.rs
-pub mod state;
+pub mod app;
+pub mod pages;
--- a/client/src/state/pages.rs
+++ b/client/src/state/pages.rs
@@ -0,0 +1,8 @@
+// src/state/pages.rs
+
+pub mod form;
+pub mod auth;
+pub mod admin;
+pub mod intro;
+pub mod add_table;
+pub mod canvas_state;
--- a/client/src/state/pages/add_table.rs
+++ b/client/src/state/pages/add_table.rs
@@ -0,0 +1,171 @@
+// src/state/pages/add_table.rs
+use crate::state::pages::canvas_state::CanvasState;
+use ratatui::widgets::TableState;
+
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub struct ColumnDefinition {
+    pub name: String,
+    pub data_type: String,
+    pub selected: bool,
+}
+
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub struct LinkDefinition {
+    pub linked_table_name: String,
+    pub is_required: bool,
+    pub selected: bool,
+}
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq, Default)]
+pub enum AddTableFocus {
+    #[default]
+    InputTableName, // Field 0 for CanvasState
+    InputColumnName, // Field 1 for CanvasState
+    InputColumnType, // Field 2 for CanvasState
+    AddColumnButton,
+    // Result Tables
+    ColumnsTable,
+    IndexesTable,
+    LinksTable,
+    // Inside Tables (Scrolling Focus)
+    InsideColumnsTable,
+    InsideIndexesTable,
+    InsideLinksTable,
+    // Buttons
+    SaveButton,
+    DeleteSelectedButton,
+    CancelButton,
+}
+
+#[derive(Debug, Clone)]
+pub struct AddTableState {
+    pub profile_name: String,
+    pub table_name: String,
+    pub table_name_input: String,
+    pub column_name_input: String,
+    pub column_type_input: String,
+    pub columns: Vec<ColumnDefinition>,
+    pub indexes: Vec<String>,
+    pub links: Vec<LinkDefinition>,
+    pub current_focus: AddTableFocus,
+    pub column_table_state: TableState,
+    pub index_table_state: TableState,
+    pub link_table_state: TableState,
+    pub table_name_cursor_pos: usize,
+    pub column_name_cursor_pos: usize,
+    pub column_type_cursor_pos: usize,
+    pub has_unsaved_changes: bool,
+}
+
+impl Default for AddTableState {
+    fn default() -> Self {
+        // Initialize with some dummy data for demonstration
+        AddTableState {
+            profile_name: "default".to_string(),
+            table_name: String::new(),
+            table_name_input: String::new(),
+            column_name_input: String::new(),
+            column_type_input: String::new(),
+            columns: Vec::new(),
+            indexes: Vec::new(),
+            links: Vec::new(),
+            current_focus: AddTableFocus::InputTableName,
+            column_table_state: TableState::default(),
+            index_table_state: TableState::default(),
+            link_table_state: TableState::default(),
+            table_name_cursor_pos: 0,
+            column_name_cursor_pos: 0,
+            column_type_cursor_pos: 0,
+            has_unsaved_changes: false,
+        }
+    }
+}
+
+impl AddTableState {
+    pub const INPUT_FIELD_COUNT: usize = 3;
+}
+
+// Implement CanvasState for the input fields
+impl CanvasState for AddTableState {
+    fn current_field(&self) -> usize {
+        match self.current_focus {
+            AddTableFocus::InputTableName => 0,
+            AddTableFocus::InputColumnName => 1,
+            AddTableFocus::InputColumnType => 2,
+            // If focus is elsewhere, default to the first field for canvas rendering logic
+            _ => 0,
+        }
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        match self.current_focus {
+            AddTableFocus::InputTableName => self.table_name_cursor_pos,
+            AddTableFocus::InputColumnName => self.column_name_cursor_pos,
+            AddTableFocus::InputColumnType => self.column_type_cursor_pos,
+            _ => 0, // Default if focus is not on an input field
+        }
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        vec![&self.table_name_input, &self.column_name_input, &self.column_type_input]
+    }
+
+    fn get_current_input(&self) -> &str {
+        match self.current_focus {
+            AddTableFocus::InputTableName => &self.table_name_input,
+            AddTableFocus::InputColumnName => &self.column_name_input,
+            AddTableFocus::InputColumnType => &self.column_type_input,
+            _ => "", // Should not happen if called correctly
+        }
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        match self.current_focus {
+            AddTableFocus::InputTableName => &mut self.table_name_input,
+            AddTableFocus::InputColumnName => &mut self.column_name_input,
+            AddTableFocus::InputColumnType => &mut self.column_type_input,
+            _ => &mut self.table_name_input,
+        }
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        // These must match the order used in render_add_table
+        vec!["Table name", "Name", "Type"]
+    }
+
+    fn set_current_field(&mut self, index: usize) {
+        self.current_focus = match index {
+            0 => AddTableFocus::InputTableName,
+            1 => AddTableFocus::InputColumnName,
+            2 => AddTableFocus::InputColumnType,
+            _ => self.current_focus, // Stay on current focus if index is out of bounds
+        };
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        match self.current_focus {
+            AddTableFocus::InputTableName => self.table_name_cursor_pos = pos,
+            AddTableFocus::InputColumnName => self.column_name_cursor_pos = pos,
+            AddTableFocus::InputColumnType => self.column_type_cursor_pos = pos,
+            _ => {} // Do nothing if focus is not on an input field
+        }
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_unsaved_changes = changed;
+    }
+
+    // --- Autocomplete Support (Not needed for this form yet) ---
+    fn get_suggestions(&self) -> Option<&[String]> {
+        None
+    }
+
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        None
+    }
+}
+
--- a/client/src/state/pages/admin.rs
+++ b/client/src/state/pages/admin.rs
@@ -0,0 +1,178 @@
+// src/state/pages/admin.rs
+
+use ratatui::widgets::ListState;
+use crate::state::pages::add_table::AddTableState;
+
+// Define the focus states for the admin panel panes
+#[derive(Debug, Clone, Copy, PartialEq, Eq, Default)]
+pub enum AdminFocus {
+    #[default] // Default focus is on the profiles list
+    Profiles,
+    Tables,
+    Button1,
+    Button2,
+    Button3,
+}
+
+#[derive(Default, Clone, Debug)]
+pub struct AdminState {
+    pub profiles: Vec<String>, // Holds profile names (used by non-admin view)
+    pub profile_list_state: ListState, // Tracks navigation highlight (>) in profiles
+    pub table_list_state: ListState,   // Tracks navigation highlight (>) in tables
+    pub selected_profile_index: Option<usize>, // Index with [*] in profiles (persistent)
+    pub selected_table_index: Option<usize>,   // Index with [*] in tables (persistent)
+    pub current_focus: AdminFocus,     // Tracks which pane is focused
+    pub add_table_state: AddTableState,
+}
+
+impl AdminState {
+    /// Gets the index of the currently selected item.
+    pub fn get_selected_index(&self) -> Option<usize> {
+        self.profile_list_state.selected()
+    }
+
+    /// Gets the name of the currently selected profile.
+    pub fn get_selected_profile_name(&self) -> Option<&String> {
+        self.profile_list_state.selected().and_then(|i| self.profiles.get(i))
+    }
+
+    /// Populates the profile list and updates/resets the selection.
+    pub fn set_profiles(&mut self, new_profiles: Vec<String>) {
+        let current_selection_index = self.profile_list_state.selected();
+        self.profiles = new_profiles;
+
+        if self.profiles.is_empty() {
+            self.profile_list_state.select(None);
+        } else {
+            let new_selection = match current_selection_index {
+                Some(index) => Some(index.min(self.profiles.len() - 1)),
+                None => Some(0),
+            };
+            self.profile_list_state.select(new_selection);
+        }
+    }
+
+    /// Selects the next profile in the list, wrapping around.
+    pub fn next(&mut self) {
+        if self.profiles.is_empty() {
+            self.profile_list_state.select(None);
+            return;
+        }
+        let i = match self.profile_list_state.selected() {
+            Some(i) => if i >= self.profiles.len() - 1 { 0 } else { i + 1 },
+            None => 0,
+        };
+        self.profile_list_state.select(Some(i));
+    }
+
+    /// Selects the previous profile in the list, wrapping around.
+    pub fn previous(&mut self) {
+        if self.profiles.is_empty() {
+            self.profile_list_state.select(None);
+            return;
+        }
+        let i = match self.profile_list_state.selected() {
+            Some(i) => if i == 0 { self.profiles.len() - 1 } else { i - 1 },
+            None => self.profiles.len() - 1,
+        };
+        self.profile_list_state.select(Some(i));
+    }
+
+    /// Gets the index of the currently selected profile.
+    pub fn get_selected_profile_index(&self) -> Option<usize> {
+        self.profile_list_state.selected()
+    }
+
+    /// Gets the index of the currently selected table.
+    pub fn get_selected_table_index(&self) -> Option<usize> {
+        self.table_list_state.selected()
+    }
+
+    /// Selects a profile by index and resets table selection.
+    pub fn select_profile(&mut self, index: Option<usize>) {
+        self.profile_list_state.select(index);
+        self.table_list_state.select(None);
+    }
+
+    /// Selects a table by index.
+    pub fn select_table(&mut self, index: Option<usize>) {
+        self.table_list_state.select(index);
+    }
+
+    /// Selects the next profile, wrapping around.
+    /// `profile_count` should be the total number of profiles available.
+    pub fn next_profile(&mut self, profile_count: usize) {
+        if profile_count == 0 {
+            return;
+        }
+        let i = match self.get_selected_profile_index() {
+            Some(i) => {
+                if i >= profile_count - 1 {
+                    0
+                } else {
+                    i + 1
+                }
+            }
+            None => 0,
+        };
+        self.select_profile(Some(i)); // Use the helper method
+    }
+
+    /// Selects the previous profile, wrapping around.
+    /// `profile_count` should be the total number of profiles available.
+    pub fn previous_profile(&mut self, profile_count: usize) {
+        if profile_count == 0 {
+            return;
+        }
+        let i = match self.get_selected_profile_index() {
+            Some(i) => {
+                if i == 0 {
+                    profile_count - 1
+                } else {
+                    i - 1
+                }
+            }
+            None => 0, // Or profile_count - 1 if you prefer wrapping from None
+        };
+        self.select_profile(Some(i)); // Use the helper method
+    }
+
+    /// Selects the next table, wrapping around.
+    /// `table_count` should be the number of tables in the *currently selected* profile.
+    pub fn next_table(&mut self, table_count: usize) {
+        if table_count == 0 {
+            return;
+        }
+        let i = match self.get_selected_table_index() {
+            Some(i) => {
+                if i >= table_count - 1 {
+                    0
+                } else {
+                    i + 1
+                }
+            }
+            None => 0,
+        };
+        self.select_table(Some(i));
+    }
+
+    /// Selects the previous table, wrapping around.
+    /// `table_count` should be the number of tables in the *currently selected* profile.
+    pub fn previous_table(&mut self, table_count: usize) {
+        if table_count == 0 {
+            return;
+        }
+        let i = match self.get_selected_table_index() {
+            Some(i) => {
+                if i == 0 {
+                    table_count - 1
+                } else {
+                    i - 1
+                }
+            }
+            None => 0, // Or table_count - 1
+        };
+        self.select_table(Some(i));
+    }
+}
+
--- a/client/src/state/pages/auth.rs
+++ b/client/src/state/pages/auth.rs
@@ -0,0 +1,297 @@
+// src/state/pages/auth.rs
+use crate::state::pages::canvas_state::CanvasState;
+use lazy_static::lazy_static;
+
+lazy_static! {
+    pub static ref AVAILABLE_ROLES: Vec<String> = vec![
+        "admin".to_string(),
+        "moderator".to_string(),
+        "accountant".to_string(),
+        "viewer".to_string(),
+    ];
+}
+
+/// Represents the authenticated session state
+#[derive(Default)]
+pub struct AuthState {
+    pub auth_token: Option<String>,
+    pub user_id: Option<String>,
+    pub role: Option<String>,
+    pub decoded_username: Option<String>,
+}
+
+/// Represents the state of the Login form UI
+#[derive(Default)]
+pub struct LoginState {
+    pub username: String,
+    pub password: String,
+    pub error_message: Option<String>,
+    pub current_field: usize,
+    pub current_cursor_pos: usize,
+    pub has_unsaved_changes: bool,
+    pub login_request_pending: bool,
+}
+
+/// Represents the state of the Registration form UI
+#[derive(Default, Clone)]
+pub struct RegisterState {
+    pub username: String,
+    pub email: String,
+    pub password: String,
+    pub password_confirmation: String,
+    pub role: String,
+    pub error_message: Option<String>,
+    pub current_field: usize,
+    pub current_cursor_pos: usize,
+    pub has_unsaved_changes: bool,
+    pub show_role_suggestions: bool,
+    pub role_suggestions: Vec<String>,
+    pub selected_suggestion_index: Option<usize>,
+    pub in_suggestion_mode: bool,
+}
+
+impl AuthState {
+    /// Creates a new empty AuthState (unauthenticated)
+    pub fn new() -> Self {
+        Self {
+            auth_token: None,
+            user_id: None,
+            role: None,
+            decoded_username: None,
+        }
+    }
+}
+
+impl LoginState {
+    /// Creates a new empty LoginState
+    pub fn new() -> Self {
+        Self {
+            username: String::new(),
+            password: String::new(),
+            error_message: None,
+            current_field: 0,
+            current_cursor_pos: 0,
+            has_unsaved_changes: false,
+            login_request_pending: false,
+        }
+    }
+}
+
+impl RegisterState {
+    /// Creates a new empty RegisterState
+    pub fn new() -> Self {
+        Self {
+            username: String::new(),
+            email: String::new(),
+            password: String::new(),
+            password_confirmation: String::new(),
+            role: String::new(),
+            error_message: None,
+            current_field: 0,
+            current_cursor_pos: 0,
+            has_unsaved_changes: false,
+            show_role_suggestions: false,
+            role_suggestions: Vec::new(),
+            selected_suggestion_index: None,
+            in_suggestion_mode: false,
+        }
+    }
+
+    /// Updates role suggestions based on current input
+    pub fn update_role_suggestions(&mut self) {
+        let current_input = self.role.to_lowercase();
+        self.role_suggestions = AVAILABLE_ROLES
+            .iter()
+            .filter(|role| role.to_lowercase().contains(&current_input))
+            .cloned()
+            .collect();
+        self.show_role_suggestions = !self.role_suggestions.is_empty();
+    }
+}
+
+impl CanvasState for LoginState {
+    fn current_field(&self) -> usize {
+        self.current_field
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        let len = match self.current_field {
+            0 => self.username.len(),
+            1 => self.password.len(),
+            _ => 0,
+        };
+        self.current_cursor_pos.min(len)
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        vec![&self.username, &self.password]
+    }
+
+    fn get_current_input(&self) -> &str {
+        match self.current_field {
+            0 => &self.username,
+            1 => &self.password,
+            _ => "",
+        }
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        match self.current_field {
+            0 => &mut self.username,
+            1 => &mut self.password,
+            _ => panic!("Invalid current_field index in LoginState"),
+        }
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        vec!["Username/Email", "Password"]
+    }
+
+    fn set_current_field(&mut self, index: usize) {
+        if index < 2 {
+            self.current_field = index;
+            let len = match self.current_field {
+                0 => self.username.len(),
+                1 => self.password.len(),
+                _ => 0,
+            };
+            self.current_cursor_pos = self.current_cursor_pos.min(len);
+        }
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        let len = match self.current_field {
+            0 => self.username.len(),
+            1 => self.password.len(),
+            _ => 0,
+        };
+        self.current_cursor_pos = pos.min(len);
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_unsaved_changes = changed;
+    }
+
+    fn get_suggestions(&self) -> Option<&[String]> {
+        None
+    }
+
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        None
+    }
+}
+
+impl CanvasState for RegisterState {
+    fn current_field(&self) -> usize {
+        self.current_field
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        let len = match self.current_field {
+            0 => self.username.len(),
+            1 => self.email.len(),
+            2 => self.password.len(),
+            3 => self.password_confirmation.len(),
+            4 => self.role.len(),
+            _ => 0,
+        };
+        self.current_cursor_pos.min(len)
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        vec![
+            &self.username,
+            &self.email,
+            &self.password,
+            &self.password_confirmation,
+            &self.role,
+        ]
+    }
+
+    fn get_current_input(&self) -> &str {
+        match self.current_field {
+            0 => &self.username,
+            1 => &self.email,
+            2 => &self.password,
+            3 => &self.password_confirmation,
+            4 => &self.role,
+            _ => "",
+        }
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        match self.current_field {
+            0 => &mut self.username,
+            1 => &mut self.email,
+            2 => &mut self.password,
+            3 => &mut self.password_confirmation,
+            4 => &mut self.role,
+            _ => panic!("Invalid current_field index in RegisterState"),
+        }
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        vec![
+            "Username",
+            "Email (Optional)",
+            "Password (Optional)",
+            "Confirm Password",
+            "Role (Optional)"
+        ]
+    }
+
+    fn set_current_field(&mut self, index: usize) {
+        if index < 5 {
+            self.current_field = index;
+            let len = match self.current_field {
+                0 => self.username.len(),
+                1 => self.email.len(),
+                2 => self.password.len(),
+                3 => self.password_confirmation.len(),
+                4 => self.role.len(),
+                _ => 0,
+            };
+            self.current_cursor_pos = self.current_cursor_pos.min(len);
+        }
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        let len = match self.current_field {
+            0 => self.username.len(),
+            1 => self.email.len(),
+            2 => self.password.len(),
+            3 => self.password_confirmation.len(),
+            4 => self.role.len(),
+            _ => 0,
+        };
+        self.current_cursor_pos = pos.min(len);
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_unsaved_changes = changed;
+    }
+
+    fn get_suggestions(&self) -> Option<&[String]> {
+        if self.current_field == 4 && self.in_suggestion_mode && self.show_role_suggestions {
+            Some(&self.role_suggestions)
+        } else {
+            None
+        }
+    }
+
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        if self.current_field == 4 && self.in_suggestion_mode && self.show_role_suggestions {
+            self.selected_suggestion_index
+        } else {
+            None
+        }
+    }
+}
--- a/client/src/state/pages/canvas_state.rs
+++ b/client/src/state/pages/canvas_state.rs
@@ -0,0 +1,20 @@
+// src/state/canvas_state.rs
+
+
+pub trait CanvasState {
+    fn current_field(&self) -> usize;
+    fn current_cursor_pos(&self) -> usize;
+    fn has_unsaved_changes(&self) -> bool;
+    fn inputs(&self) -> Vec<&String>;
+    fn get_current_input(&self) -> &str;
+    fn get_current_input_mut(&mut self) -> &mut String;
+    fn fields(&self) -> Vec<&str>;
+
+    fn set_current_field(&mut self, index: usize);
+    fn set_current_cursor_pos(&mut self, pos: usize);
+    fn set_has_unsaved_changes(&mut self, changed: bool);
+
+    // --- Autocomplete Support ---
+    fn get_suggestions(&self) -> Option<&[String]>;
+    fn get_selected_suggestion_index(&self) -> Option<usize>;
+}
--- a/client/src/state/pages/form.rs
+++ b/client/src/state/pages/form.rs
@@ -0,0 +1,148 @@
+// src/state/pages/form.rs
+use crate::config::colors::themes::Theme;
+use ratatui::layout::Rect;
+use ratatui::Frame;
+use crate::state::app::highlight::HighlightState;
+use crate::state::pages::canvas_state::CanvasState;
+
+pub struct FormState {
+    pub id: i64,
+    pub fields: Vec<String>,
+    pub values: Vec<String>,
+    pub current_field: usize,
+    pub has_unsaved_changes: bool,
+    pub current_cursor_pos: usize,
+}
+
+impl FormState {
+    /// Create a new FormState with dynamic fields.
+    pub fn new(fields: Vec<String>) -> Self {
+        let values = vec![String::new(); fields.len()]; // Initialize values for each field
+        FormState {
+            id: 0,
+            fields,
+            values,
+            current_field: 0,
+            has_unsaved_changes: false,
+            current_cursor_pos: 0,
+        }
+    }
+
+    pub fn render(
+        &self,
+        f: &mut Frame,
+        area: Rect,
+        theme: &Theme,
+        is_edit_mode: bool,
+        highlight_state: &HighlightState,
+        total_count: u64,
+        current_position: u64,
+    ) {
+        let fields: Vec<&str> = self.fields.iter().map(|s| s.as_str()).collect();
+        let values: Vec<&String> = self.values.iter().collect();
+
+        crate::components::form::form::render_form(
+            f,
+            area,
+            self,
+            &fields,
+            &self.current_field,
+            &values,
+            theme,
+            is_edit_mode,
+            highlight_state,
+            total_count,
+            current_position,
+        );
+    }
+
+    pub fn reset_to_empty(&mut self) {
+        self.id = 0; // Reset ID to 0 for new entries
+        self.values.iter_mut().for_each(|v| v.clear()); // Clear all values
+        self.has_unsaved_changes = false;
+    }
+
+    pub fn get_current_input(&self) -> &str {
+        self.values
+            .get(self.current_field)
+            .map(|s| s.as_str())
+            .unwrap_or("")
+    }
+
+    pub fn get_current_input_mut(&mut self) -> &mut String {
+        self.values
+            .get_mut(self.current_field)
+            .expect("Invalid current_field index")
+    }
+
+    pub fn update_from_response(&mut self, response: common::proto::multieko2::adresar::AdresarResponse) {
+        self.id = response.id;
+        self.values = vec![
+            response.firma, response.kz, response.drc,
+            response.ulica, response.psc, response.mesto,
+            response.stat, response.banka, response.ucet,
+            response.skladm, response.ico, response.kontakt,
+            response.telefon, response.skladu, response.fax,
+        ];
+    }
+}
+
+impl CanvasState for FormState {
+    fn current_field(&self) -> usize {
+        self.current_field
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        self.current_cursor_pos
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        self.values.iter().collect()
+    }
+
+    fn get_current_input(&self) -> &str {
+        self.values
+            .get(self.current_field)
+            .map(|s| s.as_str())
+            .unwrap_or("")
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        self.values
+            .get_mut(self.current_field)
+            .expect("Invalid current_field index")
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        self.fields.iter().map(|s| s.as_str()).collect()
+    }
+
+    // --- Implement the setter methods ---
+    fn set_current_field(&mut self, index: usize) {
+        if index < self.fields.len() { // Basic bounds check
+            self.current_field = index;
+        }
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        // Optional: Add validation based on current input length if needed
+        self.current_cursor_pos = pos;
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_unsaved_changes = changed;
+    }
+
+    // --- Autocomplete Support (Not Used for FormState) ---
+    fn get_suggestions(&self) -> Option<&[String]> {
+        None // FormState doesn't provide suggestions
+    }
+
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        None // FormState doesn't have selected suggestions
+    }
+}
--- a/client/src/state/pages/intro.rs
+++ b/client/src/state/pages/intro.rs
@@ -0,0 +1,25 @@
+// src/state/pages/intro.rs
+
+#[derive(Default, Clone, Debug)]
+pub struct IntroState {
+    pub selected_option: usize,
+}
+
+impl IntroState {
+    pub fn new() -> Self {
+        Self::default()
+    }
+
+    pub fn next_option(&mut self) {
+        if self.selected_option < 3 {
+            self.selected_option += 1;
+        }
+    }
+
+    pub fn previous_option(&mut self) {
+        if self.selected_option > 0 {
+             self.selected_option -= 1
+        }
+    }
+}
+
--- a/client/src/state/state.rs
+++ b/client/src/state/state.rs
@@ -1,63 +0,0 @@
-// src/state/state.rs
-
-use std::env;
-use common::proto::multieko2::table_definition::ProfileTreeResponse;
-
-pub struct UiState {
-    pub show_sidebar: bool,
-    pub is_saved: bool,
-    pub show_intro: bool,
-    pub show_admin: bool,
-}
-
-pub struct AppState {
-    // Core editor state
-    pub current_dir: String,
-    pub total_count: u64,
-    pub current_position: u64,
-    pub profile_tree: ProfileTreeResponse,
-    pub selected_profile: Option<String>,
-    pub admin_selected_item: usize,  // Tracks selection in admin panel
-    pub admin_profiles: Vec<String>, // Stores admin panel data
-
-    // UI preferences
-    pub ui: UiState,
-}
-
-impl AppState {
-    pub fn new() -> Result<Self, Box<dyn std::error::Error>> {
-        let current_dir = env::current_dir()?
-            .to_string_lossy()
-            .to_string();
-        Ok(AppState {
-            current_dir,
-            total_count: 0,
-            current_position: 0,
-            profile_tree: ProfileTreeResponse::default(),
-            selected_profile: None,
-            admin_selected_item: 0,
-            admin_profiles: Vec::new(),
-            ui: UiState::default(),
-        })
-    }
-
-    // Existing methods remain unchanged
-    pub fn update_total_count(&mut self, total_count: u64) {
-        self.total_count = total_count;
-    }
-
-    pub fn update_current_position(&mut self, current_position: u64) {
-        self.current_position = current_position;
-    }
-}
-
-impl Default for UiState {
-    fn default() -> Self {
-        Self {
-            show_sidebar: true,
-            is_saved: false,
-            show_intro: true,
-            show_admin: false,
-        }
-    }
-}
--- a/client/src/tui/functions.rs
+++ b/client/src/tui/functions.rs
@@ -0,0 +1,11 @@
+// src/tui/functions.rs
+
+pub mod admin;
+pub mod intro;
+pub mod login;
+pub mod form;
+pub mod common;
+
+pub use admin::*;
+pub use intro::*;
+pub use form::*;
--- a/client/src/tui/functions/admin.rs
+++ b/client/src/tui/functions/admin.rs
@@ -0,0 +1,11 @@
+use crate::state::app::state::AppState;
+use crate::state::pages::admin::AdminState;
+
+pub fn handle_admin_selection(app_state: &mut AppState, admin_state: &AdminState) {
+    let profiles = &app_state.profile_tree.profiles;
+    if let Some(selected_index) = admin_state.get_selected_index() {
+        if let Some(profile) = profiles.get(selected_index) {
+            app_state.selected_profile = Some(profile.name.clone());
+        }
+    }
+}
--- a/client/src/tui/functions/common.rs
+++ b/client/src/tui/functions/common.rs
@@ -0,0 +1,6 @@
+// src/tui/functions/common.rs
+
+pub mod form;
+pub mod login;
+pub mod register;
+pub mod add_table;
--- a/client/src/tui/functions/common/add_table.rs
+++ b/client/src/tui/functions/common/add_table.rs
@@ -0,0 +1,100 @@
+// src/tui/functions/common/add_table.rs
+use crate::state::pages::add_table::{
+    AddTableFocus, AddTableState, ColumnDefinition,
+};
+
+/// Handles the logic for adding a column when the "Add" button is activated.
+///
+/// Takes the mutable state and command message string.
+/// Returns `Some(AddTableFocus)` indicating the desired focus state after a successful add,
+/// or `None` if the action failed (e.g., validation error).
+pub fn handle_add_column_action(
+    add_table_state: &mut AddTableState,
+    command_message: &mut String,
+) -> Option<AddTableFocus> {
+
+    // Trim and create owned Strings from inputs
+    let table_name_in = add_table_state.table_name_input.trim();
+    let column_name_in = add_table_state.column_name_input.trim();
+    let column_type_in = add_table_state.column_type_input.trim(); 
+
+    // Validate all inputs needed for this combined action
+    let has_table_name = !table_name_in.is_empty();
+    let has_column_name = !column_name_in.is_empty();
+    let has_column_type = !column_type_in.is_empty();
+
+    match (has_table_name, has_column_name, has_column_type) {
+        // Case 1: Both column fields have input (Table name is optional here)
+        (_, true, true) => {
+            let mut msg = String::new();
+            // Optionally update table name if provided
+            if has_table_name {
+                add_table_state.table_name = table_name_in.to_string();
+                msg.push_str(&format!("Table name set to '{}'. ", add_table_state.table_name));
+            }
+            // Add the column
+            let new_column = ColumnDefinition {
+                name: column_name_in.to_string(),
+                data_type: column_type_in.to_string(),
+                selected: false,
+            };
+            add_table_state.columns.push(new_column.clone()); // Clone for msg
+            msg.push_str(&format!("Column '{}' added.", new_column.name));
+            *command_message = msg;
+
+            // Clear all inputs and reset cursors
+            add_table_state.table_name_input.clear();
+            add_table_state.column_name_input.clear();
+            add_table_state.column_type_input.clear();
+            add_table_state.table_name_cursor_pos = 0;
+            add_table_state.column_name_cursor_pos = 0;
+            add_table_state.column_type_cursor_pos = 0;
+            add_table_state.has_unsaved_changes = true;
+            Some(AddTableFocus::InputColumnName) // Focus for next column
+        }
+        // Case 2: Only one column field has input (Error)
+        (_, true, false) | (_, false, true) => {
+            *command_message = "Both Column Name and Type are required to add a column.".to_string();
+            None // Indicate validation failure
+        }
+        // Case 3: Only Table name has input (No column input)
+        (true, false, false) => {
+            add_table_state.table_name = table_name_in.to_string();
+            *command_message = format!("Table name set to '{}'.", add_table_state.table_name);
+            // Clear only table name input
+            add_table_state.table_name_input.clear();
+            add_table_state.table_name_cursor_pos = 0;
+            add_table_state.has_unsaved_changes = true;
+            Some(AddTableFocus::InputTableName) // Keep focus here
+        }
+        // Case 4: All fields are empty
+        (false, false, false) => {
+            *command_message = "No input provided.".to_string();
+            None
+        }
+    }
+}
+
+/// Handles deleting columns marked as selected in the AddTableState.
+pub fn handle_delete_selected_columns(
+    add_table_state: &mut AddTableState,
+) -> String {
+    let initial_count = add_table_state.columns.len();
+    // Keep only the columns that are NOT selected
+    add_table_state.columns.retain(|col| !col.selected);
+    let deleted_count = initial_count - add_table_state.columns.len();
+
+    if deleted_count > 0 {
+        add_table_state.has_unsaved_changes = true;
+        // Reset selection highlight as indices have changed
+        add_table_state.column_table_state.select(None);
+        // Optionally, select the first item if the list is not empty
+        // if !add_table_state.columns.is_empty() {
+        //     add_table_state.column_table_state.select(Some(0));
+        // }
+        format!("Deleted {} selected column(s).", deleted_count)
+    } else {
+        "No columns marked for deletion.".to_string()
+    }
+}
+
--- a/client/src/tui/functions/common/form.rs
+++ b/client/src/tui/functions/common/form.rs
@@ -1,20 +1,29 @@
-// src/modes/canvas/common.rs
+// src/tui/functions/common/form.rs

-use crate::tui::terminal::grpc_client::GrpcClient;
-use crate::ui::handlers::form::FormState;
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::form::FormState;
 use common::proto::multieko2::adresar::{PostAdresarRequest, PutAdresarRequest};

+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum SaveOutcome {
+    NoChange,         // Nothing needed saving
+    UpdatedExisting,  // An existing record was updated
+    CreatedNew(i64),  // A new record was created (include its new ID)
+}
+
 /// Shared logic for saving the current form state
 pub async fn save(
    form_state: &mut FormState,
    grpc_client: &mut GrpcClient,
-    is_saved: &mut bool,
    current_position: &mut u64,
    total_count: u64,
-) -> Result<String, Box<dyn std::error::Error>> {
+) -> Result<SaveOutcome, Box<dyn std::error::Error>> { // <-- Return SaveOutcome
+    if !form_state.has_unsaved_changes {
+        return Ok(SaveOutcome::NoChange); // Early exit if no changes
+    }
    let is_new = *current_position == total_count + 1;

-    let message = if is_new {
+    let outcome = if is_new {
        let post_request = PostAdresarRequest {
            firma: form_state.values[0].clone(),
            kz: form_state.values[1].clone(),
@@ -33,10 +42,9 @@ pub async fn save(
            fax: form_state.values[14].clone(),
        };
        let response = grpc_client.post_adresar(post_request).await?;
-        let new_total = grpc_client.get_adresar_count().await?;
-        *current_position = new_total;
-        form_state.id = response.into_inner().id;
-        "New entry created".to_string()
+        let new_id = response.into_inner().id;
+        form_state.id = new_id;
+        SaveOutcome::CreatedNew(new_id) // <-- Return CreatedNew with ID
    } else {
        let put_request = PutAdresarRequest {
            id: form_state.id,
@@ -57,70 +65,11 @@ pub async fn save(
            fax: form_state.values[14].clone(),
        };
        let _ = grpc_client.put_adresar(put_request).await?;
-        "Entry updated".to_string()
+        SaveOutcome::UpdatedExisting
    };

-    *is_saved = true;
    form_state.has_unsaved_changes = false;
-    Ok(message)
-}
-
-/// Shared logic for force quitting the application
-pub fn force_quit() -> (bool, String) {
-    (true, "Force quitting application".to_string())
-}
-
-/// Shared logic for saving and quitting
-pub async fn save_and_quit(
-    form_state: &mut FormState,
-    grpc_client: &mut GrpcClient,
-    current_position: &mut u64,
-    total_count: u64,
-) -> Result<(bool, String), Box<dyn std::error::Error>> {
-    let is_new = *current_position == total_count + 1;
-
-    if is_new {
-        let post_request = PostAdresarRequest {
-            firma: form_state.values[0].clone(),
-            kz: form_state.values[1].clone(),
-            drc: form_state.values[2].clone(),
-            ulica: form_state.values[3].clone(),
-            psc: form_state.values[4].clone(),
-            mesto: form_state.values[5].clone(),
-            stat: form_state.values[6].clone(),
-            banka: form_state.values[7].clone(),
-            ucet: form_state.values[8].clone(),
-            skladm: form_state.values[9].clone(),
-            ico: form_state.values[10].clone(),
-            kontakt: form_state.values[11].clone(),
-            telefon: form_state.values[12].clone(),
-            skladu: form_state.values[13].clone(),
-            fax: form_state.values[14].clone(),
-        };
-        let _ = grpc_client.post_adresar(post_request).await?;
-    } else {
-        let put_request = PutAdresarRequest {
-            id: form_state.id,
-            firma: form_state.values[0].clone(),
-            kz: form_state.values[1].clone(),
-            drc: form_state.values[2].clone(),
-            ulica: form_state.values[3].clone(),
-            psc: form_state.values[4].clone(),
-            mesto: form_state.values[5].clone(),
-            stat: form_state.values[6].clone(),
-            banka: form_state.values[7].clone(),
-            ucet: form_state.values[8].clone(),
-            skladm: form_state.values[9].clone(),
-            ico: form_state.values[10].clone(),
-            kontakt: form_state.values[11].clone(),
-            telefon: form_state.values[12].clone(),
-            skladu: form_state.values[13].clone(),
-            fax: form_state.values[14].clone(),
-        };
-        let _ = grpc_client.put_adresar(put_request).await?;
-    }
-
-    Ok((true, "Saved and exiting application".to_string()))
+    Ok(outcome)
 }

 /// Discard changes since last save
--- a/client/src/tui/functions/common/login.rs
+++ b/client/src/tui/functions/common/login.rs
@@ -0,0 +1,132 @@
+// src/tui/functions/common/login.rs
+
+use crate::services::auth::AuthClient;
+use crate::state::pages::auth::AuthState;
+use crate::state::pages::auth::LoginState;
+use crate::state::app::state::AppState;
+use crate::state::app::buffer::{AppView, BufferState};
+use crate::state::pages::canvas_state::CanvasState;
+use crate::ui::handlers::context::DialogPurpose;
+use crate::modes::handlers::event::EventOutcome; // Make sure this is imported
+
+/// Attempts to log the user in using the provided credentials via gRPC.
+/// Updates AuthState and AppState on success or failure.
+/// (This is your existing function - remains unchanged)
+pub async fn save(
+    auth_state: &mut AuthState,
+    login_state: &mut LoginState,
+    auth_client: &mut AuthClient,
+    app_state: &mut AppState,
+) -> Result<String, Box<dyn std::error::Error>> {
+    let identifier = login_state.username.clone();
+    let password = login_state.password.clone();
+
+    // Clear previous error/dialog state before attempting
+    login_state.error_message = None;
+    app_state.hide_dialog(); // Hide any previous dialog
+
+    // Call the gRPC login method
+    match auth_client.login(identifier, password).await {
+        Ok(response) => {
+            // Store authentication details using correct field names
+            auth_state.auth_token = Some(response.access_token.clone());
+            auth_state.user_id = Some(response.user_id.clone());
+            auth_state.role = Some(response.role.clone());
+            auth_state.decoded_username = Some(response.username.clone());
+            login_state.set_has_unsaved_changes(false);
+            login_state.error_message = None;
+
+            // Format the success message using response data
+            let success_message = format!(
+                "Login Successful!\n\n\
+                Username: {}\n\
+                User ID: {}\n\
+                Role: {}",
+                response.username,
+                response.user_id,
+                response.role
+            );
+
+            app_state.show_dialog(
+                "Login Success",
+                &success_message,
+                vec!["Menu".to_string(), "Exit".to_string()],
+                DialogPurpose::LoginSuccess,
+            );
+            login_state.password.clear();
+            login_state.current_cursor_pos = 0;
+            Ok("Login successful, details shown in dialog.".to_string())
+        }
+        Err(e) => {
+            let error_message = format!("{}", e);
+            app_state.show_dialog(
+                "Login Failed",
+                &error_message,
+                vec!["OK".to_string()],
+                DialogPurpose::LoginFailed,
+            );
+            login_state.error_message = Some(error_message.clone());
+            login_state.set_has_unsaved_changes(true);
+            Ok(format!("Login failed: {}", error_message))
+        }
+    }
+}
+
+// --- Add this new function ---
+/// Sets the stage for login: shows loading dialog and sets the pending flag.
+/// Call this from the event handler when login is triggered.
+pub async fn initiate_login(
+    app_state: &mut AppState,
+    login_state: &mut LoginState,
+) -> Result<EventOutcome, Box<dyn std::error::Error>> {
+    // Show the loading dialog immediately
+    app_state.show_loading_dialog("Logging In", "Please wait...");
+    // Set the flag in LoginState to indicate the actual save should run next loop
+    login_state.login_request_pending = true;
+    // Return immediately to allow redraw
+    Ok(EventOutcome::Ok("Login initiated.".to_string()))
+}
+// --- End of new function ---
+
+
+/// Reverts the login form fields to empty and returns to the previous screen (Intro).
+pub async fn revert(
+    login_state: &mut LoginState,
+    _app_state: &mut AppState, // Keep signature consistent if needed elsewhere
+) -> String {
+    // Clear the input fields
+    login_state.username.clear();
+    login_state.password.clear();
+    login_state.error_message = None;
+    login_state.set_has_unsaved_changes(false);
+    login_state.login_request_pending = false; // Ensure flag is reset on revert
+
+    "Login reverted".to_string()
+}
+
+pub async fn back_to_main(
+    login_state: &mut LoginState,
+    app_state: &mut AppState,
+    buffer_state: &mut BufferState,
+) -> String {
+    // Clear the input fields
+    login_state.username.clear();
+    login_state.password.clear();
+    login_state.error_message = None;
+    login_state.set_has_unsaved_changes(false);
+    login_state.login_request_pending = false; // Ensure flag is reset
+
+    // Ensure dialog is hidden if revert is called
+    app_state.hide_dialog();
+
+    // Navigation logic
+    buffer_state.close_active_buffer();
+    buffer_state.update_history(AppView::Intro);
+
+    // Reset focus state
+    app_state.ui.focus_outside_canvas = false;
+    app_state.focused_button_index= 0;
+
+    "Returned to main menu".to_string()
+}
+
--- a/client/src/tui/functions/common/register.rs
+++ b/client/src/tui/functions/common/register.rs
@@ -0,0 +1,154 @@
+// src/tui/functions/common/register.rs
+
+use crate::services::auth::AuthClient;
+use crate::state::{
+    pages::auth::RegisterState,
+    app::state::AppState,
+    pages::canvas_state::CanvasState,
+};
+use crate::ui::handlers::context::DialogPurpose;
+use crate::state::app::buffer::{AppView, BufferState};
+
+/// Attempts to register the user using the provided details via gRPC.
+/// Updates RegisterState and AppState on success or failure.
+pub async fn save(
+    register_state: &mut RegisterState,
+    auth_client: &mut AuthClient,
+    app_state: &mut AppState,
+) -> Result<String, Box<dyn std::error::Error>> {
+    let username = register_state.username.clone();
+    let email = register_state.email.clone();
+    // Handle optional passwords: send None if empty, Some(value) otherwise
+    let password = if register_state.password.is_empty() {
+        None
+    } else {
+        Some(register_state.password.clone())
+    };
+    let password_confirmation = if register_state.password_confirmation.is_empty() {
+        None
+    } else {
+        Some(register_state.password_confirmation.clone())
+    };
+    let role = if register_state.role.is_empty() {
+        None
+    } else {
+        Some(register_state.role.clone())
+    };
+
+    // Basic client-side validation (example)
+    if username.is_empty() {
+         app_state.show_dialog(
+            "Registration Failed",
+            "Username cannot be empty.",
+            vec!["OK".to_string()],
+            DialogPurpose::RegisterFailed,
+        );
+        register_state.error_message = Some("Username cannot be empty.".to_string());
+        return Ok("Registration failed: Username cannot be empty.".to_string());
+    }
+    if password.is_some() && password != password_confirmation {
+         app_state.show_dialog(
+            "Registration Failed",
+            "Passwords do not match.",
+            vec!["OK".to_string()],
+            DialogPurpose::RegisterFailed,
+        );
+        register_state.error_message = Some("Passwords do not match.".to_string());
+        return Ok("Registration failed: Passwords do not match.".to_string());
+    }
+
+
+    // Clear previous error/dialog state before attempting
+    register_state.error_message = None;
+    app_state.hide_dialog();
+
+    // Call the gRPC register method
+    match auth_client.register(username, email, password, password_confirmation, role).await {
+        Ok(response) => {
+            // Clear fields on success? Optional, maybe wait for dialog confirmation.
+            // register_state.username.clear();
+            // register_state.email.clear();
+            // register_state.password.clear();
+            // register_state.password_confirmation.clear();
+            register_state.set_has_unsaved_changes(false);
+
+            let success_message = format!(
+                "Registration Successful!\n\n\
+                 User ID: {}\n\
+                 Username: {}\n\
+                 Email: {}\n\
+                 Role: {}",
+                response.id,
+                response.username,
+                response.email,
+                response.role
+            );
+
+            // Show success dialog
+            app_state.show_dialog(
+                "Registration Success",
+                &success_message,
+                vec!["OK".to_string()], // Simple OK for now
+                DialogPurpose::RegisterSuccess,
+            );
+
+            Ok("Registration successful, details shown in dialog.".to_string())
+        }
+        Err(e) => {
+            let error_message = format!("{}", e);
+            register_state.error_message = Some(error_message.clone());
+            register_state.set_has_unsaved_changes(true); // Keep changes on error
+
+            // Show error dialog
+            app_state.show_dialog(
+                "Registration Failed",
+                &error_message,
+                vec!["OK".to_string()],
+                DialogPurpose::RegisterFailed,
+            );
+
+            Ok(format!("Registration failed: {}", error_message))
+        }
+    }
+}
+
+/// Clears the registration form fields.
+pub async fn revert(
+    register_state: &mut RegisterState,
+    _app_state: &mut AppState, // Keep signature consistent if needed elsewhere
+) -> String {
+    register_state.username.clear();
+    register_state.email.clear();
+    register_state.password.clear();
+    register_state.password_confirmation.clear();
+    register_state.role.clear();
+    register_state.error_message = None;
+    register_state.set_has_unsaved_changes(false);
+    register_state.current_field = 0; // Reset focus to first field
+    register_state.current_cursor_pos = 0;
+    "Registration form cleared".to_string()
+}
+
+/// Clears the form and returns to the intro screen.
+pub async fn back_to_login(
+    register_state: &mut RegisterState,
+    app_state: &mut AppState,
+    buffer_state: &mut BufferState,
+) -> String {
+    // Clear fields first
+    let _ = revert(register_state, app_state).await;
+
+    // Ensure dialog is hidden
+    app_state.hide_dialog();
+
+    // Navigation logic
+    buffer_state.close_active_buffer();
+    buffer_state.update_history(AppView::Login);
+
+    // Reset focus state
+    app_state.ui.focus_outside_canvas = false;
+    app_state.focused_button_index = 0;
+
+    "Returned to main menu".to_string()
+}
+
--- a/client/src/tui/functions/form.rs
+++ b/client/src/tui/functions/form.rs
@@ -0,0 +1,89 @@
+// src/tui/functions/form.rs
+use crate::state::pages::form::FormState;
+use crate::services::grpc_client::GrpcClient;
+use crate::state::pages::canvas_state::CanvasState;
+
+pub async fn handle_action(
+    action: &str,
+    form_state: &mut FormState,
+    grpc_client: &mut GrpcClient,
+    current_position: &mut u64,
+    total_count: u64,
+    ideal_cursor_column: &mut usize,
+) -> Result<String, Box<dyn std::error::Error>> {
+            // TODO store unsaved changes without deleting form state values
+    // First check for unsaved changes in both cases
+    if form_state.has_unsaved_changes() {
+        return Ok(
+            "Unsaved changes. Save (Ctrl+S) or Revert (Ctrl+R) before navigating."
+                .to_string(),
+        );
+    }
+
+    match action {
+        "previous_entry" => {
+            let new_position = current_position.saturating_sub(1);
+            if new_position >= 1 {
+                *current_position = new_position;
+                let response = grpc_client.get_adresar_by_position(*current_position).await?;
+
+                // Direct field assignments
+                form_state.id = response.id;
+                form_state.values = vec![
+                    response.firma, response.kz, response.drc,
+                    response.ulica, response.psc, response.mesto,
+                    response.stat, response.banka, response.ucet,
+                    response.skladm, response.ico, response.kontakt,
+                    response.telefon, response.skladu, response.fax,
+                ];
+
+                let current_input = form_state.get_current_input();
+                let max_cursor_pos = if !current_input.is_empty() {
+                    current_input.len() - 1
+                } else { 0 };
+                form_state.current_cursor_pos = std::cmp::min(*ideal_cursor_column, max_cursor_pos);
+                form_state.has_unsaved_changes = false;
+
+                Ok(format!("Loaded form entry {}", *current_position))
+            } else {
+                Ok("Already at first form entry".into())
+            }
+        }
+        "next_entry" => {
+            if *current_position <= total_count {
+                *current_position += 1;
+                if *current_position <= total_count {
+                    let response = grpc_client.get_adresar_by_position(*current_position).await?;
+
+                    // Direct field assignments
+                    form_state.id = response.id;
+                    form_state.values = vec![
+                        response.firma, response.kz, response.drc,
+                        response.ulica, response.psc, response.mesto,
+                        response.stat, response.banka, response.ucet,
+                        response.skladm, response.ico, response.kontakt,
+                        response.telefon, response.skladu, response.fax,
+                    ];
+
+                    let current_input = form_state.get_current_input();
+                    let max_cursor_pos = if !current_input.is_empty() {
+                        current_input.len() - 1
+                    } else { 0 };
+                    form_state.current_cursor_pos = std::cmp::min(*ideal_cursor_column, max_cursor_pos);
+                    form_state.has_unsaved_changes = false;
+
+                    Ok(format!("Loaded form entry {}", *current_position))
+                } else {
+                    form_state.reset_to_empty();
+                    form_state.current_field = 0;
+                    form_state.current_cursor_pos = 0;
+                    *ideal_cursor_column = 0;
+                    Ok("New form entry mode".into())
+                }
+            } else {
+                Ok("Already at last entry".into())
+            }
+        }
+        _ => Err("Unknown form action".into())
+    }
+}            
--- a/client/src/tui/functions/intro.rs
+++ b/client/src/tui/functions/intro.rs
@@ -0,0 +1,33 @@
+// src/tui/functions/intro.rs
+use crate::state::app::state::AppState;
+use crate::state::app::buffer::{AppView, BufferState};
+
+/// Handles intro screen selection by updating view history and managing focus state.
+/// 0: Continue (restores last form or default)
+/// 1: Admin view
+/// 2: Login view
+/// 3: Register view (with focus reset)
+pub fn handle_intro_selection(
+    app_state: &mut AppState,
+    buffer_state: &mut BufferState,
+    index: usize,
+) {
+    let target_view = match index {
+        0 => {
+            let form_name = app_state.selected_profile.clone().unwrap_or_else(|| "Data Form".to_string());
+            AppView::Form(form_name)
+        }
+        1 => AppView::Admin,
+        2 => AppView::Login,
+        3 => AppView::Register,
+        _ => return,
+    };
+
+    buffer_state.update_history(target_view);
+    
+    // Register view requires focus reset
+    if index == 3 {
+        app_state.ui.focus_outside_canvas = false;
+        app_state.focused_button_index = 0;
+    }
+}
--- a/client/src/tui/functions/login.rs
+++ b/client/src/tui/functions/login.rs
@@ -0,0 +1,13 @@
+// src/tui/functions/login.rs
+
+pub async fn handle_action(action: &str,) -> Result<String, Box<dyn std::error::Error>> {
+    match action {
+        "previous_entry" => {
+            Ok("Previous entry at tui/functions/login.rs not implemented".into())
+        }
+        "next_entry" => {
+            Ok("Next entry at tui/functions/login.rs not implemented".into())
+        }
+        _ => Err("Unknown login action".into())
+    }
+}
--- a/client/src/tui/mod.rs
+++ b/client/src/tui/mod.rs
@@ -1,2 +1,5 @@
 // src/tui/mod.rs
 pub mod terminal;
+pub mod functions;
+
+pub use functions::*;
--- a/client/src/tui/terminal.rs
+++ b/client/src/tui/terminal.rs
@@ -1,11 +1,7 @@
 // src/tui/terminal.rs

 pub mod core;
-pub mod grpc_client;
-pub mod commands;
 pub mod event_reader;

 pub use core::TerminalCore;
-pub use grpc_client::GrpcClient;
-pub use commands::CommandHandler;
 pub use event_reader::EventReader;
--- a/client/src/tui/terminal/commands.rs
+++ b/client/src/tui/terminal/commands.rs
@@ -1,46 +0,0 @@
-// src/tui/terminal/commands.rs
-
-use crate::tui::terminal::core::TerminalCore;
-
-pub struct CommandHandler {
-    is_saved: bool,
-}
-
-impl CommandHandler {
-    pub fn new() -> Self {
-        Self { is_saved: false }
-    }
-
-    pub async fn handle_command(
-        &mut self,
-        action: &str,
-        terminal: &mut TerminalCore,
-    ) -> Result<(bool, String), Box<dyn std::error::Error>> {
-        match action {
-            "quit" => self.handle_quit(terminal).await,
-            "force_quit" => self.handle_force_quit(terminal).await,
-            "save_and_quit" => self.handle_save_quit(terminal).await,
-            _ => Ok((false, format!("Unknown command: {}", action))),
-        }
-    }
-
-    async fn handle_quit(&self, terminal: &mut TerminalCore) -> Result<(bool, String), Box<dyn std::error::Error>> {
-        if self.is_saved {
-            terminal.cleanup()?;
-            Ok((true, "Exiting.".into()))
-        } else {
-            Ok((false, "No changes saved. Use :q! to force quit.".into()))
-        }
-    }
-
-    async fn handle_force_quit(&self, terminal: &mut TerminalCore) -> Result<(bool, String), Box<dyn std::error::Error>> {
-        terminal.cleanup()?;
-        Ok((true, "Force exiting without saving.".into()))
-    }
-
-    async fn handle_save_quit(&mut self, terminal: &mut TerminalCore) -> Result<(bool, String), Box<dyn std::error::Error>> {
-        self.is_saved = true;
-        terminal.cleanup()?;
-        Ok((true, "State saved. Exiting.".into()))
-    }
-}
--- a/client/src/tui/terminal/core.rs
+++ b/client/src/tui/terminal/core.rs
@@ -3,7 +3,7 @@
 use crossterm::{
    execute,
    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
-    cursor::{SetCursorStyle, EnableBlinking, Show, MoveTo},
+    cursor::{SetCursorStyle, EnableBlinking, Show, Hide, MoveTo},
 };
 use ratatui::{backend::CrosstermBackend, Terminal};
 use std::io::{self, stdout, Write};
@@ -64,6 +64,22 @@ impl TerminalCore {
        )?;
        Ok(())
    }
+
+    pub fn show_cursor(&mut self) -> Result<(), Box<dyn std::error::Error>> {
+        execute!(
+            self.terminal.backend_mut(),
+            Show
+        )?;
+        Ok(())
+    }
+
+    pub fn hide_cursor(&mut self) -> Result<(), Box<dyn std::error::Error>> {
+        execute!(
+            self.terminal.backend_mut(),
+            Hide
+        )?;
+        Ok(())
+    }
 }

 impl Drop for TerminalCore {
--- a/client/src/ui/handlers.rs
+++ b/client/src/ui/handlers.rs
@@ -1,9 +1,10 @@
 // src/client/ui/handlers.rs

 pub mod ui;
-pub mod form;
 pub mod render;
 pub mod rat_state;
+pub mod context;

 pub use ui::run_ui;
 pub use rat_state::*;
+pub use context::*;
--- a/client/src/ui/handlers/context.rs
+++ b/client/src/ui/handlers/context.rs
@@ -0,0 +1,22 @@
+// src/ui/handlers/context.rs
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum UiContext {
+    Intro,
+    Login,
+    Register,
+    Admin,
+    Dialog,
+}
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum DialogPurpose {
+    LoginSuccess,
+    LoginFailed,
+    RegisterSuccess,
+    RegisterFailed,
+    ConfirmDeleteColumns, // add_table delete selected Columns
+    // TODO in the future:
+    // ConfirmQuit,
+}
+
--- a/client/src/ui/handlers/form.rs
+++ b/client/src/ui/handlers/form.rs
@@ -1,73 +0,0 @@
-// src/client/ui/handlers/form.rs
-use crate::config::colors::themes::Theme;
-use ratatui::layout::Rect;
-use ratatui::Frame;
-
-pub struct FormState {
-    pub id: i64,
-    pub fields: Vec<String>, // Use Vec<String> for dynamic field names
-    pub values: Vec<String>, // Store field values dynamically
-    pub current_field: usize,
-    pub has_unsaved_changes: bool,
-    pub current_cursor_pos: usize,
-}
-
-impl FormState {
-    /// Create a new FormState with dynamic fields.
-    pub fn new(fields: Vec<String>) -> Self {
-        let values = vec![String::new(); fields.len()]; // Initialize values for each field
-        FormState {
-            id: 0,
-            fields,
-            values,
-            current_field: 0,
-            has_unsaved_changes: false,
-            current_cursor_pos: 0,
-        }
-    }
-
-    pub fn render(
-        &self,
-        f: &mut Frame,
-        area: Rect,
-        theme: &Theme,
-        is_edit_mode: bool,
-        total_count: u64,
-        current_position: u64,
-    ) {
-        let fields: Vec<&str> = self.fields.iter().map(|s| s.as_str()).collect();
-        let values: Vec<&String> = self.values.iter().collect();
-
-        crate::components::handlers::form::render_form(
-            f,
-            area,
-            self,
-            &fields,
-            &self.current_field,
-            &values,
-            theme,
-            is_edit_mode,
-            total_count,
-            current_position,
-        );
-    }
-
-    pub fn reset_to_empty(&mut self) {
-        self.id = 0; // Reset ID to 0 for new entries
-        self.values.iter_mut().for_each(|v| v.clear()); // Clear all values
-        self.has_unsaved_changes = false;
-    }
-
-    pub fn get_current_input(&self) -> &str {
-        self.values
-            .get(self.current_field)
-            .map(|s| s.as_str())
-            .unwrap_or("")
-    }
-
-    pub fn get_current_input_mut(&mut self) -> &mut String {
-        self.values
-            .get_mut(self.current_field)
-            .expect("Invalid current_field index")
-    }
-}
--- a/client/src/ui/handlers/rat_state.rs
+++ b/client/src/ui/handlers/rat_state.rs
@@ -1,7 +1,7 @@
 // src/ui/handlers/rat_state.rs
 use crossterm::event::{KeyCode, KeyModifiers};
 use crate::config::binds::config::Config;
-use crate::state::state::UiState;
+use crate::state::app::state::UiState;

 pub struct UiStateHandler;

@@ -21,4 +21,18 @@ impl UiStateHandler {
        false
    }
    
+   pub fn toggle_buffer_list(
+       ui_state: &mut UiState,
+       config: &Config,
+       key: KeyCode,
+       modifiers: KeyModifiers,
+   ) -> bool {
+       if let Some(action) = config.get_common_action(key, modifiers) {
+           if action == "toggle_buffer_list" {
+               ui_state.show_buffer_list = !ui_state.show_buffer_list;
+               return true;
+           }
+       }
+       false
+   }
 }
--- a/client/src/ui/handlers/render.rs
+++ b/client/src/ui/handlers/render.rs
@@ -2,74 +2,133 @@

 use crate::components::{
    render_background,
+    render_buffer_list,
    render_command_line,
    render_status_line,
-    handlers::{sidebar::{self, calculate_sidebar_layout}, form::render_form},
-    intro::{intro},
-    admin::{admin_panel::AdminPanelState},
+    intro::intro::render_intro,
+    handlers::sidebar::{self, calculate_sidebar_layout},
+    form::form::render_form,
+    admin::render_add_table,
+    auth::{login::render_login, register::render_register},
 };
 use crate::config::colors::themes::Theme;
 use ratatui::layout::{Constraint, Direction, Layout};
 use ratatui::Frame;
-use super::form::FormState;
-use crate::state::state::AppState;
+use crate::state::pages::form::FormState;
+use crate::state::pages::auth::AuthState;
+use crate::state::pages::auth::LoginState;
+use crate::state::pages::auth::RegisterState;
+use crate::state::pages::intro::IntroState;
+use crate::state::app::buffer::BufferState;
+use crate::state::app::state::AppState;
+use crate::state::pages::admin::AdminState;
+use crate::state::app::highlight::HighlightState;

 pub fn render_ui(
    f: &mut Frame,
    form_state: &mut FormState,
+    auth_state: &mut AuthState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
+    intro_state: &IntroState,
+    admin_state: &mut AdminState,
+    buffer_state: &BufferState,
    theme: &Theme,
    is_edit_mode: bool,
+    highlight_state: &HighlightState,
    total_count: u64,
    current_position: u64,
    current_dir: &str,
    command_input: &str,
    command_mode: bool,
    command_message: &str,
+    current_fps: f64,
    app_state: &AppState,
-    intro_state: &intro::IntroState,
 ) {
    render_background(f, f.area(), theme);

+    // Adjust layout based on whether buffer list is shown
+    let constraints = if app_state.ui.show_buffer_list {
+        vec![
+            Constraint::Length(1),   // Buffer list
+            Constraint::Min(1),      // Main content
+            Constraint::Length(1),   // Status line
+            Constraint::Length(1),   // Command line
+        ]
+    } else {
+        vec![
+            Constraint::Min(1),      // Main content
+            Constraint::Length(1),   // Status line (no buffer list)
+            Constraint::Length(1),   // Command line
+        ]
+    };
+
    let root = Layout::default()
        .direction(Direction::Vertical)
-        .constraints([
-            Constraint::Min(1),
-            Constraint::Length(1),
-            Constraint::Length(1),
-        ])
+        .constraints(constraints)
        .split(f.area());

-    let main_content_area = root[0];
+    let mut buffer_list_area = None;
+    let main_content_area;
+    let status_line_area;
+    let command_line_area;
+
+    // Assign areas based on layout
+    if app_state.ui.show_buffer_list {
+        buffer_list_area = Some(root[0]);
+        main_content_area = root[1];
+        status_line_area = root[2];
+        command_line_area = root[3];
+    } else {
+        main_content_area = root[0];
+        status_line_area = root[1];
+        command_line_area = root[2];
+    }
+
    if app_state.ui.show_intro {
-        intro_state.render(f, main_content_area, theme);
-    } else if app_state.ui.show_admin {
-        // Create temporary AdminPanelState for rendering
-        let mut admin_state = AdminPanelState::new(
-            if app_state.admin_profiles.is_empty() {
-                // Fallback if admin_profiles is empty
-                app_state.profile_tree.profiles
-                    .iter()
-                    .map(|p| p.name.clone())
-                    .collect()
-            } else {
-                app_state.admin_profiles.clone()
-            }
-        );
-
-        // Set the selected item
-        if !admin_state.profiles.is_empty() {
-            let safe_index = app_state.admin_selected_item.min(admin_state.profiles.len() - 1);
-            admin_state.list_state.select(Some(safe_index));
-        }
-
-        admin_state.render(
+        render_intro(f, intro_state, main_content_area, theme);
+    } else if app_state.ui.show_register {
+        render_register(
            f,
            main_content_area,
            theme,
-            &app_state.profile_tree, 
+            register_state,
+            app_state,
+            register_state.current_field < 4,
+            highlight_state,
+        );
+    } else if app_state.ui.show_add_table {
+        render_add_table(
+            f,
+            main_content_area,
+            theme,
+            app_state,
+            &mut admin_state.add_table_state,
+            login_state.current_field < 3,
+            highlight_state,
+        );
+    } else if app_state.ui.show_login {
+        render_login(
+            f,
+            main_content_area,
+            theme,
+            login_state,
+            app_state,
+            login_state.current_field < 2,
+            highlight_state,
+        );
+    } else if app_state.ui.show_admin {
+        crate::components::admin::admin_panel::render_admin_panel(
+            f,
+            app_state,
+            auth_state,
+            admin_state,
+            main_content_area,
+            theme,
+            &app_state.profile_tree,
            &app_state.selected_profile,
        );
-    } else {
+    } else if app_state.ui.show_form {
        let (sidebar_area, form_area) = calculate_sidebar_layout(
            app_state.ui.show_sidebar,
            main_content_area
@@ -77,11 +136,11 @@ pub fn render_ui(

        if let Some(sidebar_rect) = sidebar_area {
            sidebar::render_sidebar(
-                f, 
-                sidebar_rect, 
-                theme, 
-                &app_state.profile_tree, 
-                &app_state.selected_profile  // Remove trailing comma
+                f,
+                sidebar_rect,
+                theme,
+                &app_state.profile_tree,
+                &app_state.selected_profile
            );
        }

@@ -122,11 +181,18 @@ pub fn render_ui(
            &values,
            theme,
            is_edit_mode,
+            highlight_state,
            total_count,
            current_position,
        );
    }

-    render_status_line(f, root[1], current_dir, theme, is_edit_mode);
-    render_command_line(f, root[2], command_input, command_mode, theme, command_message);
+    // Render buffer list if enabled and area is available
+    if let Some(area) = buffer_list_area {
+        if app_state.ui.show_buffer_list {
+            render_buffer_list(f, area, theme, buffer_state);
+        }
+    }
+    render_status_line(f, status_line_area, current_dir, theme, is_edit_mode, current_fps);
+    render_command_line(f, command_line_area, command_input, command_mode, theme, command_message);
 }
--- a/client/src/ui/handlers/ui.rs
+++ b/client/src/ui/handlers/ui.rs
@@ -1,172 +1,365 @@
 // src/ui/handlers/ui.rs

-use crate::tui::terminal::TerminalCore;
-use crate::tui::terminal::GrpcClient;
-use crate::tui::terminal::CommandHandler;
-use crate::tui::terminal::EventReader;
-use crate::config::colors::themes::Theme;
 use crate::config::binds::config::Config;
-use crate::ui::handlers::{form::FormState, render::render_ui};
-use crate::modes::handlers::event::EventHandler;
-use crate::state::state::AppState;
-use crate::components::admin::{admin_panel::AdminPanelState};
-use crate::components::intro::{intro::IntroState};
+use crate::config::colors::themes::Theme;
+use crate::services::grpc_client::GrpcClient;
+use crate::services::auth::AuthClient; // <-- Add AuthClient import
+use crate::services::ui_service::UiService;
+use crate::modes::common::commands::CommandHandler;
+use crate::modes::handlers::event::{EventHandler, EventOutcome};
+use crate::modes::handlers::mode_manager::{AppMode, ModeManager};
+use crate::state::pages::canvas_state::CanvasState;
+use crate::state::pages::form::FormState;
+use crate::state::pages::auth::AuthState;
+use crate::state::pages::auth::LoginState;
+use crate::state::pages::auth::RegisterState;
+use crate::state::pages::admin::AdminState;
+use crate::state::pages::intro::IntroState;
+use crate::state::app::buffer::BufferState;
+use crate::state::app::buffer::AppView;
+use crate::state::app::state::AppState;
+use crate::ui::handlers::context::DialogPurpose; // <-- Add DialogPurpose import
+// Import SaveOutcome
+use crate::tui::terminal::{EventReader, TerminalCore};
+use crate::ui::handlers::render::render_ui;
+use crate::tui::functions::common::login; // <-- Add login module import
+use std::time::Instant;
+use crossterm::cursor::SetCursorStyle;
+use crossterm::event as crossterm_event;
+use tracing::{info, error};

 pub async fn run_ui() -> Result<(), Box<dyn std::error::Error>> {
    let config = Config::load()?;
+    let theme = Theme::from_str(&config.colors.theme);
    let mut terminal = TerminalCore::new()?;
    let mut grpc_client = GrpcClient::new().await?;
    let mut command_handler = CommandHandler::new();
-    let theme = Theme::from_str(&config.colors.theme);
-    let mut intro_state = IntroState::new();

-    // Initialize app_state first
-    let mut app_state = AppState::new()?;
-
-    // Fetch profile tree and table structure
-    let profile_tree = grpc_client.get_profile_tree().await?;
-    app_state.profile_tree = profile_tree;
-
-    // Now create admin panel with profiles from app_state
-    if intro_state.selected_option == 1 {
-        app_state.ui.show_admin = true;
-        app_state.admin_profiles = app_state.profile_tree.profiles
-            .iter()
-            .map(|p| p.name.clone())
-            .collect();
-        app_state.admin_selected_item = 0;
-    }
-
-    // Fetch table structure at startup (one-time)
-    let table_structure = grpc_client.get_table_structure().await?;
-
-    // Extract the column names from the response
-    let column_names: Vec<String> = table_structure
-        .columns
-        .iter()
-        .map(|col| col.name.clone())
-        .collect();
-
-    // Initialize FormState with dynamic fields
-    let mut form_state = FormState::new(column_names);
-
-    // The rest of your UI initialization remains the same
-    let mut event_handler = EventHandler::new();
+    let mut event_handler = EventHandler::new().await?;
    let event_reader = EventReader::new();

+    let mut auth_state = AuthState::default();
+    let mut login_state = LoginState::default();
+    let mut register_state = RegisterState::default();
+    let mut intro_state = IntroState::default();
+    let mut admin_state = AdminState::default();
+    let mut buffer_state = BufferState::default();
+    let mut app_state = AppState::new()?;
+
+    // Initialize app state with profile tree and table structure
+    let column_names =
+        UiService::initialize_app_state(&mut grpc_client, &mut app_state)
+            .await?;
+    let mut form_state = FormState::new(column_names);
+
    // Fetch the total count of Adresar entries
-    let total_count = grpc_client.get_adresar_count().await?;
-    app_state.update_total_count(total_count);
-    app_state.update_current_position(total_count.saturating_add(1)); // Start in new entry mode
+    UiService::initialize_adresar_count(&mut grpc_client, &mut app_state)
+        .await?;
    form_state.reset_to_empty();

-    loop {
-        let total_count = grpc_client.get_adresar_count().await?;
-        app_state.update_total_count(total_count);
+    // --- FPS Calculation State ---
+    let mut last_frame_time = Instant::now();
+    let mut current_fps = 0.0;

+    loop {
+        // --- Synchronize UI View from Active Buffer ---
+        if let Some(active_view) = buffer_state.get_active_view() {
+            // Reset all flags first
+            app_state.ui.show_intro = false;
+            app_state.ui.show_login = false;
+            app_state.ui.show_register = false;
+            app_state.ui.show_admin = false;
+            app_state.ui.show_add_table = false;
+            app_state.ui.show_form = false;
+            match active_view {
+                AppView::Intro => app_state.ui.show_intro = true,
+                AppView::Login => app_state.ui.show_login = true,
+                AppView::Register => app_state.ui.show_register = true,
+                AppView::Admin => {
+                    app_state.ui.show_admin = true;
+                    let profile_names = app_state.profile_tree.profiles.iter()
+                        .map(|p| p.name.clone())
+                        .collect();
+                    admin_state.set_profiles(profile_names);
+                }
+                AppView::AddTable => app_state.ui.show_add_table = true,
+                AppView::Form(_) => app_state.ui.show_form = true,
+                AppView::Scratch => {} // Or show a scratchpad component
+            }
+        }
+        // --- End Synchronization ---
+
+        // --- 3. Draw UI ---
+        // Draw the current state *first*. This ensures the loading dialog
+        // set in the *previous* iteration gets rendered before the pending
+        // action check below.
        terminal.draw(|f| {
            render_ui(
                f,
                &mut form_state,
+                &mut auth_state,
+                &login_state,
+                &register_state,
+                &intro_state,
+                &mut admin_state,
+                &buffer_state,
                &theme,
-                event_handler.is_edit_mode,
+                event_handler.is_edit_mode, // Use event_handler's state
+                &event_handler.highlight_state,
                app_state.total_count,
                app_state.current_position,
                &app_state.current_dir,
                &event_handler.command_input,
                event_handler.command_mode,
                &event_handler.command_message,
+                current_fps,
                &app_state,
-                &intro_state,
            );
        })?;

+        // --- Cursor Visibility Logic ---
+        // (Keep existing cursor logic here - depends on state drawn above)
+        let current_mode = ModeManager::derive_mode(&app_state, &event_handler);
+        match current_mode {
+            AppMode::Edit => { terminal.show_cursor()?; }
+            AppMode::Highlight => { terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?; terminal.show_cursor()?; }
+            AppMode::ReadOnly => {
+                if !app_state.ui.focus_outside_canvas { terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?; }
+                else { terminal.set_cursor_style(SetCursorStyle::SteadyUnderScore)?; }
+                terminal.show_cursor()?;
+            }
+            AppMode::General => {
+                if app_state.ui.focus_outside_canvas { terminal.set_cursor_style(SetCursorStyle::SteadyUnderScore)?; terminal.show_cursor()?; }
+                else { terminal.hide_cursor()?; }
+            }
+            AppMode::Command => { terminal.set_cursor_style(SetCursorStyle::SteadyUnderScore)?; terminal.show_cursor()?; }
+        }
+        // --- End Cursor Visibility Logic ---
+
+        // --- 2. Check for Pending Login Action ---
+        if login_state.login_request_pending {
+            // Reset the flag *before* calling save
+            login_state.login_request_pending = false;
+
+            // Create AuthClient and call save
+            match AuthClient::new().await {
+                Ok(mut auth_client_instance) => {
+                    // Call the ORIGINAL save function from the login module
+                    let save_result = login::save(
+                        &mut auth_state,
+                        &mut login_state,
+                        &mut auth_client_instance, // Pass the new client instance
+                        &mut app_state,
+                    ).await;
+
+                    // Use tracing for logging the outcome
+                    match save_result {
+                        // save returns Result<String, Error>, Ok contains the message
+                        Ok(msg) => info!(message = %msg, "Login save result"), // Use tracing::info!
+                        Err(e) => error!(error = %e, "Error during login save"), // Use tracing::error!
+                    }
+                    // Note: save already handles showing the final dialog (success/failure)
+                }
+                Err(e) => {
+                    // Handle client connection error - show dialog directly
+                    // Ensure flag is already false here
+                    app_state.show_dialog( // Use show_dialog, not update_dialog_content
+                        "Login Failed",
+                        &format!("Connection Error: {}", e),
+                        vec!["OK".to_string()],
+                        DialogPurpose::LoginFailed, // Use appropriate purpose
+                    );
+                    login_state.error_message = Some(format!("Connection Error: {}", e));
+                    error!(error = %e, "Failed to create AuthClient"); // Use tracing::error!
+                }
+            }
+            // After save runs, the state (dialog content, etc.) is updated.
+            // The *next* iteration's draw call will show the final result.
+        } // --- End Pending Login Check ---
+
        let total_count = app_state.total_count;
        let mut current_position = app_state.current_position;
+        let position_before_event = current_position;

-        let event = event_reader.read_event()?;
-        let (should_exit, message) = event_handler.handle_event(
-            event,
-            &config,
-            &mut terminal,
-            &mut grpc_client,
-            &mut command_handler,
-            &mut form_state,
-            &mut app_state,
-            total_count,
-            &mut current_position,
-            &mut intro_state,
-        ).await?;
-
-        app_state.current_position = current_position;
-
-        // Handle position changes and update form state
-        if !event_handler.is_edit_mode {
-            let current_input = form_state.get_current_input();
-            let max_cursor_pos = if !current_input.is_empty() {
-                current_input.len() - 1  // Limit to last character in readonly mode
-            } else {
-                0
-            };
-            form_state.current_cursor_pos = event_handler.ideal_cursor_column.min(max_cursor_pos);
-
-            // Ensure position never exceeds total_count + 1
-            if app_state.current_position > total_count + 1 {
-                app_state.current_position = total_count + 1;
-            }
-            if app_state.current_position > total_count {
-                // New entry - reset form
-                form_state.reset_to_empty();
-                form_state.current_field = 0;
-            } else if app_state.current_position >= 1 && app_state.current_position <= total_count {
-                // Existing entry - load data
-                match grpc_client.get_adresar_by_position(app_state.current_position).await {
-                    Ok(response) => {
-                        // Set the ID properly
-                        form_state.id = response.id;
-
-                        // Update form values dynamically
-                        form_state.values = vec![
-                            response.firma,
-                            response.kz,
-                            response.drc,
-                            response.ulica,
-                            response.psc,
-                            response.mesto,
-                            response.stat,
-                            response.banka,
-                            response.ucet,
-                            response.skladm,
-                            response.ico,
-                            response.kontakt,
-                            response.telefon,
-                            response.skladu,
-                            response.fax,
-                        ];
-
-                        let current_input = form_state.get_current_input();
-                        let max_cursor_pos = if !event_handler.is_edit_mode && !current_input.is_empty() {
-                            current_input.len() - 1  // In readonly mode, limit to last character
-                        } else {
-                            current_input.len()
-                        };
-                        form_state.current_cursor_pos = event_handler.ideal_cursor_column.min(max_cursor_pos);
-                        form_state.has_unsaved_changes = false;
-                        event_handler.command_message = format!("Loaded entry {}", app_state.current_position);
-                    }
-                    Err(e) => {
-                        event_handler.command_message = format!("Error loading entry: {}", e);
-                    }
-                }
-            } else {
-                // Invalid position - reset to first entry
-                app_state.current_position = 1;
-            }
+        // --- 1. Handle Terminal Events ---
+        let mut event_outcome_result = Ok(EventOutcome::Ok(String::new()));
+        // Poll for events *after* drawing and checking pending actions
+        if crossterm_event::poll(std::time::Duration::from_millis(20))? {
+            let event = event_reader.read_event()?;
+            event_outcome_result = event_handler
+                .handle_event(
+                    event,
+                    &config,
+                    &mut terminal,
+                    &mut grpc_client,
+                    &mut command_handler,
+                    &mut form_state,
+                    &mut auth_state,
+                    &mut login_state,
+                    &mut register_state,
+                    &mut intro_state,
+                    &mut admin_state,
+                    &mut buffer_state,
+                    &mut app_state,
+                    total_count,
+                    &mut current_position,
+                )
+                .await;
        }

-        event_handler.command_message = message;
+        // Update position based on handler's modification
+        // This happens *after* the event is handled
+        app_state.current_position = current_position;
+
+        // --- Centralized Consequence Handling ---
+        let mut should_exit = false;
+        match event_outcome_result {
+            Ok(outcome) => match outcome {
+                EventOutcome::Ok(message) => {
+                    if !message.is_empty() {
+                        // Update command message only if event handling produced one
+                        // Avoid overwriting messages potentially set by pending actions
+                        // event_handler.command_message = message;
+                    }
+                }
+                EventOutcome::Exit(message) => {
+                    event_handler.command_message = message;
+                    should_exit = true;
+                }
+                EventOutcome::DataSaved(save_outcome, message) => {
+                    event_handler.command_message = message; // Show save status
+                    if let Err(e) = UiService::handle_save_outcome(
+                        save_outcome,
+                        &mut grpc_client,
+                        &mut app_state,
+                        &mut form_state,
+                    )
+                    .await
+                    {
+                        event_handler.command_message =
+                            format!("Error handling save outcome: {}", e);
+                    }
+                }
+                EventOutcome::ButtonSelected { context: _, index: _ } => {
+                    // This case should ideally be fully handled within handle_event
+                    // If initiate_login was called, it returned early.
+                    // If not, the message was set and returned via Ok(message).
+                    // Log if necessary, but likely no action needed here.
+                    // log::warn!("ButtonSelected outcome reached main loop unexpectedly.");
+                }
+            },
+            Err(e) => {
+                event_handler.command_message = format!("Error: {}", e);
+            }
+        } // --- End Consequence Handling ---
+
+        // --- Position Change Handling (after outcome processing and pending actions) ---
+        let position_changed = app_state.current_position != position_before_event;
+        let current_total_count = app_state.total_count;
+        if app_state.ui.show_form {
+            if position_changed && !event_handler.is_edit_mode {
+                let current_input = form_state.get_current_input();
+                let max_cursor_pos = if !current_input.is_empty() {
+                    current_input.len() - 1 // Limit to last character in readonly mode
+                } else {
+                    0
+                };
+                form_state.current_cursor_pos =
+                    event_handler.ideal_cursor_column.min(max_cursor_pos);
+
+                // Ensure position never exceeds total_count + 1
+                if app_state.current_position > current_total_count + 1 {
+                    app_state.current_position = current_total_count + 1;
+                }
+                if app_state.current_position > current_total_count {
+                    // New entry - reset form
+                    form_state.reset_to_empty();
+                    form_state.current_field = 0;
+                } else if app_state.current_position >= 1
+                    && app_state.current_position <= current_total_count
+                {
+                    // Existing entry - load data
+                    let current_position_to_load = app_state.current_position; // Use a copy
+                    let load_message = UiService::load_adresar_by_position(
+                        &mut grpc_client,
+                        &mut app_state, // Pass app_state mutably if needed by the service
+                        &mut form_state,
+                        current_position_to_load,
+                    )
+                    .await?;
+
+                    let current_input = form_state.get_current_input();
+                    let max_cursor_pos = if !event_handler.is_edit_mode
+                        && !current_input.is_empty()
+                    {
+                        current_input.len() - 1 // In readonly mode, limit to last character
+                    } else {
+                        current_input.len()
+                    };
+                    form_state.current_cursor_pos = event_handler
+                        .ideal_cursor_column
+                        .min(max_cursor_pos);
+                    // Don't overwrite message from handle_event if load_message is simple success
+                    if !load_message.starts_with("Loaded entry")
+                        || event_handler.command_message.is_empty()
+                    {
+                        event_handler.command_message = load_message;
+                    }
+                } else {
+                    // Invalid position (e.g., 0) - reset to first entry or new entry mode
+                    app_state.current_position =
+                        1.min(current_total_count + 1); // Go to 1 or new entry if empty
+                    if app_state.current_position > total_count {
+                        form_state.reset_to_empty();
+                        form_state.current_field = 0;
+                    }
+                }
+            } else if !position_changed && !event_handler.is_edit_mode {
+                // If position didn't change but we are in read-only, just adjust cursor
+                let current_input = form_state.get_current_input();
+                let max_cursor_pos = if !current_input.is_empty() {
+                    current_input.len() - 1
+                } else {
+                    0
+                };
+                form_state.current_cursor_pos =
+                    event_handler.ideal_cursor_column.min(max_cursor_pos);
+            }
+        } else if app_state.ui.show_register {
+             if !event_handler.is_edit_mode {
+                let current_input = register_state.get_current_input();
+                let max_cursor_pos = if !current_input.is_empty() {
+                    current_input.len() - 1
+                } else {
+                    0
+                };
+                register_state.current_cursor_pos = event_handler.ideal_cursor_column.min(max_cursor_pos);
+            }
+        } else if app_state.ui.show_login {
+             if !event_handler.is_edit_mode {
+                let current_input = login_state.get_current_input();
+                let max_cursor_pos = if !current_input.is_empty() {
+                    current_input.len() - 1
+                } else {
+                    0
+                };
+                login_state.current_cursor_pos = event_handler.ideal_cursor_column.min(max_cursor_pos);
+            }
+        }
+        // --- End Position Change Handling ---
+
+        // Check exit condition *after* all processing for the iteration
        if should_exit {
            return Ok(());
        }
-    }
+
+        // --- FPS Calculation ---
+        let now = Instant::now();
+        let frame_duration = now.duration_since(last_frame_time);
+        last_frame_time = now;
+        if frame_duration.as_secs_f64() > 1e-6 {
+            current_fps = 1.0 / frame_duration.as_secs_f64();
+        }
+    } // End main loop
 }
+
--- a/common/build.rs
+++ b/common/build.rs
@@ -8,6 +8,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
            &[
                "proto/common.proto",
                "proto/adresar.proto",
+                "proto/auth.proto",
                "proto/uctovnictvo.proto",
                "proto/table_structure.proto",
                "proto/table_definition.proto",
--- a/common/proto/auth.proto
+++ b/common/proto/auth.proto
@@ -0,0 +1,39 @@
+// proto/auth.proto
+syntax = "proto3";
+package multieko2.auth;
+
+import "common.proto";
+
+service AuthService {
+    rpc Register(RegisterRequest) returns (AuthResponse);
+    rpc Login(LoginRequest) returns (LoginResponse);
+}
+
+message RegisterRequest {
+    string username = 1;
+    string email = 2;
+    string password = 3;
+    string password_confirmation = 4;
+    string role = 5;
+}
+
+message AuthResponse {
+    string id = 1;           // UUID in string format
+    string username = 2;     // Registered username
+    string email = 3;        // Registered email (if provided)
+    string role = 4;         // Default role: 'accountant'
+}
+
+message LoginRequest {
+    string identifier = 1;   // Can be username or email
+    string password = 2;
+}
+
+message LoginResponse {
+    string access_token = 1;   // JWT token
+    string token_type = 2;     // Usually "Bearer"
+    int32 expires_in = 3;      // Expiration in seconds (86400 for 24 hours)
+    string user_id = 4;        // User's UUID in string format
+    string role = 5;           // User's role
+    string username = 6;
+}
--- a/common/src/lib.rs
+++ b/common/src/lib.rs
@@ -4,6 +4,9 @@ pub mod proto {
        pub mod adresar {
            include!("proto/multieko2.adresar.rs");
        }
+        pub mod auth {
+            include!("proto/multieko2.auth.rs");
+        }
        pub mod common {
            include!("proto/multieko2.common.rs");
        }
--- a/Show More
+++ b/Show More