🥇 Token comments followup (Joystream#6419)

Joystream · Jul 24, 2024 · 94c39fd · 94c39fd
1 parent b1ae89c
commit 94c39fd
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 11 deletions.
diff --git a/packages/atlas/src/components/CssDrawer/CssDrawer.tsx b/packages/atlas/src/components/CssDrawer/CssDrawer.tsx
@@ -1,6 +1,7 @@
 import styled from '@emotion/styled'
 import { isPropValid } from '@storybook/theming'
-import { ReactNode, useRef } from 'react'
+import { ReactNode } from 'react'
+import useResizeObserver from 'use-resize-observer'
 
 import { SvgActionChevronT } from '@/assets/icons'
 import { cVar, sizes, transitions } from '@/styles'
@@ -14,15 +15,13 @@ type CssDrawerProps = {
 }
 
 export const CssDrawer = ({ children, isActive, className }: CssDrawerProps) => {
-  const drawer = useRef<HTMLDivElement>(null)
+  const { ref, height } = useResizeObserver<HTMLDivElement>({
+    // this is here to trigger the rerender when the children grows in height
+    onResize: () => undefined,
+  })
+
   return (
-    <Drawer
-      flow="column"
-      isActive={isActive}
-      ref={drawer}
-      maxHeight={drawer?.current?.scrollHeight}
-      className={className}
-    >
+    <Drawer flow="column" isActive={isActive} ref={ref} maxHeight={height} className={className}>
       {children}
     </Drawer>
   )

diff --git a/packages/atlas/src/views/viewer/VideoView/CommentsSection.tsx b/packages/atlas/src/views/viewer/VideoView/CommentsSection.tsx
@@ -24,7 +24,6 @@ import { getMemberAvatar } from '@/providers/assets/assets.helpers'
 import { useFee } from '@/providers/joystream'
 import { useUser } from '@/providers/user/user.hooks'
 import { createPlaceholderData } from '@/utils/data'
-import { InfiniteLoadingOffsets } from '@/utils/loading.contants'
 
 import { CommentThread } from './CommentThread'
 import { CommentsSectionHeader, CommentsSectionWrapper, CommentsStyledSection } from './VideoView.styles'
@@ -265,7 +264,6 @@ export const CommentsSection: FC<CommentsSectionProps> = ({
                     return
                   },
                   type: 'infinite',
-                  loadingTriggerOffset: InfiniteLoadingOffsets.VideoTile,
                 }
           }
         />