fix: add app instance id to phase app

Also improve database structure and sample database so that it reflects how the API returns the space. closes #111
graasp · Jun 21, 2019 · dd93a91 · dd93a91
1 parent e2a6651
commit dd93a91
Show file tree

Hide file tree

Showing 5 changed files with 71 additions and 28 deletions.
diff --git a/public/electron.js b/public/electron.js
@@ -430,8 +430,10 @@ app.on('ready', async () => {
         .get('phases')
         .find({ id: subSpaceId })
         .get('items')
+        .filter(item => item.appInstance)
+        .map(item => item.appInstance)
         .find({ id: appInstanceId })
-        .get('appInstanceResources');
+        .get('resources');
 
       // only filter by type if provided
       if (type) {
@@ -492,8 +494,10 @@ app.on('ready', async () => {
         .get('phases')
         .find({ id: subSpaceId })
         .get('items')
+        .filter(item => item.appInstance)
+        .map(item => item.appInstance)
         .find({ id: appInstanceId })
-        .get('appInstanceResources')
+        .get('resources')
         .push(resourceToWrite)
         .write();
 
@@ -523,8 +527,10 @@ app.on('ready', async () => {
         .get('phases')
         .find({ id: subSpaceId })
         .get('items')
+        .filter(item => item.appInstance)
+        .map(item => item.appInstance)
         .find({ id: appInstanceId })
-        .get('appInstanceResources')
+        .get('resources')
         .find({ id })
         .assign(fieldsToUpdate)
         .value();
@@ -549,8 +555,9 @@ app.on('ready', async () => {
         .get('phases')
         .find({ id: subSpaceId })
         .get('items')
-        .find({ appInstanceId: id })
-        .get('appInstance')
+        .filter(item => item.appInstance)
+        .map(item => item.appInstance)
+        .find({ id })
         .value();
 
       mainWindow.webContents.send(GET_APP_INSTANCE_CHANNEL, appInstance);

diff --git a/src/actions/appInstance.js b/src/actions/appInstance.js
@@ -13,14 +13,23 @@ const getAppInstance = async (
   callback
 ) => async (dispatch, getState) => {
   try {
-    // first check to see if app instance is available in the redux store
+    // first check to see if items are available in the content
+    // of the phase that is currently in the redux store
     const { Phase } = getState();
-    const items = Phase.getIn(['current', 'content', 'items']);
-    const item = items && _.find(items, ['id', id]);
-    if (item && item.appInstance) {
+    const items = Phase.getIn(['current', 'content', 'items']) || [];
+
+    // only consider items that have app instances
+    const appInstances = items
+      .filter(item => item.appInstance)
+      .map(item => item.appInstance);
+
+    // find the app instance with this id
+    const appInstance = _.find(appInstances, ['id', id]);
+
+    if (appInstance) {
       callback({
         type: GET_APP_INSTANCE_SUCCEEDED,
-        payload: item.appInstance,
+        payload: appInstance,
       });
     } else {
       window.ipcRenderer.send(GET_APP_INSTANCE_CHANNEL, {

diff --git a/src/components/phase/PhaseApp.js b/src/components/phase/PhaseApp.js
@@ -32,11 +32,15 @@ class PhaseApp extends Component {
     phaseId: PropTypes.string.isRequired,
     spaceId: PropTypes.string.isRequired,
     lang: PropTypes.string,
+    appInstance: PropTypes.shape({
+      id: PropTypes.string.isRequired,
+    }),
   };
 
   static defaultProps = {
     url: null,
     asset: null,
+    appInstance: null,
     name: 'Image',
     lang: DEFAULT_LANGUAGE,
   };
@@ -83,7 +87,17 @@ class PhaseApp extends Component {
   };
 
   render() {
-    const { url, lang, asset, name, id, folder, spaceId, phaseId } = this.props;
+    const {
+      url,
+      lang,
+      asset,
+      name,
+      id,
+      folder,
+      spaceId,
+      phaseId,
+      appInstance,
+    } = this.props;
     let uri = url;
     if (asset) {
       // assets with absolute paths are usually for testing
@@ -109,13 +123,16 @@ class PhaseApp extends Component {
       existingParams = Qs.parse(existingQueryString);
     }
 
+    const { id: appInstanceId } = appInstance || {};
+
     const params = {
       ...existingParams,
       spaceId,
       userId,
       lang,
+      appInstanceId,
+      itemId: id,
       offline: true,
-      appInstanceId: id,
       subSpaceId: phaseId,
     };
 

diff --git a/src/components/phase/PhaseItem.js b/src/components/phase/PhaseItem.js
@@ -44,7 +44,7 @@ const renderResource = item => {
 };
 
 const PhaseItem = ({ item, spaceId, phaseId }) => {
-  const { id, category, asset, url, name } = item;
+  const { id, category, asset, url, name, appInstance } = item;
   switch (category) {
     case RESOURCE:
       return renderResource(item);
@@ -59,6 +59,7 @@ const PhaseItem = ({ item, spaceId, phaseId }) => {
           name={name}
           spaceId={spaceId}
           phaseId={phaseId}
+          appInstance={appInstance}
         />
       );
 
@@ -77,6 +78,13 @@ PhaseItem.propTypes = {
   }).isRequired,
   phaseId: PropTypes.string.isRequired,
   spaceId: PropTypes.string.isRequired,
+  appInstance: PropTypes.shape({
+    id: PropTypes.string,
+  }),
+};
+
+PhaseItem.defaultProps = {
+  appInstance: null,
 };
 
 export default PhaseItem;
diff --git a/src/data/sample.json b/src/data/sample.json
@@ -57,24 +57,26 @@
               "name": "Input Box",
               "url": "https://apps.graasp.eu/5acb589d0d5d9464081c2d46/5cde9891226a7d20a8a16697/latest/index.html",
               "asset": "",
-              "appInstanceResources": [
-                {
-                  "appInstance": "5ce2c2e23a209c1877b3dc80",
-                  "createdAt": "2019-05-21T17:06:29.683Z",
-                  "updatedAt": "2019-05-24T13:24:05.073Z",
-                  "data": "Sample text.",
-                  "format": "v1",
-                  "type": "input",
-                  "visibility": "private",
-                  "user": "5ce422795fe28eeca1001e0a",
-                  "id": "5ce430152f6f6672b16fca57"
-                }
-              ],
-              "appInstanceId": "5ce2c2e23a209c1877b3dc80",
               "appInstance": {
+                "id": "5ce2c2e23a209c1877b3dc80",
                 "settings": {
                   "headerVisible": false
-                }
+                },
+                "resources": [
+                  {
+                    "appInstance": "5ce2c2e23a209c1877b3dc80",
+                    "createdAt": "2019-05-21T17:06:29.683Z",
+                    "updatedAt": "2019-05-24T13:24:05.073Z",
+                    "data": "Sample text.",
+                    "format": "v1",
+                    "type": "input",
+                    "visibility": "private",
+                    "user": "5ce422795fe28eeca1001e0a",
+                    "id": "5ce430152f6f6672b16fca57"
+                  }
+                ],
+                "createdAt": "2019-05-21T17:06:29.683Z",
+                "updatedAt": "2019-05-24T13:24:05.073Z"
               }
             }
           ],