Getting registration working

Co-authored-by: Brian Ginsburg <gins@brianginsburg.com>

package-lock.json

@@ -8,7 +8,7 @@
       "name": "svelte-elemetary-template",
       "version": "0.1.0",
       "dependencies": {
-        "webnative": "0.33.0-alpha-1"
+        "webnative": "0.33.0-alpha-2"
       },
       "devDependencies": {
         "@sveltejs/adapter-static": "1.0.0-next.36",
@@ -44,9 +44,6 @@
         "@babel/highlight": "^7.10.4"
       }
     },
-    "node_modules/@babel/highlight": {
-      "dev": true
-    },
     "node_modules/@cspotcode/source-map-support": {
       "version": "0.8.1",
       "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
@@ -1699,18 +1696,6 @@
         "esbuild-windows-arm64": "0.14.49"
       }
     },
-    "node_modules/esbuild-android-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-android-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-darwin-64": {
-      "dev": true,
-      "optional": true
-    },
     "node_modules/esbuild-darwin-arm64": {
       "version": "0.14.49",
       "integrity": "sha512-XMaqDxO846srnGlUSJnwbijV29MTKUATmOLyQSfswbK/2X5Uv28M9tTLUJcKKxzoo9lnkYPsx2o8EJcTYwCs/A==",
@@ -1726,70 +1711,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/esbuild-freebsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-freebsd-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-32": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-arm": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-mips64le": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-ppc64le": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-riscv64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-linux-s390x": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-netbsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-openbsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-sunos-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-windows-32": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-windows-64": {
-      "dev": true,
-      "optional": true
-    },
-    "node_modules/esbuild-windows-arm64": {
-      "dev": true,
-      "optional": true
-    },
     "node_modules/escalade": {
       "version": "3.1.1",
       "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
@@ -4758,9 +4679,9 @@
       }
     },
     "node_modules/webnative": {
-      "version": "0.33.0-alpha-1",
+      "version": "0.33.0-alpha-2",
-      "resolved": "https://registry.npmjs.org/webnative/-/webnative-0.33.0-alpha-1.tgz",
+      "resolved": "https://registry.npmjs.org/webnative/-/webnative-0.33.0-alpha-2.tgz",
-      "integrity": "sha512-g5xg5gkDScTre5IrhcJgWhEgYlI/pri2OTxZxLq832cqgu42gJ9Jzs7B+hgSEDHWB+ROQWCe+RJ9H0dlhTKORw==",
+      "integrity": "sha512-S9UzS9PKTdgaoplBrlgsk5T7IYcpKMbTxXzg1jxkrVPiHJpuBLC5l+t4GkLTMyalaRMBO6JzlL5qaE51j3j2dw==",
       "dependencies": {
         "@ipld/dag-cbor": "^7.0.0",
         "@ipld/dag-pb": "^2.1.15",
@@ -4955,9 +4876,6 @@
         "@babel/highlight": "^7.10.4"
       }
     },
-    "@babel/highlight": {
-      "dev": true
-    },
     "@cspotcode/source-map-support": {
       "version": "0.8.1",
       "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
@@ -6126,88 +6044,12 @@
         "esbuild-windows-arm64": "0.14.49"
       }
     },
-    "esbuild-android-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-android-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-darwin-64": {
-      "dev": true,
-      "optional": true
-    },
     "esbuild-darwin-arm64": {
       "version": "0.14.49",
       "integrity": "sha512-XMaqDxO846srnGlUSJnwbijV29MTKUATmOLyQSfswbK/2X5Uv28M9tTLUJcKKxzoo9lnkYPsx2o8EJcTYwCs/A==",
       "dev": true,
       "optional": true
     },
-    "esbuild-freebsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-freebsd-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-32": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-arm": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-arm64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-mips64le": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-ppc64le": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-riscv64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-s390x": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-netbsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-openbsd-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-sunos-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-32": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-64": {
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-arm64": {
-      "dev": true,
-      "optional": true
-    },
     "escalade": {
       "version": "3.1.1",
       "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
@@ -8227,9 +8069,9 @@
       "peer": true
     },
     "webnative": {
-      "version": "0.33.0-alpha-1",
+      "version": "0.33.0-alpha-2",
-      "resolved": "https://registry.npmjs.org/webnative/-/webnative-0.33.0-alpha-1.tgz",
+      "resolved": "https://registry.npmjs.org/webnative/-/webnative-0.33.0-alpha-2.tgz",
-      "integrity": "sha512-g5xg5gkDScTre5IrhcJgWhEgYlI/pri2OTxZxLq832cqgu42gJ9Jzs7B+hgSEDHWB+ROQWCe+RJ9H0dlhTKORw==",
+      "integrity": "sha512-S9UzS9PKTdgaoplBrlgsk5T7IYcpKMbTxXzg1jxkrVPiHJpuBLC5l+t4GkLTMyalaRMBO6JzlL5qaE51j3j2dw==",
       "requires": {
         "@ipld/dag-cbor": "^7.0.0",
         "@ipld/dag-pb": "^2.1.15",

package.json

@@ -50,6 +50,6 @@
     ]
   },
   "dependencies": {
-    "webnative": "0.33.0-alpha-1"
+    "webnative": "0.33.0-alpha-2"
   }
 }

src/components/auth/Register.svelte

@@ -1,10 +1,15 @@
 <script lang="ts">
   import * as webnative from 'webnative'
-  import { isUsernameValid, isUsernameAvailable } from '$lib/common/webnative'
+  import {
+    isUsernameValid,
+    isUsernameAvailable,
+    register
+  } from '$lib/common/webnative'
 
   let username: string = ''
   let usernameValid = true
   let usernameAvailable = true
+  let registrationSuccess = true
 
   const checkUsername = async (event: Event) => {
     const { value } = event.target as HTMLInputElement
@@ -18,6 +23,14 @@
       console.log(username, ' is available: ', usernameAvailable)
     }
   }
+
+  const registerUser = async (event: Event) => {
+    registrationSuccess = await register(username)
+    console.log('registration success: ', registrationSuccess)
+    if (registrationSuccess) {
+      // Redirect to device linking?
+    }
+  }
 </script>
 
 <input type="checkbox" id="my-modal-5" checked class="modal-toggle" />
@@ -54,6 +67,14 @@
           {/if}
         </label>
       {/if}
+      {#if registrationSuccess}
+        <label for="registration" class="label mt-1">
+          <span class="label-text-alt text-error text-left">
+            There was an issue registering your account. Please try again.
+            <a href="#" class="underline">More info</a>
+          </span>
+        </label>
+      {/if}
       <div class="text-left mt-3">
         <input
           type="checkbox"
@@ -75,6 +96,7 @@
           disabled={username.length === 0 ||
             !usernameValid ||
             !usernameAvailable}
+          on:click={registerUser}
         >
           Register
         </button>

src/global.css

@@ -21,3 +21,11 @@ input[type='checkbox']:checked::before {
 .modal-box {
   @apply p-8;
 }
+
+.label {
+  @apply px-0;
+}
+
+.label-text-alt {
+  @apply text-sm;
+}

src/lib/common/webnative.ts

@@ -1,44 +1,28 @@
 import * as webnative from 'webnative'
 
-import type FileSystem from 'webnative/fs/index'
+// import type FileSystem from 'webnative/fs/index'
-import { USE_WNFS_IMPLEMENTATION } from 'webnative/auth/implementation/use-wnfs'
 import { setup } from 'webnative'
 import { asyncDebounce } from '$lib/common/utils'
 
 // runfission.net = staging
 setup.endpoints({ api: 'https://runfission.net', user: 'fissionuser.net' })
 
-setup.setImplementations({ auth: USE_WNFS_IMPLEMENTATION.auth })
+let state: webnative.AppState
-
-let state: webnative.State
-
-const fissionInit = {
-  permissions: {
-    app: {
-      name: 'app-name',
-      creator: 'creator-name'
-    },
-    // Ask the user permission to additional filesystem paths
-    fs: {
-      // private: [webnative.path.directory('Documents', 'Contacts')],
-    }
-  }
-}
 
 // TODO: Add a flag or script to turn debugging on/off
 setup.debug({ enabled: true })
 
 export const initialize = async (): Promise<void> => {
   try {
-    const st = await webnative.initialise(fissionInit)
+    const st = await webnative.app({ useWnfs: true })
     state = st
 
     switch (state.scenario) {
-      case webnative.Scenario.NotAuthorised:
+      case webnative.AppScenario.NotAuthed:
         console.log('Not logged in')
         break
 
-      case webnative.Scenario.Continuation:
+      case webnative.AppScenario.Authed:
         console.log('Logged in')
         break
 
@@ -62,12 +46,25 @@ export const isUsernameValid = async (username: string): Promise<boolean> => {
   return webnative.account.isUsernameValid(username)
 }
 
-const debouncedIsUsernameAvailable = asyncDebounce(webnative.account.isUsernameAvailable, 300)
+const debouncedIsUsernameAvailable = asyncDebounce(
+  webnative.account.isUsernameAvailable,
+  300
+)
 
-export const isUsernameAvailable = async (username: string): Promise<boolean> => {
+export const isUsernameAvailable = async (
+  username: string
+): Promise<boolean> => {
   return debouncedIsUsernameAvailable(username)
 }
 
+export const register = async (username: string): Promise<boolean> => {
+  const { success } = await webnative.account.register({
+    username,
+    email: 'null@null.com'
+  })
+  return success
+}
+
 // interface StateFS {
 //   fs?: FileSystem
 // }