feat(issues): Add release package

Adds the release package to the hovercard
getsentry · Jan 18, 2025 · f6db9cb · f6db9cb
1 parent 7c60d3c
commit f6db9cb
Show file tree

Hide file tree

Showing 5 changed files with 56 additions and 32 deletions.
diff --git a/static/app/components/versionHoverCard.spec.tsx b/static/app/components/versionHoverCard.spec.tsx
@@ -46,6 +46,8 @@ describe('VersionHoverCard', () => {
     await userEvent.hover(screen.getByText(release.version));
 
     expect(await screen.findByText(deploy.environment)).toBeInTheDocument();
+    expect(screen.getByRole('heading', {name: 'Package'})).toBeInTheDocument();
+    expect(screen.getByText(release.version.split('@')[0]!)).toBeInTheDocument();
   });
 
   it('renders authors without ids', async () => {

diff --git a/static/app/components/versionHoverCard.tsx b/static/app/components/versionHoverCard.tsx
@@ -6,6 +6,7 @@ import Tag from 'sentry/components/badge/tag';
 import {LinkButton} from 'sentry/components/button';
 import {Flex} from 'sentry/components/container/flex';
 import {CopyToClipboardButton} from 'sentry/components/copyToClipboardButton';
+import {DateTime} from 'sentry/components/dateTime';
 import {Hovercard} from 'sentry/components/hovercard';
 import LastCommit from 'sentry/components/lastCommit';
 import LoadingError from 'sentry/components/loadingError';
@@ -22,6 +23,7 @@ import {uniqueId} from 'sentry/utils/guid';
 import {useDeploys} from 'sentry/utils/useDeploys';
 import {useRelease} from 'sentry/utils/useRelease';
 import {useRepositories} from 'sentry/utils/useRepositories';
+import {parseVersion} from 'sentry/utils/versions/parseVersion';
 
 interface Props extends React.ComponentProps<typeof Hovercard> {
   organization: Organization;
@@ -96,11 +98,11 @@ function VersionHoverCard({
       return {header: null, body: null};
     }
 
+    const parsedVersion = parseVersion(releaseVersion);
     const recentDeploysByEnvironment = deploys
       .toSorted(
         // Sorted by most recent deploy first
-        (a: any, b: any) =>
-          new Date(b.dateFinished).getTime() - new Date(a.dateFinished).getTime()
+        (a, b) => new Date(b.dateFinished).getTime() - new Date(a.dateFinished).getTime()
       )
       .slice(0, 3);
 
@@ -114,25 +116,39 @@ function VersionHoverCard({
               <CountSince>{release.newGroups}</CountSince>
             </div>
             <div>
-              <h6 style={{textAlign: 'right'}}>
-                {release.commitCount}{' '}
-                {release.commitCount !== 1 ? t('commits ') : t('commit ')} {t('by ')}{' '}
-                {release.authors.length}{' '}
-                {release.authors.length !== 1 ? t('authors') : t('author')}{' '}
-              </h6>
-              <AvatarList
-                users={authors}
-                avatarSize={25}
-                tooltipOptions={{container: 'body'} as any}
-                typeAvatars="authors"
-              />
+              <h6 style={{textAlign: 'right'}}>{t('Date Created')}</h6>
+              <DateTime date={release.dateCreated} seconds={false} />
             </div>
           </Flex>
+          {parsedVersion?.package && (
+            <Flex gap={space(2)} justify="space-between">
+              {parsedVersion.package && (
+                <div>
+                  <h6>{t('Package')}</h6>
+                  <div>{parsedVersion.package}</div>
+                </div>
+              )}
+              <div>
+                <h6 style={{textAlign: parsedVersion.package ? 'right' : undefined}}>
+                  {release.commitCount}{' '}
+                  {release.commitCount !== 1 ? t('commits ') : t('commit ')} {t('by ')}{' '}
+                  {release.authors.length}{' '}
+                  {release.authors.length !== 1 ? t('authors') : t('author')}{' '}
+                </h6>
+                <AvatarList
+                  users={authors}
+                  avatarSize={25}
+                  tooltipOptions={{container: 'body'} as any}
+                  typeAvatars="authors"
+                />
+              </div>
+            </Flex>
+          )}
           {release.lastCommit && <LastCommit commit={release.lastCommit} />}
           {deploys.length > 0 && (
             <Flex column gap={space(0.5)}>
               <h6>{t('Deploys')}</h6>
-              {recentDeploysByEnvironment.map((deploy: any) => {
+              {recentDeploysByEnvironment.map(deploy => {
                 return (
                   <Flex
                     key={deploy.id}

diff --git a/static/app/utils/versions/formatVersion.tsx b/static/app/utils/versions/formatVersion.tsx
@@ -1,16 +1,16 @@
-import {Release} from '@sentry/release-parser';
+import {parseVersion} from './parseVersion';
 
 export const formatVersion = (rawVersion: string, withPackage = false) => {
-  try {
-    const parsedVersion = new Release(rawVersion);
-    const versionToDisplay = parsedVersion.describe();
+  const parsedVersion = parseVersion(rawVersion);
+  if (!parsedVersion) {
+    return rawVersion;
+  }
 
-    if (versionToDisplay.length) {
-      return `${versionToDisplay}${withPackage && parsedVersion.package ? `, ${parsedVersion.package}` : ''}`;
-    }
+  const versionToDisplay = parsedVersion.describe();
 
-    return rawVersion;
-  } catch {
-    return rawVersion;
+  if (versionToDisplay.length) {
+    return `${versionToDisplay}${withPackage && parsedVersion.package ? `, ${parsedVersion.package}` : ''}`;
   }
+
+  return rawVersion;
 };
diff --git a/static/app/utils/versions/isSemverRelease.tsx b/static/app/utils/versions/isSemverRelease.tsx
@@ -1,10 +1,6 @@
-import {Release} from '@sentry/release-parser';
+import {parseVersion} from 'sentry/utils/versions/parseVersion';
 
 export const isSemverRelease = (rawVersion: string): boolean => {
-  try {
-    const parsedVersion = new Release(rawVersion);
-    return !!parsedVersion.versionParsed;
-  } catch {
-    return false;
-  }
+  const parsedVersion = parseVersion(rawVersion);
+  return !!parsedVersion?.versionParsed;
 };
diff --git a/static/app/utils/versions/parseVersion.tsx b/static/app/utils/versions/parseVersion.tsx
@@ -0,0 +1,10 @@
+import {Release} from '@sentry/release-parser';
+
+export function parseVersion(rawVersion: string): Release | null {
+  try {
+    const parsedVersion = new Release(rawVersion);
+    return parsedVersion;
+  } catch {
+    return null;
+  }
+}