Merge pull request #86 from bshelkhonov/fix-dom-rebuild

Memoize components in useTypographyCellComponents to fix DOM rebuild
Telegram-Mini-Apps · Nov 27, 2024 · ba0cc3b · ba0cc3b
2 parents 69993b8 + ad4ae23
commit ba0cc3b
Showing 1 changed file with 6 additions and 4 deletions.
diff --git a/src/components/Blocks/Cell/hooks/useTypographyCellComponents.tsx b/src/components/Blocks/Cell/hooks/useTypographyCellComponents.tsx
@@ -1,5 +1,7 @@
 'use client';
 
+import { useCallback } from 'react';
+
 import { usePlatform } from 'hooks/usePlatform';
 
 import { Caption } from 'components/Typography/Caption/Caption';
@@ -11,21 +13,21 @@ export const useTypographyCellComponents = () => {
   const platform = usePlatform();
   const isIOS = platform === 'ios';
 
-  const Title = (props: TypographyProps) => {
+  const Title = useCallback((props: TypographyProps) => {
     if (isIOS) {
       return <Text {...props} />;
     }
 
     return <Subheadline level="1" {...props} />;
-  };
+  }, [isIOS]);
 
-  const Description = (props: TypographyProps) => {
+  const Description = useCallback((props: TypographyProps) => {
     if (isIOS) {
       return <Caption {...props} />;
     }
 
     return <Subheadline level="2" {...props} />;
-  };
+  }, [isIOS]);
 
   return {
     Title,