add checking if IPFS is ready to be used

app/components/projects/hooks.js

@@ -3,7 +3,8 @@ import web3 from 'Embark/web3'
 import LiquidPledging from 'Embark/contracts/LiquidPledging'
 import { useState, useEffect, useMemo } from 'react'
 import { timeSinceBlock } from '../../utils/dates'
-import { getFiles } from '../../utils/ipfs'
+import { getFiles, ipfs } from '../../utils/ipfs'
+import { databaseExists } from '../../utils/db'
 
 async function getProjectAge(id, events, setState){
   const event = events.find(e => e.returnValues.idProject === id)
@@ -15,13 +16,28 @@ async function getProjectAssets(projectId, setState){
   EmbarkJS.onReady(async (err) => {
     const projectInfo = await LiquidPledging.methods.getPledgeAdmin(projectId).call()
     const CID = projectInfo.url.split('/').slice(-1)[0]
+    console.log({CID, projectInfo, ipfs})
     getFiles(CID)
       .then((files) => {
         setState(files)
         const manifest = files[2]
         console.log({files}, JSON.parse(manifest.content))
       })
-      .catch(console.log)
+      .catch(async (err) => {
+        console.log('IPFS getFiles error: ', err)
+        databaseExists('ipfs')
+          .catch(() => location.reload())
+
+        getFiles(CID)
+          .then((files) => {
+            setState(files)
+            const manifest = files[2]
+            console.log({files}, JSON.parse(manifest.content))
+          })
+          .catch((err) => {
+            console.log('IPFS FAILED ON READY', err)
+          })
+      })
   })
 }
 
@@ -30,6 +46,11 @@ const getProjectManifest = assets => assets ? JSON.parse(assets.find(a => a.name
 export function useProjectData(projectId, profile, projectAddedEvents) {
   const [projectAge, setAge] = useState(null)
   const [projectAssets, setAssets] = useState(null)
+  const [ipfsReady, setIpfsState] = useState(null)
+
+  useEffect(() => {
+    ipfs.on('ready', () => { setIpfsState(true) })
+  }, [projectId])
 
   useEffect(() => {
     getProjectAge(projectId, projectAddedEvents, setAge)
@@ -37,7 +58,7 @@ export function useProjectData(projectId, profile, projectAddedEvents) {
 
   useEffect(() => {
     getProjectAssets(projectId, setAssets)
-  }, [projectId])
+  }, [projectId, ipfsReady])
 
   const manifest = useMemo(() => getProjectManifest(projectAssets), [projectAssets])
 

app/utils/db.js

@@ -10,3 +10,32 @@ export const fieldGenerator = self => (column, name) => {
 export function initialize(target, name, descriptor) {
   descriptor.initializer = true
 }
+
+export function databaseExists(name){
+  return new Promise(function(resolve, reject){
+    var db = indexedDB,
+        req;
+
+    try{
+      // See if it exist
+      req = db.webkitGetDatabaseNames();
+      req.onsuccess = function(evt){
+        ~([].slice.call(evt.target.result)).indexOf(name) ?
+          resolve(true):
+          reject(false);
+      }
+    } catch (e){
+      // Try if it exist
+      req = db.open(name);
+      req.onsuccess = function () {
+        req.result.close();
+        resolve(true);
+      }
+      req.onupgradeneeded = function (evt) {
+        evt.target.transaction.abort();
+        reject(false);
+      }
+    }
+
+  })
+}

app/utils/ipfs.js

@@ -4,7 +4,11 @@ import { Matcher } from '@areknawo/rex'
 import { getImageType } from './images'
 
 const ipfsMatcher = new Matcher().begin().find('ipfs/')
-const ipfs = new IPFS()
+export const ipfs = new IPFS()
+
+ipfs.on('ready', () => {
+  console.log('Node is ready to use!')
+})
 
 export const isIpfs = str => ipfsMatcher.test(str)
 export const captureFile = (event, cb, imgCb) => {