Fix table dissapear after switching tabs (#11096)

app/dashboard/src/layouts/AssetsTable.tsx

@@ -2265,6 +2265,29 @@ export default function AssetsTable(props: AssetsTableProps) {
     ],
   )
 
+  React.useEffect(() => {
+    // In some browsers, at least in Chrome 126,
+    // in some situations, when an element has a
+    // 'container-size' style, and the parent element is hidden,
+    // the browser can't calculate the element's size
+    // and thus the element doesn't appear when we unhide the parent.
+    // The only way to fix that is to force browser to recalculate styles
+    // So the trick is to change a property, trigger style recalc(`getBoundlingClientRect()`)
+    // and remove the property.
+    // since everything is happening synchronously, user won't see a broken layout during recalculation
+    if (!hidden && rootRef.current) {
+      for (let i = 0; i < rootRef.current.children.length; i++) {
+        const element = rootRef.current.children[i]
+
+        if (element instanceof HTMLElement) {
+          element.style.width = '0px'
+          element.getBoundingClientRect()
+          element.style.width = ''
+        }
+      }
+    }
+  }, [hidden])
+
   // This is required to prevent the table body from overlapping the table header, because
   // the table header is transparent.
   const updateClipPath = useOnScroll(() => {