fix(tests): Wrap side bar charts in get dynamic text (#30935)

Side bar charts are causing acceptance tests to be flakey. Wrap them using
getDynamicText to get around this.

static/app/views/performance/transactionSummary/transactionOverview/sidebarCharts.tsx

@@ -26,6 +26,7 @@ import {
   formatFloat,
   formatPercentage,
 } from 'sentry/utils/formatters';
+import getDynamicText from 'sentry/utils/getDynamicText';
 import useApi from 'sentry/utils/useApi';
 import {getTermHelp, PERFORMANCE_TERM} from 'sentry/views/performance/data';
 
@@ -233,7 +234,7 @@ function SidebarCharts({
             {({results, errored, loading, reloading}) => {
               if (errored) {
                 return (
-                  <ErrorPanel height="580px">
+                  <ErrorPanel height="480px">
                     <IconWarning color="gray300" size="lg" />
                   </ErrorPanel>
                 );
@@ -247,9 +248,14 @@ function SidebarCharts({
                 : [];
 
               return (
-                <TransitionChart loading={loading} reloading={reloading} height="580px">
+                <TransitionChart loading={loading} reloading={reloading} height="480px">
                   <TransparentLoadingMask visible={reloading} />
-                  <LineChart {...zoomRenderProps} {...chartOptions} series={series} />
+                  {getDynamicText({
+                    value: (
+                      <LineChart {...zoomRenderProps} {...chartOptions} series={series} />
+                    ),
+                    fixed: <Placeholder height="480px" testId="skeleton-ui" />,
+                  })}
                 </TransitionChart>
               );
             }}