diff --git a/frontend/src/constants/zIndexes.js b/frontend/src/constants/zIndexes.js
index b3fd47ee58..4d03491e12 100644
--- a/frontend/src/constants/zIndexes.js
+++ b/frontend/src/constants/zIndexes.js
@@ -1,9 +1,33 @@
-export const RESIZE_BAR = 2;
+// CellMasks should render in front of the cells
+// Unfrozen cells do not have a zIndex specifed
+export const CELL_MASK = 1;
+export const TABLE_MAIN_INTERVAL = 1;
+export const RESIZE_HANDLE = 1;
+export const SEQUENCE_COLUMN = 1;
 
+// higher than unfrozen header cell(0), RESIZE_HANDLE
+export const FROZEN_HEADER_CELL = 2;
+export const GROUP_FROZEN_HEADER = 2;
+export const SCROLL_BAR = 2;
+// In front of CELL_MASK/non-frozen cell(1)、back of the frozen cells (2)
+export const GROUP_BACKDROP = 2;
+export const MOBILE_RECORDS_COLUMN_NAMES = 2;
+export const FROZEN_GROUP_CELL = 2;
+export const RESIZE_BAR = 2;
 export const FOLDED_SIDE_NAV_FILES = 2;
 
+// Frozen cells have a zIndex value of 2 so CELL_MASK should have a higher value
+export const FROZEN_CELL_MASK = 3;
 export const FOLDED_SIDE_NAV = 3;
 
+// need higher than the doms(etc. cell, cell_mask) which behind of the grid header
+export const GRID_HEADER = 4;
+export const GRID_FOOTER = 4;
+export const UPLOAD_PROGRESS = 4;
+
+// EditorContainer is rendered outside the grid and it higher FROZEN_GROUP_CELL(2)
+export const EDITOR_CONTAINER = 9;
+
 // search mask should higher than file tags (20) but lower than modal mask (1050)
 export const SEARCH_MASK = 1045;
 
@@ -12,3 +36,5 @@ export const SEARCH_CONTAINER = 1046;
 export const SEARCH_CONTAINER_SETTINGS = 1047;
 
 export const EXTRA_ATTRIBUTES_DIALOG_MODAL = 1048;
+
+export const DROPDOWN_MENU = 1051;
diff --git a/frontend/src/metadata/components/cell-editors/editor-container/normal-editor-container.js b/frontend/src/metadata/components/cell-editors/editor-container/normal-editor-container.js
index f2f9f9d920..02daa6ed16 100644
--- a/frontend/src/metadata/components/cell-editors/editor-container/normal-editor-container.js
+++ b/frontend/src/metadata/components/cell-editors/editor-container/normal-editor-container.js
@@ -8,7 +8,8 @@ import { getEventClassName } from '../../../utils/common';
 import { isCellValueChanged, getCellValueByColumn } from '../../../utils/cell';
 import { canEditCell } from '../../../utils/column';
 import { isCtrlKeyHeldDown, isKeyPrintable } from '../../../utils/keyboard-utils';
-import { EVENT_BUS_TYPE, metadataZIndexes, PRIVATE_COLUMN_KEYS } from '../../../constants';
+import { EVENT_BUS_TYPE, PRIVATE_COLUMN_KEYS } from '../../../constants';
+import { zIndexes } from '../../../../constants';
 
 class NormalEditorContainer extends React.Component {
 
@@ -315,7 +316,7 @@ class NormalEditorContainer extends React.Component {
 
   render() {
     const { width, height, left, top } = this.props;
-    const style = { position: 'absolute', height, width, left, top, zIndex: metadataZIndexes.EDITOR_CONTAINER };
+    const style = { position: 'absolute', height, width, left, top, zIndex: zIndexes.EDITOR_CONTAINER };
     return (
       <ClickOutside onClickOutside={this.onClickOutside}>
         <div
diff --git a/frontend/src/metadata/components/cell-editors/editor-container/popup-editor-container.js b/frontend/src/metadata/components/cell-editors/editor-container/popup-editor-container.js
index 78680e369c..9bf4aa8238 100644
--- a/frontend/src/metadata/components/cell-editors/editor-container/popup-editor-container.js
+++ b/frontend/src/metadata/components/cell-editors/editor-container/popup-editor-container.js
@@ -6,7 +6,8 @@ import Editor from '../editor';
 import { Utils } from '../../../../utils/utils';
 import { isCellValueChanged, getCellValueByColumn, getColumnOptionNameById, getColumnOptionNamesByIds } from '../../../utils/cell';
 import { canEditCell, getColumnOriginName } from '../../../utils/column';
-import { CellType, EVENT_BUS_TYPE, metadataZIndexes, PRIVATE_COLUMN_KEYS } from '../../../constants';
+import { CellType, EVENT_BUS_TYPE, PRIVATE_COLUMN_KEYS } from '../../../constants';
+import { zIndexes } from '../../../../constants';
 
 const NOT_SUPPORT_EDITOR_COLUMN_TYPES = [
   CellType.CTIME, CellType.MTIME, CellType.CREATOR, CellType.LAST_MODIFIER, CellType.FILE_NAME,
@@ -27,7 +28,7 @@ class PopupEditorContainer extends React.Component {
       isInvalid: false,
       style: {
         position: 'absolute',
-        zIndex: metadataZIndexes.EDITOR_CONTAINER,
+        zIndex: zIndexes.EDITOR_CONTAINER,
         left,
         top,
         ...additionalStyles
diff --git a/frontend/src/metadata/components/scrollbar/horizontal-scrollbar.js b/frontend/src/metadata/components/scrollbar/horizontal-scrollbar.js
index f8dd4bf9cf..83c7c90080 100644
--- a/frontend/src/metadata/components/scrollbar/horizontal-scrollbar.js
+++ b/frontend/src/metadata/components/scrollbar/horizontal-scrollbar.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { metadataZIndexes } from '../../constants';
+import { zIndexes } from '../../../constants';
 
 const propTypes = {
   innerWidth: PropTypes.number,
@@ -35,7 +35,7 @@ class HorizontalScrollbar extends React.Component {
   };
 
   getContainerStyle = () => {
-    return { zIndex: metadataZIndexes.SCROLL_BAR };
+    return { zIndex: zIndexes.SCROLL_BAR };
   };
 
   setScrollbarRef = (ref) => {
diff --git a/frontend/src/metadata/components/scrollbar/right-scrollbar.js b/frontend/src/metadata/components/scrollbar/right-scrollbar.js
index f3a021e77b..53cd988bb7 100644
--- a/frontend/src/metadata/components/scrollbar/right-scrollbar.js
+++ b/frontend/src/metadata/components/scrollbar/right-scrollbar.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { metadataZIndexes } from '../../constants';
+import { zIndexes } from '../../../constants';
 
 const propTypes = {
   onScrollbarScroll: PropTypes.func.isRequired,
@@ -49,7 +49,7 @@ class RightScrollbar extends React.Component {
     const component = window.sfMetadataBody;
     if (component && component.resultContentRef) {
       style.height = component.resultContentRef.clientHeight;
-      style.zIndex = metadataZIndexes.SCROLL_BAR;
+      style.zIndex = zIndexes.SCROLL_BAR;
     }
 
     /* sf-metadata-header have 33px height */
diff --git a/frontend/src/metadata/constants/index.js b/frontend/src/metadata/constants/index.js
index bb2cb6f625..038f530a38 100644
--- a/frontend/src/metadata/constants/index.js
+++ b/frontend/src/metadata/constants/index.js
@@ -1,7 +1,6 @@
 import CellType from './column/type';
 import { EVENT_BUS_TYPE } from './event-bus-type';
 import TRANSFER_TYPES from './TransferTypes';
-import * as metadataZIndexes from './z-index';
 
 export * from './column';
 export * from './filter';
@@ -116,7 +115,6 @@ export const EDITOR_TYPE = {
 export {
   EVENT_BUS_TYPE,
   TRANSFER_TYPES,
-  metadataZIndexes,
 };
 
 export const DATE_TAG_HEIGHT = 44;
diff --git a/frontend/src/metadata/constants/z-index.js b/frontend/src/metadata/constants/z-index.js
deleted file mode 100644
index 6f82782770..0000000000
--- a/frontend/src/metadata/constants/z-index.js
+++ /dev/null
@@ -1,135 +0,0 @@
-// copy from sf-metadata
-// Drop Target of top row's z-index is -1.
-export const DEFAULT_DROP_TARGET = -1;
-
-// CellMasks should render in front of the cells
-// Unfrozen cells do not have a zIndex specifed
-export const CELL_MASK = 1;
-export const TABLE_MAIN_INTERVAL = 1;
-export const RESIZE_HANDLE = 1;
-
-export const SEQUENCE_COLUMN = 1;
-
-// higher than unfrozen header cell(0), RESIZE_HANDLE
-export const FROZEN_HEADER_CELL = 2;
-
-export const GROUP_FROZEN_HEADER = 2;
-
-export const SCROLL_BAR = 2;
-
-// In front of CELL_MASK/non-frozen cell(1)、back of the frozen cells (2)
-export const GROUP_BACKDROP = 2;
-
-export const MOBILE_RECORDS_COLUMN_NAMES = 2;
-
-export const FROZEN_GROUP_CELL = 2;
-
-// Frozen cells have a zIndex value of 2 so CELL_MASK should have a higher value
-export const FROZEN_CELL_MASK = 3;
-
-// GALLERY_MAIN_HEADER, TABLE_MAIN_INTERVAL is 3 to hide first freeze column
-export const GALLERY_MAIN_HEADER = 3;
-
-// APP_HEADER is 8 than TABLE_HEADER because Logout Popover need to be at the top
-export const APP_HEADER = 8;
-
-// higher than frozen cells(2)
-export const GRID_HORIZONTAL_SCROLLBAR = 3;
-
-// In mobile list mode, row name fixed, so upper components z-index is 3
-export const SEARCH_ALL_TABLES = 3;
-
-export const MOBILE_TABLES_TABS_CONTAINER = 3;
-
-export const MOBILE_TABLE_TOOLBAR = 3;
-
-export const MOBILE_HEADER = 3;
-
-// need higher than the doms(etc. cell, cell_mask) which behind of the grid header
-export const GRID_HEADER = 4;
-
-export const GRID_FOOTER = 4;
-
-export const UPLOAD_PROGRESS = 4;
-
-// frozen column header z-index is 3，row drop target horizontal line shoule appear so z-index is 4
-export const ROW_DROP_TARGET = 4;
-
-export const VIEW_SIDEBAR_RESIZE_HANDLER = 4;
-
-// need higher or equal to GRID_HEADER(frozen): 4
-export const TABLE_SETTING_PANEL = 4;
-
-// higher than PANE_DIVIDER(4)
-export const TABLE_TOOLBAR = 5;
-
-export const TABLE_RIGHT_PANEL = 5;
-
-// higher than TABLE_TOOLBAR(5)
-export const TABLES_TABS_CONTAINER = 6;
-
-// higher than TABLES_TABS_CONTAINER(6)
-export const TABLE_HEADER = 7;
-
-export const TABLE_COMMENT_CONTAINER = 7;
-
-// higher than TABLE_HEADER(7)
-export const PANE_DIVIDER = 8;
-
-// EditorContainer is rendered outside the grid and it higher FROZEN_GROUP_CELL(2) and PANE_DIVIDER(8)
-export const EDITOR_CONTAINER = 9;
-
-// APP_LEFT_BAR_COLLAPSE z-index should taller than the APP_HEADER and the PANE_DIVIDER(8)
-export const APP_LEFT_BAR_COLLAPSE = 9;
-
-export const EXPAND_ROW_ICON = 99;
-
-export const MOBILE_MASK = 100;
-
-export const ROW_EXPAND_VIEW = 100;
-
-export const APP_NAV_SLIDER = 100;
-
-// LINK_RECORDS z-index should higher than EXPAND_ROW_ICON
-export const LINK_RECORDS = 100;
-
-// APP_LEFT_BAR is higher than APP_NAV_SLIDER
-export const APP_LEFT_BAR = 101;
-
-export const MOBILE_APP_NAV = 101;
-
-export const STATISTIC_DIALOG_MODAL = 800;
-
-export const STATISTIC_ENLARGE_DIALOG_MODAL = 900;
-
-export const STATISTIC_RECORDS_DIALOG_MODAL = 1000;
-
-export const SEARCH_TABLES_DIALOG_MODAL = 1000;
-
-export const DATE_EDITOR = 1001;
-
-export const NOTIFICATION_LIST_MODAL = 1046;
-
-export const TRIGGER_ROWS_MODAL = 1047;
-
-export const TRIGGER_ROWS_VIEW = 1047;
-
-export const RECORD_DETAILS_DIALOG = 1048;
-
-export const CALENDAR_DIALOG_MODAL = 1048;
-
-export const PRINT_ROW_TYPE_MODAL = 1049;
-
-export const IMAGE_PREVIEW_LIGHTBOX = 1051;
-
-export const DROPDOWN_MENU = 1051;
-
-export const RC_CALENDAR = 1053;
-
-export const EDIT_COLUMN_POPOVER = 1060;
-
-export const LARGE_MAP_EDITOR_DIALOG_MODAL = 1061;
-
-export const TOAST_MANAGER = 999999;
-
-export const LINK_PICKER = 10;
diff --git a/frontend/src/metadata/views/table/table-main/records-footer/index.js b/frontend/src/metadata/views/table/table-main/records-footer/index.js
index 9633b9511b..34d4125f1f 100644
--- a/frontend/src/metadata/views/table/table-main/records-footer/index.js
+++ b/frontend/src/metadata/views/table/table-main/records-footer/index.js
@@ -5,7 +5,8 @@ import toaster from '../../../../../components/toast';
 import LoadAllTip from '../load-all-tip';
 import RecordMetrics from '../../utils/record-metrics';
 import { gettext } from '../../../../../utils/constants';
-import { SEQUENCE_COLUMN_WIDTH, CANVAS_RIGHT_INTERVAL, metadataZIndexes } from '../../../../constants';
+import { SEQUENCE_COLUMN_WIDTH, CANVAS_RIGHT_INTERVAL } from '../../../../constants';
+import { zIndexes } from '../../../../../constants';
 import { addClassName, removeClassName } from '../../utils';
 import { getRecordsFromSelectedRange } from '../../utils/selected-cell-utils';
 
@@ -135,7 +136,7 @@ class RecordsFooter extends React.Component {
     const recordWidth = (isLoadingMore || hasMore ? SEQUENCE_COLUMN_WIDTH + columns[0].width : SEQUENCE_COLUMN_WIDTH) + groupOffsetLeft;
 
     return (
-      <div className="sf-metadata-result-footer" style={{ zIndex: metadataZIndexes.GRID_FOOTER }} ref={ref => this.ref = ref}>
+      <div className="sf-metadata-result-footer" style={{ zIndex: zIndexes.GRID_FOOTER }} ref={ref => this.ref = ref}>
         <div className="rows-record d-flex text-nowrap" style={{ width: recordWidth }}>
           <span>{this.getRecord()}</span>
           {!isLoadingMore && hasMore &&
diff --git a/frontend/src/metadata/views/table/table-main/records-header/index.js b/frontend/src/metadata/views/table/table-main/records-header/index.js
index 9a0d2ca57b..dcd98c67b1 100644
--- a/frontend/src/metadata/views/table/table-main/records-header/index.js
+++ b/frontend/src/metadata/views/table/table-main/records-header/index.js
@@ -6,7 +6,8 @@ import InsertColumn from './insert-column';
 import { isMobile } from '../../../../../utils/utils';
 import { isFrozen, recalculateColumnMetricsByResizeColumn, getFrozenColumns } from '../../../../utils/column';
 import { isEmptyObject } from '../../../../utils/common';
-import { GRID_HEADER_DEFAULT_HEIGHT, GRID_HEADER_DOUBLE_HEIGHT, HEADER_HEIGHT_TYPE, SEQUENCE_COLUMN_WIDTH, metadataZIndexes } from '../../../../constants';
+import { GRID_HEADER_DEFAULT_HEIGHT, GRID_HEADER_DOUBLE_HEIGHT, HEADER_HEIGHT_TYPE, SEQUENCE_COLUMN_WIDTH } from '../../../../constants';
+import { zIndexes } from '../../../../../constants';
 
 const RecordsHeader = ({
   isGroupView,
@@ -39,7 +40,7 @@ const RecordsHeader = ({
     return {
       width: containerWidth,
       minWidth: '100%',
-      zIndex: metadataZIndexes.GRID_HEADER,
+      zIndex: zIndexes.GRID_HEADER,
       height
     };
   }, [containerWidth, height]);
@@ -55,7 +56,7 @@ const RecordsHeader = ({
       position: (isMobile ? 'absolute' : 'fixed'),
       marginLeft: '0px',
       height,
-      zIndex: metadataZIndexes.SEQUENCE_COLUMN,
+      zIndex: zIndexes.SEQUENCE_COLUMN,
     };
     if ((isGroupView && !isFrozen(columns[0])) || isMobile) {
       value.position = 'absolute';
diff --git a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-container-left.js b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-container-left.js
index 7e904a8235..6a3bf3381a 100644
--- a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-container-left.js
+++ b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-container-left.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import GroupHeaderLeft from './group-header-left';
-import { metadataZIndexes } from '../../../../../../constants';
+import { zIndexes } from '../../../../../../../constants';
 
 class GroupContainerLeft extends Component {
 
@@ -31,7 +31,7 @@ class GroupContainerLeft extends Component {
       firstColumnFrozen, lastColumnFrozen, firstColumnKey,
     } = this.props;
     let containerStyle = {
-      zIndex: firstColumnFrozen ? metadataZIndexes.GROUP_FROZEN_HEADER : 0,
+      zIndex: firstColumnFrozen ? zIndexes.GROUP_FROZEN_HEADER : 0,
       width: leftPaneWidth,
       height,
     };
diff --git a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-cell.js b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-cell.js
index 5bec0fd39c..92c2c25b16 100644
--- a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-cell.js
+++ b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-cell.js
@@ -2,7 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { isFrozen } from '../../../../../../utils/column';
-import { GROUP_HEADER_HEIGHT, SEQUENCE_COLUMN_WIDTH, metadataZIndexes } from '../../../../../../constants';
+import { GROUP_HEADER_HEIGHT, SEQUENCE_COLUMN_WIDTH } from '../../../../../../constants';
+import { zIndexes } from '../../../../../../../constants';
 
 class GroupHeaderCell extends React.PureComponent {
 
@@ -32,7 +33,7 @@ class GroupHeaderCell extends React.PureComponent {
       left: offsetLeft
     };
     if (isFrozen(column)) {
-      style.zIndex = metadataZIndexes.GROUP_FROZEN_HEADER;
+      style.zIndex = zIndexes.GROUP_FROZEN_HEADER;
     }
     return style;
   };
diff --git a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-left.js b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-left.js
index a733d67e96..95097f919b 100644
--- a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-left.js
+++ b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/group-header-left.js
@@ -4,7 +4,8 @@ import classnames from 'classnames';
 import { IconBtn } from '@seafile/sf-metadata-ui-component';
 import GroupTitle from './group-title';
 import { gettext } from '../../../../../../../utils/constants';
-import { GROUP_HEADER_HEIGHT, metadataZIndexes } from '../../../../../../constants';
+import { zIndexes } from '../../../../../../../constants';
+import { GROUP_HEADER_HEIGHT } from '../../../../../../constants';
 
 class GroupHeaderLeft extends Component {
 
@@ -15,7 +16,7 @@ class GroupHeaderLeft extends Component {
     } = this.props;
     const { column, count, level, cell_value, original_cell_value } = group;
     const groupHeaderLeftStyle = {
-      zIndex: firstColumnFrozen && metadataZIndexes.GROUP_FROZEN_HEADER,
+      zIndex: firstColumnFrozen && zIndexes.GROUP_FROZEN_HEADER,
       height: GROUP_HEADER_HEIGHT,
       width,
     };
diff --git a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/index.js b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/index.js
index 0d4962cf70..a0265d3044 100644
--- a/frontend/src/metadata/views/table/table-main/records/group-body/group-container/index.js
+++ b/frontend/src/metadata/views/table/table-main/records/group-body/group-container/index.js
@@ -5,7 +5,8 @@ import GroupContainerLeft from './group-container-left';
 import GroupContainerRight from './group-container-right';
 import { isMobile } from '../../../../../../../utils/utils';
 import { isFrozen } from '../../../../../../utils/column';
-import { GROUP_VIEW_OFFSET, SEQUENCE_COLUMN_WIDTH, metadataZIndexes } from '../../../../../../constants';
+import { GROUP_VIEW_OFFSET, SEQUENCE_COLUMN_WIDTH } from '../../../../../../constants';
+import { zIndexes } from '../../../../../../../constants';
 
 import './index.css';
 
@@ -101,7 +102,7 @@ class GroupContainer extends Component {
     let backDropStyle = {
       height: backdropHeight,
       width: leftPaneWidth + scrollLeft ? GROUP_VIEW_OFFSET : 0,
-      zIndex: metadataZIndexes.GROUP_BACKDROP
+      zIndex: zIndexes.GROUP_BACKDROP
     };
 
     return (
diff --git a/frontend/src/metadata/views/table/table-main/records/record/index.js b/frontend/src/metadata/views/table/table-main/records/record/index.js
index 27d0172744..366f943c35 100644
--- a/frontend/src/metadata/views/table/table-main/records/record/index.js
+++ b/frontend/src/metadata/views/table/table-main/records/record/index.js
@@ -4,7 +4,7 @@ import classnames from 'classnames';
 import Cell from './cell';
 import ActionsCell from './actions-cell';
 import { getFrozenColumns } from '../../../../../utils/column';
-import { metadataZIndexes } from '../../../../../constants';
+import { zIndexes } from '../../../../../../constants';
 
 import './index.css';
 
@@ -191,12 +191,12 @@ class Record extends React.Component {
   getFrozenColumnsStyle = () => {
     const { isGroupView, lastFrozenColumnKey, height } = this.props;
     let style = {
-      zIndex: metadataZIndexes.SEQUENCE_COLUMN,
+      zIndex: zIndexes.SEQUENCE_COLUMN,
       height: height - 1,
     };
     if (isGroupView) {
       style.height = height;
-      style.zIndex = metadataZIndexes.FROZEN_GROUP_CELL;
+      style.zIndex = zIndexes.FROZEN_GROUP_CELL;
       if (!lastFrozenColumnKey) {
         style.marginLeft = '0px';
       }
diff --git a/frontend/src/metadata/views/table/utils/selected-cell-utils.js b/frontend/src/metadata/views/table/utils/selected-cell-utils.js
index 54ca208370..a4c13ebb8c 100644
--- a/frontend/src/metadata/views/table/utils/selected-cell-utils.js
+++ b/frontend/src/metadata/views/table/utils/selected-cell-utils.js
@@ -2,7 +2,8 @@ import { Utils } from '../../../../utils/utils';
 import { getCellValueByColumn, getFileNameFromRecord } from '../../../utils/cell';
 import { getGroupByPath } from '../../../utils/view';
 import { getColumnByIndex, canEditCell } from '../../../utils/column';
-import { PRIVATE_COLUMN_KEY, SUPPORT_PREVIEW_COLUMN_TYPES, metadataZIndexes } from '../../../constants';
+import { PRIVATE_COLUMN_KEY, SUPPORT_PREVIEW_COLUMN_TYPES } from '../../../constants';
+import { zIndexes } from '../../../../constants';
 import { getGroupRecordByIndex } from './group-metrics';
 
 const SELECT_DIRECTION = {
@@ -86,7 +87,7 @@ export const getSelectedDimensions = ({
     } else {
       top = getRecordTopFromRecordsBody(rowIdx);
     }
-    const zIndex = frozen ? metadataZIndexes.FROZEN_CELL_MASK : metadataZIndexes.CELL_MASK;
+    const zIndex = frozen ? zIndexes.FROZEN_CELL_MASK : zIndexes.CELL_MASK;
     return { width, left, top, height: rowHeight, zIndex };
   }
   return defaultDimensions;
@@ -122,7 +123,7 @@ export const getSelectedRangeDimensions = ({
 }) => {
   const { topLeft, bottomRight, startCell, cursorCell } = selectedRange;
   if (topLeft.idx < 0) {
-    return { width: 0, left: 0, top: 0, height: rowHeight, zIndex: metadataZIndexes.CELL_MASK };
+    return { width: 0, left: 0, top: 0, height: rowHeight, zIndex: zIndexes.CELL_MASK };
   }
 
   let { totalWidth, anyColFrozen, left } = getColumnRangeProperties(topLeft.idx, bottomRight.idx, columns);
@@ -168,7 +169,7 @@ export const getSelectedRangeDimensions = ({
     top = getRecordTopFromRecordsBody(topLeft.rowIdx);
   }
 
-  const zIndex = anyColFrozen ? metadataZIndexes.FROZEN_CELL_MASK : metadataZIndexes.CELL_MASK;
+  const zIndex = anyColFrozen ? zIndexes.FROZEN_CELL_MASK : zIndexes.CELL_MASK;
   return { width: totalWidth, left, top, height, zIndex };
 };