teacher tool - run prettier (#9831)

* prettier * max line length 200 * max-line-length: 120
microsoft · Jan 25, 2024 · 12fffd4 · 12fffd4
1 parent cd7ed80
commit 12fffd4
Show file tree

Hide file tree

Showing 30 changed files with 116 additions and 142 deletions.
diff --git a/teachertool/.prettierrc b/teachertool/.prettierrc
@@ -1,5 +1,6 @@
 {
     "arrowParens": "avoid",
     "semi": true,
-    "tabWidth": 4
-}
+    "tabWidth": 4,
+    "printWidth":120
+}
diff --git a/teachertool/src/App.tsx b/teachertool/src/App.tsx
@@ -6,7 +6,7 @@ import { usePromise } from "./hooks";
 import { makeNotification } from "./utils";
 import * as Actions from "./state/actions";
 import * as NotificationService from "./services/notificationService";
-import { downloadTargetConfigAsync } from "./services/ackendRequests";
+import { downloadTargetConfigAsync } from "./services/backendRequests";
 import { logDebug } from "./services/loggingService";
 
 import HeaderBar from "./components/HeaderBar";
@@ -20,7 +20,6 @@ import CatalogModal from "./components/CatalogModal";
 import { postNotification } from "./transforms/postNotification";
 import { loadCatalogAsync } from "./transforms/loadCatalogAsync";
 
-
 function App() {
     const { state, dispatch } = useContext(AppStateContext);
     const [inited, setInited] = useState(false);

diff --git a/teachertool/src/components/ActiveRubricDisplay.tsx b/teachertool/src/components/ActiveRubricDisplay.tsx
@@ -7,7 +7,6 @@ import { Button } from "react-common/components/controls/Button";
 import { removeCriteriaFromRubric } from "../transforms/removeCriteriaFromRubric";
 import { showCatalogModal } from "../transforms/showCatalogModal";
 
-
 interface IProps {}
 
 const ActiveRubricDisplay: React.FC<IProps> = ({}) => {
@@ -20,18 +19,26 @@ const ActiveRubricDisplay: React.FC<IProps> = ({}) => {
                 if (!criteriaInstance) return null;
 
                 const catalogCriteria = getCatalogCriteriaWithId(criteriaInstance.catalogCriteriaId);
-                return criteriaInstance.catalogCriteriaId && (
+                return (
+                    criteriaInstance.catalogCriteriaId && (
                         <div className="criteria-instance-display" key={criteriaInstance.instanceId}>
                             {catalogCriteria?.template}
                             <Button
                                 className="criteria-btn-remove"
                                 label={lf("X")}
                                 onClick={() => removeCriteriaFromRubric(criteriaInstance)}
-                                title={lf("Remove")} />
+                                title={lf("Remove")}
+                            />
                         </div>
+                    )
                 );
             })}
-            <Button className="add-criteria secondary" label={lf("+ Add Criteria")} onClick={showCatalogModal} title={lf("Add Criteria")} />
+            <Button
+                className="add-criteria secondary"
+                label={lf("+ Add Criteria")}
+                onClick={showCatalogModal}
+                title={lf("Add Criteria")}
+            />
         </div>
     );
 };

diff --git a/teachertool/src/components/CatalogModal.tsx b/teachertool/src/components/CatalogModal.tsx
@@ -12,7 +12,7 @@ interface IProps {}
 
 const CatalogModal: React.FC<IProps> = ({}) => {
     const { state: teacherTool } = useContext(AppStateContext);
-    const [ checkedCriteriaIds, setCheckedCriteria ] = useState<Set<string>>(new Set<string>());
+    const [checkedCriteriaIds, setCheckedCriteria] = useState<Set<string>>(new Set<string>());
 
     function handleCriteriaSelectedChange(criteria: CatalogCriteria, newValue: boolean) {
         const newSet = new Set(checkedCriteriaIds);
@@ -51,19 +51,27 @@ const CatalogModal: React.FC<IProps> = ({}) => {
             className: "primary",
             onClick: handleAddSelectedClicked,
         },
-    ]
+    ];
 
     return teacherTool.modal === "catalog-display" ? (
-        <Modal className="catalog-modal" title={lf("Select the criteria you'd like to include")} onClose={closeModal} actions={modalActions}>
+        <Modal
+            className="catalog-modal"
+            title={lf("Select the criteria you'd like to include")}
+            onClose={closeModal}
+            actions={modalActions}
+        >
             {teacherTool.catalog?.map(criteria => {
-                return criteria?.template && (
+                return (
+                    criteria?.template && (
                         <Checkbox
                             id={`checkbox_${criteria.id}`}
                             key={criteria.id}
                             className="catalog-item"
                             label={criteria.template}
-                            onChange={(newValue) => handleCriteriaSelectedChange(criteria, newValue)}
-                            isChecked={isCriteriaSelected(criteria.id)} />
+                            onChange={newValue => handleCriteriaSelectedChange(criteria, newValue)}
+                            isChecked={isCriteriaSelected(criteria.id)}
+                        />
+                    )
                 );
             })}
         </Modal>

diff --git a/teachertool/src/components/DebugInput.tsx b/teachertool/src/components/DebugInput.tsx
@@ -16,7 +16,7 @@ const DebugInput: React.FC<IProps> = ({}) => {
     const evaluate = async () => {
         await loadProjectMetadataAsync(shareLink);
         await runEvaluateAsync(rubric);
-    }
+    };
 
     return (
         <div className="debug-container">
@@ -27,20 +27,22 @@ const DebugInput: React.FC<IProps> = ({}) => {
                     className="link-input"
                     placeholder={lf("Share link to validate")}
                     initialValue={shareLink}
-                    onChange={setShareLink} />
+                    onChange={setShareLink}
+                />
             </div>
             <div className="rubric-json-input-container">
                 {lf("Rubric:")}
-                <Textarea
-                    id="rubricJsonInput"
-                    className="json-input"
-                    rows={20}
-                    onChange={setRubric} />
+                <Textarea id="rubricJsonInput" className="json-input" rows={20} onChange={setRubric} />
             </div>
-            <Button id="evaluateSingleProjectButton" className="ui button primary" onClick={evaluate} title={"Evaluate"} label={lf("Evaluate")} />
+            <Button
+                id="evaluateSingleProjectButton"
+                className="ui button primary"
+                onClick={evaluate}
+                title={"Evaluate"}
+                label={lf("Evaluate")}
+            />
         </div>
-    )
-
+    );
 };
 
 export default DebugInput;
diff --git a/teachertool/src/components/EvalResultDisplay.tsx b/teachertool/src/components/EvalResultDisplay.tsx
@@ -14,20 +14,21 @@ const EvalResultDisplay: React.FC<IProps> = ({}) => {
                 <div className="eval-results-container">
                     <h3>{lf("Project: {0}", teacherTool.projectMetadata.name)}</h3>
                     {teacherTool.currentEvalResult === undefined && <div className="common-spinner" />}
-                    {Object.keys(teacherTool.currentEvalResult?.blockIdResults ?? {}).map((id) => {
+                    {Object.keys(teacherTool.currentEvalResult?.blockIdResults ?? {}).map(id => {
                         const result = teacherTool.currentEvalResult?.blockIdResults[id];
                         return (
                             <div className="result-block-id" key={id}>
                                 <p className="block-id-label">{id}:</p>
-                                <p className={result ? "positive-text" : "negative-text"}>{result ? "passed" : "failed"}</p>
+                                <p className={result ? "positive-text" : "negative-text"}>
+                                    {result ? "passed" : "failed"}
+                                </p>
                             </div>
                         );
                     })}
                 </div>
             )}
         </>
     );
-
 };
 
 export default EvalResultDisplay;
diff --git a/teachertool/src/components/HeaderBar.tsx b/teachertool/src/components/HeaderBar.tsx
@@ -16,10 +16,7 @@ export const HeaderBar: React.FC<HeaderBarProps> = () => {
                 {appTheme.organizationWideLogo || appTheme.organizationLogo ? (
                     <img
                         className={`ui logo`}
-                        src={
-                            appTheme.organizationWideLogo ||
-                            appTheme.organizationLogo
-                        }
+                        src={appTheme.organizationWideLogo || appTheme.organizationLogo}
                         alt={lf("{0} Logo", appTheme.organization)}
                     />
                 ) : (
@@ -43,15 +40,12 @@ export const HeaderBar: React.FC<HeaderBarProps> = () => {
                             {appTheme.organizationText}
                         </span>,
                         <span className="name-short" key="org-name-short">
-                            {appTheme.organizationShortText ||
-                                appTheme.organizationText}
+                            {appTheme.organizationShortText || appTheme.organizationText}
                         </span>,
                     ]
                 ) : appTheme.logo || appTheme.portraitLogo ? (
                     <img
-                        className={`ui ${
-                            appTheme.logoWide ? "small" : ""
-                        } logo`}
+                        className={`ui ${appTheme.logoWide ? "small" : ""} logo`}
                         src={appTheme.logo || appTheme.portraitLogo}
                         alt={lf("{0} Logo", appTheme.boardName)}
                     />
@@ -66,15 +60,9 @@ export const HeaderBar: React.FC<HeaderBarProps> = () => {
         pxt.tickEvent("teacherTool.home");
 
         // relprefix looks like "/beta---", need to chop off the hyphens and slash
-        let rel = pxt.webConfig?.relprefix.substr(
-            0,
-            pxt.webConfig.relprefix.length - 3
-        );
+        let rel = pxt.webConfig?.relprefix.substr(0, pxt.webConfig.relprefix.length - 3);
         if (pxt.appTarget.appTheme.homeUrl && rel) {
-            if (
-                pxt.appTarget.appTheme.homeUrl?.lastIndexOf("/") ===
-                pxt.appTarget.appTheme.homeUrl?.length - 1
-            ) {
+            if (pxt.appTarget.appTheme.homeUrl?.lastIndexOf("/") === pxt.appTarget.appTheme.homeUrl?.length - 1) {
                 rel = rel.substr(1);
             }
             window.open(pxt.appTarget.appTheme.homeUrl + rel);
@@ -85,12 +73,7 @@ export const HeaderBar: React.FC<HeaderBarProps> = () => {
 
     return (
         <header className="menubar" role="banner">
-            <MenuBar
-                className={`ui menu ${
-                    appTheme?.invertedMenu ? `inverted` : ""
-                } header`}
-                ariaLabel={lf("Header")}
-            >
+            <MenuBar className={`ui menu ${appTheme?.invertedMenu ? `inverted` : ""} header`} ariaLabel={lf("Header")}>
                 <div className="left menu">
                     {getOrganizationLogo()}
                     {getTargetLogo()}

diff --git a/teachertool/src/components/MakecodeFrame.tsx b/teachertool/src/components/MakecodeFrame.tsx
@@ -6,10 +6,12 @@ import { getEditorUrl } from "../utils";
 
 interface MakeCodeFrameProps {}
 export const MakeCodeFrame: React.FC<MakeCodeFrameProps> = () => {
-    const { state: teacherTool } = useContext(AppStateContext)
+    const { state: teacherTool } = useContext(AppStateContext);
 
     function createIFrameUrl(shareId: string): string {
-        const editorUrl: string = pxt.BrowserUtils.isLocalHost() ? "http://localhost:3232/index.html" : getEditorUrl((window as any).pxtTargetBundle.appTheme.embedUrl);
+        const editorUrl: string = pxt.BrowserUtils.isLocalHost()
+            ? "http://localhost:3232/index.html"
+            : getEditorUrl((window as any).pxtTargetBundle.appTheme.embedUrl);
 
         let url = editorUrl;
         if (editorUrl.charAt(editorUrl.length - 1) === "/" && !pxt.BrowserUtils.isLocalHost()) {
@@ -21,7 +23,7 @@ export const MakeCodeFrame: React.FC<MakeCodeFrameProps> = () => {
 
     const handleIFrameRef = (el: HTMLIFrameElement | null) => {
         setEditorRef(el ?? undefined);
-    }
+    };
 
     /* eslint-disable @microsoft/sdl/react-iframe-missing-sandbox */
     return (
@@ -31,9 +33,10 @@ export const MakeCodeFrame: React.FC<MakeCodeFrameProps> = () => {
                     className="makecode-frame"
                     src={createIFrameUrl(teacherTool.projectMetadata.id)}
                     title={"title"}
-                    ref={handleIFrameRef} />
+                    ref={handleIFrameRef}
+                />
             )}
         </div>
     );
     /* eslint-enable @microsoft/sdl/react-iframe-missing-sandbox */
-}
+};
diff --git a/teachertool/src/hooks/index.ts b/teachertool/src/hooks/index.ts
@@ -1 +1 @@
-export { usePromise } from "./usePromise";
+export { usePromise } from "./usePromise";
diff --git a/teachertool/src/services/ackendRequests.ts → teachertool/src/services/backendRequests.ts b/teachertool/src/services/ackendRequests.ts → teachertool/src/services/backendRequests.ts
@@ -1,9 +1,7 @@
 import { ErrorCode } from "../types/errorCode";
 import { logError } from "./loggingService";
 
-export async function getProjectTextAsync(
-    projectId: string
-): Promise<pxt.Cloud.JsonText | undefined> {
+export async function getProjectTextAsync(projectId: string): Promise<pxt.Cloud.JsonText | undefined> {
     try {
         const projectTextUrl = `${pxt.Cloud.apiRoot}/${projectId}/text`;
         const response = await fetch(projectTextUrl);
@@ -18,9 +16,7 @@ export async function getProjectTextAsync(
     }
 }
 
-export async function getProjectMetaAsync(
-    projectId: string
-): Promise<pxt.Cloud.JsonScript | undefined> {
+export async function getProjectMetaAsync(projectId: string): Promise<pxt.Cloud.JsonScript | undefined> {
     try {
         const projectMetaUrl = `${pxt.Cloud.apiRoot}/${projectId}`;
         const response = await fetch(projectMetaUrl);
@@ -35,9 +31,7 @@ export async function getProjectMetaAsync(
     }
 }
 
-export async function downloadTargetConfigAsync(): Promise<
-    pxt.TargetConfig | undefined
-> {
+export async function downloadTargetConfigAsync(): Promise<pxt.TargetConfig | undefined> {
     try {
         return await pxt.targetConfigAsync();
     } catch (e) {

diff --git a/teachertool/src/services/loggingService.ts b/teachertool/src/services/loggingService.ts
@@ -5,11 +5,7 @@ const timestamp = () => {
     return `[${time.getHours()}:${time.getMinutes()}:${time.getSeconds()}]`;
 };
 
-export const logError = (
-    errorCode: ErrorCode,
-    message?: any,
-    data: pxt.Map<string | number> = {}
-) => {
+export const logError = (errorCode: ErrorCode, message?: any, data: pxt.Map<string | number> = {}) => {
     let dataObj = { ...data };
     if (message) {
         if (typeof message === "object") {

diff --git a/teachertool/src/services/makecodeEditorService.ts b/teachertool/src/services/makecodeEditorService.ts
@@ -10,7 +10,7 @@ let makecodeEditorRef: HTMLIFrameElement | undefined;
 let readyForMessages: boolean;
 const messageQueue: pxt.editor.EditorMessageRequest[] = [];
 let nextId: number = 0;
-let pendingMessages: {[index: string]: PendingMessage} = {};
+let pendingMessages: { [index: string]: PendingMessage } = {};
 
 function onMessageReceived(event: MessageEvent) {
     logDebug(`Message received from iframe: ${JSON.stringify(event.data)}`);
@@ -35,14 +35,14 @@ function sendMessageAsync(message?: any) {
         const sendMessageCore = (message: any) => {
             logDebug(`Sending message to iframe: ${JSON.stringify(message)}`);
             makecodeEditorRef!.contentWindow!.postMessage(message, "*");
-        }
+        };
 
         if (message) {
             message.response = true;
             message.id = nextId++ + "";
             pendingMessages[message.id] = {
                 original: message,
-                handler: resolve
+                handler: resolve,
             };
             messageQueue.push(message);
         }
@@ -79,7 +79,7 @@ export async function setHighContrastAsync(on: boolean) {
     const result = await sendMessageAsync({
         type: "pxteditor",
         action: "sethighcontrast",
-        on: on
+        on: on,
     });
     console.log(result);
 }
@@ -91,8 +91,8 @@ export async function runEvalInEditorAsync(serializedRubric: string): Promise<px
         const response = await sendMessageAsync({
             type: "pxteditor",
             action: "runeval",
-            rubric: serializedRubric } as pxt.editor.EditorMessageRunEvalRequest
-        );
+            rubric: serializedRubric,
+        } as pxt.editor.EditorMessageRunEvalRequest);
         const result = response as pxt.editor.EditorMessageResponse;
         validateResponse(result, true); // Throws on failure
         evalResults = result.resp as pxt.blocks.EvaluationResult;
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		export { usePromise } from "./usePromise";
		export { usePromise } from "./usePromise";