From f9c9467e6cd8ba10457bc11d3c535fdf621d6248 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nicol=C3=A1s=20Hatcher?= <nicolas@theuniverse.today>
Date: Wed, 26 Feb 2025 23:22:05 +0100
Subject: [PATCH] FIX: Correct height/width of cells with different font sizes

---
 base/src/test/user_model/test_row_column.rs   |  2 +-
 base/src/user_model/common.rs                 | 10 ++++++---
 .../WorksheetCanvas/worksheetCanvas.ts        | 22 +++++++++++--------
 3 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/base/src/test/user_model/test_row_column.rs b/base/src/test/user_model/test_row_column.rs
index 4125a2e..b667ebd 100644
--- a/base/src/test/user_model/test_row_column.rs
+++ b/base/src/test/user_model/test_row_column.rs
@@ -170,7 +170,7 @@ fn row_heigh_increases_automatically() {
     model
         .set_user_input(0, 1, 1, "My home in Canada had horses\nAnd monkeys!")
         .unwrap();
-    assert_eq!(model.get_row_height(0, 1), Ok(2.0 * DEFAULT_ROW_HEIGHT));
+    assert_eq!(model.get_row_height(0, 1), Ok(40.5));
 }
 
 #[test]
diff --git a/base/src/user_model/common.rs b/base/src/user_model/common.rs
index 89b274e..0b4b172 100644
--- a/base/src/user_model/common.rs
+++ b/base/src/user_model/common.rs
@@ -6,7 +6,7 @@ use csv::{ReaderBuilder, WriterBuilder};
 use serde::{Deserialize, Serialize};
 
 use crate::{
-    constants::{self, DEFAULT_ROW_HEIGHT, LAST_COLUMN, LAST_ROW},
+    constants::{self, LAST_COLUMN, LAST_ROW},
     expressions::{
         types::{Area, CellReferenceIndex},
         utils::{is_valid_column_number, is_valid_row},
@@ -430,10 +430,14 @@ impl UserModel {
             new_value: value.to_string(),
             old_value: Box::new(old_value),
         }];
+        let style = self.model.get_style_for_cell(sheet, row, column)?;
 
-        let line_count = value.split('\n').count();
+        let line_count = value.split('\n').count() as f64;
         let row_height = self.model.get_row_height(sheet, row)?;
-        let cell_height = (line_count as f64) * DEFAULT_ROW_HEIGHT;
+        // This is in sync with the front-end auto fit row
+        let font_size = style.font.sz as f64;
+        let line_height = font_size * 1.5;
+        let cell_height = (line_count - 1.0) * line_height + 8.0 + font_size;
         if cell_height > row_height {
             diff_list.push(Diff::SetRowHeight {
                 sheet,
diff --git a/webapp/IronCalc/src/components/WorksheetCanvas/worksheetCanvas.ts b/webapp/IronCalc/src/components/WorksheetCanvas/worksheetCanvas.ts
index 949ab73..31656b7 100644
--- a/webapp/IronCalc/src/components/WorksheetCanvas/worksheetCanvas.ts
+++ b/webapp/IronCalc/src/components/WorksheetCanvas/worksheetCanvas.ts
@@ -497,7 +497,7 @@ export default class WorksheetCanvas {
     context.clip();
 
     // Is there any better parameter?
-    const lineHeight = 22;
+    const lineHeight = fontSize * 1.5;
     const lines = fullText.split("\n");
     const lineCount = lines.length;
 
@@ -608,14 +608,16 @@ export default class WorksheetCanvas {
       const sheet = this.model.getSelectedSheet();
       const rows = this.model.getRowsWithData(sheet, column);
       let width = 0;
-      // This is a bit of a HACK. We should use the actual font size and weather is bold or not
-      const fontSize = 13;
-      this.ctx.font = `${fontSize}px ${defaultCellFontFamily}`;
       for (const row of rows) {
         const fullText = this.model.getFormattedCellValue(sheet, row, column);
         if (fullText === "") {
           continue;
         }
+        const style = this.model.getCellStyle(sheet, row, column);
+        const fontSize = style.font.sz;
+        let font = `${fontSize}px ${defaultCellFontFamily}`;
+        font = style.font.b ? `bold ${font}` : `400 ${font}`;
+        this.ctx.font = font;
         const lines = fullText.split("\n");
         for (const line of lines) {
           const textWidth = this.ctx.measureText(line).width;
@@ -675,18 +677,20 @@ export default class WorksheetCanvas {
       const sheet = this.model.getSelectedSheet();
       const columns = this.model.getColumnsWithData(sheet, row);
       let height = 0;
-      const lineHeight = 22;
-      // This is a bit of a HACK. We should use the actual font size and weather is bold or not
-      const fontSize = 13;
-      this.ctx.font = `${fontSize}px ${defaultCellFontFamily}`;
       for (const column of columns) {
         const fullText = this.model.getFormattedCellValue(sheet, row, column);
         if (fullText === "") {
           continue;
         }
+        const style = this.model.getCellStyle(sheet, row, column);
+        const fontSize = style.font.sz;
+        const lineHeight = fontSize * 1.5;
+        let font = `${fontSize}px ${defaultCellFontFamily}`;
+        font = style.font.b ? `bold ${font}` : `400 ${font}`;
+        this.ctx.font = font;
         const lines = fullText.split("\n");
         const lineCount = lines.length;
-        // This si computed so that the y position of the text is independent of the vertical alignment
+        // This is computed so that the y position of the text is independent of the vertical alignment
         const textHeight = (lineCount - 1) * lineHeight + 8 + fontSize;
         height = Math.max(height, textHeight);
       }