Pick edition logo at build time instead of runtime config (#66815) (#68092)

This commit is contained in:
Michael
2026-06-30 21:30:49 +00:00
committed by GitHub
parent 15cd616bc8
commit 989c8adc6a
4 changed files with 29 additions and 30 deletions
+5
View File
@@ -1,5 +1,10 @@
# this file gets generated by make
gitref.go
# logo SVGs are staged from web/packages/design/src/assets/images by the
# Makefile based on the build's edition.
/web/packages/teleport/public/app/logo-light.svg
/web/packages/teleport/public/app/logo-dark.svg
.data
debug
!/lib/srv/debug
+12
View File
@@ -1850,6 +1850,18 @@ test-compat:
.PHONY: ensure-webassets
ensure-webassets:
# Stage the logo SVGs the Vite build will compress and embed. Runs before the
# sha check so a change in GITHUB_REPOSITORY_OWNER produces a different web/
# sha and forces a rebuild.
ifeq ("$(GITHUB_REPOSITORY_OWNER)","gravitational")
@echo "copying teleport logo assets (community)";
@cp web/packages/design/src/assets/images/community-light.svg web/packages/teleport/public/app/logo-light.svg
@cp web/packages/design/src/assets/images/community-dark.svg web/packages/teleport/public/app/logo-dark.svg
else
@echo "copying teleport logo assets (agpl)";
@cp web/packages/design/src/assets/images/agpl-light.svg web/packages/teleport/public/app/logo-light.svg
@cp web/packages/design/src/assets/images/agpl-dark.svg web/packages/teleport/public/app/logo-dark.svg
endif
@if [[ "${WEBASSETS_SKIP_BUILD}" -eq 1 ]]; then mkdir -p webassets/teleport && mkdir -p webassets/teleport/app && cp web/packages/teleport/index.html webassets/teleport/index.html; \
else MAKE="$(MAKE)" "$(MAKE_DIR)/build.assets/build-webassets-if-changed.sh" OSS webassets/oss-sha build-ui web; fi
+2 -2
View File
@@ -24,7 +24,7 @@ import styled, { useTheme } from 'styled-components';
import { breakpointsPx, Flex, Image, TopNav } from 'design';
import { HoverTooltip } from 'design/Tooltip';
import { logos } from 'teleport/components/LogoHero/LogoHero';
import { logoSrc } from 'teleport/components/LogoHero/LogoHero';
import { UserMenuNav } from 'teleport/components/UserMenuNav';
import cfg from 'teleport/config';
import { useFeatures } from 'teleport/FeaturesContext';
@@ -95,7 +95,7 @@ const TeleportLogo = ({
CustomLogo?: () => React.ReactElement;
}) => {
const theme = useTheme();
const src = logos[cfg.edition][theme.type];
const src = logoSrc(theme.type);
return (
<HoverTooltip placement="bottom" tipContent="Teleport Resources Home">
@@ -18,35 +18,17 @@
import { useTheme } from 'styled-components';
import AGPLLogoDark from 'design/assets/images/agpl-dark.svg';
import AGPLLogoLight from 'design/assets/images/agpl-light.svg';
import CommunityLogoDark from 'design/assets/images/community-dark.svg';
import CommunityLogoLight from 'design/assets/images/community-light.svg';
import EnterpriseLogoDark from 'design/assets/images/enterprise-dark.svg';
import EnterpriseLogoLight from 'design/assets/images/enterprise-light.svg';
import Image from 'design/Image';
import cfg, { TeleportEdition } from 'teleport/config';
type LogoMap = {
light: string;
dark: string;
};
export const logos: Record<TeleportEdition, LogoMap> = {
oss: {
light: AGPLLogoLight,
dark: AGPLLogoDark,
},
community: {
light: CommunityLogoLight,
dark: CommunityLogoDark,
},
ent: {
light: EnterpriseLogoLight,
dark: EnterpriseLogoDark,
},
};
// The logo SVG served at this path is selected at build time to match the
// edition of the binary. See the Makefile and the per-edition public/ dirs.
// TODO (avatus): replace the static `v=1` with the Teleport version so the
// URL changes when the binary is upgraded, or just update to v=2 if we ever
// update logos.
export function logoSrc(themeType: 'light' | 'dark'): string {
const base = import.meta.env.MODE === 'development' ? '/app/' : '/web/app/';
return `${base}logo-${themeType}.svg?v=1`;
}
export const LogoHero = ({
my = '48px',
@@ -56,7 +38,7 @@ export const LogoHero = ({
customSrc?: string;
}) => {
const theme = useTheme();
const src = customSrc || logos[cfg.edition][theme.type];
const src = customSrc || logoSrc(theme.type);
return (
<Image src={src} maxHeight="120px" maxWidth="200px" my={my} mx="auto" />
);