From d8425ad2ef933a75d9fe7ce1162e5d973d21dfc3 Mon Sep 17 00:00:00 2001
From: Thomas Sparks <69657545+thsparks@users.noreply.github.com>
Date: Thu, 6 Mar 2025 10:11:26 -0800
Subject: [PATCH] Load Default Target Theme in Teacher Tool (#10407)
Not adding support for changing themes yet, but we can at least load the default one.
---
teachertool/public/index.html | 3 ++-
teachertool/src/App.tsx | 14 ++++++++++++++
2 files changed, 16 insertions(+), 1 deletion(-)
diff --git a/teachertool/public/index.html b/teachertool/public/index.html
index aa76c6a21c28..c34534ba4fbd 100644
--- a/teachertool/public/index.html
+++ b/teachertool/public/index.html
@@ -22,7 +22,7 @@
var pxtConfig = null;
-
+
@@ -32,6 +32,7 @@
+
diff --git a/teachertool/src/App.tsx b/teachertool/src/App.tsx
index 2c1f35491e3c..dc289b7412cc 100644
--- a/teachertool/src/App.tsx
+++ b/teachertool/src/App.tsx
@@ -21,6 +21,7 @@ import { ErrorCode } from "./types/errorCode";
import { loadProjectMetadataAsync } from "./transforms/loadProjectMetadataAsync";
import { Constants, Ticks } from "./constants";
import { UnsupportedExperienceModal } from "react-common/components/experiences/UnsupportedExperienceModal";
+import { ThemeManager } from "react-common/components/theming/themeManager";
export const App = () => {
const { state, dispatch } = useContext(AppStateContext);
@@ -36,6 +37,7 @@ export const App = () => {
const cfg = await downloadTargetConfigAsync();
dispatch(Actions.setTargetConfig(cfg || {}));
pxt.BrowserUtils.initTheme();
+ await initColorThemeAsync();
// Load catalog and validator plans into state.
await loadCatalogAsync();
@@ -80,6 +82,18 @@ export const App = () => {
setIsSupported(pxt.U.isExperienceSupported(Constants.ExperienceId));
}, []);
+ async function initColorThemeAsync() {
+ // We don't currently support switching themes in code eval, so just load the default.
+ const themeId = pxt.appTarget?.appTheme?.defaultColorTheme;
+
+ if (themeId) {
+ const themeManager = ThemeManager.getInstance(document);
+ if (themeId !== themeManager.getCurrentColorTheme()?.id) {
+ themeManager.switchColorTheme(themeId);
+ }
+ }
+ }
+
return !inited || !authCheckComplete ? (