24_2 Popup Overview demo options changes (#28001)

DevExpress · Sep 6, 2024 · 83fe868 · 83fe868
1 parent 7b455e3
commit 83fe868
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 14 deletions.
diff --git a/apps/demos/Demos/Popup/Overview/React/App.tsx b/apps/demos/Demos/Popup/Overview/React/App.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { Popup, Position, ToolbarItem } from 'devextreme-react/popup';
 import notify from 'devextreme/ui/notify';
 import { EmployeeItem, EmployeeItemProps } from './EmployeeItem.tsx';
@@ -51,19 +51,19 @@ export default function App() {
     );
   }, [currentEmployee]);
 
-  const getInfoButtonOptions = useCallback(() => ({
+  const getInfoButtonOptions = useMemo(() => ({
     text: 'More info',
     onClick: showMoreInfo,
   }), [showMoreInfo]);
 
-  const getEmailButtonOptions = useCallback(() => ({
+  const getEmailButtonOptions = useMemo(() => ({
     icon: 'email',
     stylingMode: 'contained',
     text: 'Send',
     onClick: sendEmail,
   }), [sendEmail]);
 
-  const getCloseButtonOptions = useCallback(() => ({
+  const getCloseButtonOptions = useMemo(() => ({
     text: 'Close',
     stylingMode: 'outlined',
     type: 'normal',
@@ -97,19 +97,19 @@ export default function App() {
           widget="dxButton"
           toolbar="top"
           locateInMenu="always"
-          options={getInfoButtonOptions()}
+          options={getInfoButtonOptions}
         />
         <ToolbarItem
           widget="dxButton"
           toolbar="bottom"
           location="before"
-          options={getEmailButtonOptions()}
+          options={getEmailButtonOptions}
         />
         <ToolbarItem
           widget="dxButton"
           toolbar="bottom"
           location="after"
-          options={getCloseButtonOptions()}
+          options={getCloseButtonOptions}
         />
         <p>
           Full Name:&nbsp;

diff --git a/apps/demos/Demos/Popup/Overview/ReactJs/App.js b/apps/demos/Demos/Popup/Overview/ReactJs/App.js
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { Popup, Position, ToolbarItem } from 'devextreme-react/popup';
 import notify from 'devextreme/ui/notify';
 import { EmployeeItem } from './EmployeeItem.js';
@@ -49,14 +49,14 @@ export default function App() {
       3000,
     );
   }, [currentEmployee]);
-  const getInfoButtonOptions = useCallback(
+  const getInfoButtonOptions = useMemo(
     () => ({
       text: 'More info',
       onClick: showMoreInfo,
     }),
     [showMoreInfo],
   );
-  const getEmailButtonOptions = useCallback(
+  const getEmailButtonOptions = useMemo(
     () => ({
       icon: 'email',
       stylingMode: 'contained',
@@ -65,7 +65,7 @@ export default function App() {
     }),
     [sendEmail],
   );
-  const getCloseButtonOptions = useCallback(
+  const getCloseButtonOptions = useMemo(
     () => ({
       text: 'Close',
       stylingMode: 'outlined',
@@ -112,19 +112,19 @@ export default function App() {
           widget="dxButton"
           toolbar="top"
           locateInMenu="always"
-          options={getInfoButtonOptions()}
+          options={getInfoButtonOptions}
         />
         <ToolbarItem
           widget="dxButton"
           toolbar="bottom"
           location="before"
-          options={getEmailButtonOptions()}
+          options={getEmailButtonOptions}
         />
         <ToolbarItem
           widget="dxButton"
           toolbar="bottom"
           location="after"
-          options={getCloseButtonOptions()}
+          options={getCloseButtonOptions}
         />
         <p>
           Full Name:&nbsp;