diff --git a/packages/web/src/datagrid/DataGrid.js b/packages/web/src/datagrid/DataGrid.js
index a7bf2c5f4..36db23626 100644
--- a/packages/web/src/datagrid/DataGrid.js
+++ b/packages/web/src/datagrid/DataGrid.js
@@ -15,6 +15,7 @@ import {
 } from './ManagerStyles';
 import ReferenceManager from './ReferenceManager';
 import { HorizontalSplitter } from '../widgets/Splitter';
+import LoadingDataGrid from './LoadingDataGrid';
 
 const MainContainer = styled.div`
   position: absolute;
@@ -50,18 +51,18 @@ export default function DataGrid(props) {
       <LeftContainer>
         <ManagerMainContainer>
           <Container1>
-            <ColumnManager {...props} managerSize={managerSize}/>
+            <ColumnManager {...props} managerSize={managerSize} />
           </Container1>
           {props.showReferences && (
             <ManagerOuterContainer2>
-              <ReferenceManager {...props} managerSize={managerSize}/>
+              <ReferenceManager {...props} managerSize={managerSize} />
             </ManagerOuterContainer2>
           )}
         </ManagerMainContainer>
       </LeftContainer>
 
       <DataGridContainer>
-        <DataGridCore {...props} />
+        <LoadingDataGrid {...props} />
       </DataGridContainer>
     </HorizontalSplitter>
 
diff --git a/packages/web/src/datagrid/LoadingDataGrid.js b/packages/web/src/datagrid/LoadingDataGrid.js
new file mode 100644
index 000000000..c9ba3dd85
--- /dev/null
+++ b/packages/web/src/datagrid/LoadingDataGrid.js
@@ -0,0 +1,6 @@
+import React from 'react';
+import DataGridCore from './DataGridCore';
+
+export default function LoadingDataGrid(props) {
+  return <DataGridCore {...props} />;
+}