feat: characters

.devcontainer/devcontainer.json

@@ -1,32 +1,29 @@
 // For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
 // https://github.com/microsoft/vscode-dev-containers/tree/v0.209.6/containers/typescript-node
 {
-	"name": "Node.js & TypeScript",
-	"build": {
-		"dockerfile": "Dockerfile",
-		// Update 'VARIANT' to pick a Node version: 16, 14, 12.
-		// Append -bullseye or -buster to pin to an OS version.
-		// Use -bullseye variants on local on arm64/Apple Silicon.
-		"args": { 
-			"VARIANT": "16"
-		}
-	},
+  "name": "Node.js & TypeScript",
+  "build": {
+    "dockerfile": "Dockerfile",
+    // Update 'VARIANT' to pick a Node version: 16, 14, 12.
+    // Append -bullseye or -buster to pin to an OS version.
+    // Use -bullseye variants on local on arm64/Apple Silicon.
+    "args": {
+      "VARIANT": "16"
+    }
+  },
 
-	// Set *default* container specific settings.json values on container create.
-	"settings": {},
+  // Set *default* container specific settings.json values on container create.
+  "settings": {},
 
+  // Add the IDs of extensions you want installed when the container is created.
+  "extensions": ["dbaeumer.vscode-eslint"],
 
-	// Add the IDs of extensions you want installed when the container is created.
-	"extensions": [
-		"dbaeumer.vscode-eslint"
-	],
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  "forwardPorts": [3000],
 
-	// Use 'forwardPorts' to make a list of ports inside the container available locally.
-	"forwardPorts": [1234],
+  // Use 'postCreateCommand' to run commands after the container is created.
+  // "postCreateCommand": "yarn install",
 
-	// Use 'postCreateCommand' to run commands after the container is created.
-	// "postCreateCommand": "yarn install",
-
-	// Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-	"remoteUser": "node"
+  // Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
+  "remoteUser": "node"
 }

.gitignore

@@ -118,3 +118,7 @@ _site
 
 # storybook
 storybook-static
+
+# next
+out
+.next

.vscode/settings.json

@@ -37,5 +37,8 @@
   ],
   "[markdown]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[ignore]": {
+    "editor.defaultFormatter": "foxundermoon.shell-format"
   }
 }

README.md

@@ -55,7 +55,7 @@ If you want to run Fari on your machine, simply run:
 bun run dev
 ```
 
-This will start and bundle the app using [ViteJS](https://vitejs.dev/) and make it available on http://localhost:1234
+This will start and bundle the app using [ViteJS](https://vitejs.dev/) and make it available on http://localhost:3000
 
 ViteJS will also update your browser's content (using React Refresh) anytime you do save a file on the disk.
 

cypress.config.ts

@@ -9,7 +9,7 @@ export default defineConfig({
     setupNodeEvents(on, config) {
       return require("./cypress/plugins/index.js")(on, config);
     },
-    baseUrl: "http://localhost:1234",
+    baseUrl: "http://localhost:3000",
   },
 
   component: {

cypress/e2e/route/Characters.cy.ts

@@ -21,13 +21,13 @@ describe("/characters", () => {
 
       // fill up fields
       Fari.get("character-dialog.ASPECTS.HIGH CONCEPT.value").type(
-        "The Last Jedi"
+        "The Last Jedi",
       );
       Fari.get("character-dialog.ASPECTS.TROUBLE.value").type(
-        "Everything for my friends"
+        "Everything for my friends",
       );
       Fari.get("character-dialog.ASPECTS.RELATIONSHIP.value").type(
-        "Leia is my sister"
+        "Leia is my sister",
       );
       Fari.get("character-dialog.ASPECTS.OTHER ASPECT.value")
         .eq(0)
@@ -56,7 +56,7 @@ describe("/characters", () => {
       Fari.get("character-dialog.CONSEQUENCES.SEVERE.value").type("An Arm");
 
       Fari.get("character-dialog.OTHER.NOTES.value").type(
-        "A long time ago in a galaxy far, far away...."
+        "A long time ago in a galaxy far, far away....",
       );
       Fari.get("character-dialog.group").find("input").type("Star Wars");
 
@@ -89,7 +89,7 @@ describe("/characters", () => {
       cy.contains("Luke Skywalker").should("not.exist");
 
       // should be back to home page
-      cy.url().should("eq", "http://localhost:1234/");
+      cy.url().should("eq", "http://localhost:3000/");
 
       // undo
       cy.contains("Undo").click();
@@ -102,7 +102,7 @@ describe("/characters", () => {
       // add player
       Fari.get("scene.add-player").click();
       Fari.get(
-        "scene.player-row.gm-npc-0.assign-or-open-character-sheet"
+        "scene.player-row.gm-npc-0.assign-or-open-character-sheet",
       ).click();
 
       cy.contains("Luke Skywalker").click();

cypress/e2e/route/Scenes.cy.ts

@@ -37,7 +37,7 @@ describe("/scenes", () => {
       // aspect
       Fari.get("scene.aspect.4.title").type("Something weird is going on");
       Fari.find(Fari.get("scene.aspect.4"), "index-card.Text.value").type(
-        "There is no war in Ba Sing Se"
+        "There is no war in Ba Sing Se",
       );
 
       // remove second
@@ -67,7 +67,7 @@ describe("/scenes", () => {
       cy.contains("Ba Sing Se").should("not.exist");
 
       // should be back to home page
-      cy.url().should("eq", "http://localhost:1234/");
+      cy.url().should("eq", "http://localhost:3000/");
 
       // undo
       cy.contains("Undo").click();

lib/routes/Draw/DrawRoute.tsx

@@ -1,3 +1,4 @@
+"use client";
 import { Box, Container, useTheme } from "@mui/material";
 import React from "react";
 import { FateLabel } from "../../components/FateLabel/FateLabel";

netlify.toml

@@ -1,12 +1,7 @@
 [dev]
-  framework = "vite"
+  framework = "next"
 
 [build]
   command = "npm install && npm run build"
-  publish = "dist"
 
-[[redirects]]
-  from = "/*"
-  to = "/index.html"
-  status = 200
 

package.json

@@ -12,7 +12,7 @@
     "ci": "npm install --force && bun run build && bun run validate",
     "dev": "next dev",
     "build": "bun run next build",
-    "serve:build": "bun run vite preview --port 1234",
+    "start": "bun serve out",
     "i18n": "bun i18n.js",
     "preview": "bun run build && bun run deploy:preview",
     "alpha": "bun run build && bun run deploy:preview -- --alias alpha",
@@ -21,7 +21,7 @@
     "lint": "next lint",
     "test": "vitest",
     "test:run": "vitest run",
-    "int": "bun run build && concurrently \"cypress run\" \"bun run serve:build\" --success first --kill-others --names \"cypress,server\" ",
+    "int": "bun run build && concurrently \"cypress run\" \"bun run start\" --success first --kill-others --names \"cypress,server\" ",
     "int:start": "concurrently \"cypress open\" \"bun run start\" --success first --kill-others --names \"cypress,server\" ",
     "validate": "bun run tsc && bun run test:run",
     "deploy:preview": "netlify deploy --site 534c856a-7d30-4fdd-ad4a-9845ccdefd08",
@@ -66,6 +66,7 @@
     "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.2.0",
     "react-i18next": "^13.0.3",
+    "serve": "latest",
     "uuid": "^9.0.0",
     "vitest": "^0.34.4"
   },
@@ -88,8 +89,6 @@
     "@types/uuid": "^9.0.2",
     "@typescript-eslint/eslint-plugin": "^6.3.0",
     "@typescript-eslint/parser": "^6.3.0",
-    "@vitejs/plugin-legacy": "^4.1.1",
-    "@vitejs/plugin-react": "^4.0.4",
     "bun-types": "^1.0.1",
     "chromatic": "^6.21.0",
     "concurrently": "^8.2.0",

tsconfig.json

@@ -7,14 +7,7 @@
     "jsx": "preserve",
     "outDir": "./.tsc",
     "skipLibCheck": true,
-    "lib": [
-      "es2015",
-      "es2016",
-      "es2017",
-      "ES2018",
-      "ES2019",
-      "dom"
-    ],
+    "lib": ["es2015", "es2016", "es2017", "ES2018", "ES2019", "dom"],
     "strict": true,
     "allowJs": true,
     "forceConsistentCasingInFileNames": true,
@@ -27,11 +20,7 @@
         "name": "next"
       }
     ],
-    "types": [
-      "vitest/globals",
-      "bun-types",
-      "next"
-    ],
+    "types": ["vitest/globals", "bun-types", "next"],
     "noEmit": true,
     "resolveJsonModule": true,
     "isolatedModules": true
@@ -44,10 +33,5 @@
     "./next-env.d.ts",
     ".next/types/**/*.ts"
   ],
-  "exclude": [
-    "./node_modules",
-    "cypress",
-    "dist",
-    "lib/**/*.test.tsx"
-  ]
+  "exclude": ["out", "./node_modules", "cypress", "dist", "lib/**/*.test.tsx"]
 }