diff --git a/web/package/agama-web-ui.changes b/web/package/agama-web-ui.changes index 5180e3718f..c4f191b405 100644 --- a/web/package/agama-web-ui.changes +++ b/web/package/agama-web-ui.changes @@ -1,3 +1,9 @@ +------------------------------------------------------------------- +Mon Feb 24 12:44:15 UTC 2025 - David Diaz + +- Prevented table overflow to avoid hiding the actions column + (gh#agama-project/agama#2044). + ------------------------------------------------------------------- Mon Feb 24 08:50:54 UTC 2025 - Ancor Gonzalez Sosa diff --git a/web/src/components/network/ConnectionsTable.tsx b/web/src/components/network/ConnectionsTable.tsx index b50c66160e..f3c8575cdb 100644 --- a/web/src/components/network/ConnectionsTable.tsx +++ b/web/src/components/network/ConnectionsTable.tsx @@ -1,5 +1,5 @@ /* - * Copyright (c) [2023-2024] SUSE LLC + * Copyright (c) [2023-2025] SUSE LLC * * All Rights Reserved. * @@ -30,6 +30,7 @@ import { NETWORK as PATHS } from "~/routes/paths"; import { formatIp } from "~/utils/network"; import { sprintf } from "sprintf-js"; import { _ } from "~/i18n"; +import { Stack, StackItem } from "@patternfly/react-core"; type ConnectionsTableProps = { connections: Connection[]; @@ -37,6 +38,21 @@ type ConnectionsTableProps = { onForget?: (connection: Connection) => void; }; +const IPAddresses = ({ devices, connection }: { devices: Device[]; connection: Connection }) => { + const device = devices.find( + ({ connection: deviceConnectionId }) => deviceConnectionId === connection.id, + ); + const addresses = device ? device.addresses : connection.addresses; + + return ( + + {addresses.map((address, index) => ( + {formatIp(address)} + ))} + + ); +}; + /** * * Displays given connections in a table @@ -50,14 +66,6 @@ const ConnectionsTable = ({ const navigate = useNavigate(); if (connections.length === 0) return null; - const connectionDevice = ({ id }) => devices.find(({ connection }) => id === connection); - const connectionAddresses = (connection: Connection) => { - const device = connectionDevice(connection); - const addresses = device ? device.addresses : connection.addresses; - - return addresses?.map(formatIp).join(", "); - }; - return ( @@ -93,7 +101,9 @@ const ConnectionsTable = ({ return ( - + - + {/* TRANSLATORS: usually just keep the original text */} {/* iBFT = iSCSI Boot Firmware Table, HW support for booting from iSCSI */} @@ -70,7 +72,7 @@ export default function InitiatorPresenter({ initiator }) { - +
{connection.id}{connectionAddresses(connection)} + + { return (
{initiator.name} + {initiator.name} + {initiator.ibft ? _("Yes") : _("No")}
{_("Name")} {_("iBFT")}{_("Offload card")}{_("Offload card")}