Skip to content

Commit 7de34b6

Browse files
authored
Merge pull request #108 from keithchong/7267-DetailsPageForApplication
Add Application Detail Pages and Tabs (#7267)
2 parents b858b0b + 269af6b commit 7de34b6

35 files changed

+3353
-23
lines changed

console-extensions.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -333,6 +333,24 @@
333333
}
334334
}
335335
},
336+
{
337+
"type": "console.page/resource/details",
338+
"flags": {
339+
"required": [
340+
"APPLICATION"
341+
]
342+
},
343+
"properties": {
344+
"model": {
345+
"group": "argoproj.io",
346+
"kind": "Application",
347+
"version": "v1alpha1"
348+
},
349+
"component": {
350+
"$codeRef": "ApplicationDetails"
351+
}
352+
}
353+
},
336354
{
337355
"type": "console.page/resource/list",
338356
"flags": {

plugin-metadata.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ const metadata: ConsolePluginBuildMetadata = {
1414
"gitopsFlags": "./components/utils/flags",
1515
"topology": "./components/topology",
1616
ApplicationList: "./gitops/components/application/ApplicationListTab.tsx",
17+
ApplicationDetails: "./gitops/components/application/ApplicationNavPage.tsx",
1718
ApplicationSetList: "./gitops/components/application/ApplicationSetListTab.tsx",
1819
yamlApplicationTemplates: "./gitops/components/application/templates/index.ts"
1920
}

src/gitops/Revision/Revision.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,22 @@ interface RevisionProps {
77
repoURL: string;
88
revision: string;
99
helm: boolean;
10+
revisionExtra?: string;
1011
}
1112

12-
const Revision: React.FC<RevisionProps> = ({ repoURL, revision, helm }) => {
13+
const Revision: React.FC<RevisionProps> = ({ repoURL, revision, helm, revisionExtra }) => {
1314
if (revision) {
1415
return (
1516
<>
1617
{!helm && (
17-
<ExternalLink href={createRevisionURL(repoURL, revision)}>
18-
({revision.substring(0, 7) || ''})
19-
</ExternalLink>
18+
<span>
19+
<ExternalLink href={createRevisionURL(repoURL, revision)}>
20+
({revision.substring(0, 7) || ''})
21+
</ExternalLink>
22+
{revisionExtra && revisionExtra}
23+
</span>
2024
)}
21-
{helm && <span>{revision}</span>}
25+
{helm && <span>({revision.substring(0, 7) || ''})</span>}
2226
</>
2327
);
2428
} else {

src/gitops/Statuses/HealthStatus.tsx

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,11 @@ import {
66
HealthProgressingIcon,
77
HealthSuspendedIcon,
88
HealthUnknownIcon,
9+
SpinningIcon,
910
} from 'src/gitops/utils/components/Icons/Icons';
1011
import { HealthStatus as HS } from 'src/gitops/utils/constants';
1112

13+
import { COLORS } from '@gitops/components/shared/colors';
1214
import { Button, Popover } from '@patternfly/react-core';
1315

1416
interface HealthProps {
@@ -64,4 +66,50 @@ const HealthStatus: React.FC<HealthProps> = ({ status, message }) => {
6466
return <div>{showStatus}</div>;
6567
};
6668

69+
export type HealthStatusCode =
70+
| 'Unknown'
71+
| 'Progressing'
72+
| 'Healthy'
73+
| 'Suspended'
74+
| 'Degraded'
75+
| 'Missing';
76+
77+
export interface HealthStatusModel {
78+
status: HealthStatusCode;
79+
message: string;
80+
}
81+
82+
export const HealthStatusIcon = ({ status }: { status: HealthStatusCode }) => {
83+
let color = COLORS.health.unknown;
84+
let icon = 'fa-question-circle';
85+
86+
switch (status) {
87+
case HS.HEALTHY:
88+
color = COLORS.health.healthy;
89+
icon = 'fa-heart';
90+
break;
91+
case HS.SUSPENDED:
92+
color = COLORS.health.suspended;
93+
icon = 'fa-pause-circle';
94+
break;
95+
case HS.DEGRADED:
96+
color = COLORS.health.degraded;
97+
icon = 'fa-heart-broken';
98+
break;
99+
case HS.PROGRESSING:
100+
color = COLORS.health.progressing;
101+
icon = `fa fa-circle-notch fa-spin`;
102+
break;
103+
case HS.MISSING:
104+
color = COLORS.health.missing;
105+
icon = 'fa-ghost';
106+
break;
107+
}
108+
return icon.includes('fa-spin') ? (
109+
<SpinningIcon color={color} title={status} />
110+
) : (
111+
<i title={status} className={'fa ' + icon + ' utils-health-status-icon'} style={{ color }} />
112+
);
113+
};
114+
67115
export default HealthStatus;

0 commit comments

Comments
 (0)