diff --git a/src/@types/index.ts b/src/@types/index.ts index 5ba3da0..98d4eb1 100644 --- a/src/@types/index.ts +++ b/src/@types/index.ts @@ -74,6 +74,7 @@ export interface Network { export interface Summary { component: string status: State + version?: string } export interface NetworkSummary { diff --git a/src/pages/index.tsx b/src/pages/index.tsx index b3c47fb..8908e6f 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -70,8 +70,10 @@ export default function HomePage(): ReactElement { key={value.component} className={`${styles.card} ${statusStyle(value.status)}`} > -
{value?.status}
+{value.version}
))}
diff --git a/src/styles/Home.module.css b/src/styles/Home.module.css
index 0134489..6c9dfca 100644
--- a/src/styles/Home.module.css
+++ b/src/styles/Home.module.css
@@ -40,19 +40,25 @@
text-align: left;
color: inherit;
text-decoration: none;
- border-radius: 10px;
- transition: color 0.15s ease, border-color 0.15s ease;
+ border-radius: var(--border-radius);
+ border: 2px solid var(--border-color);
}
.card h2 {
margin: 0 0 1rem 0;
- font-size: 1.5rem;
+ font-size: var(--font-size-large);
}
-.card p {
- margin: 0;
- font-size: 1.25rem;
- line-height: 1.5;
+.warning {
+ border-color: var(--brand-alert-yellow);
+}
+
+.down {
+ border-color: var(--brand-alert-red);
+}
+
+.version {
+ color: var(--color-secondary);
}
.logo {
@@ -61,15 +67,3 @@
width: 4rem;
margin: 0 auto;
}
-
-.up {
- border: 2px solid #5fb359;
-}
-
-.warning {
- border: 2px solid #eac146;
-}
-
-.down {
- border: 2px solid #d80606;
-}
diff --git a/src/utils/getData.ts b/src/utils/getData.ts
index a05af55..5cf2571 100644
--- a/src/utils/getData.ts
+++ b/src/utils/getData.ts
@@ -28,19 +28,40 @@ export function getSummary(network: string, data: Status[][]): Summary[] {
if (element[0].network === network) return (status = element[0])
})
+ // TODO: this is not fun. Needs a smart iteration over response instead of
+ // aall this hardcoding
const summary: Summary[] = [
- { component: 'Aquarius', status: status?.aquarius?.status },
- { component: 'Provider', status: status?.provider?.status },
- { component: 'Subgraph', status: status?.subgraph?.status },
- { component: 'Market', status: status?.market },
- { component: 'Port', status: status?.port },
+ {
+ component: 'Aquarius',
+ status: status?.aquarius?.status,
+ version: status?.aquarius?.version
+ },
+ {
+ component: 'Provider',
+ status: status?.provider?.status,
+ version: status?.provider?.version
+ },
+ {
+ component: 'Subgraph',
+ status: status?.subgraph?.status,
+ version: status?.subgraph?.version
+ },
+ {
+ component: 'Market',
+ status: status?.market
+ },
+ {
+ component: 'Port',
+ status: status?.port
+ },
{
component: 'Data Farming',
status: status?.dataFarming
},
{
component: 'Operator Service',
- status: status?.operator?.status
+ status: status?.operator?.status,
+ version: status?.operator?.version
},
{
component: 'DAO Grants',
@@ -63,6 +84,7 @@ export function getSummary(network: string, data: Status[][]): Summary[] {
export function getNetworkSUmmary(data: Status[][]): NetworkSummary[] {
const networks: string[] = JSON.parse(availableNetworks)
const networkSummary: NetworkSummary[] = []
+
networks.forEach((network) => {
const summary = getSummary(network, data)
let status = State.Up