Cleanup

Author: MichaelDeBoey

packages/app/src/app/pages/common/Modals/StorageManagementModal/FilesList/AddFileToSandboxButton.tsx

@@ -20,6 +20,10 @@ export const AddFileToSandboxButton: FunctionComponent<Props> = ({
     },
   } = useOvermind();
 
+  if (!currentSandbox) {
+    return null;
+  }
+
   return (
     <Button
       disabled={!currentSandbox}

packages/app/src/app/pages/common/Modals/StorageManagementModal/FilesList/Button/elements.ts

@@ -1,6 +1,24 @@
 import TooltipBase from '@codesandbox/common/lib/components/Tooltip';
 import styled from 'styled-components';
 
+export const ButtonComponent = styled.button`
+  font-size: 1.2em;
+  background-color: inherit;
+  border: none;
+  padding: 5px 6px 9px 6px;
+  color: rgba(255, 255, 255, 0.5);
+  cursor: pointer;
+
+  &:hover {
+    color: rgba(255, 255, 255, 1);
+  }
+
+  &[disabled] {
+    opacity: 0.5;
+    cursor: default;
+  }
+`;
+
 export const Tooltip = styled(TooltipBase)`
   font-size: 1.2em;
   background-color: inherit;

packages/app/src/app/pages/common/Modals/StorageManagementModal/FilesList/Button/index.tsx

@@ -1,22 +1,5 @@
 import React, { ComponentType, FunctionComponent, HTMLAttributes } from 'react';
-import styled from 'styled-components';
-import { Tooltip } from './elements';
-
-const ButtonComponent = styled.button`
-  font-size: 1.2em;
-  background-color: inherit;
-  border: none;
-  padding: 5px 6px 9px 6px;
-  color: rgba(255, 255, 255, 0.5);
-  cursor: pointer;
-  &:hover {
-    color: rgba(255, 255, 255, 1);
-  }
-  &[disabled] {
-    opacity: 0.5;
-    cursor: default;
-  }
-`;
+import { ButtonComponent, Tooltip } from './elements';
 
 type Props = {
   disabled?: boolean;
@@ -30,7 +13,7 @@ export const Button: FunctionComponent<Props> = ({
   tooltip,
 }) => (
   <Tooltip content={tooltip} isEnabled={!disabled}>
-    <ButtonComponent type="button" onClick={onClick}>
+    <ButtonComponent onClick={onClick} type="button">
       <Icon />
     </ButtonComponent>
   </Tooltip>

packages/app/src/app/pages/common/Modals/StorageManagementModal/FilesList/index.tsx

@@ -116,9 +116,7 @@ export const FilesList: FunctionComponent = () => {
                     cursor: pointer;
                   `}
                 >
-                  {currentSandbox && (
-                    <AddFileToSandboxButton name={name} url={url} />
-                  )}
+                  <AddFileToSandboxButton name={name} url={url} />
                 </StatBody>
 
                 <StatBody