FIX[WebApp]: fixes in formula bar

* fx is not clickable
* Removed chevron
* Show slecting/ed area in address

webapp/src/components/formulabar.tsx

@@ -1,6 +1,5 @@
 import type { Model } from "@ironcalc/wasm";
-import { Button, styled } from "@mui/material";
-import { ChevronDown } from "lucide-react";
+import { styled } from "@mui/material";
 import { Fx } from "../icons";
 import {
   COLUMN_WIDTH_SCALE,
@@ -34,9 +33,6 @@ function FormulaBar(properties: FormulaBarProps) {
     <Container>
       <AddressContainer>
         <CellBarAddress>{cellAddress}</CellBarAddress>
-        <StyledButton>
-          <ChevronDown />
-        </StyledButton>
       </AddressContainer>
       <Divider />
       <FormulaContainer>
@@ -84,7 +80,9 @@ function FormulaBar(properties: FormulaBarProps) {
   );
 }
 
-const StyledButton = styled(Button)`
+const StyledButton = styled("div")`
+  display: inline-flex;
+  align-items: center;
   width: 15px;
   min-width: 0px;
   padding: 0px;

webapp/src/components/util.ts

@@ -29,12 +29,12 @@ export const isNavigationKey = (key: string): key is NavigationKey =>
     key,
   );
 
-export const getCellAddress = (selectedArea: Area, selectedCell?: Cell) => {
+export const getCellAddress = (selectedArea: Area, selectedCell: Cell) => {
   const isSingleCell =
     selectedArea.rowStart === selectedArea.rowEnd &&
     selectedArea.columnEnd === selectedArea.columnStart;
 
-  return isSingleCell && selectedCell
+  return isSingleCell
     ? `${columnNameFromNumber(selectedCell.column)}${selectedCell.row}`
     : `${columnNameFromNumber(selectedArea.columnStart)}${
         selectedArea.rowStart
@@ -57,5 +57,7 @@ export function rangeToStr(
   if (rowStart === rowEnd && columnStart === columnEnd) {
     return `${sheetName}${columnNameFromNumber(columnStart)}${rowStart}`;
   }
-  return `${sheetName}${columnNameFromNumber(columnStart)}${rowStart}:${columnNameFromNumber(columnEnd)}${rowEnd}`;
+  return `${sheetName}${columnNameFromNumber(
+    columnStart,
+  )}${rowStart}:${columnNameFromNumber(columnEnd)}${rowEnd}`;
 }

webapp/src/components/worksheet.tsx

@@ -164,6 +164,7 @@ function Worksheet(props: {
       const { row, column } = cell;
       model.onAreaSelecting(row, column);
       canvas.renderSheet();
+      refresh();
     },
     onAreaSelected: () => {
       const styles = workbookState.getCopyStyles();
@@ -179,6 +180,7 @@ function Worksheet(props: {
       if (worksheetElement.current) {
         worksheetElement.current.style.cursor = "auto";
       }
+      refresh();
     },
     onExtendToCell: (cell) => {
       const canvas = worksheetCanvas.current;