Verified Commit 983ce2d6 authored by Jelle van der Waa's avatar Jelle van der Waa 🚧
Browse files

Open only the first StatusSection by default

To limit rendering for example 14790 DOM elements on startup by having
the first suite expanded and the rest closed so the initial page load is
fast.
parent 66d1916c
Pipeline #3783 passed with stage
in 26 seconds
......@@ -20,8 +20,8 @@ class Body extends React.Component {
</div>
</section>
}
{suites.map(suite =>
<Section key={suite.name} suite={suite}/>
{suites.map((suite, index) =>
<Section key={suite.name} suite={suite} open={index < 1}/>
)}
</React.Fragment>
)
......
......@@ -29,7 +29,7 @@ function StatusSection(props) {
class Section extends React.Component {
render() {
const { suite } = this.props;
const { suite, open } = this.props;
const good = suite.pkgs.filter(pkg => pkg.status == "GOOD");
const bad = suite.pkgs.filter(pkg => pkg.status == "BAD");
const unknown = suite.pkgs.filter(pkg => pkg.status == "UNKWN");
......@@ -37,7 +37,7 @@ class Section extends React.Component {
return (
<section key={suite.name} className="section pt-4 pb-4">
<div className="tile box has-background-info">
<Collapsible trigger={ name } open>
<Collapsible trigger={ name } lazyRender open={open}>
{good.length > 0 && <StatusSection label="good" pkgs={ good } />}
{bad.length > 0 && <StatusSection label="bad" pkgs={ bad } open />}
{unknown.length > 0 && <StatusSection label="unknown" pkgs={ unknown } open />}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment