Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,13 @@ WORKDIR /editor

COPY package.json /editor/package.json
Comment thread
jacbn marked this conversation as resolved.
COPY tsconfig.json /editor/tsconfig.json
COPY webpack.config.js /editor/webpack.config.js
RUN yarn
COPY vite.config.ts /editor/vite.config.ts
COPY yarn.lock /editor/yarn.lock
RUN yarn --frozen-lockfile

COPY public /editor/public
COPY src /editor/src
COPY index.html /editor/index.html

RUN yarn run build

Expand Down
59 changes: 59 additions & 0 deletions eslint.config.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import globals from "globals";

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is the eslint config used for? Have you been able to execute it successfully? Is the config just here for VSCode? (doesn't even work there for me...)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, I broke it when upgrading other deps but I've now restored it. I only added it so the setup across this, react-app and in theory the editor all align to make it easier for ourselves when coding across different projects.

import pluginJs from "@eslint/js";
import tseslint, { parser as tsParser } from "typescript-eslint";
import pluginReact from "eslint-plugin-react";
import pluginReactHooks from "eslint-plugin-react-hooks";
import pluginJsxA11y from "eslint-plugin-jsx-a11y";
import { fixupPluginRules } from "@eslint/compat";
import path from 'path';
import stylistic from '@stylistic/eslint-plugin'


export default [
{files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"]},
{languageOptions: { globals: globals.browser }},
pluginJs.configs.recommended,
...tseslint.configs.recommended,
pluginReact.configs.flat.recommended,
pluginJsxA11y.flatConfigs.strict,
{
plugins: {
"react-hooks": fixupPluginRules(pluginReactHooks),
'@stylistic': stylistic
},
settings: {
react: {
version: "detect"
}
},
rules: {
"no-prototype-builtins": "off",
"prefer-const": "error",
"semi": "error",
"@stylistic/indent": ["error", 4, {"SwitchCase": 1}],
"jsx-a11y/no-static-element-interactions": "error",
"react-hooks/rules-of-hooks": "error",
"react-hooks/exhaustive-deps": "error",
"@typescript-eslint/no-unused-vars": ["error", {
"argsIgnorePattern": "^_",
"varsIgnorePattern": "^_"
}],
"@typescript-eslint/ban-ts-comment": "off",
"@typescript-eslint/explicit-function-return-type": "off",
"@typescript-eslint/no-empty-interface": "error",
"@typescript-eslint/explicit-module-boundary-types": "off",
"@typescript-eslint/no-floating-promises": "error",
"react/jsx-no-target-blank": "off", // https://github.com/isaacphysics/isaac-react-app/pull/1134#discussion_r1774839755
},
languageOptions: {
parser: tsParser,
parserOptions: {
ecmaFeatures: {
"jsx": true
},
projectService: true,
tsconfigRootDir: path.__dirname,
},
}
}
];
1 change: 1 addition & 0 deletions public/index.html → index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,5 @@
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
<script type="module" src="/src/index.tsx"></script>
</html>
91 changes: 46 additions & 45 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,58 +3,59 @@
"version": "1.0.0",
"private": true,
"dependencies": {
"@codemirror/autocomplete": "^6.18.1",
"@codemirror/commands": "^6.6.2",
"@codemirror/lang-javascript": "^6.2.2",
"@codemirror/lang-python": "^6.1.6",
"@codemirror/lang-sql": "^6.7.1",
"@codemirror/language": "^6.10.3",
"@codemirror/state": "6.4.1",
"@codemirror/view": "^6.34.1",
"@lezer/common": "^1.2.1",
"@sqlite.org/sqlite-wasm": "^3.46.1-build3",
"@xterm/addon-fit": "^0.10.0",
"@xterm/addon-webgl": "^0.18.0",
"@xterm/xterm": "^5.5.0",
"acorn": "^8.12.1",
"bootstrap": "^5.3.3",
"@codemirror/autocomplete": "^6.20.3",
"@codemirror/commands": "^6.10.4",
"@codemirror/lang-javascript": "^6.2.5",
"@codemirror/lang-python": "^6.2.1",
"@codemirror/lang-sql": "^6.10.0",
"@codemirror/language": "^6.12.4",
"@codemirror/state": "6.7.1",
"@codemirror/view": "^6.43.6",
"@lezer/common": "^1.5.2",
"@sqlite.org/sqlite-wasm": "^3.53.0-build1",
"@vitejs/plugin-react": "^6.0.4",
"@xterm/addon-fit": "^0.11.0",
"@xterm/addon-webgl": "^0.19.0",
"@xterm/xterm": "^6.0.0",
"acorn": "^8.17.0",
"bootstrap": "^5.3.8",
"classnames": "^2.5.1",
"codemirror": "^6.0.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"codemirror": "^6.0.2",
"react": "^19.2.8",
"react-dom": "^19.2.8",
"reactstrap": "^9.2.3",
"skulpt": "^1.2.0",
"uuid": "^10.0.0"
"uuid": "^14.0.1",
"vite": "^8.1.5"
},
"devDependencies": {
"@testing-library/jest-dom": "^6.5.0",
"@testing-library/react": "^16.0.1",
"@testing-library/user-event": "^14.5.2",
"@types/jest": "^29.5.13",
"@types/node": "^22.7.4",
"@types/react": "^18.3.10",
"@types/react-dom": "^18.3.0",
"@types/uuid": "^10.0.0",
"@webpack-cli/generators": "^3.0.7",
"css-loader": "^7.1.2",
"html-webpack-plugin": "^5.6.0",
"sass": "^1.79.4",
"sass-loader": "^16.0.2",
"style-loader": "^4.0.0",
"ts-loader": "^9.5.1",
"typescript": "^5.6.2",
"webpack": "^5.95.0",
"webpack-cli": "^5.1.4",
"webpack-dev-server": "^5.1.0"
"@eslint/compat": "^2.1.0",
"@stylistic/eslint-plugin": "^5.10.0",
"@testing-library/jest-dom": "^7.0.0",
"@testing-library/react": "^16.3.2",
"@testing-library/user-event": "^14.6.1",
"@types/jest": "^30.0.0",
"@types/node": "^26.1.1",
"@types/react": "^19.2.17",
"@types/react-dom": "^19.2.3",
"@types/uuid": "^11.0.0",
"@typescript-eslint/eslint-plugin": "^8.60.1",
"@typescript-eslint/parser": "^8.60.1",
"css-loader": "^7.1.4",
"eslint": "^9.39.4",
"eslint-plugin-jsx-a11y": "^6.10.2",
"eslint-plugin-react": "^7.37.5",
"eslint-plugin-react-hooks": "^5.2.0",
"sass": "^1.101.7",
"typescript": "^6.0.3",
"typescript-eslint": "^8.65.0",
"vite-plugin-checker": "^0.14.5"
},
"scripts": {
"start": "webpack-dev-server --hot --port 3000 --history-api-fallback",
"build": "webpack --mode=production --node-env=production",
"test": "echo \"we have no tests...\"",
"build:dev": "webpack --mode=development",
"build:prod": "webpack --mode=production --node-env=production",
"watch": "webpack --watch",
"serve": "webpack serve"
"start": "vite --port 3000",
"build": "tsc --noEmit && vite build",
"lint": "eslint --ext .ts,.tsx src",
"test": "echo \"we have no tests...\""
},
"eslintConfig": {
"extends": [
Expand Down
10 changes: 4 additions & 6 deletions src/app/languages/sql.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { tags } from "@lezer/highlight";
import {StandardSQL} from "@codemirror/lang-sql";
import {LanguageSupport} from "@codemirror/language";
import {CodeMirrorTheme} from "../types";
import { Database, Sqlite3Static } from "@sqlite.org/sqlite-wasm";
import type {Sqlite3Static, Database} from "@sqlite.org/sqlite-wasm" with { "resolution-mode": "import" }; // https://github.com/microsoft/TypeScript/issues/49721

const log = console.log;
const error = console.error;
Expand All @@ -25,10 +25,7 @@ const QUERIES = {

const setupSqlite3 = async () => {
const {default: sqlite3InitModule} = await import("@sqlite.org/sqlite-wasm");
return await sqlite3InitModule({
print: log,
printErr: error,
}).then((sql3) => {
return await sqlite3InitModule().then((sql3) => {
try {
log('Running SQLite3 version', sql3.version.libVersion);
sqlite3 = sql3;
Expand All @@ -40,12 +37,13 @@ const setupSqlite3 = async () => {
});
}

const downloadDatabase = (sqlite3: any, link: string): Promise<Database> => {
const downloadDatabase = (sqlite3: Sqlite3Static, link: string): Promise<Database> => {
return fetch(link)
.then((response) => response.arrayBuffer())
.then((arrayBuffer) => {
const p = sqlite3.wasm.allocFromTypedArray(arrayBuffer);
const db = new sqlite3.oo1.DB();
if (!db.pointer) return db;
const rc = sqlite3.capi.sqlite3_deserialize(
db.pointer, 'main', p, arrayBuffer.byteLength, arrayBuffer.byteLength,
sqlite3.capi.SQLITE_DESERIALIZE_FREEONCLOSE
Expand Down
13 changes: 6 additions & 7 deletions src/index.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import React from 'react';
import ReactDOM from 'react-dom';

// @ts-ignore
import "./scss/cs/isaac.scss";
import React from "react";
import { createRoot } from 'react-dom/client';
import { Sandbox } from "./app/Sandbox";

ReactDOM.render(
<Sandbox />,
document.getElementById("root")
);
const root = createRoot(document.getElementById('root')!);

root.render(<Sandbox />);
2 changes: 1 addition & 1 deletion src/scss/cs/isaac.scss
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ $tertiary-font: 'arconrounded-regular', sans-serif;

// ISAAC
// Node module imports
@import "~bootstrap/scss/bootstrap";
@import "bootstrap/scss/bootstrap";


// Utility
Expand Down
6 changes: 3 additions & 3 deletions tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"noImplicitAny": true,
"module": "es2022",
"target": "es5",
"module": "node16",
"target": "es2019",
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"moduleResolution": "node",
"moduleResolution": "node16",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "react-jsx"
Expand Down
44 changes: 44 additions & 0 deletions vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import checker from 'vite-plugin-checker';

export default defineConfig({
plugins: [
react(),
checker({ typescript: true })
],

build: {
target: 'es2022',
outDir: 'build',
emptyOutDir: true,
assetsInlineLimit: 0, // prevent inlining fonts (breaks content security policy)
rollupOptions: {
input: {
main: `./index.html`,
},
output: {
entryFileNames: 'assets/[name].[hash].js',
chunkFileNames: 'assets/[name].[hash].js',
assetFileNames: 'assets/[name].[hash].[ext]',
},
}
},

css: {
devSourcemap: true,
preprocessorOptions: {
scss: {
// https://github.com/twbs/bootstrap/issues/40962 – should be able to remove when Bootstrap 6 is available
silenceDeprecations: ['color-functions', 'global-builtin', 'if-function', 'import'],
},
},
},

optimizeDeps: {
exclude: ['@sqlite.org/sqlite-wasm'], // https://www.npmjs.com/package/@sqlite.org/sqlite-wasm
},


mode: process.env.NODE_ENV === 'production' ? 'production' : 'development',

@barna-isaac barna-isaac Jul 27, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't we set "production" either in package.json or docker-compose? I'm not sure what difference this would make though, as we already don't emit source maps

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've only copied this over from the previous config; it seems perfectly fine to leave it here as Vite does accept a mode like this. I suppose we could pass it in via --mode {mode} in package.json if you wanted? Seems not to matter.

});
70 changes: 0 additions & 70 deletions webpack.config.js

This file was deleted.

Loading