@trackunit/react-core-contexts 0.3.14 → 0.4.1

package/index.js

@@ -5,12 +5,11 @@ import { onError } from '@apollo/client/link/error';
 import * as Sentry from '@sentry/browser';
 import { useEnvironment, useToken, ToastProvider, AssetSortingProvider, EnvironmentContextProvider, GlobalSelectionProvider, TokenProvider, CurrentUserProvider, UserSubscriptionProvider as UserSubscriptionProvider$1, useURLSynchronization } from '@trackunit/react-core-hooks';
 import { createUploadLink } from 'apollo-upload-client';
-import { ToastRuntime, AssetSortingRuntime, EnvironmentRuntime, GlobalSelectionRuntime, TokenRuntime, CurrentUserRuntime, UserSubscriptionRuntime } from '@trackunit/iris-app-runtime-core';
+import { ToastRuntime, setupHostConnector, AssetSortingRuntime, EnvironmentRuntime, GlobalSelectionRuntime, TokenRuntime, CurrentUserRuntime, UserSubscriptionRuntime } from '@trackunit/iris-app-runtime-core';
 import * as React from 'react';
-import { useMemo, useState, useEffect, useCallback } from 'react';
+import { useMemo, useEffect, useState } from 'react';
 import { registerTranslations, initializeTranslationsForApp } from '@trackunit/i18n-library-translation';
 import { Spinner } from '@trackunit/react-components';
-import { SortOrder } from '@trackunit/react-core-contexts-api';
 import { BrowserRouter } from 'react-router-dom';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -2447,6 +2446,21 @@ for (var COLLECTION_NAME in DOMIterables) {
 
 handlePrototype(DOMTokenListPrototype, 'DOMTokenList');
 
+/**
+ * Subscribe to methods initiated by changes in the host
+ *
+ * @param methods STABLE object with the methods you'd want to subscribe to. Wrap in useMemo for instance to make it stable
+ */
+
+const useSubscribeToHostChanges = methods => {
+  useEffect(() => {
+    const connection = setupHostConnector(methods);
+    return () => {
+      connection.destroy();
+    };
+  }, [methods]);
+};
+
 const TileAssetSortingProvider = ({
   children
 }) => {
@@ -2454,21 +2468,14 @@ const TileAssetSortingProvider = ({
   useEffect(() => {
     AssetSortingRuntime.getAssetSortingState().catch(() => null).then(setAssetSortingState);
   }, []);
-  const setSortingState = useCallback((...args) => {
-    // TODO when we can trigger a reload of the state from the host, remove this logic that updates the local state
-    AssetSortingRuntime.setAssetSortingState(...args).then(() => {
-      var _a;
-
-      setAssetSortingState({
-        sortBy: args[0],
-        order: (_a = args[1]) !== null && _a !== void 0 ? _a : SortOrder.Desc
-      });
-    });
-  }, []);
+  const methods = useMemo(() => ({
+    onAssetSortingStateChanged: setAssetSortingState
+  }), [setAssetSortingState]);
+  useSubscribeToHostChanges(methods);
   const contextValue = useMemo(() => ({
     sortingState: assetSortingState,
-    setSortBy: setSortingState
-  }), [assetSortingState, setSortingState]);
+    setSortBy: AssetSortingRuntime.setAssetSortingState
+  }), [assetSortingState]);
 
   if (!assetSortingState) {
     return null;
@@ -2517,6 +2524,10 @@ const TileGlobalSelectionProvider = ({
   useEffect(() => {
     GlobalSelectionRuntime.getGlobalSelection().catch(() => null).then(setGlobalSelectionContext);
   }, []);
+  const methods = useMemo(() => ({
+    onGlobalSelectionChanged: setGlobalSelectionContext
+  }), [setGlobalSelectionContext]);
+  useSubscribeToHostChanges(methods);
 
   if (!GlobalSelectionContext) {
     return null;
@@ -2544,6 +2555,10 @@ const TileTokenProvider = ({
 
     updateContext();
   }, []);
+  const methods = React.useMemo(() => ({
+    onTokenChanged: setTokenContext
+  }), [setTokenContext]);
+  useSubscribeToHostChanges(methods);
 
   if (!tokenContext) {
     return null;

package/package.json

@@ -1,20 +1,20 @@
 {
   "name": "@trackunit/react-core-contexts",
-  "version": "0.3.14",
+  "version": "0.4.1",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {
     "graphql": "^15.8.0",
-    "@trackunit/iris-app-runtime-core": "0.2.6",
+    "@trackunit/iris-app-runtime-core": "0.3.0",
     "@trackunit/react-core-contexts-api": "0.2.3",
-    "@trackunit/react-core-contexts-test": "0.1.7",
-    "@trackunit/react-core-hooks": "0.2.7",
+    "@trackunit/react-core-contexts-test": "0.1.8",
+    "@trackunit/react-core-hooks": "0.2.8",
     "react": "17.0.2",
     "@apollo/client": "3.6.9",
     "@sentry/browser": "^7.15.0",
     "apollo-upload-client": "^14.1.3",
     "@trackunit/i18n-library-translation": "0.0.10",
-    "@trackunit/react-components": "0.0.194",
+    "@trackunit/react-components": "0.0.196",
     "react-router-dom": "6.4.1"
   },
   "module": "./index.js",

package/useSubscribeToHostChanges.d.ts

@@ -0,0 +1,7 @@
+import { setupHostConnector } from "@trackunit/iris-app-runtime-core";
+/**
+ * Subscribe to methods initiated by changes in the host
+ *
+ * @param methods STABLE object with the methods you'd want to subscribe to. Wrap in useMemo for instance to make it stable
+ */
+export declare const useSubscribeToHostChanges: (methods: Parameters<typeof setupHostConnector>[0]) => void;