pr feedback

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);
     }
 };
 

react-common/components/profile/UserAvatarDropdown.tsx

@@ -14,7 +14,7 @@ interface IProps {
 export const UserAvatarDropdown: React.FC<IProps> = (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 = <UserAvatar avatarPicUrl={avatarUrl} />;
     const initialsElem = <UserInitials userProfile={userProfile} />;
@@ -50,4 +50,10 @@ const UserAvatar = (props: { avatarPicUrl: string }) => (
     <div className="user-avatar-image">
         <img src={props.avatarPicUrl} alt={lf("Profile Image")} referrerPolicy="no-referrer" aria-hidden="true" />
     </div>
-);
+);
+
+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}` : "";
+}

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
 

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"
   },

tutorialtool/public/index.html

@@ -7,7 +7,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="theme-color" content="#000000" />
   <meta name="description"
-    content="MakeCode Project Insights. Designed to help teachers evaluate student projects using a rubric." />
+    content="MakeCode Tutorial Tool. Build markdown tutorials for MakeCode editors" />
   <link rel="stylesheet" data-rtl="/blb/rtlsemantic.css" href="/blb/semantic.css" type="text/css">
   <link rel="stylesheet" href="/blb/icons.css" type="text/css">
   <!-- <link rel="apple-touch-icon" href="/tutorialtool-data/logo192.png" /> -->

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;
-        }
-    }
 }

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 });

tutorialtool/src/index.tsx

@@ -2,7 +2,6 @@
 // we should get rid of this somehow.
 /// <reference path="../../built/pxtsim.d.ts" />
 /// <reference path="../../built/pxtlib.d.ts" />
-/// <reference path="../../localtypings/evaluation.d.ts" />
 
 import React from "react";
 import ReactDOM from "react-dom";

tutorialtool/src/services/authClient.ts

@@ -2,7 +2,6 @@ import { setUserProfileAsync } from "../transforms/setUserProfileAsync";
 
 class AuthClient extends pxt.auth.AuthClient {
     protected async onSignedIn(): Promise<void> {
-        // await userSignedInAsync((await this.firstNameAsync())!);
     }
     protected async onSignedOut(): Promise<void> {
         await setUserProfileAsync(undefined);

tutorialtool/src/services/makecodeEditorService.ts

@@ -1,5 +1,3 @@
-/// <reference path="../../../localtypings/validatorPlan.d.ts" />
-
 import { logDebug } from "pxtservices/loggingService";
 import { EditorDriver } from "pxtservices/editorDriver";