TextEditor extracted variables to references

Rollback gridwrapper feature of skipping recomputation
Apollo-Spreadsheet · Apr 14, 2021 · d26bf29 · d26bf29
1 parent 211725e
commit d26bf29
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 25 deletions.
diff --git a/src/editorManager/components/TextEditor.tsx b/src/editorManager/components/TextEditor.tsx
@@ -27,6 +27,7 @@ const useStyles = makeStyles(() => ({
     },
   },
 }))
+
 export const TextEditor = forwardRef(
   (
     {
@@ -89,33 +90,40 @@ export const TextEditor = forwardRef(
       stopEditing({ save: false })
     }
 
+    const containerStyles: CSSProperties = {
+      width: anchorStyle.width,
+      minHeight: anchorStyle.height,
+    }
+
+    const PaperProps = {
+      style: {
+        overflow: 'hidden',
+        zIndex: 10,
+        border: isValidValue ? anchorStyle.border : '1px solid red',
+        borderRadius: 0,
+        background: 'transparent',
+      },
+    }
+
+    const transitionProps = { timeout: 0 }
+    /**
+     * @todo Consider re-strutting this component and create some wrapper HoC that we can re-use
+     * and use Popper instead for total positioning
+     * @todo Might be not worth using for Text/Numeric a popper/popover and just use the exact same position (top,left,right)
+     */
     return (
       <Popover
         id={'editor-portal'}
         anchorEl={anchorRef}
         open
         elevation={0}
-        TransitionProps={{ timeout: 0 }}
+        TransitionProps={transitionProps}
         onClose={onEditorPortalClose}
         marginThreshold={0}
         disableRestoreFocus
-        PaperProps={{
-          style: {
-            overflow: 'hidden',
-            zIndex: 10,
-            border: isValidValue ? anchorStyle.border : '1px solid red',
-            borderRadius: 0,
-            background: 'transparent',
-          },
-        }}
+        PaperProps={PaperProps}
       >
-        <div
-          id="editor-container"
-          style={{
-            width: anchorStyle.width,
-            minHeight: anchorStyle.height,
-          }}
-        >
+        <div id="editor-container" style={containerStyles}>
           <TextareaAutosize
             {...(additionalProps?.componentProps as React.HTMLAttributes<any>)}
             id={'apollo-textarea'}

diff --git a/src/gridWrapper/GridWrapper.tsx b/src/gridWrapper/GridWrapper.tsx
@@ -93,16 +93,12 @@ const GridWrapper: React.FC<GridWrapperProps> = React.memo(
     }, [logger])
 
     const recomputeSizes = useCallback((hasFixedRowHeight: boolean) => {
-      if (!hasFixedRowHeight) {
-        loggerRef.current.debug('Recomputing sizes.')
-        cacheRef.current.clearAll()
-        gridRef.current?.recomputeGridSize()
-      } else {
-        loggerRef.current.debug('Skipping size re-computation with fixed row height')
-      }
+      loggerRef.current.debug('Recomputing sizes.', { hasFixedRowHeight })
+      cacheRef.current.clearAll()
+      gridRef.current?.recomputeGridSize()
 
       /**
-       * @todo Review because this might be the troublecauser related to checkbox selection
+       * @todo Review because this might be the troublemaker related to checkbox selection
        */
       //Ensure we do have a valid index range (and if so we can scroll to that cell)
       if (coordsRef.current.rowIndex !== -1 && coordsRef.current.colIndex !== -1) {