Remove old architecture from playground
Removes the old architecture from the playground. Next step deletion.
Joe Savona committed
Dec 19, 2022 at 10:00 UTC
d9b9554948899f92b7f8afc354e77393370866c2
13 files changed
+8
-550
compiler/forget/packages/playground/components/Editor/Input.tsx
+1
-11
@@ -3,30 +3,20 @@
3
*/
4
5
import MonacoEditor, { type Monaco } from "@monaco-editor/react";
6
-import type { Diagnostic } from "babel-plugin-react-forget-legacy";
6
import invariant from "invariant";
7
import type { editor } from "monaco-editor";
8
import { useEffect, useState } from "react";
10
-import { renderForgetMarkers } from "../../lib/forgetMonacoDiagnostics";
9
import { useStore, useStoreDispatch } from "../StoreContext";
10
import { monacoOptions } from "./monacoOptions";
11
// TODO: Make TS recognize .d.ts files, in addition to loading them with webpack.
12
// @ts-ignore
13
import React$Types from "../../node_modules/@types/react/index.d.ts";
14
17
-export default function Input({ diagnostics }: { diagnostics: Diagnostic[] }) {
15
+export default function Input({}: {}) {
16
const [monaco, setMonaco] = useState<Monaco | null>(null);
17
const store = useStore();
18
const dispatchStore = useStoreDispatch();
19
22
- useEffect(() => {
23
- if (!monaco) return;
24
- const uri = monaco.Uri.parse(`file:///index.js`);
25
- const model = monaco.editor.getModel(uri);
26
- invariant(model, "Model must exist for the selected input file.");
27
- renderForgetMarkers({ monaco, model, diagnostics });
28
- }, [diagnostics, monaco]);
29
-
20
// Set tab width to 2 spaces for the selected input file.
21
useEffect(() => {
22
if (!monaco) return;
compiler/forget/packages/playground/components/Editor/Output.tsx
-18
@@ -7,15 +7,9 @@
7
import generate from "@babel/generator";
8
import MonacoEditor from "@monaco-editor/react";
9
import { HIR } from "babel-plugin-react-forget";
10
-import {
11
- Diagnostic,
12
- OutputKind,
13
- stringifyCompilerOutputs,
14
-} from "babel-plugin-react-forget-legacy";
10
import prettier from "prettier";
11
import prettierParserBabel from "prettier/parser-babel";
12
import { memo, useMemo } from "react";
18
-import compileOldArchitecture from "../../lib/compilerDriver";
13
import type { Store } from "../../lib/stores";
14
import TabbedWindow, { TabTypes } from "../TabbedWindow";
15
import { monacoOptions } from "./monacoOptions";
@@ -44,7 +38,6 @@ export default MemoizedOutput;
38
39
type Props = {
40
store: Store;
47
- updateDiagnostics: (newDiags: Diagnostic[]) => void;
41
tabsOpen: Map<TabTypes, boolean>;
42
setTabsOpen: (newTab: Map<TabTypes, boolean>) => void;
43
};
@@ -146,16 +139,6 @@ function compile(source: string): CompilerOutput | CompilerError {
139
// TODO(gsn: Update diagnostics ƒrom HIR output
140
function Output({ store, setTabsOpen, tabsOpen }: Props) {
141
const compilerOutput = useMemo(() => compile(store.source), [store.source]);
149
- const { outputs: oldCompilerOutputs } = useMemo(
150
- () => compileOldArchitecture(store.source, store.compilerFlags),
151
- [store]
152
- );
153
- const prettyOldCompilerOutput = useMemo(
154
- () => stringifyCompilerOutputs(oldCompilerOutputs),
155
- [oldCompilerOutputs]
156
- );
157
- const prettyOldCompilerOutputJS =
158
- prettyOldCompilerOutput[OutputKind.JS] ?? "(Empty)";
142
143
if (typeof compilerOutput === "string") {
144
if (compilerOutput === "") return <div></div>;
@@ -221,7 +204,6 @@ function Output({ store, setTabsOpen, tabsOpen }: Props) {
204
)}
205
</>
206
),
224
- OldArchitecture: <TextTabContent output={prettyOldCompilerOutputJS} />,
207
}}
208
/>
209
);
compiler/forget/packages/playground/components/Editor/index.tsx
+6
-10
@@ -5,11 +5,10 @@
5
* LICENSE file in the root directory of this source tree.
6
*/
7
8
-import type { Diagnostic } from "babel-plugin-react-forget-legacy";
8
import clsx from "clsx";
9
import invariant from "invariant";
10
import { useSnackbar } from "notistack";
12
-import { useCallback, useDeferredValue, useState } from "react";
11
+import { useDeferredValue, useState } from "react";
12
import { useMountEffect } from "../../hooks";
13
import { defaultStore } from "../../lib/defaultStore";
14
import {
@@ -29,11 +28,6 @@ export default function Editor() {
28
const deferredStore = useDeferredValue(store);
29
const dispatchStore = useStoreDispatch();
30
const { enqueueSnackbar } = useSnackbar();
32
- const [diagnostics, setDiagnostics] = useState<Diagnostic[]>([]);
33
- const updateDiagnostics = useCallback(
34
- (newDiags: Diagnostic[]) => setDiagnostics(newDiags),
35
- [setDiagnostics]
36
- );
31
const [tabsOpen, setTabsOpen] = useState<Map<TabTypes, boolean>>(new Map());
32
33
useMountEffect(() => {
@@ -61,15 +55,17 @@ export default function Editor() {
55
return (
56
<>
57
<div className="flex basis">
64
- <div className={clsx("relative sm:basis-1/4")}>
65
- <Input diagnostics={diagnostics} />
58
+ <div
59
+ style={{ minWidth: 650 }}
60
+ className={clsx("relative sm:basis-1/4")}
61
+ >
62
+ <Input />
63
</div>
64
<div className={clsx("flex sm:flex")}>
65
<Output
66
tabsOpen={tabsOpen}
67
setTabsOpen={setTabsOpen}
68
store={deferredStore}
72
- updateDiagnostics={updateDiagnostics}
69
/>
70
</div>
71
</div>
compiler/forget/packages/playground/components/GraphView.tsx
deleted
-51
@@ -1,51 +0,0 @@
1
-import { graphviz, wasmFolder } from "@hpcc-js/wasm";
2
-import {
3
- OutputKind,
4
- type CompilerOutputs,
5
-} from "babel-plugin-react-forget-legacy";
6
-import { memo, useEffect, useState } from "react";
7
-import genDotProgram from "../lib/dotProgramGenerator";
8
-
9
-/*
10
- Look for graphvizlib.wasm in the /public folder.
11
- It's recommended to put the WASM files along with the JS files.
12
- See https://github.com/hpcc-systems/hpcc-js-wasm/#contents.
13
-*/
14
-wasmFolder("/");
15
-
16
-const MemoizedGraphView = memo(GraphView);
17
-
18
-export default MemoizedGraphView;
19
-
20
-function GraphView({
21
- graphs,
22
-}: {
23
- graphs:
24
- | CompilerOutputs[OutputKind.ValGraph]
25
- | CompilerOutputs[OutputKind.SCCGraph]
26
- | CompilerOutputs[OutputKind.RedGraph];
27
-}) {
28
- const [renderedGraphs, setRenderedGraphs] = useState<string[]>([]);
29
-
30
- useEffect(() => {
31
- async function generateGraph() {
32
- const svgs = [];
33
- for (const graph of graphs) {
34
- const svg = await graphviz.layout(genDotProgram(graph), "svg", "dot");
35
- svgs.push(svg);
36
- }
37
- setRenderedGraphs(svgs);
38
- }
39
-
40
- generateGraph();
41
- }, [graphs]);
42
-
43
- return (
44
- <>
45
- {renderedGraphs.map((graph, i) => (
46
- // TODO: Make an ID for each graph snapshot and use it as key here.
47
- <div dangerouslySetInnerHTML={{ __html: graph }} key={i} />
48
- ))}
49
- </>
50
- );
51
-}
compiler/forget/packages/playground/components/StoreContext.tsx
-16
@@ -8,7 +8,6 @@ import createContext from "../lib/createContext";
8
import { emptyStore } from "../lib/defaultStore";
9
import type { Store } from "../lib/stores";
10
import { saveStore } from "../lib/stores";
11
-import { ForgetCompilerFlags } from "../lib/compilerDriver";
11
12
const StoreContext = createContext<Store>();
13
@@ -51,10 +50,6 @@ type ReducerAction =
50
payload: {
51
source: string;
52
};
54
- }
55
- | {
56
- type: "setCompilerFlag";
57
- payload: { flag: keyof ForgetCompilerFlags; value: boolean };
53
};
54
55
function storeReducer(store: Store, action: ReducerAction): Store {
@@ -76,16 +71,5 @@ function storeReducer(store: Store, action: ReducerAction): Store {
71
saveStore(newStore);
72
return newStore;
73
}
79
- case "setCompilerFlag": {
80
- const { flag, value } = action.payload;
81
-
82
- const newStore = {
83
- ...store,
84
- compilerFlags: { ...store.compilerFlags },
85
- };
86
- newStore.compilerFlags[flag] = value;
87
- saveStore(newStore);
88
- return newStore;
89
- }
74
}
75
}
compiler/forget/packages/playground/components/TabbedWindow.tsx
+1
-2
@@ -18,8 +18,7 @@ export type TabTypes =
18
| "ReactiveFunctions"
19
| "LeaveSSA"
20
| "JS"
21
- | "SourceMap"
22
- | "OldArchitecture";
21
+ | "SourceMap";
22
23
type TabsRecord = Record<TabTypes, React.ReactNode>;
24
compiler/forget/packages/playground/lib/compilerDriver.ts
deleted
-126
@@ -1,126 +0,0 @@
1
-/*
2
- * Copyright (c) Facebook, Inc. and its affiliates.
3
- */
4
-
5
-import type { TransformOptions } from "@babel/core";
6
-import { transform } from "@babel/standalone";
7
-import {
8
- createArrayLogger,
9
- createCompilerOutputs,
10
- getMostRecentCompilerContext,
11
- NoUseBeforeDefineRule,
12
- OutputKind,
13
- type CompilerContext,
14
- type CompilerOptions,
15
- type CompilerOutputs,
16
- type Diagnostic,
17
-} from "babel-plugin-react-forget-legacy";
18
-import { PassName } from "../../babel-plugin-react-forget-legacy/dist/Pass";
19
-// @ts-ignore
20
-import ESLint from "eslint-browser";
21
-import { getBabelPlugins } from "./utils";
22
-
23
-declare global {
24
- var Forget$Context: CompilerContext;
25
-}
26
-export type ForgetCompilerFlags = CompilerOptions["flags"];
27
-
28
-interface CompileResult {
29
- outputs: CompilerOutputs;
30
- diagnostics: Diagnostic[];
31
-}
32
-
33
-const ESLINT_CONFIG = {
34
- parserOptions: {
35
- ecmaVersion: "latest",
36
- sourceType: "module",
37
- },
38
- rules: {
39
- "custom-no-use-before-define": "error",
40
- },
41
-};
42
-
43
-/**
44
- * Post-codegen pass to validate that the generated code does not introduce bugs.
45
- * Note that the compiler currently incorrectly reorders code in some cases: this
46
- * step detects this using ESLint's no-use-before-define rule at its strictest
47
- * setting.
48
- */
49
-function validateNoUseBeforeDefine(source: string) {
50
- const linter = new ESLint.index.Linter();
51
- linter.defineRule("custom-no-use-before-define", NoUseBeforeDefineRule);
52
- return linter.verify(source, ESLINT_CONFIG);
53
-}
54
-
55
-export default function compile(
56
- source: string,
57
- compilerFlags: ForgetCompilerFlags
58
-): CompileResult {
59
- const outputs = createCompilerOutputs();
60
-
61
- const forgetLogs: string[] = [];
62
- const forgetPlaygroundOptions: Partial<CompilerOptions> = {
63
- logger: createArrayLogger(forgetLogs),
64
- outputKinds: Object.values(OutputKind),
65
- stopPass: PassName.Validator,
66
- };
67
- if (compilerFlags) {
68
- forgetPlaygroundOptions.flags = compilerFlags;
69
- }
70
-
71
- const babelPlugins = getBabelPlugins(
72
- "javascript",
73
- true,
74
- forgetPlaygroundOptions
75
- );
76
- const babelOptions: TransformOptions = {
77
- compact: true,
78
- plugins: babelPlugins,
79
- filename: "index.js",
80
- };
81
-
82
- try {
83
- const result = transform(source, babelOptions);
84
-
85
- // Don't throw if resulting code is any string. This includes the
86
- // empty string, which is when `source` is an empty string.
87
- if (typeof result?.code !== "string") {
88
- throw new Error("Compilation Failed.");
89
- }
90
-
91
- const context = getMostRecentCompilerContext();
92
- // assign to global for interactive debugging
93
- globalThis.Forget$Context = context;
94
- const { outputs } = context;
95
- let code = result.code;
96
-
97
- const errors: Array<{ ruleId: string; message: string }> =
98
- validateNoUseBeforeDefine(code);
99
- // Filter out parse errors
100
- const noUseBeforeDefineErrors =
101
- errors != null
102
- ? errors.filter((error) => error.ruleId === "no-use-before-define")
103
- : [];
104
- if (noUseBeforeDefineErrors.length !== 0) {
105
- const comments = noUseBeforeDefineErrors
106
- .map((error) => `// - ${error.message}`)
107
- .join("\n");
108
- code = `// !!! INVALID OUTPUT !!!!\n${comments}\n${code}`;
109
- } else if (errors != null && errors.length !== 0) {
110
- code = `// NOTE: Could not validate output, the validator does not yet support JSX\n${code}`;
111
- }
112
- outputs[OutputKind.JS] = code;
113
-
114
- return {
115
- outputs,
116
- diagnostics: context.diagnostics,
117
- };
118
- } catch (e) {
119
- const context = getMostRecentCompilerContext();
120
-
121
- return {
122
- outputs,
123
- diagnostics: context.diagnostics,
124
- };
125
- }
126
-}
compiler/forget/packages/playground/lib/defaultStore.ts
-4
@@ -2,7 +2,6 @@
2
* Copyright (c) Facebook, Inc. and its affiliates.
3
*/
4
5
-import { createCompilerFlags } from "babel-plugin-react-forget-legacy";
5
import type { Store } from "./stores";
6
7
const index = `\
@@ -21,7 +20,6 @@ function fibbonacci(n) {
20
21
export const defaultStore: Store = {
22
source: index,
24
- compilerFlags: createCompilerFlags(),
23
};
24
25
const minimalIndex = `\
@@ -32,10 +30,8 @@ export default function MyApp() {
30
31
export const minimalStore: Store = {
32
source: minimalIndex,
35
- compilerFlags: createCompilerFlags(),
33
};
34
35
export const emptyStore: Store = {
36
source: "",
40
- compilerFlags: createCompilerFlags(),
37
};
compiler/forget/packages/playground/lib/dotProgramGenerator.ts
deleted
-173
@@ -1,173 +0,0 @@
1
-/*
2
- * Copyright (c) Facebook, Inc. and its affiliates.
3
- */
4
-
5
-// TODO: Add transform tests for these.
6
-
7
-import { SCCGraph, ValGraph } from "babel-plugin-react-forget-legacy";
8
-import invariant from "invariant";
9
-
10
-const dotPrologue = `\
11
- compound=true;
12
- node [shape=rect, fontsize=11];
13
-`;
14
-
15
-export default function genDotProgram(graph: ValGraph | SCCGraph): string {
16
- return graph instanceof ValGraph
17
- ? genValGraphDotProgram(graph)
18
- : genSCCGraphDotProgram(graph);
19
-}
20
-
21
-function genValGraphDotProgram(graph: ValGraph): string {
22
- const stmts: string[] = [];
23
- // Stringified Val => Node ID.
24
- const nodeTable = new Map<string, string>();
25
-
26
- // Nodes
27
- graph.vertices.forEach(({ val }, i) => {
28
- const id = `node${i}`;
29
- const node = genDotNode(id, val.pretty);
30
- stmts.push(node);
31
- nodeTable.set(val.toString(), id);
32
- });
33
-
34
- // Edges (dependency => dependent)
35
- graph.vertices.forEach(({ val, incomings }) => {
36
- const destinationId = getNodeId(nodeTable, val.toString());
37
- incomings.forEach((sourceVal) => {
38
- const sourceId = getNodeId(nodeTable, sourceVal.toString());
39
- const edge = genDotEdge(sourceId, destinationId);
40
- stmts.push(edge);
41
- });
42
- });
43
-
44
- return `\
45
- digraph G {
46
- ${dotPrologue}
47
- ${stmts.join("\n")}
48
- }
49
- `;
50
-}
51
-
52
-function genSCCGraphDotProgram(graph: SCCGraph): string {
53
- const stmts: string[] = [];
54
- // Stringified SCCVertex => subgraph ID + representative node ID.
55
- const subGraphTable = new Map<string, SubgraphId>();
56
- // Stringified Val => Node ID.
57
- const nodeTable = new Map<string, string>();
58
- let nodeCount = 0;
59
-
60
- // Subgraphs
61
- graph.vertices.forEach((sccVertex, i) => {
62
- const id = `cluster_${i}`;
63
-
64
- // Nodes
65
- const nodes = sccVertex.members.map(({ val }) => {
66
- const nodeId = `node${nodeCount++}`;
67
- nodeTable.set(val.toString(), nodeId);
68
- return genDotNode(nodeId, val.pretty);
69
- });
70
-
71
- const subgraph = genDotSubgraph(id, nodes);
72
- stmts.push(subgraph);
73
- subGraphTable.set(sccVertex.toString(), {
74
- id,
75
- repNodeId: `node${nodeCount - 1}`,
76
- });
77
- });
78
-
79
- // Edges
80
- graph.vertices.forEach((sccVertex) => {
81
- const { id: destinationId, repNodeId: destinationNodeId } = getSubgraphId(
82
- subGraphTable,
83
- sccVertex.toString()
84
- );
85
-
86
- // RedGraph: input node => subgraph
87
- sccVertex.inputs.forEach((input) => {
88
- const inputNodeId = getNodeId(nodeTable, input.toString());
89
- // Prevent self-loops on reactive inputs.
90
- if (inputNodeId !== destinationNodeId) {
91
- const edge = genDotEdge(inputNodeId, destinationNodeId, {
92
- lhead: destinationId,
93
- });
94
- stmts.push(edge);
95
- }
96
- });
97
-
98
- // SCCGraph: dependency subgraph => dependent subgraph
99
- sccVertex.incomings.forEach((sourceValVertices) => {
100
- const stringifiedSCCVertex = `[${sourceValVertices
101
- .map(({ val }) => val.toString())
102
- .join(",")}]`;
103
- const { id: sourceId, repNodeId: sourceNodeId } = getSubgraphId(
104
- subGraphTable,
105
- stringifiedSCCVertex
106
- );
107
- // Since Dot doesn't allow connecting two subgraphs directly, we
108
- // instead connect each of their representative nodes and specify
109
- // that the head and tail of the edge should attach to subgraphs instead.
110
- const edge = genDotEdge(sourceNodeId, destinationNodeId, {
111
- ltail: sourceId,
112
- lhead: destinationId,
113
- });
114
- stmts.push(edge);
115
- });
116
- });
117
-
118
- return `\
119
- digraph G {
120
- ${dotPrologue}
121
- ${stmts.join("\n")}
122
- }
123
- `;
124
-}
125
-
126
-function genDotNode(id: string, label: string): string {
127
- return `${id} [id="${id}", label="${label}"];`;
128
-}
129
-
130
-function genDotEdge(
131
- sourceNode: string,
132
- destinationNode: string,
133
- options?: { ltail?: string; lhead?: string }
134
-): string {
135
- const edge = `${sourceNode} -> ${destinationNode}`;
136
- const attrs = options
137
- ? `[ltail=${options.ltail ?? `""`}, lhead=${
138
- options.lhead ?? `""`
139
- }, minlen=3]`
140
- : undefined;
141
- return [edge, attrs].filter(Boolean).join(" ");
142
-}
143
-
144
-function genDotSubgraph(id: string, stmts: string[]): string {
145
- return `\
146
- subgraph ${id} {
147
- style=filled;
148
- color="#EBECF0";
149
- ${stmts.join("\n")}
150
- }
151
- `;
152
-}
153
-
154
-function getNodeId(nodeTable: Map<string, string>, label: string): string {
155
- const id = nodeTable.get(label);
156
- invariant(id, `Could not find Node ID for label: %s`, label);
157
- return id;
158
-}
159
-
160
-interface SubgraphId {
161
- id: string;
162
- // The ID of the node representing a subgraph (the last ID in the subgraph).
163
- repNodeId: string;
164
-}
165
-
166
-function getSubgraphId(
167
- sourceMap: Map<string, SubgraphId>,
168
- label: string
169
-): SubgraphId {
170
- const id = sourceMap.get(label);
171
- invariant(id, `Could not find subgraph ID for label: %s`, label);
172
- return id;
173
-}
compiler/forget/packages/playground/lib/forgetMonacoDiagnostics.ts
deleted
-88
@@ -1,88 +0,0 @@
1
-/*
2
- * Copyright (c) Facebook, Inc. and its affiliates.
3
- */
4
-
5
-import { Monaco } from "@monaco-editor/react";
6
-import { Diagnostic, DiagnosticLevel } from "babel-plugin-react-forget-legacy";
7
-import { MarkerSeverity, type editor } from "monaco-editor";
8
-
9
-function mapForgetSeverityToMonaco(
10
- level: DiagnosticLevel,
11
- monaco: Monaco
12
-): MarkerSeverity {
13
- switch (level) {
14
- case DiagnosticLevel.Error:
15
- return monaco.MarkerSeverity.Error;
16
- case DiagnosticLevel.Warning:
17
- return monaco.MarkerSeverity.Warning;
18
- default:
19
- return monaco.MarkerSeverity.Info;
20
- }
21
-}
22
-
23
-function mapForgetDiagnosticToMonacoMarker(
24
- { body, code, level, path, suggestion }: Diagnostic,
25
- monaco: Monaco
26
-): editor.IMarkerData | null {
27
- if (path == null || path.node.loc == null) {
28
- return null;
29
- }
30
- const severity = mapForgetSeverityToMonaco(level, monaco);
31
- let message = `[${level.toUpperCase()}] ${body} (${code})`;
32
- if (suggestion != null) {
33
- message = message.concat(`\n\n${suggestion}`);
34
- }
35
- return {
36
- severity,
37
- message,
38
- startLineNumber: path.node.loc.start.line,
39
- startColumn: path.node.loc.start.column + 1,
40
- endLineNumber: path.node.loc.end.line,
41
- endColumn: path.node.loc.end.column + 1,
42
- };
43
-}
44
-
45
-type ForgetMarkerConfig = {
46
- monaco: Monaco;
47
- model: editor.ITextModel;
48
- diagnostics: Diagnostic[];
49
-};
50
-let decorations: string[] = [];
51
-export function renderForgetMarkers({
52
- monaco,
53
- model,
54
- diagnostics,
55
-}: ForgetMarkerConfig): void {
56
- let markers = [];
57
- for (const diag of diagnostics) {
58
- const marker = mapForgetDiagnosticToMonacoMarker(diag, monaco);
59
- if (marker == null) {
60
- continue;
61
- }
62
- markers.push(marker);
63
- }
64
- if (markers.length > 0) {
65
- monaco.editor.setModelMarkers(model, "owner", markers);
66
- const newDecorations = markers.map((marker) => {
67
- return {
68
- range: new monaco.Range(
69
- marker.startLineNumber,
70
- marker.startColumn,
71
- marker.endLineNumber,
72
- marker.endColumn
73
- ),
74
- options: {
75
- isWholeLine: true,
76
- glyphMarginClassName: "bg-red-300",
77
- },
78
- };
79
- });
80
- decorations = model.deltaDecorations(decorations, newDecorations);
81
- } else {
82
- monaco.editor.setModelMarkers(model, "owner", []);
83
- decorations = model.deltaDecorations(
84
- model.getAllDecorations().map((d) => d.id),
85
- []
86
- );
87
- }
88
-}
compiler/forget/packages/playground/lib/stores/store.ts
-22
@@ -2,12 +2,7 @@
2
* Copyright (c) Facebook, Inc. and its affiliates.
3
*/
4
5
-import {
6
- createCompilerFlags,
7
- parseCompilerFlags,
8
-} from "babel-plugin-react-forget-legacy";
5
import invariant from "invariant";
10
-import { ForgetCompilerFlags } from "../compilerDriver";
6
import { defaultStore } from "../defaultStore";
7
import { codec } from "../utils";
8
@@ -16,8 +11,6 @@ import { codec } from "../utils";
11
*/
12
export interface Store {
13
source: string;
19
-
20
- compilerFlags: ForgetCompilerFlags;
14
}
15
16
/**
@@ -34,23 +27,8 @@ export function saveStore(store: Store) {
27
* - it has a `source` property and is a string
28
*/
29
function getValidStore(raw: any): Store | null {
37
- if ("compilerFlags" in raw && !(raw["compilerFlags"] instanceof Object)) {
38
- return null;
39
- }
30
const isValidStore = "source" in raw && typeof raw["source"] === "string";
31
if (isValidStore) {
42
- if ("compilerFlags" in raw) {
43
- // Merge flags from decoded store into flags valid for this compiler version
44
- // Since the compiler is in active dev, if
45
- // - a flag exists in the decoded store but is not supported by the compiler,
46
- // we discard + ignore it
47
- // - a flag does not exist in the decoded store but is used by the compiler,
48
- // we use the default value
49
- raw.compilerFlags = parseCompilerFlags(raw.compilerFlags, true);
50
- } else {
51
- // some saved Stores may not have `compilerFlags`
52
- raw.compilerFlags = createCompilerFlags();
53
- }
32
return raw;
33
} else {
34
return null;
compiler/forget/packages/playground/lib/utils.ts
-22
@@ -1,10 +1,6 @@
1
/*
2
* Copyright (c) Facebook, Inc. and its affiliates.
3
*/
4
-import type { PluginItem } from "@babel/core";
5
-import ReactForgetBabelPlugin, {
6
- CompilerOptions,
7
-} from "babel-plugin-react-forget-legacy";
4
5
/**
6
* Unicode-Base64 Codec.
@@ -24,21 +20,3 @@ export const codec = {
20
return decodeURIComponent(escape(atob(base64)));
21
},
22
};
27
-
28
-export function getBabelPlugins(
29
- language: string | null,
30
- enableForget: boolean,
31
- compilerOptions: Partial<CompilerOptions>
32
-): PluginItem[] {
33
- const babelPlugins: PluginItem[] = ["syntax-jsx"];
34
- if (language === "typescript") {
35
- babelPlugins.push(["transform-typescript", { isTSX: true }]);
36
- } else if (language == "javascript") {
37
- babelPlugins.push("transform-flow-strip-types");
38
- }
39
-
40
- if (enableForget) {
41
- babelPlugins.push([ReactForgetBabelPlugin, compilerOptions]);
42
- }
43
- return babelPlugins;
44
-}
compiler/forget/packages/playground/scripts/setup.sh
-7
@@ -20,17 +20,10 @@ yarn
20
yarn build
21
yarn link
22
23
-cd ../babel-plugin-react-forget-legacy
24
-echo "building legacy forget"
25
-yarn
26
-yarn build
27
-yarn link
28
-
23
## Configure the playground itself to use the above locally linked packages
24
cd ../playground
25
echo "linking playground"
26
yarn link babel-plugin-react-forget
33
-yarn link babel-plugin-react-forget-legacy
27
yarn link eslint-browser
28
29