Remove remote compilation; not useful

src/components/share-latex/app-tools.tsx

@@ -1,15 +1,18 @@
-import { AppBar, Button, IconButton, Toolbar, Divider, MenuItem, Menu } from "@suid/material"
+import { AppBar, Button, IconButton, Toolbar, Divider, MenuItem, Menu, Select } from "@suid/material"
 import MenuIcon from "@suid/icons-material/Menu"
 import PathBread from './path-bread'
-import { createSignal, For, Switch, type JSX, Match } from "solid-js"
+import { createSignal, For, Switch, type JSX, Match, Accessor, Setter } from "solid-js"
+import { SelectChangeEvent } from "@suid/material/Select"
+import { ViewValues } from "./types"
 
 export default function AppTools(props: {
   rootPath: string,
   pathIds: string[],
   resolveName: (id: string) => string | undefined,
   menuItems: Array<{ name: string, onClick?: () => void, icon?: JSX.Element }>,
-  onCompileLocal: () => Promise<void>,
-  onCompileRemote: () => Promise<void>,
+  onCompile: () => Promise<void>,
+  view: Accessor<ViewValues>,
+  setView: Setter<ViewValues>,
 }) {
   const [menuAnchor, setMenuAnchor] = createSignal<HTMLElement>()
   const menuOpen = () => menuAnchor() !== undefined
@@ -35,12 +38,19 @@ export default function AppTools(props: {
         <div style={{ 'flex-grow': 1 }}>
           <PathBread rootPath={props.rootPath} pathIds={props.pathIds} resolveName={props.resolveName} />
         </div>
-        <Button onClick={props.onCompileLocal}>
-          Compile (local)
-        </Button>
-        <Button onClick={props.onCompileRemote}>
-          Compile (remote)
+        <Button onClick={props.onCompile}>
+          Compile
         </Button>
+        <Select
+          id="view-select"
+          value={props.view()}
+          onChange={(event: SelectChangeEvent) => props.setView(event.target.value as ViewValues)}
+        >
+          <MenuItem value="Editor">Editor</MenuItem>
+          <MenuItem value="PDF">PDF</MenuItem>
+          <MenuItem value="Both">Both</MenuItem>
+          <MenuItem value="Log">Log</MenuItem>
+        </Select>
       </Toolbar>
 
       <Menu

src/components/share-latex/share-latex/component.tsx

@@ -2,10 +2,11 @@ import AppTools from '../app-tools'
 import FileList from '../file-list'
 import LatexDoc from '../latex-doc'
 import NewItemModal, { ModalState } from '../new-item-modal'
-import { Button } from '@suid/material'
+import { Button, TextField } from '@suid/material'
 import { project } from '../../../backend/models'
 import { Accessor, Match, Setter, Show, Switch } from 'solid-js'
 import RichDoc from '../rich-doc'
+import { ViewValues } from '../types'
 
 export default function ShareLatexComponent(
   props: {
@@ -19,10 +20,12 @@ export default function ShareLatexComponent(
     deleteItem: (index: number) => void
     createItem: (name: string, state: ModalState, blob?: Uint8Array) => void
     onExportZip: () => void
-    onCompileLocal: () => Promise<void>
-    onCompileRemote: () => Promise<void>
+    onCompile: () => Promise<void>
     onMapFolder: () => Promise<void>
     onDownloadBlob: () => void
+    view: Accessor<ViewValues>
+    setView: Setter<ViewValues>
+    compilationLog: string
   }
 ) {
   return <>
@@ -37,8 +40,9 @@ export default function ShareLatexComponent(
       rootPath={props.rootUri}
       pathIds={props.pathIds()}
       resolveName={id => props.resolveItem(id)?.name}
-      onCompileLocal={props.onCompileLocal}
-      onCompileRemote={props.onCompileRemote}
+      onCompile={props.onCompile}
+      view={props.view}
+      setView={props.setView}
       menuItems={[
         { name: 'New folder', onClick: () => props.setModalState('folder') },
         { name: 'New tex', onClick: () => props.setModalState('doc') },
@@ -48,26 +52,50 @@ export default function ShareLatexComponent(
         { name: 'Download as zip', onClick: props.onExportZip },
         { name: 'Map to a folder', onClick: props.onMapFolder },
       ]} />
-    <Switch fallback={<></>}>
-      <Match when={props.folderChildren !== undefined}>
-        <FileList
-          rootUri={props.rootUri}
-          subItems={props.folderChildren!}
-          resolveItem={props.resolveItem}
-          deleteItem={props.deleteItem}
-        />
-      </Match>
-      <Match when={props.item?.kind === 'text'}>
-        <LatexDoc doc={(props.item as project.TextDoc).text} />
-      </Match>
-      <Match when={props.item?.kind === 'xmldoc'}>
-        <RichDoc doc={(props.item as project.XmlDoc).text} />
-      </Match>
-      <Match when={props.item?.kind === 'blob'}>
-        <Button onClick={props.onDownloadBlob}>
-          DOWNLOAD
-        </Button>
-      </Match>
-    </Switch>
+    <Show when={props.view() === 'Editor' || props.view() === 'Both'}>
+      <Switch fallback={<></>}>
+        <Match when={props.folderChildren !== undefined}>
+          <FileList
+            rootUri={props.rootUri}
+            subItems={props.folderChildren!}
+            resolveItem={props.resolveItem}
+            deleteItem={props.deleteItem}
+          />
+        </Match>
+        <Match when={props.item?.kind === 'text'}>
+          <LatexDoc doc={(props.item as project.TextDoc).text} />
+        </Match>
+        <Match when={props.item?.kind === 'xmldoc'}>
+          <RichDoc doc={(props.item as project.XmlDoc).text} />
+        </Match>
+        <Match when={props.item?.kind === 'blob'}>
+          <Button onClick={props.onDownloadBlob}>
+            DOWNLOAD
+          </Button>
+        </Match>
+      </Switch>
+    </Show>
+    <Show when={props.view() === 'PDF' || props.view() === 'Both'}>
+      <></>
+    </Show>
+    <Show when={props.view() === 'Log'}>
+      <TextField
+        fullWidth
+        multiline
+        rows={props.compilationLog.split('\n').length}
+        minRows={1}
+        label="Compilation Log"
+        name="compilation-log"
+        type="text"
+        inputProps={{
+          style: {
+            "font-family": '"Roboto Mono", ui-monospace, monospace',
+            "white-space": "nowrap"
+          }
+        }}
+        // disabled={readOnly()}  // disabled not working with multiline
+        value={props.compilationLog}
+      />
+    </Show>
   </>
 }

src/components/share-latex/share-latex/index.tsx

@@ -14,6 +14,7 @@ import { Encoder } from '@ndn/tlv'
 import * as segObj from '@ndn/segmented-object'
 import { PdfTeXEngine } from '../../../vendor/swiftlatex/PdfTeXEngine'
 import { LatexEnginePath } from '../../../constants'
+import { ViewValues } from '../types'
 
 export default function ShareLatex(props: {
   rootUri: string
@@ -40,6 +41,8 @@ export default function ShareLatex(props: {
 
   const [folderChildren, setFolderChildren] = createSignal<string[]>()
   const [modalState, setModalState] = createSignal<ModalState>('')
+  const [view, setView] = createSignal<ViewValues>('Editor')
+  const [compilationLog, setCompilationLog] = createSignal<string>('')
 
   if (!booted()) {
     navigate('/', { replace: true })
@@ -166,7 +169,7 @@ export default function ShareLatex(props: {
   }
 
   const [texEngine, setTexEngine] = createSignal<PdfTeXEngine>()
-  const onCompileLocal = async () => {
+  const onCompile = async () => {
     let engine = texEngine()
     if (!engine) {
       engine = new PdfTeXEngine()
@@ -185,13 +188,14 @@ export default function ShareLatex(props: {
 
     // Compile main.tex
     engine.setEngineMainFile("main.tex")
+    setCompilationLog('Start compiling ...')
     const res = await engine.compileLaTeX()
-    console.log(res.log)
+    setCompilationLog(res.log)
 
     // Check if PDF is generated
     if (!res.pdf) {
       alert('Failed to compile PDF file')
-      console.error(res)
+      setCompilationLog(res.log)
       return
     }
 
@@ -205,7 +209,9 @@ export default function ShareLatex(props: {
     window.open(fileUrl)  // TODO: not working on Safari
   }
 
-  const onCompileRemote = async () => {
+  // Preservec unused
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const _onCompileRemote = async () => {
     const agent = syncAgent()
     if (!agent) {
       return
@@ -315,9 +321,11 @@ export default function ShareLatex(props: {
     deleteItem={deleteItem}
     createItem={createItem}
     onExportZip={onExportZip}
-    onCompileLocal={onCompileLocal}
-    onCompileRemote={onCompileRemote}
+    onCompile={onCompile}
     onMapFolder={onMapFolder}
     onDownloadBlob={onDownloadBlob}
+    view={view}
+    setView={setView}
+    compilationLog={compilationLog()}
   />
 }

src/components/share-latex/types.ts

@@ -0,0 +1 @@
+export type ViewValues = 'Editor' | 'PDF' | 'Log' | 'Both'

src/vendor/swiftlatex/PdfTeXEngine.ts

@@ -14,6 +14,7 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 // This is a modified version.
+// TODO: Patch this file and `pre.js` to replace `console.log`.
 
 export enum EngineStatus {
   Init = 1,

vite.config.ts

@@ -21,7 +21,7 @@ export default defineConfig({
       registerType: 'autoUpdate',
       injectRegister: null,
       devOptions: {
-        enabled: true  // SW and devtools adds > 1 sec to loading time. Enable only when nesessary.
+        enabled: false  // SW and devtools adds > 1 sec to loading time. Enable only when nesessary.
       },
       includeAssets: ['ndn_app.png', 'ndn.svg', 'font', 'font/*.woff2', 'swiftlatex/swiftlatexpdftex.wasm'],
       manifest: {