feat: Upgrade to nuxt 3 stable, remove histoire (#75)

* Removed historie

* Updated to Nuxt3 RC 13

* bumped nuxt-parse to 0.3.0

* fix: .address is undefined by converting app to nodeListener

* Changed defineEventHandler to eventHandler

* Upgraded from RC13 to RC14

* Upgraded from RC14 to stable version 3.0.0

* fix: override sub-parse5 dep of typeorm to make build + start work

* fix: docker build + start by switching to better-sqlite3

* fix: formatting in package.json;

* feat: remove remaining histoire references

* fix: remove a remaining storybook reference

* docs: add section for yarn usage

Co-authored-by: BracketJohn <njonalik@protonmail.com>

.dockerignore

@@ -3,5 +3,4 @@ npm-debug*
 .nuxt
 dist
 tests
-.histoire
 .output

.gitignore

@@ -59,9 +59,6 @@ jspm_packages/
 # Nuxt generate
 dist
 
-# Histoire output
-.histoire
-
 # vuepress build output
 .vuepress/dist
 

README.md

@@ -12,7 +12,7 @@
 
 sidebase is a modern, best-practice, batteries-included fullstack-app starter based on Nuxt 3 and TypeScript.
 
-With this nuxt 3 starter you get production-ready frontend + backend projects while still having fun! [Atinux, CEO of Nuxt](https://github.com/Atinux) said to sidebase on Twitter:
+With this Nuxt 3 starter you get production-ready frontend + backend projects while still having fun! [Atinux, CEO of Nuxt](https://github.com/Atinux) said to sidebase on Twitter:
 > Beautiful work on sidebase!
 
 ## Quick start
@@ -41,16 +41,15 @@ With this nuxt 3 starter you get production-ready frontend + backend projects wh
 
 The key features are:
 - 🎒 **Fullstack**: Develop frontend and backend in a single TypeScript code base
-    - Fullstack [`Vue 3`](https://vuejs.org/) + [`Nuxt 3 RC.10`](https://v3.nuxtjs.org/),
-    - Data base models, migrations, queries and easy DB-switching via [`TypeORM`](https://typeorm.io/),
+    - Fullstack [`Vue 3`](https://vuejs.org/) + [`Nuxt 3 (stable)`](https://v3.nuxtjs.org/),
+    - Database models, migrations, queries and easy DB-switching via [`TypeORM`](https://typeorm.io/),
     - Frontend- and Backend data-transformation via [`nuxt-parse`](https://www.npmjs.com/package/@sidebase/nuxt-parse) and [`zod`](https://github.com/colinhacks/zod),
     - In-memory development SQL-database via [`sqlite3`](https://www.sqlite.org/index.html),
     - Linting via [`eslint`](https://eslint.org/),
     - Test management, Test UI, component snapshotting via [`vitest`](https://vitest.dev/),
     - Component tests via [`test-library/vue`](https://testing-library.com/),
     - API tests via [`supertest`](https://github.com/visionmedia/supertest),
     - Code coverage via [`c8`](https://github.com/bcoe/c8),
-    - Component stories via [`histoire`](https://histoire.dev/),
     - CSS utiltities via [`TailwindCSS`](https://tailwindcss.com/),
     - CSS components via [`Ant Design Vue`](https://antdv.com/components/overview),
     - Type checking in script and template via [`Volar / vue-tsc`](https://github.com/johnsoncodehk/volar)
@@ -73,7 +72,6 @@ Useful Commands for development, testing and deployment:
 - Develop & Debug the app:
     - `npm i`: Install required dependencies
     - `npm run dev`: Start the fullstack app, including database
-    - `npm run story`: Start `histoire` for component story based development of UI
 - Linting & Formatting (`npm run lint`)
     - `npm run lint:style`: eslint for formatting & linting
     - `npm run lint:style -- --fix`: Autofix styles and lints where possible
@@ -108,7 +106,7 @@ Useful Commands for development, testing and deployment:
     - `nvm use`: If you use `nvm`, use this command to make sure that your local environment uses the correct, required node version
     - Pre-commit checking (husky) & fixing (lint-staged)
     - github CI pipeline to linting, testing, typing checks
-    - nuxt-component support in tests and histoire
+    - nuxt-component support in tests
     - debug sql database queries by setting `logging: true` in the `database/index.ts`: This will show you a live log of all ongoing database queries which is super helpful to debug database problems
 
 ### Guides
@@ -160,6 +158,17 @@ If you have type-problems after running `npm i` for the first time:
 
 If none of this works, file an issue (preferrably with a reproduction) [here](https://github.com/sidebase/sidebase/issues/new/choose).
 
+#### `yarn`
+
+We use the `overrides` key in the `package.json`. `yarn` does not support this, you will have to replace it with:
+```
+"resolutions": {
+    "typeorm/**/parse5": "6.0.1"
+}
+```
+
+for it to work with yarn.
+
 #### `nuxt-parse`
 
 1. [`nuxt-parse`](https://www.npmjs.com/package/@sidebase/nuxt-parse) to validate and deserialize data from the `server` in the `frontend`:

components/example/__snapshots__/ShowCase.test.ts.snap

@@ -7,7 +7,7 @@ exports[`ShowCase > mounts and is still the same 1`] = `
   <form>
     <div class=\\"flex\\"><span class=\\"ant-input-group-wrapper\\"><span class=\\"ant-input-wrapper ant-input-group\\"><span class=\\"ant-input-group-addon\\">Please enter your name:</span><input placeholder=\\"Your name...\\" type=\\"text\\" class=\\"ant-input\\">
       <!----></span></span><button class=\\"ant-btn ant-btn-primary\\" type=\\"submit\\">
-        <transition-stub>
+        <transition-stub name=\\"ant-btn-loading-icon-motion\\" appear=\\"false\\" persisted=\\"false\\" css=\\"true\\">
           <!---->
         </transition-stub><span>Submit</span>
       </button>

env.d.ts

@@ -1,5 +1,3 @@
-// Types for histoire
-/// <reference types="@histoire/plugin-vue/components" />
 // Types for nuxt, to avoid volar-reload after `nuxi prepare`, see https://github.com/nuxt/framework/issues/7544#issuecomment-1247920103
 /// <reference types="nuxt" />
 // To get correct types for `svg`s