Remove the rest of urcore, better init structure.

This is another rather big one: All remaining parts of ucore are
removed. Init is now sync. Render starts only when backend connection is
done.

extensions.js

@@ -1,10 +1,10 @@
-const youtube = require('./packages/plugin-youtube')
+// const youtube = require('./packages/plugin-youtube')
 const markdown = require('./packages/plugin-markdown')
 const audio = require('./packages/plugin-audio')
 const pdf = require('./packages/plugin-pdf')
 
 module.exports = [
-  youtube,
+  // youtube,
   markdown,
   audio,
   pdf

packages/app/package.json

@@ -23,7 +23,6 @@
     "react-values": "^0.3.0",
     "speedometer": "^1.1.0",
     "through2": "^2.0.3",
-    "ucore": "^0.4.0",
     "wayfarer": "^6.6.4"
   },
   "devDependencies": {

packages/app/render.js

@@ -1,21 +1,15 @@
 import React from 'react'
 import { render } from 'react-dom'
-import { Provider } from 'ucore/react'
 
-import { App, makeCore } from './src/index.js'
+import { App } from './src/index.js'
 
 import extensions from '../../extensions'
 
 run()
 
 function run () {
-  const core = makeCore(extensions)
-  core.ready()
-
   render(
-    <Provider core={core}>
-      <App />
-    </Provider>,
+    <App extensions={extensions} />,
     document.querySelector('div')
   )
 }

packages/app/src/features/archive/NetStatsComp.js

@@ -8,7 +8,7 @@ function NetStats (props) {
   const stats = useArchiveStats(archive)
   if (!stats) return null
   function sum (stats) {
-    let sum = Object.values(stats).filter(a => (a !== undefined)).reduce((acc, val) => {
+    let sum = Object.values(stats).filter(s => s).reduce((acc, val) => {
       // makes max of peers sense? or sum? or min > 0?
       acc.peers = val.peers > acc.pee ? val.peers : acc.peers
       acc.upSpeed += val.upSpeed

packages/app/src/features/archive/archive.js

@@ -2,13 +2,14 @@ import { useState, useEffect } from 'react'
 import { getApi } from '../../lib/api'
 import { Store } from '../../lib/store'
 
-const archives = new Store('files')
-
-init()
+let archives = new Store('files')
 
 export function init () {
-  getApi().then(api => go(api))
+  // Reset.
+  archives.reset()
 
+  // Open archive stream.
+  getApi().then(api => go(api))
   async function go (api) {
     let archiveStream = await api.hyperlib.createArchiveStream(true)
     archiveStream.on('data', archive => {

packages/app/src/features/archive/index.js

@@ -1,37 +1,7 @@
-import storeConstructor from './store'
-import ArchiveInfo from './ArchiveInfo'
-import ArchiveSharing from './ArchiveSharing'
+import { init as initArchiveStore } from './archive'
+import { init as initNetstatsStore } from './netStatsStore.js'
 
-import registry from '../../lib/component-registry.js'
-import { getApi } from '../../lib/api'
-
-export default {
-  plugin: archivePlugin
-}
-
-registry.add('archiveTabs', ArchiveInfo, { title: 'Info' })
-registry.add('archiveTabs', ArchiveSharing, { title: 'Sharing' })
-
-// getApi().then(ready)
-// async function ready (api) {
-  // let archiveStream = await api.hyperlib.createArchiveStream(true)
-  // archiveStream.on('data', archive => {
-    // // console.log('got archive', archive)
-  // })
-// }
-
-async function archivePlugin (core, opts) {
-  let store = core.makeStore('archive', storeConstructor)
-
-  let updateStream = await core.api.hyperlib.createArchiveStream()
-  updateStream.on('data', data => {
-    let key = data.key
-    store.set(draft => {
-      draft.archives[key] = data
-    })
-  })
-  let statsStream = await core.api.hyperlib.createStatsStream()
-  statsStream.on('data', data => {
-    // do something with stats data.
-  })
+export default function start () {
+  initArchiveStore()
+  initNetstatsStore()
 }

packages/app/src/features/archive/netStatsStore.js

@@ -1,8 +1,6 @@
 import { useState, useEffect } from 'react'
 import { getApi } from '../../lib/api'
 
-init()
-
 let stats = {}
 const subscribers = new Set()
 
@@ -81,4 +79,4 @@ function deepEqual (a, b) {
   if (sa !== sb) return false
 
   return true
-}
+}

packages/app/src/features/drive/file.js

@@ -5,19 +5,19 @@ import { sortByProps } from '../../lib/state-utils'
 
 const files = new StatefulStore('files')
 
-init()
-
 export function init () {
-  getApi().then(api => go(api))
+  files.reset()
 
+  // Start watch stream.
+  getApi().then(api => go(api))
   async function go (api) {
     let watchStream = await api.hyperdrive.createWatchStream()
     // todo: this is really inefficient.
     watchStream.on('data', info => {
       let ids = files.ids()
       const keys = ids.filter(id => id.split('/')[0] === info.key)
-      keys.forEach(key => files.set(key, () => ({})))
-      loadFile(info.key, '/')
+      // keys.forEach(key => files.set(key, () => ({})))
+      // loadFile(info.key, '/')
     })
   }
 }

packages/app/src/features/drive/index.js

@@ -5,18 +5,24 @@ import CreateDir from './CreateDir'
 
 import { MdCreateNewFolder, MdInsertDriveFile } from 'react-icons/md'
 
-registerRoute('archive/:archive/file', FilePage, { Wrapper: FilePageWrapper })
-registerRoute('archive/:archive/file/*', FilePage)
+import { init } from './file'
 
-registerElement('archive/:archive', {
-  link: [
-    { name: 'Files', href: 'archive/:archive/file', weight: -8 }
-  ]
-})
+export default function start () {
+  registerRoute('archive/:archive/file', FilePage, { Wrapper: FilePageWrapper })
+  registerRoute('archive/:archive/file/*', FilePage)
 
-registerElement('archive/:archive/file', {
-  actions: [
-    { name: 'Upload files', component: UploadFile, icon: MdInsertDriveFile, match: file => file.isDirectory },
-    { name: 'Create directory', component: CreateDir, icon: MdCreateNewFolder, match: file => file.isDirectory }
-  ]
-})
+  registerElement('archive/:archive', {
+    link: [
+      { name: 'Files', href: 'archive/:archive/file', weight: -8 }
+    ]
+  })
+
+  registerElement('archive/:archive/file', {
+    actions: [
+      { name: 'Upload files', component: UploadFile, icon: MdInsertDriveFile, match: file => file.isDirectory },
+      { name: 'Create directory', component: CreateDir, icon: MdCreateNewFolder, match: file => file.isDirectory }
+    ]
+  })
+
+  init()
+}

packages/app/src/features/graph/index.js

@@ -3,18 +3,13 @@ import { TagSidebar, TagOverview, TagPage } from './Tag'
 import { registerElement, registerRoute } from '../../lib/router.js'
 import registry from '../../lib/component-registry'
 
-registry.add('fileSidebar', TagSidebar, { title: 'Metadata' })
+export default function start () {
+  registry.add('fileSidebar', TagSidebar, { title: 'Metadata' })
 
-registerRoute('archive/:archive/tags', TagOverview)
-registerRoute('archive/:archive/tags/:tag', TagPage)
+  registerRoute('archive/:archive/tags', TagOverview)
+  registerRoute('archive/:archive/tags/:tag', TagPage)
 
-registerElement('archive/:archive', {
-  link: { name: 'Tags', href: 'archive/:archive/tags', weight: 10 }
-})
-
-// todo: remove.
-export default {
-  name: 'graph-frontend',
-  plugin
+  registerElement('archive/:archive', {
+    link: { name: 'Tags', href: 'archive/:archive/tags', weight: 10 }
+  })
 }
-async function plugin (core) {}