diff --git a/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.js b/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.js
deleted file mode 100644
index 000a472173c..00000000000
--- a/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.js
+++ /dev/null
@@ -1,60 +0,0 @@
-import React from 'react';
-import filesize from 'filesize';
-import { inject, observer } from 'app/componentConnectors';
-import {
-  Container,
-  Title,
-  JustifiedArea,
-  SubTitle,
-  Description,
-  SubDescription,
-  Rule,
-  LoadingAnimationContainer,
-} from './elements';
-import FilesList from './FilesList';
-
-// eslint-disable-next-line
-class StorageManagementModal extends React.Component {
-  render() {
-    const { store, signals } = this.props;
-
-    const isLoading = store.uploadedFiles === null;
-    const isEmpty = !isLoading && store.uploadedFiles.length === 0;
-
-    return (
-      <Container>
-        <JustifiedArea>
-          <Title>Storage Management</Title>
-          <SubTitle>
-            Used {filesize(store.usedStorage)}
-            {' / '}
-            Total {filesize(store.maxStorage)}
-          </SubTitle>
-        </JustifiedArea>
-        <Description>
-          This is where you can manage your uploaded files.
-        </Description>
-        <Rule />
-        {!isEmpty && !isLoading && (
-          <FilesList
-            files={store.uploadedFiles}
-            deleteFile={signals.files.deletedUploadedFile}
-            deleteFiles={files =>
-              files.map(id => signals.files.deletedUploadedFile({ id }))
-            }
-            addFilesToSandbox={files =>
-              files.map(signals.files.addedFileToSandbox)
-            }
-            addFileToSandbox={signals.files.addedFileToSandbox}
-          />
-        )}
-        {isEmpty && (
-          <SubDescription>You have no uploaded files.</SubDescription>
-        )}
-        {isLoading && <LoadingAnimationContainer />}
-      </Container>
-    );
-  }
-}
-
-export default inject('store', 'signals')(observer(StorageManagementModal));
diff --git a/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.tsx b/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.tsx
new file mode 100644
index 00000000000..2233d0f2c50
--- /dev/null
+++ b/packages/app/src/app/pages/common/Modals/StorageManagementModal/index.tsx
@@ -0,0 +1,56 @@
+import React from 'react';
+import filesize from 'filesize';
+import { useOvermind } from 'app/overmind';
+import {
+  Container,
+  Title,
+  JustifiedArea,
+  SubTitle,
+  Description,
+  SubDescription,
+  Rule,
+  LoadingAnimationContainer,
+} from './elements';
+import FilesList from './FilesList';
+
+const StorageManagementModal = () => {
+  const {
+    state: { uploadedFiles, usedStorage, maxStorage },
+    actions: {
+      files: { deletedUploadedFile, addedFileToSandbox },
+    },
+  } = useOvermind();
+
+  const isLoading = uploadedFiles === null;
+  const isEmpty = !isLoading && uploadedFiles.length === 0;
+
+  return (
+    <Container>
+      <JustifiedArea>
+        <Title>Storage Management</Title>
+        <SubTitle>
+          Used {filesize(usedStorage)}
+          {' / '}
+          Total {filesize(maxStorage)}
+        </SubTitle>
+      </JustifiedArea>
+      <Description>
+        This is where you can manage your uploaded files.
+      </Description>
+      <Rule />
+      {!isEmpty && !isLoading && (
+        <FilesList
+          files={uploadedFiles}
+          deleteFile={deletedUploadedFile}
+          deleteFiles={files => files.map(id => deletedUploadedFile({ id }))}
+          addFilesToSandbox={files => files.map(addedFileToSandbox)}
+          addFileToSandbox={addedFileToSandbox}
+        />
+      )}
+      {isEmpty && <SubDescription>You have no uploaded files.</SubDescription>}
+      {isLoading && <LoadingAnimationContainer />}
+    </Container>
+  );
+};
+
+export default StorageManagementModal;