both

frontend/packages/data-portal/app/components/Download/Tomogram/TomogramSelectorOption.tsx

@@ -1,3 +1,5 @@
+import { TomogramTypeBadge } from 'app/components/TomogramTypeBadge'
+import { IdPrefix } from 'app/constants/idPrefixes'
 import { useI18n } from 'app/hooks/useI18n'
 import { TomogramV2 } from 'app/types/gqlResponseTypes'
 import { getTomogramName } from 'app/utils/tomograms'
@@ -15,7 +17,10 @@ export function TomogramSelectorOption({
     <div>
       <div className="font-semibold">{getTomogramName(tomogram)}</div>
       <div className="text-sds-body-xxs text-sds-color-primitive-gray-500">
-        {t('tomogramId')}: {tomogram.id}
+        {t('tomogramId')}: {IdPrefix.Tomogram}-{tomogram.id}{' '}
+        {tomogram.isStandardized && (
+          <TomogramTypeBadge type="standard" size="small" />
+        )}
       </div>
       <div className="text-sds-body-xxs text-sds-color-primitive-gray-500">
         {t('tomogramSampling')}:{' '}

frontend/packages/data-portal/app/components/TomogramTypeBadge.tsx

@@ -6,19 +6,22 @@ import { Tooltip } from './Tooltip'
 
 export interface TomogramTypeBadgeProps {
   type: 'standard' | 'author'
+  size?: 'default' | 'small'
   showTooltip?: boolean
 }
 
 export function TomogramTypeBadge({
   type,
+  size = 'default',
   showTooltip,
 }: TomogramTypeBadgeProps) {
   const { t } = useI18n()
 
   const badge = (
     <div
       className={cns(
-        'h-[20px] px-sds-xs py-sds-xxxs !text-sds-body-xxxs text-[#002660] leading-sds-body-xxxs rounded inline-flex bg-[#e9f1ff]',
+        'inline-flex items-center px-sds-xs py-sds-xxxs !text-sds-body-xxxs text-[#002660] leading-sds-body-xxxs rounded bg-[#e9f1ff]',
+        size === 'small' ? 'h-[16px]' : 'h-[20px]',
         showTooltip && 'cursor-pointer',
       )}
     >

frontend/packages/data-portal/app/constants/idPrefixes.ts

@@ -5,4 +5,5 @@ export enum IdPrefix {
   Deposition = 'CZCDP',
   Run = 'RN',
   TiltSeries = 'TS',
+  Tomogram = 'TM',
 }