@spinnaker/amazon 0.0.0-2025.1-0

package/src/instance/details/InstanceStatus.tsx

@@ -0,0 +1,92 @@
+import React from 'react';
+
+import { CollapsibleSection, InstanceLoadBalancerHealth, robotToHuman, Tooltip } from '@spinnaker/core';
+import type { IAmazonHealth } from '../../domain';
+
+export type MetricTypes = 'LoadBalancer' | 'TargetGroup';
+
+export interface CustomHealthLink {
+  type: string;
+  href: string;
+  text: string;
+}
+
+export interface IInstanceStatusProps {
+  healthMetrics: IAmazonHealth[];
+  healthState: string;
+  metricTypes: MetricTypes[];
+  customHealthUrl?: CustomHealthLink;
+  privateIpAddress?: string;
+}
+
+export const InstanceStatus = ({
+  healthMetrics,
+  healthState,
+  metricTypes,
+  customHealthUrl,
+  privateIpAddress,
+}: IInstanceStatusProps) => {
+  const hasLoadBalancer = metricTypes.includes('LoadBalancer');
+  const hasTargetGroup = metricTypes.includes('TargetGroup');
+
+  return (
+    <CollapsibleSection heading="Status" defaultExpanded={true}>
+      {!healthMetrics.length && (
+        <p>{healthState === 'Starting' ? 'Starting' : 'No health metrics found for this instance'}</p>
+      )}
+      <dl className="horizontal-when-filters-collapsed">
+        {healthMetrics
+          .sort((a: IAmazonHealth, b: IAmazonHealth) => (a.type < b.type ? -1 : a.type > b.type ? 1 : 0))
+          .map((metric: IAmazonHealth) => (
+            <React.Fragment key={`${metric.type}-${metric.description}`}>
+              <dt>{robotToHuman(metric.type)}</dt>
+              <dd>
+                {!metricTypes.includes(metric.type as MetricTypes) && (
+                  <div>
+                    <Tooltip value={metric.state.toLowerCase() === 'down' ? metric.description : ''} placement="left">
+                      <span>
+                        <span className={`glyphicon glyphicon-${metric.state}-triangle`} />
+                        <span>{robotToHuman(metric.state)}</span>
+                      </span>
+                    </Tooltip>
+                    <span className="pad-left small">
+                      {metric.healthCheckUrl && (
+                        <a target="_blank" href={metric.healthCheckUrl}>
+                          Health Check
+                        </a>
+                      )}
+                      {metric.healthCheckUrl && metric.statusPageUrl && <span> | </span>}
+                      {metric.statusPageUrl && (
+                        <a target="_blank" href={metric.statusPageUrl}>
+                          Status
+                        </a>
+                      )}
+                      {customHealthUrl && metric.type === customHealthUrl.type && (
+                        <span>
+                          {' '}
+                          |{' '}
+                          <a target="_blank" href={customHealthUrl.href}>
+                            {customHealthUrl.text}
+                          </a>
+                        </span>
+                      )}
+                    </span>
+                  </div>
+                )}
+                {hasLoadBalancer &&
+                  metric.type === 'LoadBalancer' &&
+                  (metric.loadBalancers || []).map((lb) => (
+                    <InstanceLoadBalancerHealth key={`lb-${lb.name}`} loadBalancer={lb} />
+                  ))}
+                {hasTargetGroup &&
+                  metric.type === 'TargetGroup' &&
+                  (metric.targetGroups || []).map((tg) => (
+                    <InstanceLoadBalancerHealth key={`tg-${tg.name}`} loadBalancer={tg} ipAddress={privateIpAddress} />
+                  ))}
+              </dd>
+            </React.Fragment>
+          ))}
+      </dl>
+    </CollapsibleSection>
+  );
+};

package/src/instance/details/InstanceTags.tsx

@@ -0,0 +1,21 @@
+import { orderBy } from 'lodash';
+import React from 'react';
+
+import { CollapsibleSection, LabeledValue } from '@spinnaker/core';
+
+export interface IInstanceTagsProps {
+  tags: Array<{
+    key: string;
+    value: string;
+  }>;
+}
+
+export const InstanceTags = ({ tags }: IInstanceTagsProps) => {
+  const sortedTags = orderBy(tags, ['key'], ['asc']);
+  return (
+    <CollapsibleSection heading="Tags" defaultExpanded={true}>
+      {!tags.length && <div>No tags associated with this server</div>}
+      {tags.length && sortedTags.map((tag) => <LabeledValue key={tag.key} label={tag.key} value={tag.value} />)}
+    </CollapsibleSection>
+  );
+};

package/src/instance/details/amazonInstanceInformation.component.ts

@@ -0,0 +1,13 @@
+import { module } from 'angular';
+import { react2angular } from 'react2angular';
+
+import { withErrorBoundary } from '@spinnaker/core';
+
+import { AmazonInstanceInformation } from './AmazonInstanceInformation';
+
+export const AMAZON_INSTANCE_INFORMATION_COMPONENT = 'spinnaker.application.amazonInstanceInformation.component';
+
+module(AMAZON_INSTANCE_INFORMATION_COMPONENT, []).component(
+  'amazonInstanceInformation',
+  react2angular(withErrorBoundary(AmazonInstanceInformation, 'amazonInstanceInformation'), ['instance']),
+);