[playground] Only log error to console when clicked
Lauren Tan committed
Oct 16, 2023 at 15:54 UTC
640994f49b5cfb09eb65632b155570ba1c90878f
2 files changed
+13
-3
compiler/apps/playground/components/Editor/Output.tsx
+13
-2
@@ -16,7 +16,7 @@ import MonacoEditor, { DiffEditor } from "@monaco-editor/react";
16
import { type CompilerError } from "babel-plugin-react-forget";
17
import prettier from "prettier";
18
import prettierParserBabel from "prettier/parser-babel";
19
-import { memo, useMemo, useState } from "react";
19
+import { memo, useCallback, useMemo, useState } from "react";
20
import { type Store } from "../../lib/stores";
21
import TabbedWindow from "../TabbedWindow";
22
import { monacoOptions } from "./monacoOptions";
@@ -182,6 +182,11 @@ function Output({ store, compilerOutput }: Props) {
182
() => tabify(store.source, compilerOutput),
183
[store.source, compilerOutput]
184
);
185
+ const consoleLogError = useCallback(() => {
186
+ if (compilerOutput.kind === "err") {
187
+ console.error(compilerOutput.error);
188
+ }
189
+ }, [compilerOutput]);
190
191
return (
192
<>
@@ -203,7 +208,13 @@ function Output({ store, compilerOutput }: Props) {
208
className="p-4 basis-full text-red-600 overflow-y-scroll whitespace-pre-wrap"
209
style={{ width: "calc(100vw - 650px)", height: "150px" }}
210
>
206
- <code>{compilerOutput.error.toString()}</code>
211
+ <button
212
+ className="text-left"
213
+ title="Log error to console"
214
+ onClick={() => consoleLogError()}
215
+ >
216
+ <code>{compilerOutput.error.toString()}</code>
217
+ </button>
218
</pre>
219
</div>
220
) : null}
compiler/apps/playground/components/Editor/index.tsx
-1
@@ -183,7 +183,6 @@ function compile(source: string): CompilerOutput {
183
}
184
return { kind: "ok", results };
185
} catch (error: any) {
186
- console.error(error);
186
// error might be an invariant violation or other runtime error
187
// (i.e. object shape that is not CompilerError)
188
if (error.details == null) {