renevan10 commented on a change in pull request #8484: Web console: Druid 
status displayed in a table
URL: https://github.com/apache/incubator-druid/pull/8484#discussion_r322384359
 
 

 ##########
 File path: web-console/src/dialogs/status-dialog/status-dialog.tsx
 ##########
 @@ -16,29 +16,97 @@
  * limitations under the License.
  */
 
-import { Button, Classes, Dialog, Intent } from '@blueprintjs/core';
+import { Button, Classes, Dialog, InputGroup, Intent } from 
'@blueprintjs/core';
+import axios from 'axios';
 import React from 'react';
+import ReactTable from 'react-table';
 
-import { ShowJson } from '../../components';
 import { UrlBaser } from '../../singletons/url-baser';
+import { QueryManager } from '../../utils';
 
 import './status-dialog.scss';
 
 interface StatusDialogProps {
   onClose: () => void;
 }
 
-export class StatusDialog extends React.PureComponent<StatusDialogProps> {
+interface StatusDialogState {
+  response: any;
+  loading: boolean;
+  version: string;
+}
+
+export class StatusDialog extends React.PureComponent<StatusDialogProps, 
StatusDialogState> {
+  private showStatusQueryManager: QueryManager<null, string>;
+  constructor(props: StatusDialogProps, context: any) {
+    super(props, context);
+    this.state = {
+      response: [],
+      loading: false,
+      version: '',
+    };
+    this.showStatusQueryManager = new QueryManager({
+      processQuery: async () => {
+        const endpoint = UrlBaser.base(`/status`);
+        const resp = await axios.get(endpoint);
+        this.setState({ version: 'Version ' + resp.data.version });
+        return resp.data.modules;
+      },
+      onStateChange: ({ result, loading }) => {
+        this.setState({
+          loading,
+          response: result,
+        });
+      },
+    });
+  }
+
+  componentDidMount(): void {
+    this.showStatusQueryManager.runQuery(null);
+  }
+
   render(): JSX.Element {
     const { onClose } = this.props;
-
+    const { response, loading, version } = this.state;
     return (
       <Dialog className={'status-dialog'} onClose={onClose} isOpen 
title="Status">
         <div className={'status-dialog-main-area'}>
-          <ShowJson endpoint={UrlBaser.base(`/status`)} 
downloadFilename={'status'} />
+          <InputGroup defaultValue={version} readOnly />
+          <ReactTable
+            data={response}
+            columns={[
+              {
+                Header: 'Extensions',
+                columns: [
+                  {
+                    Header: 'Extension Name',
 
 Review comment:
   I've made the changes, please have a look.

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@druid.apache.org
For additional commands, e-mail: commits-h...@druid.apache.org

Reply via email to