You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@druid.apache.org by cw...@apache.org on 2019/05/25 05:53:17 UTC

[incubator-druid] branch master updated: Web-Console: add actions icon to lookups (#7725)

This is an automated email from the ASF dual-hosted git repository.

cwylie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-druid.git


The following commit(s) were added to refs/heads/master by this push:
     new 3a77a3e  Web-Console: add actions icon to lookups (#7725)
3a77a3e is described below

commit 3a77a3e1123761547775e886aa37805206a91fce
Author: mcbrewster <37...@users.noreply.github.com>
AuthorDate: Fri May 24 22:53:12 2019 -0700

    Web-Console: add actions icon to lookups (#7725)
    
    * add lookup-table-action-dialog
    
    * reorder arguments
    
    * remove lookup-table-action-dialog
    
    * fix supervisors table action dialog
    
    * fix imports
    
    * Add host column to task view
    
    * reorder buttons
    
    * remove log
    
    * update snapshots
    
    * remove host
    
    * update snapshots
    
    * remove console log
    
    * remove fragment
    
    * update snapshots and remove space
---
 .../__snapshots__/lookups-view.spec.tsx.snap       |  1 +
 .../src/views/lookups-view/lookups-view.tsx        | 49 ++++++++++++++++------
 2 files changed, 38 insertions(+), 12 deletions(-)

diff --git a/web-console/src/views/lookups-view/__snapshots__/lookups-view.spec.tsx.snap b/web-console/src/views/lookups-view/__snapshots__/lookups-view.spec.tsx.snap
index baf19ed..148a732 100644
--- a/web-console/src/views/lookups-view/__snapshots__/lookups-view.spec.tsx.snap
+++ b/web-console/src/views/lookups-view/__snapshots__/lookups-view.spec.tsx.snap
@@ -121,6 +121,7 @@ exports[`describe lookups view lookups view snapshot 1`] = `
           "filterable": false,
           "id": "actions",
           "show": true,
+          "width": 70,
         },
       ]
     }
diff --git a/web-console/src/views/lookups-view/lookups-view.tsx b/web-console/src/views/lookups-view/lookups-view.tsx
index c2bd3ec..d72d189 100644
--- a/web-console/src/views/lookups-view/lookups-view.tsx
+++ b/web-console/src/views/lookups-view/lookups-view.tsx
@@ -16,24 +16,26 @@
  * limitations under the License.
  */
 
-import { Button, Intent } from '@blueprintjs/core';
+import {Button, Icon, Intent, Popover, Position} from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
 import axios from 'axios';
 import * as classNames from 'classnames';
 import * as React from 'react';
 import ReactTable from 'react-table';
 
-import { TableColumnSelection, ViewControlBar } from '../../components/index';
-import { AsyncActionDialog, LookupEditDialog } from '../../dialogs/index';
+import {ActionCell, TableColumnSelection, ViewControlBar} from '../../components';
+import { AsyncActionDialog, LookupEditDialog } from '../../dialogs/';
 import { AppToaster } from '../../singletons/toaster';
 import {
   getDruidErrorMessage, LocalStorageKeys,
   QueryManager,
   TableColumnSelectionHandler
 } from '../../utils';
+import {BasicAction, basicActionsToMenu} from '../../utils/basic-action';
 
 import './lookups-view.scss';
 
+
 const tableColumns: string[] = ['Lookup name', 'Tier', 'Type', 'Version', 'Actions'];
 
 const DEFAULT_LOOKUP_TIER: string = '__default';
@@ -55,8 +57,8 @@ export interface LookupsViewState {
   isEdit: boolean;
   allLookupTiers: string[];
 
-  deleteLookupTier: string | null;
   deleteLookupName: string | null;
+  deleteLookupTier: string | null;
 }
 
 export class LookupsView extends React.Component<LookupsViewProps, LookupsViewState> {
@@ -212,6 +214,22 @@ export class LookupsView extends React.Component<LookupsViewProps, LookupsViewSt
     }
   }
 
+  private getlookupActions(lookupTier: string, lookupId: string): BasicAction[] {
+    return [
+      {
+        icon: IconNames.EDIT,
+        title: 'Edit',
+        onAction: () => this.openLookupEditDialog(lookupTier, lookupId)
+      },
+      {
+        icon: IconNames.CROSS,
+        title: 'Delete',
+        intent: Intent.DANGER,
+        onAction: () => this.setState({ deleteLookupTier: lookupTier, deleteLookupName: lookupId })
+      }
+    ];
+  }
+
   renderDeleteLookupAction() {
     const { deleteLookupTier, deleteLookupName } = this.state;
 
@@ -288,16 +306,23 @@ export class LookupsView extends React.Component<LookupsViewProps, LookupsViewSt
           {
             Header: 'Actions',
             id: 'actions',
+            width: 70,
             accessor: row => ({id: row.id, tier: row.tier}),
             filterable: false,
             Cell: (row: any) => {
               const lookupId = row.value.id;
               const lookupTier = row.value.tier;
-              return <div>
-                <a onClick={() => this.openLookupEditDialog(lookupTier, lookupId)}>Edit</a>
-                &nbsp;&nbsp;&nbsp;
-                <a onClick={() => this.setState({ deleteLookupTier: lookupTier, deleteLookupName: lookupId })}>Delete</a>
-              </div>;
+              const lookupActions = this.getlookupActions(lookupTier, lookupId);
+              const lookupMenu = basicActionsToMenu(lookupActions);
+
+              return <ActionCell>
+                {
+                  lookupMenu &&
+                  <Popover content={lookupMenu} position={Position.BOTTOM_RIGHT}>
+                      <Icon icon={IconNames.WRENCH}/>
+                  </Popover>
+                }
+              </ActionCell>;
             },
             show: tableColumnSelectionHandler.showColumn('Actions')
           }
@@ -309,7 +334,7 @@ export class LookupsView extends React.Component<LookupsViewProps, LookupsViewSt
   }
 
   renderLookupEditDialog() {
-    const { lookupEditDialogOpen, allLookupTiers, lookupEditSpec, lookupEditTier, lookupEditName, lookupEditVersion, isEdit } = this.state;
+    const { lookupEditDialogOpen, allLookupTiers, lookupEditSpec, lookupEditTier, lookupEditName, lookupEditVersion, isEdit} = this.state;
 
     return <LookupEditDialog
       isOpen={lookupEditDialogOpen}
@@ -326,10 +351,10 @@ export class LookupsView extends React.Component<LookupsViewProps, LookupsViewSt
   }
 
   render() {
-    const { lookupsError } = this.state;
+    const { lookupsError} = this.state;
     const { tableColumnSelectionHandler } = this;
 
-    return <div className="lookups-view app-view">
+    return<div className="lookups-view app-view">
       <ViewControlBar label="Lookups">
         <Button
           icon={IconNames.REFRESH}


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