jevstrudel.git / website / src / repl / components / ReplEditor.jsx
ReplEditor.jsx52 lines · 2.5 KB · raw
1import { Code } from '@src/repl/components/Code';
2import Loader from '@src/repl/components/Loader';
3import { BottomPanel, LeftPanel, MainPanel, RightPanel } from '@src/repl/components/panel/Panel';
4import UserFacingErrorMessage from '@src/repl/components/UserFacingErrorMessage';
5import { useSettings } from '@src/settings.mjs';
6import { JevBoothEffects } from '@src/jev/JevBooth.jsx';
7import { JevPane } from '@src/jev/JevPane.jsx';
8import { SandboxNotice } from '@src/jev/SandboxNotice.jsx';
9import { RadioDriver } from '@src/jev/JevPicks.jsx';
10import { PerformanceRecorder } from '@src/jev/JevPerformance.jsx';
11import { UpdateModal } from '@src/jev/UpdateModal.jsx';
12
13// type Props = {
14//  context: replcontext,
15// }
16
17export default function ReplEditor(Props) {
18  const { context, ...editorProps } = Props;
19  const { containerRef, editorRef, error, init, pending } = context;
20  const settings = useSettings();
21  const { panelPosition, isZen } = settings;
22  const isEmbedded = typeof window !== 'undefined' && window.location !== window.parent.location;
23
24  return (
25    <div className="h-full flex flex-col relative" {...editorProps}>
26      <Loader active={pending} />
27      <div className="flex flex-col grow overflow-hidden">
28        {/* <MainPanel context={context} isEmbedded={isEmbedded} className="hidden sm:block" /> */}
29        <MainPanel context={context} isEmbedded={isEmbedded} />
30        <SandboxNotice />
31        <div className="flex overflow-hidden h-full">
32          {/* jevstrudel: Jev's panel, the right one's twin (Panel.jsx) */}
33          {!isZen && !isEmbedded && <LeftPanel context={context} />}
34          {/* jevstrudel: the editor, with Jev at work under it (JevPane.jsx) */}
35          <div className="flex flex-col grow min-w-0 overflow-hidden">
36            <Code containerRef={containerRef} editorRef={editorRef} init={init} />
37            {!isZen && !isEmbedded && <JevPane context={context} />}
38          </div>
39          {!isZen && panelPosition === 'right' && <RightPanel context={context} />}
40        </div>
41      </div>
42      {/* jevstrudel: the booth's code highlighting and toasts; the booth is JevPane's */}
43      <JevBoothEffects context={context} />
44      <RadioDriver context={context} />
45      <PerformanceRecorder context={context} />
46      <UpdateModal />
47      <UserFacingErrorMessage error={error} />
48      {!isZen && panelPosition === 'bottom' && <BottomPanel context={context} />}
49      {/* <MainPanel context={context} isEmbedded={isEmbedded} className="block sm:hidden" /> */}
50    </div>
51  );
52}