Discharge7443/fleet
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

Query Results: Render errors table on fullscreen (#807)

Browse Source 
* Render errors table on fullscreen
This commit is contained in:
RachelElysia
2021-05-20 11:43:12 -04:00
committed by GitHub
parent d50b48e7c2
commit 3286a9c4bc
2 changed files with 24 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/queries/QueryResultsTable/QueryResultsTable.jsx
+14 -18
View File
@@ -227,25 +227,21 @@ class QueryResultsTable extends Component {
{!hasNoResults && renderTable()}
</div>
{hasErrors && (
<>
<div className={`${baseClass}__error-table-container`}>
<header className={`${baseClass}__button-wrap`}>
<div>
<Button
className={`${baseClass}__export-btn`}
onClick={onExportErrorsResults}
variant="inverse"
>
Export errors
</Button>
</div>
</header>
<span className={`${baseClass}__table-title`}>Errors</span>
<div className={`${baseClass}__error-table-wrapper`}>
{renderErrorsTable()}
</div>
<div className={`${baseClass}__error-table-container`}>
<header className={`${baseClass}__button-wrap`}>
<Button
className={`${baseClass}__export-btn`}
onClick={onExportErrorsResults}
variant="inverse"
>
Export errors
</Button>
</header>
<span className={`${baseClass}__table-title`}>Errors</span>
<div className={`${baseClass}__error-table-wrapper`}>
{renderErrorsTable()}
</div>
</>
</div>
)}
</div>
);
frontend/components/queries/QueryResultsTable/_styles.scss
+10 -4
View File
@@ -39,7 +39,7 @@
border-radius: 3px;
overflow: scroll;
margin-top: $pad-xsmall;
min-height: 200px;
min-height: 100px;
max-height: 400px;
width: 100%;
@@ -57,17 +57,19 @@
&__error-table-container {
margin-top: $pad-large;
overflow: scroll;
}
&__error-table-wrapper {
display: flex;
border: solid 1px $ui-fleet-blue-15;
border-radius: 3px;
overflow: scroll;
margin-bottom: $pad-xxlarge;
margin-top: $pad-xsmall;
max-height: 200px;
min-height: 200px;
max-height: 400px;
width: 100%;
box-sizing: border-box;
}
&__table {
@@ -144,7 +146,11 @@
}
.query-results-table__error-table-container {
display: none;
max-height: none;
}
.query-results-table__error-table-wrapper {
max-height: none;
}
}