diff --git a/api/src/main/java/marquez/db/DatasetFieldDao.java b/api/src/main/java/marquez/db/DatasetFieldDao.java
index 7b66b55adf..86abf8de60 100644
--- a/api/src/main/java/marquez/db/DatasetFieldDao.java
+++ b/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(
diff --git a/api/src/test/java/marquez/api/TagResourceIntegrationTest.java b/api/src/test/java/marquez/api/TagResourceIntegrationTest.java
index 4304b55d33..60b905c33a 100644
--- a/api/src/test/java/marquez/api/TagResourceIntegrationTest.java
+++ b/api/src/test/java/marquez/api/TagResourceIntegrationTest.java
@@ -100,4 +100,38 @@ public void testApp_testDatasetTagFieldDelete() {
     // assert that only SENSITIVE remains
     assertThat(taggedDatasetFieldDelete.getFields().get(0).getTags()).containsExactly("SENSITIVE");
   }
+
+  @Test
+  public void testApp_testDatasetTagFieldConflict() {
+    // Create Namespace
+    createNamespace(NAMESPACE_NAME);
+    // create a source
+    createSource(DB_TABLE_SOURCE_NAME);
+    // Create Dataset
+    MARQUEZ_CLIENT.createDataset(NAMESPACE_NAME, DB_TABLE_NAME, DB_TABLE_META);
+
+    // tag dataset field
+    Dataset taggedDatasetField =
+        MARQUEZ_CLIENT.tagFieldWith(
+            NAMESPACE_NAME,
+            DB_TABLE_NAME,
+            DB_TABLE_META.getFields().get(0).getName(),
+            "TESTFIELDTAG");
+    // assert the tag TESTFIELDTAG has been added to field at position 0
+    assertThat(taggedDatasetField.getFields().get(0).getTags()).contains("TESTFIELDTAG");
+    // assert a total of two tags exist on the field
+    assertThat(taggedDatasetField.getFields().get(0).getTags()).hasSize(2);
+
+    // tag dataset field again to test ON CONFLICT DO NOTHING
+    Dataset taggedDatasetField2 =
+        MARQUEZ_CLIENT.tagFieldWith(
+            NAMESPACE_NAME,
+            DB_TABLE_NAME,
+            DB_TABLE_META.getFields().get(0).getName(),
+            "TESTFIELDTAG");
+    // assert the tag TESTFIELDTAG has been added to field at position 0
+    assertThat(taggedDatasetField2.getFields().get(0).getTags()).contains("TESTFIELDTAG");
+    // assert a total of two tags exist on the field
+    assertThat(taggedDatasetField2.getFields().get(0).getTags()).hasSize(2);
+  }
 }
diff --git a/web/src/components/datasets/DatasetDetailPage.tsx b/web/src/components/datasets/DatasetDetailPage.tsx
index b739d71026..58d63ecd3d 100644
--- a/web/src/components/datasets/DatasetDetailPage.tsx
+++ b/web/src/components/datasets/DatasetDetailPage.tsx
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import * as Redux from 'redux'
-import { Box, Button, Tab, Tabs, createTheme } from '@mui/material'
+import { Box, Button, Switch, Tab, Tabs, createTheme } from '@mui/material'
 import { CircularProgress } from '@mui/material'
 import { DatasetVersion } from '../../types/api'
 import { IState } from '../../store/reducers'
@@ -31,7 +31,7 @@ import IconButton from '@mui/material/IconButton'
 import Io from '../io/Io'
 import MqStatus from '../core/status/MqStatus'
 import MqText from '../core/text/MqText'
-import React, { ChangeEvent, FunctionComponent, useEffect } from 'react'
+import React, { ChangeEvent, FunctionComponent, useEffect, useState } from 'react'
 
 interface StateProps {
   lineageDataset: LineageDataset
@@ -79,6 +79,7 @@ const DatasetDetailPage: FunctionComponent<IProps> = (props) => {
   const i18next = require('i18next')
   const theme = createTheme(useTheme())
   const [_, setSearchParams] = useSearchParams()
+  const [showTags, setShowTags] = useState(false)
 
   // unmounting
   useEffect(
@@ -91,7 +92,13 @@ const DatasetDetailPage: FunctionComponent<IProps> = (props) => {
 
   useEffect(() => {
     fetchDatasetVersions(lineageDataset.namespace, lineageDataset.name)
-  }, [lineageDataset.name, datasets.refreshTags])
+  }, [lineageDataset.name])
+
+  useEffect(() => {
+    if (showTags === true) {
+      fetchDatasetVersions(lineageDataset.namespace, lineageDataset.name)
+    }
+  }, [showTags])
 
   // if the dataset is deleted then redirect to datasets end point
   useEffect(() => {
@@ -194,7 +201,7 @@ const DatasetDetailPage: FunctionComponent<IProps> = (props) => {
             </Tabs>
           </Box>
         </Box>
-        <Box display={'flex'} alignItems={'center'}>
+        <Box display={'flex'} alignItems={'center'} justifyContent={'space-between'}>
           {facetsStatus && (
             <Box mr={1}>
               <MqStatus label={'Quality'} color={facetsStatus} />
@@ -203,6 +210,14 @@ const DatasetDetailPage: FunctionComponent<IProps> = (props) => {
           <MqText heading font={'mono'}>
             {name}
           </MqText>
+          <Box ml={1} display={'flex'} alignItems={'center'}>
+            <MqText subheading>{i18next.t('datasets.show_field_tags')}</MqText>
+            <Switch
+              checked={showTags}
+              onChange={() => setShowTags(!showTags)}
+              inputProps={{ 'aria-label': 'toggle show tags' }}
+            />
+          </Box>
         </Box>
         <Box mb={2}>
           <MqText subdued>{description}</MqText>
@@ -213,6 +228,7 @@ const DatasetDetailPage: FunctionComponent<IProps> = (props) => {
           datasetFields={firstVersion.fields}
           facets={firstVersion.facets}
           run={firstVersion.createdByRun}
+          showTags={showTags}
         />
       )}
       {tabIndex === 1 && <Io />}
diff --git a/web/src/components/datasets/DatasetInfo.tsx b/web/src/components/datasets/DatasetInfo.tsx
index a218aa96ac..b938066cc1 100644
--- a/web/src/components/datasets/DatasetInfo.tsx
+++ b/web/src/components/datasets/DatasetInfo.tsx
@@ -4,16 +4,13 @@ import * as Redux from 'redux'
 import { Box, Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material'
 import { Field, Run } from '../../types/api'
 import { IState } from '../../store/reducers'
-
 import { connect, useSelector } from 'react-redux'
 import { fetchJobFacets, resetFacets } from '../../store/actionCreators'
-import Collapse from '@mui/material/Collapse'
 import DatasetTags from './DatasetTags'
-import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'
 import MqEmpty from '../core/empty/MqEmpty'
 import MqJsonView from '../core/json-view/MqJsonView'
 import MqText from '../core/text/MqText'
-import React, { FunctionComponent, useEffect, useState } from 'react'
+import React, { FunctionComponent, useEffect } from 'react'
 
 export interface DispatchProps {
   fetchJobFacets: typeof fetchJobFacets
@@ -36,22 +33,18 @@ type DatasetInfoProps = {
   datasetFields: Field[]
   facets?: object
   run?: Run
+  showTags?: boolean
 } & JobFacetsProps &
   DispatchProps
 
 const DatasetInfo: FunctionComponent<DatasetInfoProps> = (props) => {
-  const { datasetFields, facets, run, fetchJobFacets, resetFacets } = props
+  const { datasetFields, facets, run, fetchJobFacets, resetFacets, showTags } = props
   const i18next = require('i18next')
   const dsNamespace = useSelector(
     (state: IState) => state.datasetVersions.result.versions[0].namespace
   )
   const dsName = useSelector((state: IState) => state.datasetVersions.result.versions[0].name)
 
-  const loadCollapsedState = () => {
-    const storedState = localStorage.getItem(`dsi_${dsNamespace}_${dsName}`)
-    return storedState ? JSON.parse(storedState) : []
-  }
-
   useEffect(() => {
     run && fetchJobFacets(run.id)
   }, [run])
@@ -62,27 +55,6 @@ const DatasetInfo: FunctionComponent<DatasetInfoProps> = (props) => {
     },
     []
   )
-  const [expandedRows, setExpandedRows] = useState<number[]>(loadCollapsedState)
-
-  const toggleRow = (index: number) => {
-    setExpandedRows((prevExpandedRows) => {
-      const newExpandedRows = prevExpandedRows.includes(index)
-        ? prevExpandedRows.filter((rowIndex) => rowIndex !== index)
-        : [...prevExpandedRows, index]
-
-      localStorage.setItem(`dsi_${dsNamespace}_${dsName}`, JSON.stringify(newExpandedRows))
-
-      return newExpandedRows
-    })
-  }
-
-  useEffect(() => {
-    for (const key in localStorage) {
-      if (key !== `dsi_${dsNamespace}_${dsName}`) {
-        localStorage.removeItem(key)
-      }
-    }
-  }, [dsNamespace, dsName])
 
   return (
     <Box>
@@ -102,53 +74,49 @@ const DatasetInfo: FunctionComponent<DatasetInfoProps> = (props) => {
                     {i18next.t('dataset_info_columns.name')}
                   </MqText>
                 </TableCell>
-                <TableCell align='left'>
-                  <MqText subheading inline>
-                    {i18next.t('dataset_info_columns.type')}
-                  </MqText>
-                </TableCell>
-                <TableCell align='left'>
-                  <MqText subheading inline>
-                    {i18next.t('dataset_info_columns.description')}
-                  </MqText>
-                </TableCell>
-                <TableCell align='left'></TableCell>
+                {!showTags && (
+                  <TableCell align='left'>
+                    <MqText subheading inline>
+                      {i18next.t('dataset_info_columns.type')}
+                    </MqText>
+                  </TableCell>
+                )}
+                {!showTags && (
+                  <TableCell align='left'>
+                    <MqText subheading inline>
+                      {i18next.t('dataset_info_columns.description')}
+                    </MqText>
+                  </TableCell>
+                )}
+                {showTags && (
+                  <TableCell align='left'>
+                    <MqText subheading inline>
+                      {i18next.t('dataset_tags.tags')}
+                    </MqText>
+                  </TableCell>
+                )}
               </TableRow>
             </TableHead>
             <TableBody>
-              {datasetFields.map((field, index) => {
+              {datasetFields.map((field) => {
                 return (
                   <React.Fragment key={field.name}>
-                    <TableRow
-                      sx={{ cursor: 'pointer' }}
-                      onClick={() => toggleRow(index)}
-                      className='expandable-row'
-                    >
+                    <TableRow sx={{ cursor: 'pointer' }}>
                       <TableCell align='left'>{field.name}</TableCell>
-                      <TableCell align='left'>{field.type}</TableCell>
-                      <TableCell align='left'>{field.description || 'no description'}</TableCell>
-                      <TableCell align='right'>
-                        <KeyboardArrowDownIcon
-                          sx={{
-                            rotate: expandedRows.includes(index) ? '180deg' : 0,
-                            transition: 'rotate .3s',
-                          }}
-                        />
-                      </TableCell>
-                    </TableRow>
-                    <TableRow>
-                      <TableCell colSpan={4} style={{ padding: 0, border: 'none' }}>
-                        <Collapse in={expandedRows.includes(index)} timeout='auto'>
-                          <Box p={2}>
-                            <DatasetTags
-                              namespace={dsNamespace}
-                              datasetName={dsName}
-                              datasetTags={field.tags}
-                              datasetField={field.name}
-                            />
-                          </Box>
-                        </Collapse>
-                      </TableCell>
+                      {!showTags && <TableCell align='left'>{field.type}</TableCell>}
+                      {!showTags && (
+                        <TableCell align='left'>{field.description || 'no description'}</TableCell>
+                      )}
+                      {showTags && (
+                        <TableCell align='left'>
+                          <DatasetTags
+                            namespace={dsNamespace}
+                            datasetName={dsName}
+                            datasetTags={field.tags}
+                            datasetField={field.name}
+                          />
+                        </TableCell>
+                      )}
                     </TableRow>
                   </React.Fragment>
                 )
diff --git a/web/src/components/datasets/DatasetTags.tsx b/web/src/components/datasets/DatasetTags.tsx
index 245214fa3c..0863451136 100644
--- a/web/src/components/datasets/DatasetTags.tsx
+++ b/web/src/components/datasets/DatasetTags.tsx
@@ -1,7 +1,13 @@
 // Copyright 2018-2024 contributors to the Marquez project
 // SPDX-License-Identifier: Apache-2.0
 import * as Redux from 'redux'
-import { Autocomplete, TextField } from '@mui/material'
+import {
+  Autocomplete,
+  AutocompleteChangeDetails,
+  AutocompleteChangeReason,
+  Checkbox,
+  TextField,
+} from '@mui/material'
 import { Box, createTheme } from '@mui/material'
 import { IState } from '../../store/reducers'
 import { Tag } from '../../types/api'
@@ -15,27 +21,18 @@ import {
 import { bindActionCreators } from 'redux'
 import { connect, useSelector } from 'react-redux'
 import { useTheme } from '@emotion/react'
-import AddIcon from '@mui/icons-material/Add'
-import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'
 import Button from '@mui/material/Button'
-import ButtonGroup from '@mui/material/ButtonGroup'
+import CheckBoxIcon from '@mui/icons-material/CheckBox'
+import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank'
 import Chip from '@mui/material/Chip'
-import ClickAwayListener from '@mui/material/ClickAwayListener'
 import Dialog from '@mui/material/Dialog'
 import DialogActions from '@mui/material/DialogActions'
 import DialogContent from '@mui/material/DialogContent'
 import DialogTitle from '@mui/material/DialogTitle'
-import EditNoteIcon from '@mui/icons-material/EditNote'
-import FormControl from '@mui/material/FormControl'
-import Grow from '@mui/material/Grow'
+import LocalOfferIcon from '@mui/icons-material/LocalOffer'
 import MQText from '../core/text/MqText'
 import MQTooltip from '../core/tooltip/MQTooltip'
-import MenuItem from '@mui/material/MenuItem'
-import MenuList from '@mui/material/MenuList'
-import Paper from '@mui/material/Paper'
-import Popper from '@mui/material/Popper'
-import React, { useRef, useState } from 'react'
-import Select from '@mui/material/Select'
+import React, { useState } from 'react'
 import Snackbar from '@mui/material/Snackbar'
 
 interface DatasetTagsProps {
@@ -68,47 +65,24 @@ const DatasetTags: React.FC<IProps> = (props) => {
     addTags,
   } = props
 
-  const [isDialogOpen, setDialogOpen] = useState(false)
   const [listTag, setListTag] = useState('')
-  const closeDialog = () => setDialogOpen(false)
-  const i18next = require('i18next')
-  const options = ['Add a Tag', 'Edit a Tag Description']
-  const [openDropDown, setOpenDropDown] = useState(false)
   const [openTagDesc, setOpenTagDesc] = useState(false)
-  const anchorRef = useRef<HTMLDivElement>(null)
-  const [selectedIndex, setSelectedIndex] = useState(0)
   const [tagDescription, setTagDescription] = useState('No Description')
+  const [selectedTags, setSelectedTags] = useState<string[]>(datasetTags)
+
   const handleButtonClick = () => {
-    options[selectedIndex] === 'Add a Tag' ? setDialogOpen(true) : setOpenTagDesc(true)
+    setOpenTagDesc(true)
   }
+
   const [snackbarOpen, setSnackbarOpen] = useState(false)
   const theme = createTheme(useTheme())
 
-  const handleMenuItemClick = (
-    _event: React.MouseEvent<HTMLLIElement, MouseEvent>,
-    index: number
-  ) => {
-    setSelectedIndex(index)
-    setOpenDropDown(false)
-  }
-
-  const handleDropDownToggle = () => {
-    setOpenDropDown((prevprevOpenDropDown) => !prevprevOpenDropDown)
-  }
-
   const handleTagDescClose = () => {
     setOpenTagDesc(false)
     setListTag('')
     setTagDescription('No Description')
   }
 
-  const handleDropDownClose = (event: Event) => {
-    if (anchorRef.current && anchorRef.current.contains(event.target as HTMLElement)) {
-      return
-    }
-    setOpenDropDown(false)
-  }
-
   const handleTagDescChange = (_event: any, value: string) => {
     const selectedTagData = tagData.find((tag) => tag.name === value)
     setListTag(value)
@@ -119,19 +93,33 @@ 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)
-  }
+  const handleTagChange = (
+    _event: React.SyntheticEvent,
+    _value: string[],
+    _reason: AutocompleteChangeReason,
+    details?: AutocompleteChangeDetails<string> | undefined
+  ) => {
+    
+    if (details) {
+      const newTag = details.option
+      const newSelectedTags = [...selectedTags, newTag]
+      setSelectedTags(newSelectedTags)
 
-  const handleTagChange = () => {
-    datasetField
-      ? addDatasetFieldTag(namespace, datasetName, listTag, datasetField)
-      : addDatasetTag(namespace, datasetName, listTag)
+      datasetField
+        ? addDatasetFieldTag(namespace, datasetName, newTag, datasetField)
+        : addDatasetTag(namespace, datasetName, newTag)
+    }
   }
 
   const handleDelete = (deletedTag: string) => {
+    const newSelectedTags = selectedTags.filter((tag) => deletedTag !== tag)
+    
+    setSelectedTags(newSelectedTags)
+
     datasetField
       ? deleteDatasetFieldTag(namespace, datasetName, deletedTag, datasetField)
       : deleteDatasetTag(namespace, datasetName, deletedTag)
@@ -146,19 +134,20 @@ const DatasetTags: React.FC<IProps> = (props) => {
   }
 
   const formatTags = (tags: string[], tag_desc: Tag[]) => {
-    return tags.map((tag) => {
+    return tags.map((tag, index) => {
       const tagDescription = tag_desc.find((tagItem) => tagItem.name === tag)
       const tooltipTitle = tagDescription?.description || 'No Tag Description'
       return (
         <MQTooltip title={tooltipTitle} key={tag}>
           <Chip
             color={'primary'}
+            variant='outlined'
             label={tag}
             size='small'
             onDelete={() => handleDelete(tag)}
             style={{
               display: 'row',
-              marginLeft: theme.spacing(1),
+              marginLeft: index === 0 ? theme.spacing(0) : theme.spacing(1),
             }}
           />
         </MQTooltip>
@@ -176,121 +165,85 @@ const DatasetTags: React.FC<IProps> = (props) => {
         message={'Tag updated.'}
         anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}
       />
-      <Box display={'flex'} alignItems={'center'}>
-        <MQText subheading>{i18next.t('dataset_tags.tags')}</MQText>
-        {formatTags(datasetTags, tagData)}
-        <ButtonGroup
-          variant='contained'
-          ref={anchorRef}
-          aria-label='tags-nested-menu'
-          sx={{ height: '32px', width: '20px', marginLeft: '8px' }}
-        >
-          <MQTooltip placement='left' title={options[selectedIndex]}>
+      <Box display={'flex'} alignItems='center' justifyContent='center'>
+        {!datasetField && (
+          <MQTooltip title='Edit a Tag' key='edit-tag'>
             <Button
               variant='outlined'
-              sx={{ height: '32px', width: '20px' }}
               onClick={handleButtonClick}
+              color='primary'
+              size='medium'
+              sx={{ marginRight: '8px' }}
+              startIcon={<LocalOfferIcon />}
             >
-              {selectedIndex === 0 ? <AddIcon /> : <EditNoteIcon />}
+              Edit Tag
             </Button>
           </MQTooltip>
-          <Button
-            variant='outlined'
-            size='small'
-            aria-controls={openDropDown ? 'split-button-menu' : undefined}
-            aria-expanded={openDropDown ? 'true' : undefined}
-            aria-label='tags-menu'
-            aria-haspopup='menu'
-            onClick={handleDropDownToggle}
-          >
-            <ArrowDropDownIcon />
-          </Button>
-        </ButtonGroup>
+        )}
+        <Autocomplete
+          multiple
+          disableCloseOnSelect
+          id='dataset-tags'
+          sx={{ width: 516, flex: 1 }}
+          limitTags={!datasetField ? 5 : 4}
+          autoHighlight
+          disableClearable
+          disablePortal
+          options={tagData.map((option) => option.name)}
+          value={selectedTags}
+          onChange={handleTagChange}
+          renderTags={(value: string[]) => formatTags(value, tagData)}
+          renderOption={(props, option, { selected }) => (
+            <li {...props}>
+              <Checkbox
+                icon={<CheckBoxOutlineBlankIcon fontSize='small' />}
+                checkedIcon={<CheckBoxIcon fontSize='small' />}
+                style={{ marginRight: 4 }}
+                checked={selected}
+              />
+              <div>
+                <MQText bold>{option}</MQText>
+                <MQText subdued overflowHidden>
+                  {tagData.find((tagItem) => tagItem.name === option)?.description ||
+                    'No Tag Description'}
+                </MQText>
+              </div>
+            </li>
+          )}
+          renderInput={(params) => (
+            <TextField
+              variant={!datasetField ? 'outlined' : 'standard'}
+              {...params}
+              placeholder={selectedTags.length > 0 ? '' : 'Add some Tags.'}
+              InputProps={{
+                ...params.InputProps,
+                ...(datasetField ? { disableUnderline: true } : {}),
+              }}
+              InputLabelProps={{
+                shrink: true,
+              }}
+              size='small'
+            />
+          )}
+        />
       </Box>
-      <Popper
-        sx={{
-          zIndex: 1,
+      <Dialog
+        open={openTagDesc}
+        fullWidth
+        maxWidth='sm'
+        onKeyDown={(event) => {
+          if (event.key === 'Escape') {
+            handleTagDescClose()
+          }
         }}
-        open={openDropDown}
-        anchorEl={anchorRef.current}
-        role={undefined}
-        transition
-        disablePortal
       >
-        {({ TransitionProps, placement }) => (
-          <Grow
-            {...TransitionProps}
-            style={{
-              transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom',
-            }}
-          >
-            <Paper>
-              <ClickAwayListener onClickAway={handleDropDownClose}>
-                <MenuList id='split-button-menu' autoFocusItem>
-                  {options.map((option, index) => (
-                    <MenuItem
-                      key={option}
-                      selected={index === selectedIndex}
-                      disabled={index === 1 && !!datasetField}
-                      onClick={(event) => handleMenuItemClick(event, index)}
-                    >
-                      {option}
-                    </MenuItem>
-                  ))}
-                </MenuList>
-              </ClickAwayListener>
-            </Paper>
-          </Grow>
-        )}
-      </Popper>
-      <Dialog open={isDialogOpen} onClose={closeDialog} fullWidth maxWidth='sm'>
-        <DialogTitle>{i18next.t('dataset_tags.dialogtitle')}</DialogTitle>
-        <DialogContent>
-          <FormControl variant='outlined' size='small' fullWidth>
-            <Select
-              displayEmpty
-              value={listTag}
-              onChange={handleTagListChange}
-              inputProps={{
-                name: 'tags',
-                id: 'tag-select',
-              }}
-            >
-              <MenuItem value=''>{i18next.t('dataset_tags.selecttagtoadd')}</MenuItem>
-              {tagData.map((option) => (
-                <MenuItem
-                  style={{ whiteSpace: 'normal', maxWidth: '800px' }}
-                  key={option.name}
-                  value={option.name}
-                >
-                  <div>
-                    <MQText bold>{option.name}</MQText>
-                    <MQText subdued overflowHidden>
-                      {option.description || 'No Tag Description'}
-                    </MQText>
-                  </div>
-                </MenuItem>
-              ))}
-            </Select>
-          </FormControl>
-        </DialogContent>
-        <DialogActions>
-          <Button color='primary' onClick={handleTagChange} disabled={listTag === ''}>
-            {i18next.t('dataset_tags.addatagdialog')}
-          </Button>
-          <Button onClick={closeDialog} color='primary'>
-            {i18next.t('dataset_tags.canceltagdialog')}
-          </Button>
-        </DialogActions>
-      </Dialog>
-      <Dialog open={openTagDesc} fullWidth maxWidth='sm'>
         <DialogTitle>Select a Tag to change</DialogTitle>
         <DialogContent>
           <MQText subheading>Tag</MQText>
           <Autocomplete
             options={tagData.map((option) => option.name)}
-            freeSolo
             autoSelect
+            freeSolo
             onChange={handleTagDescChange}
             renderInput={(params) => (
               <TextField
diff --git a/web/src/i18n/config.ts b/web/src/i18n/config.ts
index ee6d29b4cf..60b66ada70 100644
--- a/web/src/i18n/config.ts
+++ b/web/src/i18n/config.ts
@@ -93,6 +93,7 @@ i18next
             column_lineage_tab: 'COLUMN LINEAGE',
             dialog_delete: 'DELETE',
             dialog_confirmation_title: 'Are you sure?',
+            show_field_tags: 'Show Field Tags',
           },
           datasets_route: {
             empty_title: 'No datasets found',
diff --git a/web/src/store/actionCreators/index.ts b/web/src/store/actionCreators/index.ts
index 360f00e09e..c8c7fb8728 100644
--- a/web/src/store/actionCreators/index.ts
+++ b/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,
   },
 })
 
diff --git a/web/src/store/reducers/datasets.ts b/web/src/store/reducers/datasets.ts
index 1952674430..ed75282131 100644
--- a/web/src/store/reducers/datasets.ts
+++ b/web/src/store/reducers/datasets.ts
@@ -72,21 +72,28 @@ 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,
+      }
     case DELETE_DATASET_FIELD_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case DELETE_DATASET_FIELD_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return {
+        ...state,
+      }
     case ADD_DATASET_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case ADD_DATASET_TAG_SUCCESS:
       return { ...state, refreshTags: true }
     case ADD_DATASET_FIELD_TAG:
-      return { ...state, refreshTags: false }
+      return { ...state }
     case ADD_DATASET_FIELD_TAG_SUCCESS:
-      return { ...state, refreshTags: true }
+      return {
+        ...state,
+        refreshTags: true,
+      }
     default:
       return state
   }
diff --git a/web/src/store/sagas/index.ts b/web/src/store/sagas/index.ts
index 0e36113c73..b233da757b 100644
--- a/web/src/store/sagas/index.ts
+++ b/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.'))
     }