Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • andersharrisson/ce-deploy-ui
  • ccce/dev/ce-deploy-ui
2 results
Show changes
Commits on Source (2)
Hide whitespace changes
Inline Side-by-side
src/components/IOC/IOCTable.js
View file @ 5986da0e
......@@ -3,13 +3,14 @@ import { CustomTable } from "../common/table/CustomTable";
import { Grid, Tooltip } from "@material-ui/core";
import { useHistory } from 'react-router-dom';
import { IOCStatusIcon } from './IOCIcons';
import { noWrapText } from '../common/Helper';
const ownIocsColumns = [
{ id: "status", label: 'Status', width: '8%' },
{ id: "namingName", label: 'IOC name', width: '20%', sortable: false },
{ id: "host", label: 'Host', width: '15%', sortable: false },
{ id: "network", label: 'Network', width: '15%', sortable: false },
{ id: "sourceVersion", label: 'Git reference', width: '42%', sortable: false },
{ id: "sourceVersion", label: 'Git reference', width: '8%', sortable: false },
]
const exploreIocsColumns = [
......@@ -18,13 +19,13 @@ const exploreIocsColumns = [
{ id: "host", label: 'Host', width: '15%', sortable: false },
{ id: "network", label: 'Network', width: '15%', sortable: false },
{ id: "owner", label: 'Owner', width: '10%', sortable: true },
{ id: "sourceVersion", label: 'Git reference', width: '32%', sortable: true },
{ id: "sourceVersion", label: 'Git reference', width: '8%', sortable: true },
]
const hostDetailsColumns = [
{ id: "status", label: 'Status', width: '8%' },
{ id: "name", label: 'Name', width: '30%', sortable: false },
{ id: "sourceVersion", label: 'Git reference', width: '62%', sortable: false },
{ id: "namingName", label: 'Name', width: '30%', sortable: false },
{ id: "sourceVersion", label: 'Git reference', width: '8%', sortable: false },
]
function createGitVersionField(version, shortVersion) {
......@@ -32,7 +33,7 @@ function createGitVersionField(version, shortVersion) {
<>
{version ?
<Tooltip title={version} arrow enterDelay={400}>
<label>{shortVersion ?? version}</label>
<label>{noWrapText(shortVersion ?? version)}</label>
</Tooltip>
: "---"
}
......@@ -40,6 +41,8 @@ function createGitVersionField(version, shortVersion) {
)
}
function createTableRowForHostDetails(ioc) {
const { id, name, namingName, sourceVersion, sourceVersionShort, alert } = ioc;
......@@ -49,7 +52,7 @@ function createTableRowForHostDetails(ioc) {
<Grid container direction="column" justifyContent="center" alignItems="center">
<IOCStatusIcon ioc={ioc} />
</Grid>,
name: namingName ?? name,
namingName: noWrapText(namingName ?? name),
sourceVersion: createGitVersionField(sourceVersion, sourceVersionShort),
discrepancy: alert === "WARNING",
inconsistentState: alert === "ERROR",
......@@ -65,10 +68,10 @@ function createTableRowForOwnIocs(ioc) {
<Grid container direction="column" justifyContent="center" alignItems="center">
<IOCStatusIcon ioc={ioc} />
</Grid>,
namingName: namingName ?? "---",
namingName: noWrapText(namingName ?? "---"),
sourceVersion: createGitVersionField(sourceVersion, sourceVersionShort),
host: (activeDeployment?.host.hostName || "---"),
network: (activeDeployment?.host.network || "---"),
host: noWrapText(activeDeployment?.host.hostName || "---"),
network: noWrapText(activeDeployment?.host.network || "---"),
discrepancy: alert === "WARNING",
inconsistentState: alert === "ERROR",
iocNotDeployed: !ioc.activeDeployment
......@@ -77,18 +80,17 @@ function createTableRowForOwnIocs(ioc) {
function createTableRowForExploreIocs(ioc) {
const { id, namingName, owner, sourceVersion, sourceVersionShort, alert, host} = ioc;
return {
id: id,
status:
<Grid container direction="column" justifyContent="center" alignItems="center">
<IOCStatusIcon ioc={ioc} />
</Grid>,
namingName: namingName ?? "---",
namingName: noWrapText(namingName ?? "---"),
sourceVersion: createGitVersionField(sourceVersion, sourceVersionShort),
host: (host?.hostName || "---"),
network: (host?.network || "---"),
owner: (owner || "---"),
host: noWrapText(host?.hostName || "---"),
network: noWrapText(host?.network || "---"),
owner: noWrapText(owner || "---"),
discrepancy: alert === "WARNING",
inconsistentState: alert === "ERROR",
iocNotDeployed: !ioc.activeDeployment
......
src/components/common/Helper.js
View file @ 5986da0e
import React, { useState, useEffect } from "react";
import moment from 'moment';
import { alpha } from '@material-ui/core/styles/colorManipulator';
import { Typography } from "@material-ui/core";
export function formatToList(items) {
......@@ -140,3 +141,7 @@ export function transformHostQuery(query) {
return joinParts(parts, true);
}
export function noWrapText(text) {
return <Typography noWrap>{text}</Typography>;
}
src/components/deployments/DeploymentsTable.js
View file @ 5986da0e
......@@ -2,8 +2,8 @@ import React from 'react';
import { CustomTable } from "../common/table/CustomTable";
import { Grid, Tooltip } from "@material-ui/core";
import { DeploymentStatusIcon, DeploymentTypeIcon } from './DeploymentIcons';
import { useHistory } from 'react-router';
import { formatDate } from '../common/Helper';
import { useHistory } from 'react-router-dom';
import { formatDate, noWrapText } from '../common/Helper';
const formatDeploymentDate = (value) => {
if (value) {
......@@ -12,24 +12,20 @@ const formatDeploymentDate = (value) => {
return "Not started yet";
}
const dateTemplate = (rowData) => {
return formatDeploymentDate(rowData.start);
}
const columns = [
{ id: 'type', label: 'Type', width: '5%'},
{ id: 'ioc', label: 'IOC Name', width: '16%', sortable: true },
{ id: 'host', label: 'Host', width: '15%', sortable: false },
{ id: 'network', label: 'Network', width: '22%', sortable: false },
{ id: 'host', label: 'Host', width: '19%', sortable: false },
{ id: 'network', label: 'Network', width: '19%', sortable: false },
{ id: 'user', label: 'User', width: '12%', sortable: true },
{ id: 'version', label: 'Git reference', width: '15%', sortable: true },
{ id: 'start', label: 'Start date', width: '15%', body: dateTemplate, sortable: true }
{ id: 'start', label: 'Start date', width: '15%', sortable: true }
];
function createGitVersionField(version, shortVersion) {
return(
<Tooltip title={version} arrow enterDelay={400}>
<label>{shortVersion ?? version}</label>
<label>{noWrapText(shortVersion ?? version)}</label>
</Tooltip>
)
}
......@@ -45,12 +41,12 @@ function createTableRow(deployment) {
<Grid container direction="column" justifyContent="center" alignItems="center">
<DeploymentStatusIcon status={deployment.status}/>
</Grid>,
ioc: deployment.namingName,
ioc: noWrapText(deployment.namingName),
version: createGitVersionField(deployment.sourceVersion, deployment.sourceVersionShort),
host: deployment.host?.hostName ?? null,
network: deployment.host?.network ?? null,
user: deployment.createdBy,
start: deployment.startDate,
host: noWrapText(deployment.host?.hostName ?? null),
network: noWrapText(deployment.host?.network ?? null),
user: noWrapText(deployment.createdBy),
start: noWrapText(formatDeploymentDate(deployment.startDate)),
deploymentFailed: deployment.status === 'FAILED'
};
}
......
src/components/host/HostTable.js
View file @ 5986da0e
......@@ -3,6 +3,7 @@ import { Grid, Tooltip } from "@material-ui/core";
import { CustomTable } from '../common/table/CustomTable';
import { useHistory } from 'react-router-dom';
import { HostStatusIcon } from './HostIcons';
import { noWrapText } from '../common/Helper';
const columns = [
{ id: 'bulb', label: 'Status', width: '6%' },
......@@ -18,7 +19,7 @@ export function rowDescription(description) {
return (
<div className={'shortenLongDataLines'}>
<Tooltip title={description} arrow enterDelay={400}>
<label>{description}</label>
<label>{noWrapText(description)}</label>
</Tooltip>
</div>
);
......@@ -32,11 +33,11 @@ export function createRow(hostContainer) {
<Grid container direction="column" justifyContent="center" alignItems="center">
<HostStatusIcon host={hostContainer} />
</Grid>,
host: host.name,
host: noWrapText(host.name),
description: rowDescription(host.description),
network: host.network,
deviceType: host.deviceType,
scope: host.scope,
network: noWrapText(host.network),
deviceType: noWrapText(host.deviceType),
scope: noWrapText(host.scope),
discrepancy: hostContainer.alert === "WARNING",
inconsistentState: hostContainer.alert === "ERROR",
shortenLongData: true,
......