Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

Merge pull request #4680 from appsmithorg/ui/perf/optimize-expensive-style-calc-evalauatedValuePopup/4679

Browse Source 
Memoize the evaluate popup placement value
This commit is contained in:
Satish Gandham 2021-05-28 11:16:21 +05:30 committed by GitHub
commit 83b44b30b6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/client/src/components/editorComponents/CodeEditor/EvaluatedValuePopup.tsx
View File

@ -1,4 +1,4 @@
import React, { memo, useRef, useState } from "react";
import React, { memo, useMemo, useRef, useState } from "react";
import styled from "styled-components";
import _ from "lodash";
import Popper from "pages/Editor/Popper";
@ -314,13 +314,15 @@ function EvaluatedValuePopup(props: Props) {
const [contentHovered, setContentHovered] = useState(false);
const wrapperRef = useRef<HTMLDivElement>(null);
let placement: Placement = "left-start";
if (wrapperRef.current) {
const boundingRect = wrapperRef.current.getBoundingClientRect();
if (boundingRect.left < theme.evaluatedValuePopup.width) {
placement = "right-start";
const placement: Placement = useMemo(() => {
if (wrapperRef.current) {
const boundingRect = wrapperRef.current.getBoundingClientRect();
if (boundingRect.left < theme.evaluatedValuePopup.width) {
return "right-start";
}
}
}
return "left-start";
}, [wrapperRef.current]);
return (
<Wrapper ref={wrapperRef}>