Move to version bridge

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>

packages/ui/package.json

@@ -40,6 +40,7 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
+    "@backstage/version-bridge": "^1.0.10",
     "@remixicon/react": "^4.6.0",
     "@tanstack/react-table": "^8.21.3",
     "clsx": "^2.1.1",

packages/ui/src/hooks/useSurface.tsx

@@ -14,7 +14,11 @@
  * limitations under the License.
  */
 
-import { createContext, useContext, ReactNode } from 'react';
+import { useContext, ReactNode } from 'react';
+import {
+  createVersionedContext,
+  createVersionedValueMap,
+} from '@backstage/version-bridge';
 import { Surface, Responsive } from '../types';
 
 /** @public */
@@ -46,9 +50,9 @@ export interface UseSurfaceOptions {
   onSurface?: Responsive<Surface>;
 }
 
-const SurfaceContext = createContext<SurfaceContextValue>({
-  surface: undefined,
-});
+const SurfaceContext = createVersionedContext<{
+  1: SurfaceContextValue;
+}>('surface-context');
 
 /**
  * Increments a surface level by one, capping at '3'.
@@ -159,7 +163,9 @@ export const SurfaceProvider = ({
   children,
 }: SurfaceProviderProps) => {
   return (
-    <SurfaceContext.Provider value={{ surface }}>
+    <SurfaceContext.Provider
+      value={createVersionedValueMap({ 1: { surface } })}
+    >
       {children}
     </SurfaceContext.Provider>
   );
@@ -179,7 +185,8 @@ export const SurfaceProvider = ({
 export const useSurface = (
   options?: UseSurfaceOptions,
 ): SurfaceContextValue => {
-  const context = useContext(SurfaceContext);
+  const value = useContext(SurfaceContext)?.atVersion(1);
+  const context = value ?? { surface: undefined };
 
   // Infer behavior from which parameter is provided
   // 'surface' = provider behavior (increment)

yarn.lock

@@ -7937,6 +7937,7 @@ __metadata:
   resolution: "@backstage/ui@workspace:packages/ui"
   dependencies:
     "@backstage/cli": "workspace:^"
+    "@backstage/version-bridge": "npm:^1.0.10"
     "@remixicon/react": "npm:^4.6.0"
     "@tanstack/react-table": "npm:^8.21.3"
     "@types/react": "npm:^18.0.0"
@@ -7964,7 +7965,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@backstage/version-bridge@workspace:^, @backstage/version-bridge@workspace:packages/version-bridge":
+"@backstage/version-bridge@npm:^1.0.10, @backstage/version-bridge@workspace:^, @backstage/version-bridge@workspace:packages/version-bridge":
   version: 0.0.0-use.local
   resolution: "@backstage/version-bridge@workspace:packages/version-bridge"
   dependencies: