core-api: memo app and api provider versioned value maps

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/core-api/src/apis/system/ApiProvider.tsx

@@ -20,6 +20,7 @@ import React, {
   ReactNode,
   PropsWithChildren,
   Context,
+  useMemo,
 } from 'react';
 import PropTypes from 'prop-types';
 import { ApiRef, ApiHolder, TypesToApiRefs } from './types';
@@ -54,14 +55,15 @@ export const ApiProvider = ({
   children,
 }: PropsWithChildren<ApiProviderProps>) => {
   const parentHolder = useContext(ApiContext)?.atVersion(1);
-  const holder = parentHolder ? new ApiAggregator(apis, parentHolder) : apis;
-
-  return (
-    <ApiContext.Provider
-      value={createVersionedValueMap({ 1: holder })}
-      children={children}
-    />
+  const versionedValue = useMemo(
+    () =>
+      createVersionedValueMap({
+        1: parentHolder ? new ApiAggregator(apis, parentHolder) : apis,
+      }),
+    [parentHolder, apis],
   );
+
+  return <ApiContext.Provider value={versionedValue} children={children} />;
 };
 
 ApiProvider.propTypes = {

packages/core-api/src/app/AppContext.tsx

@@ -19,6 +19,7 @@ import React, {
   PropsWithChildren,
   useContext,
   Context,
+  useMemo,
 } from 'react';
 import {
   VersionedValue,
@@ -43,7 +44,10 @@ export const AppContextProvider = ({
   appContext,
   children,
 }: PropsWithChildren<Props>) => {
-  const versionedValue = createVersionedValueMap({ 1: appContext });
+  const versionedValue = useMemo(
+    () => createVersionedValueMap({ 1: appContext }),
+    [appContext],
+  );
 
   return <AppContext.Provider value={versionedValue} children={children} />;
 };