function getKubernetesTable()

in karavan-web/karavan-app/src/main/webui/src/dashboard/DashboardPage.tsx [229:302]
72 lines of code
8 McCabe index (conditional complexity)

    function getKubernetesTable() {
        const deps = Array.from(new Set(deployments.filter(d => d.name.toLowerCase().includes(filter)).map(d => d.name)));
        return (
            <TableComposable aria-label="Projects" variant={TableVariant.compact}>
                <Thead>
                    <Tr>
                        <Th key='type'>Type</Th>
                        <Th key='name'>Deployment</Th>
                        <Th key='description'>Project/Description</Th>
                        <Th key='environment'>Environment</Th>
                        <Th key='namespace'>Namespace</Th>
                        <Th key='replicas'>Replicas</Th>
                        <Th key='services'>Services</Th>
                        <Th key='camel'>Camel Health</Th>
                        {/*<Th key='action'></Th>*/}
                    </Tr>
                </Thead>
                <Tbody>
                    {deps.map(deployment => (
                        <Tr key={deployment}>
                            <Td style={{verticalAlign: "middle"}}>
                                {isKaravan(deployment) ? Icon("icon") : CamelUi.getIconFromSource(camelIcon)}
                            </Td>
                            <Td style={{verticalAlign: "middle"}}>
                                <Button style={{padding: '6px'}} variant={"link"}>{deployment}</Button>
                            </Td>
                            <Td style={{verticalAlign: "middle"}}>
                                <HelperText>
                                    <HelperTextItem>{getProject(deployment)?.name || ""}</HelperTextItem>
                                    <HelperTextItem>{getProject(deployment)?.description || "Camel project"}</HelperTextItem>
                                </HelperText>
                            </Td>
                            <Td>
                                <Flex direction={{default: "column"}}>
                                    {getDeploymentEnvironments(deployment).map(value => (
                                        <FlexItem className="badge-flex-item" key={value[0]}><Badge className="badge"
                                                                                                    isRead={!value[1]}>{value[0]}</Badge></FlexItem>
                                    ))}
                                </Flex>
                            </Td>
                            <Td>
                                <Flex direction={{default: "column"}}>
                                    {getServiceByEnvironments(deployment).map(value => (
                                        <FlexItem className="badge-flex-item" key={value[0]}>
                                            <Label variant={"outline"}>
                                                {value[1] ? (value[1]?.port + " -> " + value[1]?.targetPort) : "???"}
                                            </Label>
                                        </FlexItem>
                                    ))}
                                </Flex>
                            </Td>
                            <Td modifier={"fitContent"}>
                                <Flex direction={{default: "column"}}>
                                    {getCamelStatusByEnvironments(deployment).map(value => {
                                        // const color = value[1] ? (value[1].consumerStatus === "UP" ? "green" : "red") : "grey";
                                        // let icon = undefined;
                                        // if (value[1]?.consumerStatus === "UP") icon = <UpIcon/>
                                        // if (value[1]?.consumerStatus === "DOWN") icon = <DownIcon/>
                                        // const text = value[1] && value[1]?.contextVersion ? value[1]?.contextVersion : "???";
                                        return <FlexItem key={value[0]}>
                                            {/*<LabelGroup numLabels={4} className="camel-label-group">*/}
                                            {/*    <Label color={color} className="table-label" icon={icon}>{text}</Label>*/}
                                            {/*</LabelGroup>*/}
                                        </FlexItem>
                                    })}
                                </Flex>
                            </Td>
                        </Tr>
                    ))}
                    {deps.length === 0 && getEmptyState()}
                </Tbody>
            </TableComposable>
        )
    }