diff --git a/index.js b/index.js
index 426966b..256e255 100644
--- a/index.js
+++ b/index.js
@@ -55,8 +55,8 @@ window.downloadSketch = () => {
 // add model to store
 import modelData from './models/circle_error.d3sketch';
 import JSONToSketchData from './src/shape/JSONToSketchData.js';
-JSONToSketchData(JSON.parse(modelData)).then(sketch => {
-  store.dispatch(actions.openSketch(sketch));
+JSONToSketchData(JSON.parse(modelData)).then(data => {
+  store.dispatch(actions.openSketch({ data }));
 });
 
 // default css
diff --git a/src/components/App.js b/src/components/App.js
index 88fdb97..f422b35 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -106,9 +106,9 @@ class App extends React.Component {
         case 'D3SKETCH':
         case 'JSON':
           const url = URL.createObjectURL(file);
-          const data = await fetch(url).then(result => result.json());
-          const sketchData = await JSONToSketchData(data);
-          openSketch(sketchData);
+          const json = await fetch(url).then(result => result.json());
+          const data = await JSONToSketchData(json);
+          openSketch({ data });
           break;
         case 'JPG':
         case 'JPEG':