diff --git a/packages/ui/package.json b/packages/ui/package.json index 00b51295fd..2ec523e984 100644 --- a/packages/ui/package.json +++ b/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", diff --git a/packages/ui/src/hooks/useSurface.tsx b/packages/ui/src/hooks/useSurface.tsx index c5c5e4d862..e16633220d 100644 --- a/packages/ui/src/hooks/useSurface.tsx +++ b/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; } -const SurfaceContext = createContext({ - 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 ( - + {children} ); @@ -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) diff --git a/yarn.lock b/yarn.lock index 393cd37bd7..26f89fc381 100644 --- a/yarn.lock +++ b/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: