Merge pull request #217 from compute-toys/master

Deploy

.devcontainer/devcontainer.json

@@ -7,7 +7,8 @@
 	"features": {
 		"ghcr.io/devcontainers/features/node:1": {},
 		"ghcr.io/devcontainers/features/rust:1": {},
-		"devwasm.azurecr.io/dev-wasm/dev-wasm-feature/rust-wasi:0": {}
+		"devwasm.azurecr.io/dev-wasm/dev-wasm-feature/rust-wasi:0": {},
+		"ghcr.io/devcontainers/features/docker-in-docker:2": {}
 	},
 
 	// Features to add to the dev container. More info: https://containers.dev/features.
@@ -20,7 +21,8 @@
 	"postCreateCommand": {
 		"submodule": "git submodule update --init --recursive",
 		"wasm-pack": "curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh",
-		"yarn": "yarn"
+		"yarn": "yarn",
+		"deno": "curl -fsSL https://deno.land/install.sh | sh"
 	},
 
 	// Configure tool-specific properties.
@@ -36,7 +38,9 @@
 	"customizations": {
 		"vscode": {
 			"extensions": [
-				"esbenp.prettier-vscode"
+				"esbenp.prettier-vscode",
+				"denoland.vscode-deno",
+				"ms-azuretools.vscode-docker"
 			]
 		}
 	}

.eslintrc.json

@@ -1,11 +1,36 @@
 {
   "extends": [
-    "./node_modules/gts/",
-    "next/core-web-vitals"
+    "eslint:recommended",
+    "next/core-web-vitals",
+    "plugin:n/recommended",
+    "prettier"
+  ],
+  "plugins": [
+    "import",
+    "n",
+    "prettier"
   ],
   "rules": {
+    "block-scoped-var": "error",
+    "eqeqeq": "error",
+    "no-var": "error",
+    "prefer-const": "error",
+    "eol-last": "error",
+    "prefer-arrow-callback": "error",
+    "no-trailing-spaces": "error",
+    "quotes": ["warn", "single", { "avoidEscape": true }],
+    "no-restricted-properties": [
+      "error",
+      {
+        "object": "describe",
+        "property": "only"
+      },
+      {
+        "object": "it",
+        "property": "only"
+      }
+    ],
     "react-hooks/exhaustive-deps": "off",
-    "@typescript-eslint/ban-ts-comment": "warn",
     "prettier/prettier": [
       "error",
       {
@@ -32,5 +57,39 @@
       "@mui/material",
       "@mui/icons-material"
     ]
-  }
+  },
+  "overrides": [
+    {
+      "files": ["**/*.ts", "**/*.tsx"],
+      "parser": "@typescript-eslint/parser",
+      "extends": [
+        "plugin:@typescript-eslint/recommended"
+      ],
+      "rules": {
+        "@typescript-eslint/ban-ts-comment": "warn",
+        "@typescript-eslint/no-explicit-any": "warn",
+        "@typescript-eslint/no-non-null-assertion": "off",
+        "@typescript-eslint/no-use-before-define": "off",
+        "@typescript-eslint/no-warning-comments": "off",
+        "@typescript-eslint/no-empty-function": "off",
+        "@typescript-eslint/no-var-requires": "off",
+        "@typescript-eslint/explicit-function-return-type": "off",
+        "@typescript-eslint/explicit-module-boundary-types": "off",
+        "@typescript-eslint/ban-types": "off",
+        "@typescript-eslint/camelcase": "off",
+        "n/no-missing-import": "off",
+        "n/no-empty-function": "off",
+        "n/no-unsupported-features/es-syntax": "off",
+        "n/no-unsupported-features/node-builtins": "off",
+        "n/no-missing-require": "off",
+        "n/shebang": "off",
+        "no-dupe-class-members": "off",
+        "require-atomic-updates": "off"
+      },
+      "parserOptions": {
+        "ecmaVersion": 2018,
+        "sourceType": "module"
+      }
+    }
+  ]
 }

.github/dependabot.yml

@@ -9,3 +9,32 @@ updates:
     directory: "/" # Location of package manifests
     schedule:
       interval: "weekly"
+  - package-ecosystem: "npm" # See documentation for possible values
+    directory: "/" # Location of package manifests
+    schedule:
+      interval: "weekly"
+    ignore:
+      - dependency-name: 'eslint'
+        update-types: ['version-update:semver-major'] # Ignore major version updates for eslint
+    groups:
+      nextjs:
+        patterns:
+          - "@cloudflare/next-on-pages"
+          - "@next/*"
+          - "eslint-config-next"
+          - "next"
+          - "vercel"
+          - "wrangler"
+      typescript:
+        patterns:
+          - "@typescript-eslint/*"
+          - "@types/*"
+          - "@webgpu/types"
+          - "eslint"
+          - "eslint-config-prettier"
+          - "eslint-plugin-*"
+          - "prettier*"
+          - "typescript"
+      fontawesome:
+        patterns:
+          - "@fortawesome/*"

.github/workflows/build.yml

@@ -27,7 +27,8 @@ jobs:
       - run: cargo install wasm-pack
       - uses: actions/setup-node@v4
         with:
-          node-version: node
+          node-version-file: .node-version
           cache: 'yarn'
       - run: yarn
+      - run: yarn lint
       - run: yarn build

.github/workflows/deploy.yml

@@ -31,7 +31,7 @@ jobs:
       - run: cargo install wasm-pack
       - uses: actions/setup-node@v4
         with:
-          node-version: node
+          node-version-file: .node-version
           cache: 'yarn'
       - run: yarn
       - run: yarn build

.gitignore

@@ -31,3 +31,4 @@ yarn-error.log*
 .env.*
 
 .vercel/
+.wrangler/

.node-version

@@ -0,0 +1 @@
+v20.17.0

.prettierrc

@@ -1,4 +1,5 @@
 {
+    "plugins": ["prettier-plugin-organize-imports"],
     "semi": true,
     "singleQuote": true,
     "tabWidth": 4,

README.md

@@ -25,6 +25,17 @@ Some other useful commands are:
 - `yarn lint` to only check for lint errors and warnings
 - `yarn fix` to automatically fix lint errors where possible
 
+## Local Database
+
+Run `npx supabase start` to start a local instance of the compute.toys database.
+Copy the "anon key" from the output and set it as `NEXT_PUBLIC_SUPABASE_PUBLIC_API_KEY` in the `.env` file.
+You'll also need to set `NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321`
+
+If you're using codespaces, you can instead set the URL to the forwarded port, it'll need to have public visibility.
+You should also set `api_url` in `supabase/config.toml` to the same address.
+
+A local test user is available to login with username `[email protected]` and password `pass`
+
 ## Standalone Editor
 
 By default, the development environment will connect to the public API for the compute.toys website.

components/buttons/recordbutton.tsx

@@ -18,13 +18,13 @@ export default function RecordButton() {
             }}
             title={'Record video <Ctrl + Alt + R>'}
             sx={{
-                color: recording ? theme.palette.primary.contrastText : theme.palette.primary.light
+                fill: recording ? theme.palette.primary.contrastText : theme.palette.primary.light
             }}
         >
             {recording ? (
                 <RadioButtonChecked />
             ) : (
-                <SvgIcon style={{ transform: 'scale(0.9)' }}>
+                <SvgIcon sx={{ transform: 'scale(0.9)' }}>
                     <svg
                         id="Layer_1"
                         data-name="Layer 1"