diff --git a/config_app/config_endpoints/api/__init__.py b/config_app/config_endpoints/api/__init__.py
index d539639eb..0adf080be 100644
--- a/config_app/config_endpoints/api/__init__.py
+++ b/config_app/config_endpoints/api/__init__.py
@@ -137,4 +137,5 @@ import config_endpoints.api.discovery
 import config_endpoints.api.suconfig
 import config_endpoints.api.superuser
 import config_endpoints.api.user
+import config_endpoints.api.tar_config_loader
 
diff --git a/config_app/config_endpoints/api/tar_config_loader.py b/config_app/config_endpoints/api/tar_config_loader.py
new file mode 100644
index 000000000..1891f1f09
--- /dev/null
+++ b/config_app/config_endpoints/api/tar_config_loader.py
@@ -0,0 +1,47 @@
+import logging
+from flask import abort, request
+
+from config_app.config_endpoints.api import resource, ApiResource, nickname, validate_json_request
+
+logger = logging.getLogger(__name__)
+
+@resource('/v1/configapp/tarconfig')
+class TarConfigLoader(ApiResource):
+    """ Resource for validating a block of configuration against an external service. """
+    schemas = {
+        'ValidateUploadConfig': {
+            'type': 'object',
+            'description': '',
+            'required': [
+                'config'
+            ],
+            'properties': {
+                'config': {
+                    'type': 'object'
+                },
+            },
+        },
+    }
+
+    @nickname('uploadTarballConfig')
+    # @validate_json_request('ValidateUploadConfig')
+    def post(self):
+        """ Extracts and validates all configuration from """
+        logger.debug('hello world!')
+        logger.debug(request)
+        logger.debug('hello world!')
+        logger.debug(request.files)
+        # logger.debug('hello world!')
+        # logger.debug(request.body)
+        # logger.debug(request.data)
+        logger.debug('hello world!')
+        logger.debug(request.files)
+        logger.debug('hello world!')
+        logger.debug(request.mimetype)
+        logger.debug('hello world!')
+        logger.debug(request.get_data())
+        logger.debug('hello world!')
+        logger.debug(request.get_json())
+        logger.debug('hello world!')
+
+        abort(418)
diff --git a/config_app/js/components/file-upload-box.js b/config_app/js/components/file-upload-box.js
index 2a48b06d0..6fee20a14 100644
--- a/config_app/js/components/file-upload-box.js
+++ b/config_app/js/components/file-upload-box.js
@@ -34,7 +34,7 @@ angular.module('quay-config').directive('fileUploadBox', function () {
 
       var conductUpload = function(file, url, fileId, mimeType, progressCb, doneCb) {
         var request = new XMLHttpRequest();
-        request.open('PUT', url, true);
+        request.open('POST', url, true);
         request.setRequestHeader('Content-Type', mimeType);
         request.onprogress = function(e) {
           $scope.$apply(function() {
@@ -103,12 +103,13 @@ angular.module('quay-config').directive('fileUploadBox', function () {
           $scope.currentlyUploadingFile = currentFile;
           $scope.uploadProgress = 0;
 
-          ApiService.getFiledropUrl(data).then(function(resp) {
-            // Perform the upload.
-            conductUpload(currentFile, resp.url, resp.file_id, mimeType, progressCb, doneCb);
-          }, function() {
-            callback(false, 'Could not retrieve upload URL');
-          });
+          // ApiService.getFiledropUrl(data).then(function(resp) {
+          //   // Perform the upload.
+          //   conductUpload(currentFile, resp.url, resp.file_id, mimeType, progressCb, doneCb);
+          // }, function() {
+          //   callback(false, 'Could not retrieve upload URL');
+          // });
+          conductUpload(currentFile, '/api/v1/configapp/tarconfig','fileIdIsUnused', mimeType, progressCb, doneCb);
         };
 
         // Start the uploading.
diff --git a/config_app/js/components/load-config/load-config.component.ts b/config_app/js/components/load-config/load-config.component.ts
index 933a5469e..2279420c4 100644
--- a/config_app/js/components/load-config/load-config.component.ts
+++ b/config_app/js/components/load-config/load-config.component.ts
@@ -1,32 +1,47 @@
 import { Input, Component, Inject } from 'ng-metadata/core';
 const templateUrl = require('./load-config.html');
+const styleUrl = require('./load-config.css');
+
+declare let bootbox: any;
+declare let window: any;
 
 @Component({
     selector: 'load-config',
     templateUrl,
+    styleUrls: [ styleUrl ],
 })
 export class LoadConfigComponent {
-    private resetUpload: number = 0;
+    private isReady: boolean = false;
+    private uploadFunc: Function;
 
-    private handleTarballSelected(files, callback) {
-        console.log('hi world')
-        /*
-        $scope.certsUploading = true;
-        $upload.upload({
-            url: '/api/v1/superuser/customcerts/' + files[0].name,
-            method: 'POST',
-            data: {'_csrf_token': window.__token},
-            file: files[0]
-        }).success(function() {
-            callback(true);
-            $scope.resetUpload++;
-            loadCertificates();
-        }).error(function(r) {
-            bootbox.alert('Could not upload certificate')
-            callback(false);
-            $scope.resetUpload++;
-            loadCertificates();
-        });
-        */
+    private constructor(@Inject('ApiService') private apiService: any) {
     }
+
+    private handleTarballSelected(files: File[], callback: Function) {
+        this.isReady = true;
+        callback(true)
+    }
+
+    private handleTarballCleared() {
+        this.isReady = false;
+    }
+
+    private uploadTarball() {
+        this.uploadFunc(resp => {
+            console.log('hi')
+            console.log(resp)
+        });
+    }
+
+    /**
+     * When files are validated, this is called by the child to give us
+     * the callback function to upload
+     * @param files: files to upload
+     * @param uploadFiles: function to call to upload files
+     */
+    private filesValidated(files, uploadFiles) {
+        this.uploadFunc = uploadFiles;
+    }
+
+
 }
\ No newline at end of file
diff --git a/config_app/js/components/load-config/load-config.css b/config_app/js/components/load-config/load-config.css
new file mode 100644
index 000000000..a557fd3a9
--- /dev/null
+++ b/config_app/js/components/load-config/load-config.css
@@ -0,0 +1,4 @@
+
+
+.load-config__body strong {
+}
\ No newline at end of file
diff --git a/config_app/js/components/load-config/load-config.html b/config_app/js/components/load-config/load-config.html
index 3a5d0606e..142c3f44f 100644
--- a/config_app/js/components/load-config/load-config.html
+++ b/config_app/js/components/load-config/load-config.html
@@ -8,14 +8,20 @@
                     <h4 class="modal-title"><span>Load Config</span></h4>
                 </div>
                 <!-- Body -->
-                <div>
-                    Please upload a tarball
+                <div class="modal-body">
+                    <span>Please upload the previous configuration</span>
                     <div class="file-upload-box"
                          select-message="Select a previous configuration to modify. Must be in tar.gz format"
                          files-selected="$ctrl.handleTarballSelected(files, callback)"
-                         reset="$ctrl.resetUpload"
+                         files-cleared="$ctrl.handleFilesCleared()"
+                         files-validated="$ctrl.filesValidated(files, uploadFiles)"
                          extensions="['application/gzip', '.gz']"></div>
                 </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-primary" ng-click="$ctrl.uploadTarball()" ng-disabled="!$ctrl.isReady">
+                        Upload Configuration
+                    </button>
+                </div>
             </div><!-- /.modal-content -->
         </div><!-- /.modal-dialog -->
     </div>