diff --git a/CHANGELOG.md b/CHANGELOG.md index 5ed967fea..280fddb0f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -32,6 +32,7 @@ NOTE: As semantic versioning states all 0.y.z releases can contain breaking chan - [#230](https://github.com/kobsio/kobs/pull/230): [dashboards] Add special variables `__timeStart` and `__timeEnd` for dashboards. - [#231](https://github.com/kobsio/kobs/pull/231): [klogs] Highlight expanded row and do not use index as key. The same changes were also applied for the Elasticsearch plugin. - [#232](https://github.com/kobsio/kobs/pull/232): [core] Change options handling for various plugins. +- [#233](https://github.com/kobsio/kobs/pull/233): [resources] Highlight expanded row for containers in Pod details. ## [v0.7.0](https://github.com/kobsio/kobs/releases/tag/v0.7.0) (2021-11-19) diff --git a/plugins/azure/src/components/containerinstances/DetailsContainerGroup.tsx b/plugins/azure/src/components/containerinstances/DetailsContainerGroup.tsx index 96d911e7f..a2a4b90be 100644 --- a/plugins/azure/src/components/containerinstances/DetailsContainerGroup.tsx +++ b/plugins/azure/src/components/containerinstances/DetailsContainerGroup.tsx @@ -175,12 +175,8 @@ const DetailsContainerGroup: React.FunctionComponent - {data.properties?.initContainers?.map((initContainer, index) => ( - + {data.properties?.initContainers?.map((initContainer) => ( + ))} @@ -202,8 +198,8 @@ const DetailsContainerGroup: React.FunctionComponentPrevious State - {data.properties?.containers?.map((container, index) => ( - + {data.properties?.containers?.map((container) => ( + ))} diff --git a/plugins/azure/src/components/containerinstances/DetailsContainerGroupContainer.tsx b/plugins/azure/src/components/containerinstances/DetailsContainerGroupContainer.tsx index adb184564..d861c319d 100644 --- a/plugins/azure/src/components/containerinstances/DetailsContainerGroupContainer.tsx +++ b/plugins/azure/src/components/containerinstances/DetailsContainerGroupContainer.tsx @@ -11,27 +11,21 @@ import DetailsContainerGroupEvent from './DetailsContainerGroupEvent'; import { IContainer } from './interfaces'; interface IDetailsContainerGroupContainerProps { - rowIndex: number; container: IContainer; } const DetailsContainerGroupContainer: React.FunctionComponent = ({ - rowIndex, container, }: IDetailsContainerGroupContainerProps) => { - const [isExpanded, setIsExpaned] = useState(false); + const [isExpanded, setIsExpanded] = useState(false); return ( - + setIsExpaned(!isExpanded), - rowIndex: rowIndex, - }} + expand={{ isExpanded: isExpanded, onToggle: (): void => setIsExpanded(!isExpanded), rowIndex: 0 }} /> {container.name} {container.properties?.instanceView?.restartCount || '-'} diff --git a/plugins/azure/src/components/containerinstances/DetailsContainerGroupInitContainer.tsx b/plugins/azure/src/components/containerinstances/DetailsContainerGroupInitContainer.tsx index d9a9b91db..2133beaf6 100644 --- a/plugins/azure/src/components/containerinstances/DetailsContainerGroupInitContainer.tsx +++ b/plugins/azure/src/components/containerinstances/DetailsContainerGroupInitContainer.tsx @@ -11,27 +11,21 @@ import DetailsContainerGroupEvent from './DetailsContainerGroupEvent'; import { IInitContainer } from './interfaces'; interface IDetailsContainerGroupInitContainerProps { - rowIndex: number; initContainer: IInitContainer; } const DetailsContainerGroupInitContainer: React.FunctionComponent = ({ - rowIndex, initContainer, }: IDetailsContainerGroupInitContainerProps) => { - const [isExpanded, setIsExpaned] = useState(false); + const [isExpanded, setIsExpanded] = useState(false); return ( - + setIsExpaned(!isExpanded), - rowIndex: rowIndex, - }} + expand={{ isExpanded: isExpanded, onToggle: (): void => setIsExpanded(!isExpanded), rowIndex: 0 }} /> {initContainer.name} {initContainer.properties?.instanceView?.restartCount || '-'} diff --git a/plugins/azure/src/components/kubernetesservices/DetailsNodePools.tsx b/plugins/azure/src/components/kubernetesservices/DetailsNodePools.tsx index f38d4af76..7440423a2 100644 --- a/plugins/azure/src/components/kubernetesservices/DetailsNodePools.tsx +++ b/plugins/azure/src/components/kubernetesservices/DetailsNodePools.tsx @@ -94,10 +94,9 @@ const DetailsNodePools: React.FunctionComponent = ({ - {data.map((nodePool, index) => ( + {data.map((nodePool) => ( = ({ - rowIndex, name, resourceGroup, managedCluster, nodeResourceGroup, nodePool, }: IDetailsNodePoolsItemProps) => { - const [isExpanded, setIsExpaned] = useState(false); + const [isExpanded, setIsExpanded] = useState(false); return ( - + setIsExpaned(!isExpanded), - rowIndex: rowIndex, - }} + expand={{ isExpanded: isExpanded, onToggle: (): void => setIsExpanded(!isExpanded), rowIndex: 0 }} /> {nodePool.name || '-'} {nodePool.properties?.provisioningState || '-'} diff --git a/plugins/azure/src/components/virtualmachinescalesets/DetailsVirtualMachines.tsx b/plugins/azure/src/components/virtualmachinescalesets/DetailsVirtualMachines.tsx index 223f91ba8..b526542d6 100644 --- a/plugins/azure/src/components/virtualmachinescalesets/DetailsVirtualMachines.tsx +++ b/plugins/azure/src/components/virtualmachinescalesets/DetailsVirtualMachines.tsx @@ -87,10 +87,9 @@ const DetailsVirtualMachines: React.FunctionComponentLatest Model - {data.map((virtualMachine, index) => ( + {data.map((virtualMachine) => ( = ({ - rowIndex, name, resourceGroup, virtualMachineScaleSet, virtualMachine, }: IDetailsVirtualMachinesItemProps) => { - const [isExpanded, setIsExpaned] = useState(false); + const [isExpanded, setIsExpanded] = useState(false); return ( - + setIsExpaned(!isExpanded), - rowIndex: rowIndex, - }} + expand={{ isExpanded: isExpanded, onToggle: (): void => setIsExpanded(!isExpanded), rowIndex: 0 }} /> {virtualMachine.name || '-'} {virtualMachine.properties?.osProfile?.computerName || '-'} diff --git a/plugins/harbor/src/components/panel/details/Vulnerabilities.tsx b/plugins/harbor/src/components/panel/details/Vulnerabilities.tsx index 0d7d46519..bcfc47eb1 100644 --- a/plugins/harbor/src/components/panel/details/Vulnerabilities.tsx +++ b/plugins/harbor/src/components/panel/details/Vulnerabilities.tsx @@ -70,7 +70,7 @@ const Vulnerabilities: React.FunctionComponent = ({

{error?.message}

) : data ? ( - + diff --git a/plugins/harbor/src/components/panel/details/VulnerabilitiesRow.tsx b/plugins/harbor/src/components/panel/details/VulnerabilitiesRow.tsx index 02020f979..9a20f8664 100644 --- a/plugins/harbor/src/components/panel/details/VulnerabilitiesRow.tsx +++ b/plugins/harbor/src/components/panel/details/VulnerabilitiesRow.tsx @@ -1,5 +1,5 @@ +import { ExpandableRowContent, Tbody, Td, Tr } from '@patternfly/react-table'; import React, { useState } from 'react'; -import { Tbody, Td, Tr } from '@patternfly/react-table'; import { COLOR_DANGER, COLOR_INFO, COLOR_WARNING } from '../../../utils/helpers'; import { IVulnerabilityDetails } from '../../../utils/interfaces'; @@ -38,7 +38,7 @@ const VulnerabilitiesRow: React.FunctionComponent = ({ const [isExpanded, setIsExpanded] = useState(false); return ( - + = ({ {vulnerability.fix_version} - - {vulnerability.description} + + {vulnerability.description} + ); diff --git a/plugins/resources/src/components/page/Page.tsx b/plugins/resources/src/components/page/Page.tsx index c7bc27eab..5b798cefa 100644 --- a/plugins/resources/src/components/page/Page.tsx +++ b/plugins/resources/src/components/page/Page.tsx @@ -54,7 +54,7 @@ const Page: React.FunctionComponent = ({ name, displayName, de - {options.clusters.length === 0 || options.namespaces.length === 0 || options.resources.length === 0 ? ( + {options.clusters.length === 0 || options.resources.length === 0 ? (

Select a list of clusters, resources and namespaces from the toolbar.

diff --git a/plugins/resources/src/components/panel/details/overview/Container.tsx b/plugins/resources/src/components/panel/details/overview/Container.tsx index 896165ad3..b063817fb 100644 --- a/plugins/resources/src/components/panel/details/overview/Container.tsx +++ b/plugins/resources/src/components/panel/details/overview/Container.tsx @@ -4,7 +4,7 @@ import { DescriptionListGroup, DescriptionListTerm, } from '@patternfly/react-core'; -import { ExpandableRowContent, Td, Tr } from '@patternfly/react-table'; +import { ExpandableRowContent, Tbody, Td, Tr } from '@patternfly/react-table'; import React, { useState } from 'react'; import { V1Container, V1ContainerState, V1ContainerStatus, V1EnvVarSource, V1Probe } from '@kubernetes/client-node'; @@ -111,11 +111,16 @@ const Container: React.FunctionComponent = ({ containerStatus, containerMetric, }: IContainerProps) => { - const [isExpanded, setIsExpaned] = useState(false); + const [isExpanded, setIsExpanded] = useState(false); return ( - - setIsExpaned(!isExpanded)}> + + + setIsExpanded(!isExpanded), rowIndex: 0 }} + /> {container.name} {containerStatus && containerStatus.ready ? 'True' : 'False'} {containerStatus ? containerStatus.restartCount : 0} @@ -154,7 +159,7 @@ const Container: React.FunctionComponent = ({ - + @@ -224,7 +229,7 @@ const Container: React.FunctionComponent = ({ - + ); }; diff --git a/plugins/resources/src/components/panel/details/overview/Containers.tsx b/plugins/resources/src/components/panel/details/overview/Containers.tsx index 34a041566..4ee2c5bdb 100644 --- a/plugins/resources/src/components/panel/details/overview/Containers.tsx +++ b/plugins/resources/src/components/panel/details/overview/Containers.tsx @@ -1,4 +1,4 @@ -import { TableComposable, TableVariant, Tbody, Th, Thead, Tr } from '@patternfly/react-table'; +import { TableComposable, TableVariant, Th, Thead, Tr } from '@patternfly/react-table'; import { V1Container, V1ContainerStatus } from '@kubernetes/client-node'; import React from 'react'; import { Title } from '@patternfly/react-core'; @@ -52,9 +52,10 @@ const Containers: React.FunctionComponent = ({ {title} - + + Name Ready Restarts @@ -67,16 +68,15 @@ const Containers: React.FunctionComponent = ({ Memory Limits - - {containers.map((container) => ( - - ))} - + + {containers.map((container) => ( + + ))} );