From 141a3f587def76654cf4b3ae3bd8578e37e491ed Mon Sep 17 00:00:00 2001 From: Richard Knoll Date: Mon, 22 Apr 2024 10:34:51 -0700 Subject: [PATCH] pr feedback --- pxtservices/loggingService.ts | 4 +-- .../components/profile/UserAvatarDropdown.tsx | 10 +++++-- tutorialtool/README.md | 14 +++++----- tutorialtool/package.json | 3 +- tutorialtool/public/index.html | 2 +- .../components/styling/HeaderBar.module.scss | 13 --------- tutorialtool/src/constants.ts | 28 ++----------------- tutorialtool/src/index.tsx | 1 - tutorialtool/src/services/authClient.ts | 1 - .../src/services/makecodeEditorService.ts | 2 -- 10 files changed, 21 insertions(+), 57 deletions(-) diff --git a/pxtservices/loggingService.ts b/pxtservices/loggingService.ts index 6d5795791070..0ff438ce4aeb 100644 --- a/pxtservices/loggingService.ts +++ b/pxtservices/loggingService.ts @@ -37,9 +37,9 @@ export const logInfo = (message: any) => { console.log(timestamp(), message); }; -export const logDebug = (message: any) => { +export const logDebug = (message: any, data?: any) => { if (pxt.BrowserUtils.isLocalHost() || pxt.options.debug) { - console.log(timestamp(), message); + console.log(timestamp(), message, data); } }; diff --git a/react-common/components/profile/UserAvatarDropdown.tsx b/react-common/components/profile/UserAvatarDropdown.tsx index 160252f13f5b..6cb3da7e30f1 100644 --- a/react-common/components/profile/UserAvatarDropdown.tsx +++ b/react-common/components/profile/UserAvatarDropdown.tsx @@ -14,7 +14,7 @@ interface IProps { export const UserAvatarDropdown: React.FC = (props) => { const { userProfile, title, items, onSignOutClick, className } = props; - const avatarUrl = userProfile?.idp?.pictureUrl ?? userProfile?.idp?.picture?.dataUrl; + const avatarUrl = userProfile?.idp?.pictureUrl ?? encodedAvatarPic(userProfile); const avatarElem = ; const initialsElem = ; @@ -50,4 +50,10 @@ const UserAvatar = (props: { avatarPicUrl: string }) => (
-); \ No newline at end of file +); + +function encodedAvatarPic(user: pxt.auth.UserProfile): string { + const type = user?.idp?.picture?.mimeType; + const encodedImg = user?.idp?.picture?.encoded; + return type && encodedImg ? `data:${type};base64,${encodedImg}` : ""; +} \ No newline at end of file diff --git a/tutorialtool/README.md b/tutorialtool/README.md index da4dc05c5107..2eae6595481a 100644 --- a/tutorialtool/README.md +++ b/tutorialtool/README.md @@ -1,29 +1,29 @@ -# Teacher Tool +# Tutorial tool ## Localhost testing -To test the Teacher Tool locally: +To test the Tutorial Tool locally: 1. Ensure your pxt repo is up to date and has been built recently. -2. In a command shell, in the `pxt` repo, cd into the `tutorialtool` folder and start the Teacher Tool dev server: `npm run start`. This will *not* open a browser window. +2. In a command shell, in the `pxt` repo, cd into the `tutorialtool` folder and start the Tutorial Tool dev server: `npm run start`. This will *not* open a browser window. 3. In another command shell, in the target repo (e.g. `pxt-arcade` or `pxt-microbit`), start the pxt dev server: `pxt serve --rebundle --noauth`. This will open the editor webapp in a browser. 1. **Note the `--noauth` parameter.** It is important to include this option when running on localhost in order to download certain required startup files from the localhost pxt server. -Requests to the `/eval` endpoint will be routed to the Teacher Tool dev server. +Requests to the `/tt` endpoint will be routed to the Tutorial Tool dev server. -Debug and step through Teacher Tool code using the browser dev tools (F12 to open). +Debug and step through Tutorial Tool code using the browser dev tools (F12 to open). ## Test in staging environment -1. In the pxt repo, run `gulp` to ensure production teacher tool is built. +1. In the pxt repo, run `gulp` to ensure production Tutorial tool is built. 2. In a browser, go to `https://staging.pxt.io/oauth/gettoken`. This should return a url with an auth token embedded. Copy the entire url value to your clipboard. - It should look something like `https://staging.pxt.io/?access_token=X.XXXXXXXX` - If you get access denied, contact your manager to help you. 3. In a command shell, set environment variable `PXT_ACCESS_TOKEN` with the copied value. 4. In the same shell, in the pxt-arcade repo, run `pxt uploadtrg --rebundle`. This should return a url to your private build. - It should look something like `https://arcade.staging.pxt.io/app/XXXXXX-XXXXX` - - Paste in a browser and append "/tutorialtool". This should take you to your teacher tool build in staging. + - Paste in a browser and append "--tutorialtool". This should take you to your Tutorial tool build in staging. ## Test in production environment diff --git a/tutorialtool/package.json b/tutorialtool/package.json index 983310c1c4f1..be6f22f6c153 100644 --- a/tutorialtool/package.json +++ b/tutorialtool/package.json @@ -1,5 +1,5 @@ { - "name": "makecode-arcade-tutorialtool", + "name": "makecode-tutorialtool", "version": "0.1.0", "private": true, "dependencies": { @@ -13,7 +13,6 @@ "react-scripts": "5.0.1", "react-to-print": "^2.15.1", "sass": "^1.70.0", - "swiper": "^8.4.4", "tslib": "^2.6.2", "typescript": "^4.6.4" }, diff --git a/tutorialtool/public/index.html b/tutorialtool/public/index.html index b5a34cec2b9a..df9b9ea85350 100644 --- a/tutorialtool/public/index.html +++ b/tutorialtool/public/index.html @@ -7,7 +7,7 @@ + content="MakeCode Tutorial Tool. Build markdown tutorials for MakeCode editors" /> diff --git a/tutorialtool/src/components/styling/HeaderBar.module.scss b/tutorialtool/src/components/styling/HeaderBar.module.scss index 94a31aa2739f..dad4820419d5 100644 --- a/tutorialtool/src/components/styling/HeaderBar.module.scss +++ b/tutorialtool/src/components/styling/HeaderBar.module.scss @@ -41,17 +41,4 @@ margin: 0 1rem; } } - - .rubric-name { - display: flex; - align-items: center; - &:before { - height: 1.5rem; - border-left: 2px solid var(--pxt-headerbar-foreground); - content: " "; - } - span { - margin: 0 1rem; - } - } } diff --git a/tutorialtool/src/constants.ts b/tutorialtool/src/constants.ts index 086ef62ed5bb..3856e73aba73 100644 --- a/tutorialtool/src/constants.ts +++ b/tutorialtool/src/constants.ts @@ -1,27 +1,3 @@ -export namespace Strings { - export const ErrorLoadingRubricMsg = lf("That wasn't a valid rubric."); - export const ConfirmReplaceRubricMsg = lf("This will replace your current rubric. Continue?"); - export const UntitledProject = lf("Untitled Project"); - export const UntitledRubric = lf("Untitled Rubric"); - export const NewRubric = lf("New Rubric"); - export const ImportRubric = lf("Import Rubric"); - export const ExportRubric = lf("Export Rubric"); - export const Remove = lf("Remove"); - export const Criteria = lf("Criteria"); - export const Name = lf("Name"); - export const RubricName = lf("Rubric Name"); - export const AddCriteria = lf("Add Criteria"); - export const Actions = lf("Actions"); - export const AutoRun = lf("auto-run"); - export const AutoRunDescription = lf("Automatically re-evaluate when the rubric or project changes"); - export const AddNotes = lf("Add Notes"); - export const DragAndDrop = lf("Drag & Drop"); - export const ReleaseToUpload = lf("Release to Upload"); - export const Browse = lf("Browse"); - export const SelectRubricFile = lf("Select Rubric File"); - export const InvalidRubricFile = lf("Invalid Rubric File"); -} - export namespace Ticks { export const Loaded = "tutorialtool.loaded"; export const HomeLink = "tutorialtool.homelink"; @@ -31,7 +7,7 @@ export namespace Ticks { } namespace Misc { - export const LearnMoreLink = "https://makecode.com/teachertool"; // TODO: Replace with golink or aka.ms link + export const LearnMoreLink = "https://makecode.com/tutorialtool"; // TODO: Replace with golink or aka.ms link } -export const Constants = Object.assign(Misc, { Strings, Ticks }); +export const Constants = Object.assign(Misc, { Ticks }); diff --git a/tutorialtool/src/index.tsx b/tutorialtool/src/index.tsx index c0aea5eacefd..53bffdb9fc87 100644 --- a/tutorialtool/src/index.tsx +++ b/tutorialtool/src/index.tsx @@ -2,7 +2,6 @@ // we should get rid of this somehow. /// /// -/// import React from "react"; import ReactDOM from "react-dom"; diff --git a/tutorialtool/src/services/authClient.ts b/tutorialtool/src/services/authClient.ts index 910ca4e2d00d..6861ca122a7e 100644 --- a/tutorialtool/src/services/authClient.ts +++ b/tutorialtool/src/services/authClient.ts @@ -2,7 +2,6 @@ import { setUserProfileAsync } from "../transforms/setUserProfileAsync"; class AuthClient extends pxt.auth.AuthClient { protected async onSignedIn(): Promise { - // await userSignedInAsync((await this.firstNameAsync())!); } protected async onSignedOut(): Promise { await setUserProfileAsync(undefined); diff --git a/tutorialtool/src/services/makecodeEditorService.ts b/tutorialtool/src/services/makecodeEditorService.ts index 7d1c14644d3c..c3da91ff0014 100644 --- a/tutorialtool/src/services/makecodeEditorService.ts +++ b/tutorialtool/src/services/makecodeEditorService.ts @@ -1,5 +1,3 @@ -/// - import { logDebug } from "pxtservices/loggingService"; import { EditorDriver } from "pxtservices/editorDriver";