Refactored editor workspace files

Author: ivandevp

packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/index.js

@@ -0,0 +1,65 @@
+import { getModulePath } from '@codesandbox/common/lib/sandbox/modules';
+import { useOvermind } from 'app/overmind';
+import React from 'react';
+
+import EditIcons from './DirectoryEntry/Entry/EditIcons';
+import DirectoryEntry from './DirectoryEntry/index';
+
+interface IFilesProps {
+  setEditActions: React.Dispatch<any>;
+}
+
+export const Files: React.FC<IFilesProps> = ({ setEditActions }) => {
+  const {
+    state: {
+      editor: { currentSandbox: sandbox },
+      isLoggedIn,
+    },
+    actions: {
+      editor: {
+        createZipClicked,
+      }
+    },
+  } = useOvermind();
+
+  const _getModulePath = moduleId => {
+    try {
+      return getModulePath(sandbox.modules, sandbox.directories, moduleId);
+    } catch (e) {
+      return '';
+    }
+  };
+
+  return (
+    <DirectoryEntry
+      root
+      getModulePath={_getModulePath}
+      title={sandbox.title || 'Project'}
+      initializeProperties={({
+        onCreateModuleClick,
+        onCreateDirectoryClick,
+        onUploadFileClick,
+      }) => {
+        if (setEditActions) {
+          setEditActions(
+            <EditIcons
+              hovering
+              forceShow={window.__isTouch}
+              onCreateFile={onCreateModuleClick}
+              onCreateDirectory={onCreateDirectoryClick}
+              onDownload={createZipClicked}
+              onUploadFile={
+                isLoggedIn && sandbox.privacy === 0
+                  ? onUploadFileClick
+                  : undefined
+              }
+            />
+          );
+        }
+      }}
+      depth={-1}
+      id={null}
+      shortid={null}
+    />
+  );
+};

packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/index.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 
 import { useOvermind } from 'app/overmind';
-import Files from '../../Files';
+import { Files } from '../../Files';
 import { Dependencies } from '../../Dependencies';
 import { WorkspaceItem } from '../../WorkspaceItem';
 import { ItemTitle } from '../../elements';

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Files/index.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { useOvermind } from 'app/overmind';
 import { Dependencies } from '../../Dependencies';
-import Files from '../../Files';
+import { Files } from '../../Files';
 import { Project } from '../../Project';
 import { WorkspaceItem } from '../../WorkspaceItem';