Merge pull request #22 from back4app/cleanup-files

Cleanup files screen

Author: rsouzas

src/dashboard/Settings/GeneralSettings.react.js

@@ -181,7 +181,9 @@ let ManageAppFields = ({
       labelWidth={DEFAULT_SETTINGS_LABEL_WIDTH}
       label={<Label
         text='Clean up app'
-        description={<span>This will delete any files that <br/>are not referenced by any objects.</span>} />}
+        description={<span>This will delete any files that are not referenced by any objects. 
+        (Don't use the feature if you have Arrays of Files,<br/>or Files inside Object columns!)
+        </span>} />}
       input={<FormButton
         onClick={cleanUpFiles}
         value='Clean Up Files'/>} />
@@ -190,61 +192,6 @@ let ManageAppFields = ({
       color={cleanUpMessageColor}>
       <div>{cleanUpFilesMessage}</div>
     </FormNote> : null}
-    <Field
-      labelWidth={DEFAULT_SETTINGS_LABEL_WIDTH}
-      label={<Label
-        text='Export app data'
-        description={'We firmly believe in data portability.'} />}
-      //TODO: Add export progress view when designs are ready.
-      input={<FormButton
-        onClick={exportData}
-        value='Export Data'/>} />
-    {exportDataMessage ? <FormNote
-      show={true}
-      color={exportMessageColor}>
-      <div>{exportDataMessage}</div>
-    </FormNote> : null}
-    {migrateAppField}
-    <Field
-      labelWidth={DEFAULT_SETTINGS_LABEL_WIDTH}
-      label={<Label
-        text='Clone app'
-        description={<span>Choose what you want to carry over <br/>and create a copy of this Parse app.</span>} />}
-      input={<FormButton
-        value='Clone this app'
-        onClick={cloneApp} />
-      } />
-    {cloneAppMessage ? <FormNote
-      show={true}
-      color='green'>
-      <div>{cloneAppMessage} Check out the progress on your <Link to={{ pathname: '/apps' }}>apps page</Link>!</div>
-    </FormNote> : null}
-    {!isCollaborator ? <Field
-      labelWidth={DEFAULT_SETTINGS_LABEL_WIDTH}
-      label={<Label
-        text='Transfer app'
-        description={<span>Give an existing collaborator <br/>ownership over this app.</span>} />
-      }
-      input={<FormButton
-        value='Transfer this app'
-        color='red'
-        disabled={!hasCollaborators}
-        onClick={transferApp} />
-      } /> : null}
-    {transferAppMessage ? <FormNote
-      color='green'>
-      {transferAppMessage}
-    </FormNote> : null}
-    {!isCollaborator ? <Field
-      labelWidth={DEFAULT_SETTINGS_LABEL_WIDTH}
-      label={<Label
-        text='Delete app'
-        description={<span>Completely remove any trace <br/>of this app's existence.</span>} />}
-      input={<FormButton
-        color='red'
-        value='Delete this app'
-        onClick={deleteApp} />
-      } /> : null}
   </Fieldset>);
 }
 
@@ -284,6 +231,7 @@ export default class GeneralSettings extends DashboardView {
       newConnectionString: '',
 
       removedCollaborators: [],
+      showPurgeFilesModal: false,
     };
   }
 
@@ -553,7 +501,7 @@ export default class GeneralSettings extends DashboardView {
           return promise;
         }}
         renderForm={({ changes, fields, setField, resetFields }) => {
-          let isCollaborator = AccountManager.currentUser().email !== this.props.initialFields.owner_email;
+          //let isCollaborator = AccountManager.currentUser().email !== this.props.initialFields.owner_email;
           return <div className={styles.settings_page}>
             <AppInformationFields
               appName={fields.appName}
@@ -576,6 +524,37 @@ export default class GeneralSettings extends DashboardView {
               viewerEmail={AccountManager.currentUser().email}
               addCollaborator={setCollaborators.bind(undefined, setField)}
               removeCollaborator={setCollaborators.bind(undefined, setField)}/>
+            <ManageAppFields
+              mongoURL={fields.mongoURL}
+              isCollaborator={AccountManager.currentUser().email !== this.props.initialFields.owner_email}
+              hasCollaborators={fields.collaborators.length > 0}
+              appSlug={this.context.currentApp.slug}
+              cleanUpFiles={() => this.setState({showPurgeFilesModal: true})}
+              cleanUpFilesMessage={this.state.cleanupFilesMessage}
+              cleanUpMessageColor={this.state.cleanupNoteColor} />
+            {this.state.showPurgeFilesModal ? <Modal
+              type={Modal.Types.INFO}
+              icon='down-outline'
+              iconSize={40}
+              title='Clean Orphan Files'
+              subtitle={'The files without DB references will be removed!'}
+              confirmText='Purge Files'
+              cancelText='Cancel'
+              buttonsInCenter={true}
+              onCancel={() => this.setState({showPurgeFilesModal: false})}
+              onConfirm={() => this.context.currentApp.cleanUpFiles().then(result => {
+                this.setState({
+                  cleanupFilesMessage: 'All set! Your files will be deleted soon.',
+                  cleanupNoteColor: 'orange',
+                  showPurgeFilesModal: false,
+                });
+              }).fail((e) => {
+                this.setState({
+                  cleanupFilesMessage: e.error,
+                  cleanupNoteColor: 'red',
+                  showPurgeFilesModal: false,
+                });
+              })} /> : null }
           </div>;
         }} />
       <Toolbar section='Settings' subsection='General' />

src/lib/ParseApp.js

@@ -340,8 +340,8 @@ export default class ParseApp {
   }
 
   cleanUpFiles() {
-    let path = '/apps/' + this.slug + '/cleanup_files';
-    return AJAX.put(path);
+    let path = '/apps/' + this.slug + '/orphan_files';
+    return AJAX.post(path);
   }
 
   normalizePath(path) {