@spinnaker/core 0.14.2 → 0.16.1

package/src/managed/versionMetadata/MetadataComponents.tsx

@@ -3,14 +3,14 @@ import classnames from 'classnames';
 import { sortBy } from 'lodash';
 import type { DateTime } from 'luxon';
 import React from 'react';
-import { Dropdown, MenuItem } from 'react-bootstrap';
 
 import type { IconNames } from '@spinnaker/presentation';
 import { Icon } from '@spinnaker/presentation';
 
-import { RelativeTimestamp } from '../RelativeTimestamp';
+import { formatToRelativeTimestamp, RelativeTimestamp } from '../RelativeTimestamp';
 import type { LifecycleEventSummary } from '../overview/artifact/utils';
-import { Tooltip } from '../../presentation';
+import { HoverablePopover, IconTooltip, LabeledValue, Tooltip } from '../../presentation';
+import { copyTextToClipboard } from '../../utils/clipboard/copyTextToClipboard';
 import { ABSOLUTE_TIME_FORMAT, TOOLTIP_DELAY_SHOW } from '../utils/defaults';
 import { useLogEvent } from '../utils/logging';
 
@@ -20,12 +20,7 @@ export const MetadataElement: React.FC<{ className?: string }> = ({ className, c
   return <span className={classnames('delimited-element horizontal middle', className)}>{children}</span>;
 };
 
-export interface VersionAction {
-  onClick?: () => void;
-  href?: string;
-  content: string;
-  disabled?: boolean;
-}
+export const METADATA_TEXT_COLOR = 'nobel';
 
 export interface VersionMessageData {
   by?: string;
@@ -33,6 +28,11 @@ export interface VersionMessageData {
   comment?: string;
 }
 
+export interface ICompareLinks {
+  previous?: string;
+  current?: string;
+}
+
 export const toPinnedMetadata = (data: {
   pinnedAt?: string;
   pinnedBy?: string;
@@ -54,59 +54,28 @@ export const toVetoedMetadata = (data: {
 });
 
 export interface IVersionMetadataProps {
-  build?: IVersionBuildProps['build'] & Partial<LifecycleEventSummary>;
-  version: string;
-  sha?: string;
+  build?: IVersionBuildProps['build'];
   author?: string;
   deployedAt?: string;
-  createdAt?: IVersionCreatedAtProps['createdAt'];
   buildsBehind?: number;
   isDeploying?: boolean;
+  isPending?: boolean;
   bake?: LifecycleEventSummary;
   pinned?: VersionMessageData;
   vetoed?: VersionMessageData;
-  actions?: VersionAction[];
+  isCurrent?: boolean;
 }
 
-export interface IVersionMetadataActionsProps {
-  id: string;
-  actions: VersionAction[];
-}
-
-export const VersionMetadataActions = ({ id, actions }: IVersionMetadataActionsProps) => {
-  const logEvent = useLogEvent('ArtifactActions');
-  return (
-    <MetadataElement>
-      <Dropdown id={id}>
-        <Dropdown.Toggle className="element-actions-menu-toggle">Actions</Dropdown.Toggle>
-        <Dropdown.Menu>
-          {actions.map((action, index) => (
-            <MenuItem
-              key={index}
-              disabled={action.disabled}
-              onClick={() => {
-                action.onClick?.();
-                logEvent({ action: `OpenModal - ${action.content}` });
-              }}
-              href={action.href}
-              target="_blank"
-            >
-              {action.content}
-            </MenuItem>
-          ))}
-        </Dropdown.Menu>
-      </Dropdown>
-    </MetadataElement>
-  );
+const useCreateVersionLink = (linkProps: IVersionCreatedAtProps['linkProps']) => {
+  return useSref('home.applications.application.environments.history', linkProps);
 };
-
 interface IVersionCreatedAtProps {
   createdAt?: string | DateTime;
   linkProps: Record<string, string>;
 }
 
 export const VersionCreatedAt = ({ createdAt, linkProps }: IVersionCreatedAtProps) => {
-  const { href, onClick } = useSref('home.applications.application.environments.history', linkProps);
+  const { href } = useCreateVersionLink(linkProps);
   if (!createdAt) return null;
 
   return (
@@ -114,7 +83,13 @@ export const VersionCreatedAt = ({ createdAt, linkProps }: IVersionCreatedAtProp
       <Tooltip delayShow={TOOLTIP_DELAY_SHOW} value="Created at">
         <i className="far fa-calendar-alt metadata-icon" />
       </Tooltip>
-      <a href={href} onClick={onClick}>
+      <a
+        href={href}
+        onClick={(e) => {
+          href && copyTextToClipboard([window.location.origin, href].join('/'));
+          e.stopPropagation();
+        }}
+      >
         <RelativeTimestamp timestamp={createdAt} delayShow={TOOLTIP_DELAY_SHOW} removeStyles withSuffix />
       </a>
     </MetadataElement>
@@ -124,6 +99,7 @@ export const VersionCreatedAt = ({ createdAt, linkProps }: IVersionCreatedAtProp
 const badgeTypeToDetails = {
   deploying: { className: 'version-deploying', text: 'Deploying' },
   baking: { className: 'version-baking', text: 'Baking' },
+  deployed: { className: 'version-deployed', text: 'Live' },
 };
 
 interface IMetadataBadgeProps {
@@ -168,7 +144,7 @@ const versionTypeProps: { [key in IVersionMessage['type']]: { text: string; clas
     icon: 'pin',
   },
   vetoed: {
-    text: 'Marked as bad by',
+    text: 'Rejected by',
     className: 'version-vetoed',
     icon: 'artifactBad',
   },
@@ -180,7 +156,7 @@ export const VersionMessage = ({ data, type, newRow = true }: IVersionMessage) =
     <>
       {newRow && <div className="flex-break sp-margin-s-top" />}
       <div className={classnames('version-message', typeProps.className)}>
-        <Icon name={typeProps.icon} size="14px" color="black" className="sp-margin-2xs-top" />
+        <Icon name={typeProps.icon} size="14px" color={METADATA_TEXT_COLOR} className="sp-margin-2xs-top" />
         <div>
           <div>
             {typeProps.text} {data.by},{' '}
@@ -212,13 +188,13 @@ export const VersionBranch = ({ branch }: IVersionBranchProps) => {
   if (!branch) return null;
   return (
     <MetadataElement>
-      <Icon name="spCIBranch" size="11px" className="sp-margin-xs-right" color="concrete" /> {branch}
+      <Icon name="spCIBranch" size="11px" className="sp-margin-xs-right" color={METADATA_TEXT_COLOR} /> {branch}
     </MetadataElement>
   );
 };
 
 interface IVersionBuildProps {
-  build: { buildNumber?: string; link?: string; version?: string };
+  build: { buildNumber?: string; version?: string } & Partial<LifecycleEventSummary>;
   withPrefix?: boolean;
 }
 
@@ -234,9 +210,12 @@ export const VersionBuild = ({ build, withPrefix }: IVersionBuildProps) => {
   );
 
   return build.version ? (
-    <Tooltip value={build.version} delayShow={TOOLTIP_DELAY_SHOW}>
+    <HoverablePopover
+      Component={() => <LifecycleEventDetails {...build} title="Build" showLink={false} />}
+      delayShow={TOOLTIP_DELAY_SHOW}
+    >
       <span>{content}</span>
-    </Tooltip>
+    </HoverablePopover>
   ) : (
     <>{content}</>
   );
@@ -274,30 +253,83 @@ export const BaseVersionMetadata: React.FC = ({ children }) => {
 
 interface ILifecycleEventDetailsProps extends Partial<LifecycleEventSummary> {
   title: string;
+  showLink?: boolean;
+  version?: string;
 }
 
-export const LifecycleEventDetails = ({ duration, link, startedAt, title }: ILifecycleEventDetailsProps) => {
+export const LifecycleEventDetails = ({
+  version,
+  duration,
+  link,
+  startedAt,
+  title,
+  showLink = true,
+}: ILifecycleEventDetailsProps) => {
   return (
     <div className="LifecycleEventDetails">
       <div>
         <div className="title sp-margin-xs-bottom">{title}</div>
         <dl className="details sp-margin-s-bottom">
-          <dt>Started at</dt>
-          <dd>{startedAt?.toFormat(ABSOLUTE_TIME_FORMAT) || 'N/A'}</dd>
-
-          <dt>Duration</dt>
-          <dd>{duration || 'N/A'}</dd>
-
-          {link && (
-            <>
-              <dt>Link</dt>
-              <dd>
-                <a href={link}>Open</a>
-              </dd>
-            </>
-          )}
+          {version && <LabeledValue label="Version" value={version} />}
+          <LabeledValue
+            label="Started at"
+            value={
+              `${startedAt?.toFormat(ABSOLUTE_TIME_FORMAT) || 'N/A'}` +
+              ` ` +
+              `${startedAt ? ` (${formatToRelativeTimestamp(startedAt, true)})` : ''}`
+            }
+          />
+          <LabeledValue label="Duration" value={duration || 'N/A'} />
+          {showLink && link && <LabeledValue label="Link" value={<a href={link}>Open</a>} />}
         </dl>
       </div>
     </div>
   );
 };
+
+type IDeploymentStatusProps = Pick<IVersionMetadataProps, 'deployedAt' | 'isPending' | 'isCurrent' | 'isDeploying'>;
+
+const statusToProps = {
+  CURRENT: {
+    icon: 'cloudDeployed',
+    tooltip: 'Deployed at',
+  },
+  PENDING: {
+    icon: 'cloudWaiting',
+    tooltip: 'Deployment pending',
+  },
+  PREVIOUS: {
+    icon: 'cloudDecommissioned',
+    tooltip: 'Replaced by another version',
+  },
+  SKIPPED: {
+    icon: 'artifactSkipped',
+    tooltip: 'Deployment skipped',
+  },
+} as const;
+
+export const DeploymentStatus = ({ deployedAt, isCurrent, isPending, isDeploying }: IDeploymentStatusProps) => {
+  if (!deployedAt && isDeploying) return null; // We'll show the deploying badge so no reason to show this component if this version is being deployed for the first time
+  const props = statusToProps[deployedAt ? (isCurrent ? 'CURRENT' : 'PREVIOUS') : isPending ? 'PENDING' : 'SKIPPED'];
+  return (
+    <MetadataElement>
+      <IconTooltip
+        tooltip={props.tooltip}
+        name={props.icon}
+        size="14px"
+        wrapperClassName="metadata-icon"
+        delayShow={TOOLTIP_DELAY_SHOW}
+        color={METADATA_TEXT_COLOR}
+      />
+      {deployedAt ? (
+        <>
+          Deployed <RelativeTimestamp timestamp={deployedAt} delayShow={TOOLTIP_DELAY_SHOW} removeStyles withSuffix />
+        </>
+      ) : isPending ? (
+        'Pending'
+      ) : (
+        'Not deployed'
+      )}
+    </MetadataElement>
+  );
+};

package/src/managed/versionMetadata/VersionMetadata.less

@@ -1,15 +1,18 @@
+@textColor: var(--color-nobel);
+
 .VersionMetadata {
   display: flex;
   flex-direction: row;
   align-items: center;
-  margin-top: var(--xs-spacing);
-  color: var(--color-concrete);
+  margin-top: 6px;
+  color: @textColor;
   white-space: pre-wrap;
   font-size: 13px;
   flex-wrap: wrap;
+  line-height: 1.6;
 
   i {
-    color: var(--color-concrete);
+    color: @textColor;
   }
 
   .HoverablePopover {
@@ -29,25 +32,17 @@
     font-size: 12px;
   }
 
-  .element-actions-menu-toggle {
-    padding: 0 var(--xs-spacing);
-    border: none;
-    font-size: inherit;
-    &:not(:hover) {
-      background-color: transparent;
-    }
-  }
-
   .version-badge {
     border-radius: 3px;
-    padding: 0 var(--s-spacing);
+    padding: 1px var(--s-spacing) 0;
     display: flex;
-    min-width: 60px;
+    min-width: 50px;
     justify-content: center;
     flex-direction: row;
-    & > svg {
-      margin-right: 4px;
-    }
+    text-transform: uppercase;
+    font-weight: 700;
+    font-size: 12px;
+    letter-spacing: 0.4px;
   }
 
   .version-deploying {
@@ -60,6 +55,11 @@
     color: var(--color-black);
   }
 
+  .version-deployed {
+    background-color: var(--color-status-success);
+    color: var(--color-white);
+  }
+
   .version-pinned {
     background-color: var(--color-status-warning-light);
   }
@@ -99,7 +99,6 @@
     align-items: baseline;
 
     dt {
-      font-weight: normal;
       text-transform: uppercase;
       font-size: 13px;
       color: var(--color-concrete);

package/src/managed/versionMetadata/VersionMetadata.tsx

@@ -1,38 +1,45 @@
 import React from 'react';
 
 import type { IVersionMetadataProps } from './MetadataComponents';
+import { METADATA_TEXT_COLOR } from './MetadataComponents';
 import {
   BaseVersionMetadata,
+  DeploymentStatus,
   LifecycleEventDetails,
   MetadataBadge,
   MetadataElement,
   toVetoedMetadata,
   VersionAuthor,
   VersionBuilds,
-  VersionCreatedAt,
   VersionMessage,
-  VersionMetadataActions,
 } from './MetadataComponents';
-import { formatToRelativeTimestamp, RelativeTimestamp } from '../RelativeTimestamp';
-import { getLifecycleEventSummary } from '../overview/artifact/utils';
+import { formatToRelativeTimestamp } from '../RelativeTimestamp';
+import { getLifecycleEventSummary, isVersionPending } from '../overview/artifact/utils';
 import type { QueryArtifactVersion } from '../overview/types';
-import { HoverablePopover, IconTooltip } from '../../presentation';
-import { TOOLTIP_DELAY_SHOW } from '../utils/defaults';
+import { HoverablePopover, Icon } from '../../presentation';
 import type { SingleVersionArtifactVersion } from '../versionsHistory/types';
 
+export const getVersionCompareLinks = (version: QueryArtifactVersion | SingleVersionArtifactVersion) => {
+  return {
+    current: version.gitMetadata?.comparisonLinks?.toCurrentVersion,
+    previous: version.gitMetadata?.comparisonLinks?.toPreviousVersion,
+  };
+};
+
 export const getBaseMetadata = (
   version: QueryArtifactVersion | SingleVersionArtifactVersion,
-): Omit<Partial<IVersionMetadataProps>, 'version'> & Pick<IVersionMetadataProps, 'version'> => {
+): Partial<IVersionMetadataProps> => {
+  // The return type above makes everything optional except for the version
   return {
-    version: version.version,
-    sha: version.gitMetadata?.commit,
     build: {
       buildNumber: version.buildNumber,
       version: version.version,
       ...getLifecycleEventSummary(version, 'BUILD'),
     },
     author: version.gitMetadata?.author,
+    isPending: isVersionPending(version),
     deployedAt: version.deployedAt,
+    isCurrent: version.isCurrent,
     isDeploying: version.status === 'DEPLOYING',
     bake: getLifecycleEventSummary(version, 'BAKE'),
     vetoed: version.veto ? toVetoedMetadata(version.veto) : undefined,
@@ -40,21 +47,20 @@ export const getBaseMetadata = (
 };
 
 export const VersionMetadata = ({
-  version,
-  sha,
   build,
   author,
   deployedAt,
-  createdAt,
+  isPending,
+  isCurrent,
+  isDeploying,
   buildsBehind,
   bake,
-  isDeploying,
   pinned,
   vetoed,
-  actions,
 }: IVersionMetadataProps) => {
   return (
     <BaseVersionMetadata>
+      {isCurrent && <MetadataBadge type="deployed" />}
       {isDeploying && <MetadataBadge type="deploying" />}
       {bake?.isRunning && (
         <MetadataBadge
@@ -65,20 +71,8 @@ export const VersionMetadata = ({
       )}
       {build?.buildNumber && <VersionBuilds builds={[build]} />}
       <VersionAuthor author={author} />
-      <VersionCreatedAt createdAt={createdAt} linkProps={sha ? { sha } : { version }} />
-      {deployedAt && (
-        <MetadataElement>
-          <IconTooltip
-            tooltip="Deployed at"
-            name="cloudDeployed"
-            size="12px"
-            wrapperClassName="metadata-icon"
-            delayShow={TOOLTIP_DELAY_SHOW}
-          />
-          <RelativeTimestamp timestamp={deployedAt} delayShow={TOOLTIP_DELAY_SHOW} removeStyles withSuffix />
-        </MetadataElement>
-      )}
-      {(build?.duration || bake?.duration) && (
+      <DeploymentStatus {...{ deployedAt, isCurrent, isPending, isDeploying }} />
+      {bake?.duration && (
         <MetadataElement>
           <HoverablePopover
             delayShow={200}
@@ -86,11 +80,10 @@ export const VersionMetadata = ({
             Component={() => (
               <>
                 <LifecycleEventDetails title="Bake" {...bake} />
-                <LifecycleEventDetails title="Build" {...build} />
               </>
             )}
           >
-            <i className="fas fa-info-circle " />
+            <Icon name="bake" size="13px" color={METADATA_TEXT_COLOR} />
           </HoverablePopover>
         </MetadataElement>
       )}
@@ -99,7 +92,6 @@ export const VersionMetadata = ({
           {buildsBehind} build{buildsBehind > 1 ? 's' : ''} behind
         </MetadataElement>
       ) : null}
-      {actions && <VersionMetadataActions id={`${build?.buildNumber}-actions`} actions={actions} />}
       {pinned && <VersionMessage type="pinned" data={pinned} />}
       {vetoed && <VersionMessage type="vetoed" data={vetoed} />}
     </BaseVersionMetadata>

package/src/managed/versionsHistory/VersionContent.tsx

@@ -1,6 +1,7 @@
 import { flatten, omit, uniq } from 'lodash';
 import React from 'react';
 
+import { ArtifactActions } from '../artifactActions/ArtifactActions';
 import { BaseEnvironment } from '../environmentBaseElements/BaseEnvironment';
 import { EnvironmentItem } from '../environmentBaseElements/EnvironmentItem';
 import { EnvironmentsRender, useOrderedEnvironment } from '../environmentBaseElements/EnvironmentsRender';
@@ -9,7 +10,8 @@ import { useFetchVersionQuery } from '../graphql/graphql-sdk';
 import type { ITaskArtifactVersionProps } from '../overview/artifact/ArtifactVersionTasks';
 import { ArtifactVersionTasks } from '../overview/artifact/ArtifactVersionTasks';
 import { Constraints } from '../overview/artifact/Constraints';
-import { useCreateVersionActions } from '../overview/artifact/utils';
+import { useCreateVersionRollbackActions } from '../overview/artifact/useCreateRollbackActions.hook';
+import { extractVersionRollbackDetails, isVersionVetoed } from '../overview/artifact/utils';
 import { useApplicationContextSafe } from '../../presentation';
 import { LoadingAnimation } from '../../presentation/LoadingAnimation';
 import type {
@@ -20,12 +22,13 @@ import type {
 } from './types';
 import type { VersionMessageData } from '../versionMetadata/MetadataComponents';
 import { toPinnedMetadata } from '../versionMetadata/MetadataComponents';
-import { getBaseMetadata, VersionMetadata } from '../versionMetadata/VersionMetadata';
+import { getBaseMetadata, getVersionCompareLinks, VersionMetadata } from '../versionMetadata/VersionMetadata';
 
 import './VersionsHistory.less';
 
 interface IVersionInEnvironmentProps {
   environment: string;
+  isPreview?: boolean;
   version: HistoryArtifactVersionExtended;
   envPinnedVersions?: PinnedVersions[keyof PinnedVersions];
   loading: boolean;
@@ -35,6 +38,7 @@ interface IVersionInEnvironmentProps {
 const VersionInEnvironment = ({
   environment,
   version,
+  isPreview,
   envPinnedVersions,
   detailedVersionData,
   loading,
@@ -45,18 +49,14 @@ const VersionInEnvironment = ({
     pinnedData = toPinnedMetadata(currentPinnedVersion);
   }
 
-  const actions = useCreateVersionActions({
+  const actions = useCreateVersionRollbackActions({
     environment,
     reference: version.reference,
     version: version.version,
-    buildNumber: version.buildNumber,
-    status: version.status,
-    commitMessage: version.gitMetadata?.commitInfo?.message,
+    isVetoed: isVersionVetoed(version),
     isPinned: Boolean(pinnedData),
-    compareLinks: {
-      previous: detailedVersionData?.gitMetadata?.comparisonLinks?.toPreviousVersion,
-      current: detailedVersionData?.gitMetadata?.comparisonLinks?.toCurrentVersion,
-    },
+    isCurrent: version.isCurrent,
+    selectedVersion: extractVersionRollbackDetails(version),
   });
 
   const versionProps: ITaskArtifactVersionProps = {
@@ -75,12 +75,18 @@ const VersionInEnvironment = ({
     >
       <VersionMetadata
         key={version.id}
-        version={version.version}
         {...(detailedVersionData ? omit(getBaseMetadata(detailedVersionData), 'author', 'buildDuration') : undefined)}
-        actions={actions}
         pinned={pinnedData}
       />
-
+      {!isPreview && (
+        <ArtifactActions
+          buildNumber={version.buildNumber}
+          version={version.version}
+          actions={actions}
+          compareLinks={detailedVersionData ? getVersionCompareLinks(detailedVersionData) : undefined}
+          className="sp-margin-s-yaxis"
+        />
+      )}
       {loading && <LoadingAnimation />}
       <Constraints
         constraints={detailedVersionData?.constraints}
@@ -144,6 +150,7 @@ export const VersionContent = ({ versionData, pinnedVersions }: IVersionContentP
                 environment={env}
                 key={version.id}
                 version={version}
+                isPreview={isPreview}
                 envPinnedVersions={pinnedVersions?.[env]}
                 loading={loading}
                 detailedVersionData={getDetailedVersionData({ environment: env, version, versionsDetails })}

package/src/managed/versionsHistory/VersionHeading.tsx

@@ -73,7 +73,7 @@ const statusToText: { [key in VersionStatus]: string } = {
   VETOED: `Marked as bad`,
   PREVIOUS: `Previously deployed`,
   DEPLOYING: `Deploying`,
-  SKIPPED: 'Skipped',
+  SKIPPED: 'Not deployed',
 };
 
 const secondaryStatusToIcon: { [key in VersionStatus]?: string } = {
@@ -137,6 +137,7 @@ const EnvironmentBadge = ({ name, data: { isPreview, versions, gitMetadata, isPi
   const isCurrent = getIsCurrent(versions);
   const statusClassName = statusToClassName[isCurrent ? 'CURRENT' : statusSummary];
   const statusText = statusToText[statusSummary];
+
   // In case that the status is different than CURRENT (e.g. when you veto the CURRENT version), we want to show that as well
   const hasSecondaryStatus = Boolean(isCurrent && statusSummary !== 'CURRENT');
   const secondaryIcon = hasSecondaryStatus ? secondaryStatusToIcon[statusSummary] : undefined;

package/src/managed/versionsHistory/VersionsHistory.less

@@ -117,15 +117,23 @@
     }
 
     &.skipped {
+      @stripesColor: var(--color-silver);
+      @baseColor: var(--color-white);
       border: 1px solid var(--color-silver);
+      background-image: linear-gradient(
+        to top right,
+        @baseColor calc(50% - 1px),
+        @stripesColor,
+        @baseColor calc(50% + 1px)
+      );
     }
 
     &.approved {
-      background-color: var(--color-status-progress);
+      background-color: var(--color-status-progress-light);
     }
 
     &.pending {
-      background-color: var(--color-status-progress);
+      background-color: var(--color-status-progress-light);
     }
 
     &.vetoed {
@@ -137,7 +145,7 @@
     }
 
     &.previous {
-      background-color: var(--color-status-neutral);
+      background-color: rgba(43%, 84%, 43%, 0.2);
     }
 
     &.deploying {

package/src/manifest/PodNameProvider.spec.ts

@@ -1,5 +1,5 @@
 import { DefaultPodNameProvider, JobEventBasedPodNameProvider } from './PodNameProvider';
-import { IManifest, IManifestEvent } from '../domain';
+import type { IManifest, IManifestEvent } from '../domain';
 
 describe('PodNameProvider', function () {
   describe('DefaultPodNameProvider', function () {

package/src/navigation/customParamTypes.spec.ts

@@ -1,4 +1,4 @@
-import { trueKeyObjectParamType, booleanParamType, inverseBooleanParamType, sortKeyParamType } from './state.provider';
+import { booleanParamType, inverseBooleanParamType, sortKeyParamType, trueKeyObjectParamType } from './state.provider';
 
 describe('custom param types', () => {
   describe('trueKeyObject', () => {

package/src/pagerDuty/pagerDuty.read.service.spec.ts

@@ -1,6 +1,8 @@
-import { mockHttpClient } from '../api/mock/jasmine';
 import { mock } from 'angular';
-import { IPagerDutyService, PagerDutyReader } from './pagerDuty.read.service';
+
+import { mockHttpClient } from '../api/mock/jasmine';
+import type { IPagerDutyService } from './pagerDuty.read.service';
+import { PagerDutyReader } from './pagerDuty.read.service';
 
 describe('PagerDutyReader', () => {
   beforeEach(mock.module());

package/src/pagerDuty/pagerDutyTag.component.spec.ts

@@ -1,7 +1,11 @@
+import type { IComponentControllerService } from 'angular';
+import { mock } from 'angular';
 import { of as observableOf } from 'rxjs';
-import { IComponentControllerService, mock } from 'angular';
-import { IPagerDutyService, PagerDutyReader } from './pagerDuty.read.service';
-import { PAGER_DUTY_TAG_COMPONENT, PagerDutyTagComponentController } from './pagerDutyTag.component';
+
+import type { IPagerDutyService } from './pagerDuty.read.service';
+import { PagerDutyReader } from './pagerDuty.read.service';
+import type { PagerDutyTagComponentController } from './pagerDutyTag.component';
+import { PAGER_DUTY_TAG_COMPONENT } from './pagerDutyTag.component';
 
 describe('PagerDutyTagComponent', () => {
   let $componentController: IComponentControllerService, $ctrl: PagerDutyTagComponentController;