renderTable()

in uui-docs/src/peContexts/PagePanelContext.tsx [22:96]

• 75 lines of code
• 1 McCabe index (conditional complexity)

    renderTable(item: (typeof items)[number]) {
        return (
            <React.Fragment>
                <FlexRow padding="12" borderBottom>
                    <Text fontWeight="600">{item.country}</Text>
                </FlexRow>
                <FlexRow padding="12" background="surface-main" borderBottom>
                    <FlexCell minWidth={ 100 } grow={ 4 }>
                        <Text fontWeight="600" size="24">
                            Column1
                        </Text>
                    </FlexCell>
                    <FlexCell grow={ 3 }>
                        <Text fontWeight="600" size="24">
                            Column2
                        </Text>
                    </FlexCell>
                    <FlexCell grow={ 2 }>
                        <Text fontWeight="600" size="24">
                            Column3
                        </Text>
                    </FlexCell>
                    <FlexCell grow={ 1 }>
                        <Text fontWeight="600" size="24">
                            Column3
                        </Text>
                    </FlexCell>
                </FlexRow>
                <FlexRow padding="12" size="36" borderBottom>
                    <FlexCell minWidth={ 100 } grow={ 4 }>
                        <Text size="24">Republic Cruiser</Text>
                    </FlexCell>
                    <FlexCell grow={ 3 }>
                        <Text size="24">{item.country}</Text>
                    </FlexCell>
                    <FlexCell grow={ 2 }>
                        <Text size="24">1234</Text>
                    </FlexCell>
                    <FlexCell grow={ 1 }>
                        <Text size="24">B1</Text>
                    </FlexCell>
                </FlexRow>
                <FlexRow padding="12" size="36" borderBottom>
                    <FlexCell minWidth={ 100 } grow={ 4 }>
                        <Text size="24">Calamari Cruiser</Text>
                    </FlexCell>
                    <FlexCell grow={ 3 }>
                        <Text size="24">{item.country}</Text>
                    </FlexCell>
                    <FlexCell grow={ 2 }>
                        <Text size="24">1020</Text>
                    </FlexCell>
                    <FlexCell grow={ 1 }>
                        <Text size="24">B1</Text>
                    </FlexCell>
                </FlexRow>
                <FlexRow padding="12" size="36" borderBottom>
                    <FlexCell minWidth={ 100 } grow={ 4 }>
                        <Text size="24">Naboo Royal Starship</Text>
                    </FlexCell>
                    <FlexCell grow={ 3 }>
                        <Text fontWeight="600" size="24">
                            {item.country}
                        </Text>
                    </FlexCell>
                    <FlexCell grow={ 2 }>
                        <Text size="24">1050</Text>
                    </FlexCell>
                    <FlexCell grow={ 1 }>
                        <Text size="24">B1</Text>
                    </FlexCell>
                </FlexRow>
            </React.Fragment>
        );
    }