ref(layout) use layout.main

Author: JonasBa

static/app/components/layouts/thirds.tsx

@@ -1,4 +1,4 @@
-import {useContext, type HTMLAttributes} from 'react';
+import {useContext} from 'react';
 import {css} from '@emotion/react';
 import styled from '@emotion/styled';
 
@@ -200,7 +200,7 @@ export const Body = styled((props: ContainerProps<'div'> & {noRowGap?: boolean})
   }
 `;
 
-interface MainProps extends HTMLAttributes<HTMLElement> {
+export interface MainProps extends ContainerProps {
   children: React.ReactNode;
   /**
    * Set the width of the main content.

static/app/views/explore/components/viewportConstrainedPage.tsx

@@ -1,11 +1,9 @@
 import styled from '@emotion/styled';
 
-import type {FlexProps} from '@sentry/scraps/layout';
-
 import * as Layout from 'sentry/components/layouts/thirds';
 import {SHORT_VIEWPORT_HEIGHT} from 'sentry/utils/useIsShortViewport';
 
-interface ViewportConstrainedPageProps extends FlexProps<'main'> {
+interface ViewportConstrainedPageProps extends Layout.MainProps {
   constrained?: boolean;
   hideFooter?: boolean;
 }
@@ -27,11 +25,12 @@ export function ViewportConstrainedPage({
   ...rest
 }: ViewportConstrainedPageProps) {
   if (!constrained) {
-    return <Layout.Page {...rest} />;
+    return <Layout.Main width="full" {...rest} />;
   }
 
   return (
-    <ConstrainedPage
+    <ConstrainedMain
+      width="full"
       minHeight="0"
       overflow="hidden"
       data-hide-footer={hideFooter ? '' : undefined}
@@ -40,7 +39,7 @@ export function ViewportConstrainedPage({
   );
 }
 
-const ConstrainedPage = styled(Layout.Page)`
+const ConstrainedMain = styled(Layout.Main)`
   contain: size;
 
   @media (max-height: ${SHORT_VIEWPORT_HEIGHT}px) {

static/app/views/explore/errors/content.tsx

@@ -25,15 +25,15 @@ export default function ErrorsContent() {
 
   return (
     <SentryDocumentTitle title={t('Errors')} orgSlug={organization?.slug}>
-      <Layout.Page>
+      <Layout.Main width="full">
         <ErrorsHeader />
         <PageFiltersContainer>
           <ExploreBodySearch>
             <ErrorsFilterSection />
           </ExploreBodySearch>
         </PageFiltersContainer>
         <ErrorsBody />
-      </Layout.Page>
+      </Layout.Main>
     </SentryDocumentTitle>
   );
 }