diff --git a/src/categories.ts b/src/categories.ts new file mode 100644 index 00000000000000..ab2f5964c6446b --- /dev/null +++ b/src/categories.ts @@ -0,0 +1,22 @@ +import {PlatformCategory} from './types'; + +/** + * Category predicates shared across components. + * + * A platform or guide can carry several categories at once. Meta-frameworks + * (e.g. Next.js, Remix) run in both the browser and on a server, so they carry + * both `browser` and `server`. The `browser-only` / `server-only` categories + * mark platforms that run *exclusively* on one side (something the `browser` / + * `server` tags alone cannot express) and are primarily consumed from MDX via + * ``. + */ + +/** Whether the categories include a server-side runtime (`server` or `serverless`). */ +export function hasServerCategory(categories?: PlatformCategory[] | null): boolean { + return !!categories?.some(c => c === 'server' || c === 'serverless'); +} + +/** Whether the categories include the browser runtime. */ +export function hasBrowserCategory(categories?: PlatformCategory[] | null): boolean { + return !!categories?.includes('browser'); +} diff --git a/src/components/platformLink.tsx b/src/components/platformLink.tsx index 29aa5c4846ccaa..cb22a82147ce88 100644 --- a/src/components/platformLink.tsx +++ b/src/components/platformLink.tsx @@ -1,3 +1,4 @@ +import {hasServerCategory} from 'sentry-docs/categories'; import {getCurrentPlatformOrGuide, getPlatform, nodeForPath} from 'sentry-docs/docTree'; import {serverContext} from 'sentry-docs/serverContext'; import {Platform, PlatformGuide} from 'sentry-docs/types'; @@ -30,8 +31,7 @@ function getPlatformsWithFallback( else if ( 'platform' in curPlatformOrGuide && curPlatformOrGuide.platform === 'javascript' && - (curPlatformOrGuide.categories?.includes('server') || - curPlatformOrGuide.categories?.includes('serverless')) + hasServerCategory(curPlatformOrGuide.categories) ) { // Include node platform for server-side JavaScript guides result.push('node'); diff --git a/src/components/sdkOption.tsx b/src/components/sdkOption.tsx index c877764af3b769..1b8a405b10dec0 100644 --- a/src/components/sdkOption.tsx +++ b/src/components/sdkOption.tsx @@ -1,3 +1,4 @@ +import {hasBrowserCategory, hasServerCategory} from 'sentry-docs/categories'; import {getCurrentPlatformOrGuide} from 'sentry-docs/docTree'; import {serverContext} from 'sentry-docs/serverContext'; import {PlatformCategory} from 'sentry-docs/types'; @@ -31,9 +32,7 @@ export function SdkOption({ const shouldShowEnvVar = () => { if (!currentPlatformOrGuide) return false; - const isServerPlatform = - currentPlatformOrGuide.categories?.includes('server') || - currentPlatformOrGuide.categories?.includes('serverless'); + const isServerPlatform = hasServerCategory(currentPlatformOrGuide.categories); const isExcludedPlatform = currentPlatformOrGuide.key === 'javascript.nextjs' || @@ -91,25 +90,18 @@ export function getPlatformHints(categorySupported: PlatformCategory[]) { const currentPlatformOrGuide = getCurrentPlatformOrGuide(rootNode, path); const currentCategories = currentPlatformOrGuide?.categories || []; - // We only handle browser, server & serverless here for now - const currentIsBrowser = currentCategories.includes('browser'); - const currentIsServer = currentCategories.includes('server'); - const currentIsServerless = currentCategories.includes('serverless'); - const currentIsServerLike = currentIsServer || currentIsServerless; - const hasCategorySupported = categorySupported.length > 0; const supportedBrowserOnly = - categorySupported.includes('browser') && - !categorySupported.includes('server') && - !categorySupported.includes('serverless'); + hasBrowserCategory(categorySupported) && !hasServerCategory(categorySupported); const supportedServerLikeOnly = - !categorySupported.includes('browser') && - (categorySupported.includes('server') || categorySupported.includes('serverless')); + !hasBrowserCategory(categorySupported) && hasServerCategory(categorySupported); const showBrowserOnly = - hasCategorySupported && supportedBrowserOnly && currentIsServerLike; + hasCategorySupported && supportedBrowserOnly && hasServerCategory(currentCategories); const showServerLikeOnly = - hasCategorySupported && supportedServerLikeOnly && currentIsBrowser; + hasCategorySupported && + supportedServerLikeOnly && + hasBrowserCategory(currentCategories); return {showBrowserOnly, showServerLikeOnly}; }