[compiler] Run prettier, fix snap

After this is merged, I'll add it to .git-blame-ignore-revs. I can't do
it now as the hash will change after ghstack lands this stack.

ghstack-source-id: 054ca86
Pull Request resolved: #29214

Author: poteto

compiler/apps/playground/colors.js

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-
 /**
  * Sync from <https://github.com/reactjs/reactjs.org/blob/main/beta/colors.js>.
  */

compiler/apps/playground/components/Editor/EditorImpl.tsx

@@ -43,7 +43,7 @@ import {
 } from "./Output";
 
 function parseFunctions(
-  source: string,
+  source: string
 ): Array<
   NodePath<
     t.FunctionDeclaration | t.ArrowFunctionExpression | t.FunctionExpression
@@ -148,7 +148,7 @@ function isHookName(s: string): boolean {
 }
 
 function getReactFunctionType(
-  id: NodePath<t.Identifier | null | undefined>,
+  id: NodePath<t.Identifier | null | undefined>
 ): ReactFunctionType {
   if (id && id.node && id.isIdentifier()) {
     if (isHookName(id.node.name)) {
@@ -189,7 +189,7 @@ function compile(source: string): CompilerOutput {
             severity: ErrorSeverity.Todo,
             loc: fn.node.loc ?? null,
             suggestions: null,
-          }),
+          })
         );
         continue;
       }
@@ -205,7 +205,7 @@ function compile(source: string): CompilerOutput {
         "_c",
         null,
         null,
-        null,
+        null
       )) {
         const fnName = fn.node.id?.name ?? null;
         switch (result.kind) {
@@ -274,7 +274,7 @@ function compile(source: string): CompilerOutput {
           reason: `Unexpected failure when transforming input! ${err}`,
           loc: null,
           suggestions: null,
-        }),
+        })
       );
     }
   }
@@ -291,7 +291,7 @@ export default function Editor() {
   const { enqueueSnackbar } = useSnackbar();
   const compilerOutput = useMemo(
     () => compile(deferredStore.source),
-    [deferredStore.source],
+    [deferredStore.source]
   );
 
   useMountEffect(() => {
@@ -305,7 +305,7 @@ export default function Editor() {
         ...createMessage(
           "Bad URL - fell back to the default Playground.",
           MessageLevel.Info,
-          MessageSource.Playground,
+          MessageSource.Playground
         ),
       });
       mountStore = defaultStore;
@@ -319,9 +319,7 @@ export default function Editor() {
   return (
     <>
       <div className="relative flex basis top-14">
-        <div
-          className={clsx("relative sm:basis-1/4")}
-        >
+        <div className={clsx("relative sm:basis-1/4")}>
           <Input
             errors={
               compilerOutput.kind === "err" ? compilerOutput.error.details : []

compiler/apps/playground/components/Editor/Input.tsx

@@ -76,7 +76,7 @@ export default function Input({ errors }: Props) {
       allowSyntheticDefaultImports: true,
     };
     monaco.languages.typescript.javascriptDefaults.setCompilerOptions(
-      tscOptions,
+      tscOptions
     );
     monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
       ...tscOptions,

compiler/apps/playground/components/Editor/Output.tsx

@@ -106,7 +106,7 @@ async function tabify(source: string, compilerOutput: CompilerOutput) {
         output={text}
         diff={lastPassOutput ?? null}
         showInfoPanel={true}
-      ></TextTabContent>,
+      ></TextTabContent>
     );
     lastPassOutput = text;
   }
@@ -122,7 +122,7 @@ async function tabify(source: string, compilerOutput: CompilerOutput) {
         output={code}
         diff={null}
         showInfoPanel={false}
-      ></TextTabContent>,
+      ></TextTabContent>
     );
     if (sourceMapUrl) {
       reorderedTabs.set(
@@ -133,7 +133,7 @@ async function tabify(source: string, compilerOutput: CompilerOutput) {
             className="w-full h-monaco_small sm:h-monaco"
             title="Generated Code"
           />
-        </>,
+        </>
       );
     }
   }
@@ -145,16 +145,16 @@ async function tabify(source: string, compilerOutput: CompilerOutput) {
 
 async function codegen(
   ast: t.Program,
-  source: string,
+  source: string
 ): Promise<{ code: any; sourceMapUrl: string | null }> {
   const generated = generate(
     ast,
     { sourceMaps: true, sourceFileName: "input.js" },
-    source,
+    source
   );
   const sourceMapUrl = getSourceMapUrl(
     generated.code,
-    JSON.stringify(generated.map),
+    JSON.stringify(generated.map)
   );
   const codegenOutput = await prettier.format(generated.code, {
     semi: true,
@@ -172,14 +172,14 @@ function getSourceMapUrl(code: string, map: string): string | null {
   code = utf16ToUTF8(code);
   map = utf16ToUTF8(map);
   return `https://evanw.github.io/source-map-visualization/#${btoa(
-    `${code.length}\0${code}${map.length}\0${map}`,
+    `${code.length}\0${code}${map.length}\0${map}`
   )}`;
 }
 
 function Output({ store, compilerOutput }: Props) {
-  const [tabsOpen, setTabsOpen] = useState<Set<string>>(() => new Set(['JS']));
+  const [tabsOpen, setTabsOpen] = useState<Set<string>>(() => new Set(["JS"]));
   const [tabs, setTabs] = useState<Map<string, React.ReactNode>>(
-    () => new Map(),
+    () => new Map()
   );
   useEffect(() => {
     tabify(store.source, compilerOutput).then((tabs) => {

compiler/apps/playground/components/Editor/index.tsx

@@ -13,4 +13,4 @@ const Editor = dynamic(() => import("./EditorImpl"), {
   ssr: false,
 });
 
-export default Editor;
+export default Editor;

compiler/apps/playground/components/Editor/monacoOptions.ts

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-
 import type { EditorProps } from "@monaco-editor/react";
 
 export const monacoOptions: Partial<EditorProps["options"]> = {

compiler/apps/playground/components/Header.tsx

@@ -50,7 +50,7 @@ export default function Header() {
         <Logo
           className={clsx(
             "w-8 h-8 text-link",
-            process.env.NODE_ENV === "development" && "text-yellow-600",
+            process.env.NODE_ENV === "development" && "text-yellow-600"
           )}
         />
         <p className="hidden select-none sm:block">React Compiler Playground</p>

compiler/apps/playground/components/Icons/IconGitHub.tsx

@@ -21,5 +21,5 @@ export const IconGitHub = memo<JSX.IntrinsicElements["svg"]>(
         <path d="M10 0a10 10 0 0 0-3.16 19.49c.5.1.68-.22.68-.48l-.01-1.7c-2.78.6-3.37-1.34-3.37-1.34-.46-1.16-1.11-1.47-1.11-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.9 1.52 2.34 1.08 2.91.83.1-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.1.39-1.99 1.03-2.69a3.6 3.6 0 0 1 .1-2.64s.84-.27 2.75 1.02a9.58 9.58 0 0 1 5 0c1.91-1.3 2.75-1.02 2.75-1.02.55 1.37.2 2.4.1 2.64.64.7 1.03 1.6 1.03 2.69 0 3.84-2.34 4.68-4.57 4.93.36.31.68.92.68 1.85l-.01 2.75c0 .26.18.58.69.48A10 10 0 0 0 10 0"></path>
       </svg>
     );
-  },
+  }
 );

compiler/apps/playground/components/Logo.tsx

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-
 // https://github.com/reactjs/reactjs.org/blob/main/beta/src/components/Logo.tsx
 
 export default function Logo(props: JSX.IntrinsicElements["svg"]) {

compiler/apps/playground/components/StoreContext.tsx

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-
 import type { Dispatch, ReactNode } from "react";
 import { useReducer } from "react";
 import createContext from "../lib/createContext";