This is an automated email from the ASF dual-hosted git repository.
devesh pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ozone.git
The following commit(s) were added to refs/heads/master by this push:
new d68bd23341 HDDS-10852. Recon Heatmap - Not allowing user to select
timerange if no data available (#6674)
d68bd23341 is described below
commit d68bd23341a882ffe87222bddac656885b3f2851
Author: Smita <[email protected]>
AuthorDate: Tue Jun 18 11:29:51 2024 +0530
HDDS-10852. Recon Heatmap - Not allowing user to select timerange if no
data available (#6674)
Thanks @smitajoshi12 for working on this patch. Thanks @devabhishekpal and
@ArafatKhan2198 for review.
---
.../ozone-recon-web/src/views/heatMap/heatmap.tsx | 65 ++++++++++++----------
1 file changed, 37 insertions(+), 28 deletions(-)
diff --git
a/hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/heatMap/heatmap.tsx
b/hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/heatMap/heatmap.tsx
index 3d9280a117..c7e728efd3 100644
---
a/hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/heatMap/heatmap.tsx
+++
b/hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/heatMap/heatmap.tsx
@@ -364,6 +364,32 @@ export class Heatmap extends
React.Component<Record<string, object>, ITreeState>
</Menu>
);
+ const headerMenu = (
+ <Row>
+ <div className='go-back-button'>
+ <Button type='primary' onClick={e => this.resetInputpath(e,
inputPath)}><Icon type='undo' /></Button>
+ </div>
+ <div className='path-input-container'>
+ <h4 style={{ marginTop: "10px" }}>Path</h4>
+ <form className='input' autoComplete="off" id='input-form'
onSubmit={this.handleSubmit}>
+ <Form.Item className='path-input-element'
validateStatus={inputPathValid} help={helpMessage}>
+ <Input placeholder={CONSTANTS.ROOT_PATH} name="inputPath"
value={inputPath} onChange={this.handleChange} />
+ </Form.Item>
+ </form>
+ </div>
+ <div className='entity-dropdown-button'>
+ <Dropdown overlay={entityTypeMenu} placement='bottomCenter'>
+ <Button>Entity Type: {this.state.entityType}<DownOutlined
/></Button>
+ </Dropdown>
+ </div>
+ <div className='date-dropdown-button'>
+ <Dropdown overlay={menuCalendar} placement='bottomLeft'>
+ <Button>Last {date > 100 ? new Date(date *
1000).toLocaleString() : date}<DownOutlined /></Button>
+ </Dropdown>
+ </div>
+ </Row>
+ );
+
return (
<>
{isLoading ? <span><Icon type='loading' /> Loading...</span> : (
@@ -385,31 +411,9 @@ export class Heatmap extends
React.Component<Record<string, object>, ITreeState>
title="Failed to fetch Heatmap"/>
:
(Object.keys(treeResponse).length > 0 &&
(treeResponse.label !== null || treeResponse.path !== null)) ?
- <div>
+ <>
<div className='heatmap-header-container'>
- <Row>
- <div className='go-back-button'>
- <Button type='primary' onClick={e =>
this.resetInputpath(e, inputPath)}><Icon type='undo' /></Button>
- </div>
- <div className='path-input-container'>
- <h4 style={{ marginTop: "10px" }}>Path</h4>
- <form className='input' autoComplete="off"
id='input-form' onSubmit={this.handleSubmit}>
- <Form.Item className='path-input-element'
validateStatus={inputPathValid} help={helpMessage}>
- <Input placeholder={CONSTANTS.ROOT_PATH}
name="inputPath" value={inputPath} onChange={this.handleChange} />
- </Form.Item>
- </form>
- </div>
- <div className='entity-dropdown-button'>
- <Dropdown overlay={entityTypeMenu}
placement='bottomCenter'>
- <Button>Entity
Type: {this.state.entityType}<DownOutlined /></Button>
- </Dropdown>
- </div>
- <div className='date-dropdown-button'>
- <Dropdown overlay={menuCalendar}
placement='bottomLeft'>
- <Button>Last {date > 100 ? new
Date(date * 1000).toLocaleString() : date}<DownOutlined /></Button>
- </Dropdown>
- </div>
- </Row>
+ {headerMenu}
<div className='heatmap-legend-container'>
<div className='heatmap-legend-item'>
<div style={{ width: "13px", height: "13px",
backgroundColor: `${colourScheme["amber_alert"][0]}`, marginRight: "5px" }}>
</div>
@@ -428,11 +432,16 @@ export class Heatmap extends
React.Component<Record<string, object>, ITreeState>
<div id="heatmap-chart-container">
<HeatMapConfiguration data={treeResponse}
colorScheme={colourScheme["amber_alert"]}
onClick={this.updateTreemapParent}></HeatMapConfiguration>
</div>
- </div>
+ </>
:
- <div className='heatmapinformation'><br />
- No Data Available. {' '}<br />
- </div>
+ <>
+ <div className='heatmap-header-container'>
+ {headerMenu}
+ </div>
+ <div className='heatmapinformation'>
+ No Data Available . {' '}<br />
+ </div>
+ </>
}</>}
</div>
</div>
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
