diff --git a/src/CustomLocationPage.tsx b/src/CustomLocationPage.tsx index f905b06..fb5a091 100644 --- a/src/CustomLocationPage.tsx +++ b/src/CustomLocationPage.tsx @@ -14,8 +14,8 @@ import { DomainConfigState } from '@ir-engine/engine/src/assets/state/DomainConf import { MediaSettingsState } from '@ir-engine/engine/src/audio/MediaSettingsState' import { NetworkState } from '@ir-engine/network' import React, { useEffect } from 'react' +import { NeighbourhoodNetworkState } from './ad4m/NeighbourhoodNetworkTransport' import { AgentState } from './ad4m/useADAM' -import { NeighbourhoodNetworkState } from './ad4m/useNeighbourhoodNetwork' import { LocationState } from '@ir-engine/client-core/src/social/services/LocationService' import '@ir-engine/client-core/src/systems/AvatarUISystem' diff --git a/src/ad4m/useNeighbourhoodNetwork.tsx b/src/ad4m/NeighbourhoodNetworkTransport.tsx similarity index 93% rename from src/ad4m/useNeighbourhoodNetwork.tsx rename to src/ad4m/NeighbourhoodNetworkTransport.tsx index 7ed4892..4b22f88 100644 --- a/src/ad4m/useNeighbourhoodNetwork.tsx +++ b/src/ad4m/NeighbourhoodNetworkTransport.tsx @@ -48,22 +48,22 @@ type SignalData = { export const NeighbourhoodNetworkState = defineState({ name: 'hexafield.adam-template.NeighbourhoodNetworkState', - initial: [] as Array<{ topic: Topic; sharedUrl: string }>, + initial: [] as Array<{ topic: Topic; networkID: NetworkID; neighbourhoodUrl: string }>, reactor: () => { - const joinedNeighbourhoods = useMutableState(NeighbourhoodNetworkState).value + const networks = useMutableState(NeighbourhoodNetworkState).value useEffect(() => { - /** @todo it's probably fine that we override this every time we connect to a new server, but we should maybe handle this smarter */ getMutableState(StunServerState).set(PUBLIC_STUN_SERVERS) }, []) return ( <> - {joinedNeighbourhoods.map((neighbourhood) => ( + {networks.map((network) => ( ))} @@ -75,8 +75,8 @@ const array = new Uint32Array(1) self.crypto.getRandomValues(array) const myPeerIndex = array[0] -const ConnectionReactor = (props: { sharedUrl: string; topic: Topic }) => { - const { sharedUrl, topic } = props +const ConnectionReactor = (props: { sharedUrl: string; networkID: NetworkID; topic: Topic }) => { + const { sharedUrl, networkID, topic } = props useEffect(() => { const url = new URL(window.location.href) @@ -85,8 +85,6 @@ const ConnectionReactor = (props: { sharedUrl: string; topic: Topic }) => { window.history.replaceState({}, '', url.toString()) }, []) - const networkID = (sharedUrl + '_' + topic) as NetworkID - const perspective = getState(PerspectivesState).neighbourhoods[sharedUrl] const neighbourhood = useHookstate(() => { diff --git a/src/ad4m/useADAM.tsx b/src/ad4m/useADAM.tsx index c75b19b..e1fb766 100644 --- a/src/ad4m/useADAM.tsx +++ b/src/ad4m/useADAM.tsx @@ -28,30 +28,27 @@ export const AdamClientState = defineState({ ad4mConnect.isAuthenticated().then((authenticated) => { authenticatedState.set(authenticated) + + if (authenticated) return + + const oldState = ad4mConnect.authState + + const onAuthStateChange = (e) => { + if (ad4mConnect.authState === 'authenticated' && oldState !== 'authenticated') { + authenticatedState.set(true) + ad4mConnect.removeEventListener('authstatechange', onAuthStateChange) + } + } + + ad4mConnect.addEventListener('authstatechange', onAuthStateChange) }) }, []) - const authState = useHookstate(ad4mConnect.authState) - useEffect(() => { + if (!authenticatedState.value) return getAd4mClient().then((client) => { getMutableState(AdamClientState).set(client) }) - - const onAuthStateChange = (e) => { - const oldState = authState.value - authState.set(ad4mConnect.authState) - console.log('auth state changed', e, ad4mConnect.authState) - if (ad4mConnect.authState === 'authenticated' && oldState !== 'authenticated') { - // window.location.reload() - } - } - - ad4mConnect.addEventListener('authstatechange', onAuthStateChange) - - return () => { - ad4mConnect.removeEventListener('authstatechange', onAuthStateChange) - } }, [authenticatedState.value]) return null diff --git a/src/tools/graph/DataState.ts b/src/tools/graph/DataState.ts index c0eb982..fc86660 100644 --- a/src/tools/graph/DataState.ts +++ b/src/tools/graph/DataState.ts @@ -38,7 +38,7 @@ export const DataToolRegistry = defineState({ export type TargetSchema = { id: string label: string - value: JSONSchema + schema: JSONSchema onData: (data: Record>) => T onConfirm: (data: T) => void } diff --git a/src/tools/graph/MappingUI.tsx b/src/tools/graph/MappingUI.tsx index bdbfd64..187b43d 100644 --- a/src/tools/graph/MappingUI.tsx +++ b/src/tools/graph/MappingUI.tsx @@ -14,7 +14,7 @@ import SchemaDisplay from './SchemaDisplay' export const MappingUI = () => { // Global visualization type state. const visualizationType = useHookstate('hexafield.conjure.graph-tool.ForceGraph') // todo put in search params once we have multiple - const targetSchema = getState(TargetVisualizationState)[visualizationType.get()].value + const targetSchema = getState(TargetVisualizationState)[visualizationType.get()]?.schema const onConfirm = () => { if (!finalDataState.value) return diff --git a/src/tools/graph/forcegraph/ForceGraph.tsx b/src/tools/graph/forcegraph/ForceGraph.tsx index fd597b2..885a0d4 100644 --- a/src/tools/graph/forcegraph/ForceGraph.tsx +++ b/src/tools/graph/forcegraph/ForceGraph.tsx @@ -562,7 +562,7 @@ type ForceGraphShape = { export const ForceGraphSchema = { id: 'hexafield.conjure.graph-tool.ForceGraph', label: 'Force Graph', - value: forcegraphSchema, + schema: forcegraphSchema, onData: (data: Record) => { const finalData: ForceGraphShape = { nodes: [], edges: [] } const seenLabels = new Map() diff --git a/src/world/NeighbourhoodBubbles.tsx b/src/world/NeighbourhoodBubbles.tsx index 012c0ea..b3e690a 100644 --- a/src/world/NeighbourhoodBubbles.tsx +++ b/src/world/NeighbourhoodBubbles.tsx @@ -1,9 +1,9 @@ -import { getMutableState, getState, NO_PROXY_STEALTH, useHookstate } from '@ir-engine/hyperflux' +import { getMutableState, getState, NetworkID, NO_PROXY_STEALTH, useHookstate } from '@ir-engine/hyperflux' import { NetworkTopics } from '@ir-engine/network' import * as d3 from 'd3' import React, { useEffect, useMemo, useRef } from 'react' +import { NeighbourhoodNetworkState } from '../ad4m/NeighbourhoodNetworkTransport' import { AgentState } from '../ad4m/useADAM' -import { NeighbourhoodNetworkState } from '../ad4m/useNeighbourhoodNetwork' import { PerspectivesState } from '../ad4m/usePerspectives' import { stringToColor } from '../utils/stringToColor' @@ -228,14 +228,26 @@ const NeighbourhoodBubbles = () => { }, [neighbourhoodsState]) const onJoinNeighbourhood = (sharedURL: string) => { - getMutableState(NeighbourhoodNetworkState).set([{ topic: NetworkTopics.world, sharedUrl: sharedURL }]) + getMutableState(NeighbourhoodNetworkState).set([ + { + topic: NetworkTopics.world, + networkID: (NetworkTopics.world + '-' + sharedURL) as NetworkID, + neighbourhoodUrl: sharedURL + } + ]) /** * @todo to get around the pubsub subscription race condition, * use a significant delay to connect to the media server a few seconds late */ setTimeout(() => { - getMutableState(NeighbourhoodNetworkState).merge([{ topic: NetworkTopics.media, sharedUrl: sharedURL }]) + getMutableState(NeighbourhoodNetworkState).merge([ + { + topic: NetworkTopics.media, + networkID: (NetworkTopics.media + '-' + sharedURL) as NetworkID, + neighbourhoodUrl: sharedURL + } + ]) }, 1000) } diff --git a/src/world/NeighbourhoodWorldSystem.tsx b/src/world/NeighbourhoodWorldSystem.tsx index ef017ea..dbef930 100644 --- a/src/world/NeighbourhoodWorldSystem.tsx +++ b/src/world/NeighbourhoodWorldSystem.tsx @@ -2,7 +2,7 @@ import { defineSystem, PresentationSystemGroup } from '@ir-engine/ecs' import { useHookstate, useMutableState } from '@ir-engine/hyperflux' import { NetworkState, NetworkTopics } from '@ir-engine/network' import React from 'react' -import { NeighbourhoodNetworkState } from '../ad4m/useNeighbourhoodNetwork' +import { NeighbourhoodNetworkState } from '../ad4m/NeighbourhoodNetworkTransport' import { useBasicScene } from './BasicScene' import { useSpawnAvatar } from './useSpawnAvatar' @@ -18,7 +18,7 @@ export const NeighbourhoodWorldSystem = defineSystem({ {neighbourhoods .filter((n) => n.topic === NetworkTopics.world) .map((neighbourhood) => ( - + ))} )