feat(ddm): Add layout and alpha badge (#56398)

getsentry · Sep 19, 2023 · 4dcbe53 · 4dcbe53
1 parent feabebf
commit 4dcbe53
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git a/static/app/components/sidebar/index.tsx b/static/app/components/sidebar/index.tsx
@@ -351,6 +351,7 @@ function Sidebar({location, organization}: Props) {
         label={t('DDM')}
         to={`/organizations/${organization.slug}/ddm/`}
         id="ddm"
+        isAlpha
       />
     </Feature>
   );

diff --git a/static/app/views/ddm/ddm.tsx b/static/app/views/ddm/ddm.tsx
@@ -1,3 +1,9 @@
+import ButtonBar from 'sentry/components/buttonBar';
+import FeatureBadge from 'sentry/components/featureBadge';
+import {FeatureFeedback} from 'sentry/components/featureFeedback';
+import * as Layout from 'sentry/components/layouts/thirds';
+import PageFiltersContainer from 'sentry/components/organizations/pageFilters/container';
+import {PageHeadingQuestionTooltip} from 'sentry/components/pageHeadingQuestionTooltip';
 import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import {t} from 'sentry/locale';
 import useOrganization from 'sentry/utils/useOrganization';
@@ -7,7 +13,30 @@ function DDM() {
 
   return (
     <SentryDocumentTitle title={t('DDM')} orgSlug={organization.slug}>
-      {t('DDM')}
+      <PageFiltersContainer>
+        <Layout.Page>
+          <Layout.Header>
+            <Layout.HeaderContent>
+              <Layout.Title>
+                {t('DDM')}
+                <PageHeadingQuestionTooltip
+                  docsUrl="https://docs.sentry.io"
+                  title={t('Delightful Developer Metrics.')}
+                />
+                <FeatureBadge type="alpha" />
+              </Layout.Title>
+            </Layout.HeaderContent>
+            <Layout.HeaderActions>
+              <ButtonBar gap={1}>
+                <FeatureFeedback featureName="DDM" buttonProps={{size: 'sm'}} />
+              </ButtonBar>
+            </Layout.HeaderActions>
+          </Layout.Header>
+          <Layout.Body>
+            <Layout.Main fullWidth>.</Layout.Main>
+          </Layout.Body>
+        </Layout.Page>
+      </PageFiltersContainer>
     </SentryDocumentTitle>
   );
 }