Update dataset/dataset field tagging experience

api/src/main/java/marquez/db/DatasetFieldDao.java

@@ -129,7 +129,7 @@ void deleteDatasetVersionFieldTag(
 
   @SqlUpdate(
       "INSERT INTO dataset_fields_tag_mapping (dataset_field_uuid, tag_uuid, tagged_at) "
-          + "VALUES (:rowUuid, :tagUuid, :taggedAt)")
+          + "VALUES (:rowUuid, :tagUuid, :taggedAt) ON CONFLICT DO NOTHING")
   void updateTags(UUID rowUuid, UUID tagUuid, Instant taggedAt);
 
   @SqlBatch(

web/src/__tests__/reducers/datasets.test.ts

@@ -21,7 +21,7 @@ describe('datasets reducer', () => {
       result: datasets,
       totalCount: 16,
       deletedDatasetName: '',
-      refreshTags: false
+      refreshTags: ''
     })
   })
 

web/src/components/datasets/DatasetTags.tsx

@@ -119,7 +119,7 @@ const DatasetTags: React.FC<IProps> = (props) => {
     setTagDescription(event.target.value)
   }
 
-  const tagData = useSelector((state: IState) => state.tags.tags)
+  const tagData = useSelector((state: IState) => state.tags.tags.sort((a,b) => a.name.localeCompare(b.name)))
 
   const handleTagListChange = (event: any) => {
     setListTag(event.target.value)
@@ -129,6 +129,7 @@ const DatasetTags: React.FC<IProps> = (props) => {
     datasetField
       ? addDatasetFieldTag(namespace, datasetName, listTag, datasetField)
       : addDatasetTag(namespace, datasetName, listTag)
+    setDialogOpen(false)
   }
 
   const handleDelete = (deletedTag: string) => {
@@ -243,7 +244,17 @@ const DatasetTags: React.FC<IProps> = (props) => {
           </Grow>
         )}
       </Popper>
-      <Dialog open={isDialogOpen} onClose={closeDialog} fullWidth maxWidth='sm'>
+      <Dialog
+        open={isDialogOpen}
+        onClose={closeDialog}
+        fullWidth
+        maxWidth='sm'
+        onKeyDown={(event) => {
+          if (event.key === 'Escape') {
+            closeDialog()
+          }
+        }}
+      >
         <DialogTitle>{i18next.t('dataset_tags.dialogtitle')}</DialogTitle>
         <DialogContent>
           <FormControl variant='outlined' size='small' fullWidth>
@@ -283,7 +294,16 @@ const DatasetTags: React.FC<IProps> = (props) => {
           </Button>
         </DialogActions>
       </Dialog>
-      <Dialog open={openTagDesc} fullWidth maxWidth='sm'>
+      <Dialog
+        open={openTagDesc}
+        fullWidth
+        maxWidth='sm'
+        onKeyDown={(event) => {
+          if (event.key === 'Escape') {
+            handleTagDescClose()
+          }
+        }}
+      >
         <DialogTitle>Select a Tag to change</DialogTitle>
         <DialogContent>
           <MQText subheading>Tag</MQText>

web/src/store/actionCreators/index.ts

@@ -118,10 +118,12 @@ export const deleteDatasetTag = (namespace: string, datasetName: string, tag: st
   },
 })
 
-export const deleteDatasetTagSuccess = (datasetName: string) => ({
+export const deleteDatasetTagSuccess = (namespace: string, datasetName: string, tag: string) => ({
   type: actionTypes.DELETE_DATASET_TAG_SUCCESS,
   payload: {
     datasetName,
+    namespace,
+    tag,
   },
 })
 
@@ -140,10 +142,18 @@ export const deleteDatasetFieldTag = (
   },
 })
 
-export const deleteDatasetFieldTagSuccess = (datasetName: string) => ({
+export const deleteDatasetFieldTagSuccess = (
+  namespace: string,
+  datasetName: string,
+  field: string,
+  tag: string
+) => ({
   type: actionTypes.DELETE_DATASET_FIELD_TAG_SUCCESS,
   payload: {
     datasetName,
+    namespace,
+    tag,
+    field,
   },
 })
 
@@ -156,10 +166,12 @@ export const addDatasetTag = (namespace: string, datasetName: string, tag: strin
   },
 })
 
-export const addDatasetTagSuccess = (datasetName: string) => ({
+export const addDatasetTagSuccess = (namespace: string, datasetName: string, tag: string) => ({
   type: actionTypes.ADD_DATASET_TAG_SUCCESS,
   payload: {
     datasetName,
+    namespace,
+    tag,
   },
 })
 
@@ -178,10 +190,18 @@ export const addDatasetFieldTag = (
   },
 })
 
-export const addDatasetFieldTagSuccess = (datasetName: string) => ({
+export const addDatasetFieldTagSuccess = (
+  namespace: string,
+  datasetName: string,
+  field: string,
+  tag: string
+) => ({
   type: actionTypes.ADD_DATASET_FIELD_TAG_SUCCESS,
   payload: {
     datasetName,
+    namespace,
+    field,
+    tag,
   },
 })
 

web/src/store/reducers/datasets.ts

@@ -32,7 +32,7 @@ export type IDatasetsState = {
   totalCount: number
   init: boolean
   deletedDatasetName: string
-  refreshTags: boolean
+  refreshTags: string
 }
 
 export const initialState: IDatasetsState = {
@@ -41,7 +41,7 @@ export const initialState: IDatasetsState = {
   result: [],
   totalCount: 0,
   deletedDatasetName: '',
-  refreshTags: false,
+  refreshTags: '',
 }
 
 export type IDatasetsAction = ReturnType<typeof fetchDatasetsSuccess> &
@@ -72,21 +72,30 @@ export default (state: IDatasetsState = initialState, action: IDatasetsAction):
     case DELETE_DATASET_SUCCESS:
       return { ...state, deletedDatasetName: payload.datasetName }
     case DELETE_DATASET_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case DELETE_DATASET_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return {
+        ...state,
+        refreshTags: `${payload.namespace}#${payload.datasetName}#${payload.tag}#d`,
+      }
     case DELETE_DATASET_FIELD_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case DELETE_DATASET_FIELD_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return {
+        ...state,
+        refreshTags: `${payload.namespace}#${payload.datasetName}#${payload.field}#${payload.tag}#d`,
+      }
     case ADD_DATASET_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case ADD_DATASET_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return { ...state, refreshTags: `${payload.namespace}#${payload.datasetName}#${payload.tag}` }
     case ADD_DATASET_FIELD_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case ADD_DATASET_FIELD_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return {
+        ...state,
+        refreshTags: `${payload.namespace}#${payload.datasetName}#${payload.field}#${payload.tag}`,
+      }
     default:
       return state
   }

web/src/store/sagas/index.ts

@@ -253,13 +253,8 @@ export function* deleteDatasetTagSaga() {
   while (true) {
     try {
       const { payload } = yield take(DELETE_DATASET_TAG)
-      const dataset: Dataset = yield call(
-        deleteDatasetTag,
-        payload.namespace,
-        payload.datasetName,
-        payload.tag
-      )
-      yield put(deleteDatasetTagSuccess(dataset.name))
+      yield call(deleteDatasetTag, payload.namespace, payload.datasetName, payload.tag)
+      yield put(deleteDatasetTagSuccess(payload.namespace, payload.datasetName, payload.tag))
     } catch (e) {
       yield put(applicationError('Something went wrong while removing tag from dataset'))
     }
@@ -270,14 +265,21 @@ export function* deleteDatasetFieldTagSaga() {
   while (true) {
     try {
       const { payload } = yield take(DELETE_DATASET_FIELD_TAG)
-      const dataset: Dataset = yield call(
+      yield call(
         deleteDatasetFieldTag,
         payload.namespace,
         payload.datasetName,
         payload.tag,
         payload.field
       )
-      yield put(deleteDatasetFieldTagSuccess(dataset.name))
+      yield put(
+        deleteDatasetFieldTagSuccess(
+          payload.namespace,
+          payload.datasetName,
+          payload.field,
+          payload.tag
+        )
+      )
     } catch (e) {
       yield put(applicationError('Something went wrong while removing tag from dataset field'))
     }
@@ -288,13 +290,8 @@ export function* addDatasetTagSaga() {
   while (true) {
     try {
       const { payload } = yield take(ADD_DATASET_TAG)
-      const dataset: Dataset = yield call(
-        addDatasetTag,
-        payload.namespace,
-        payload.datasetName,
-        payload.tag
-      )
-      yield put(addDatasetTagSuccess(dataset.name))
+      yield call(addDatasetTag, payload.namespace, payload.datasetName, payload.tag)
+      yield put(addDatasetTagSuccess(payload.namespace, payload.datasetName, payload.tag))
     } catch (e) {
       yield put(applicationError('Something went wrong while adding tag to dataset'))
     }
@@ -305,14 +302,21 @@ export function* addDatasetFieldTagSaga() {
   while (true) {
     try {
       const { payload } = yield take(ADD_DATASET_FIELD_TAG)
-      const dataset: Dataset = yield call(
+      yield call(
         addDatasetFieldTag,
         payload.namespace,
         payload.datasetName,
         payload.tag,
         payload.field
       )
-      yield put(addDatasetFieldTagSuccess(dataset.name))
+      yield put(
+        addDatasetFieldTagSuccess(
+          payload.namespace,
+          payload.datasetName,
+          payload.field,
+          payload.tag
+        )
+      )
     } catch (e) {
       yield put(applicationError('Something went wrong while adding tag to dataset field.'))
     }