From d3af5e69cd62a3634804761c3ae439f23c8ad4f8 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Fri, 20 Sep 2024 17:37:49 +0200 Subject: [PATCH 01/10] Migration docs WIP Signed-off-by: Mihovil Ilakovac --- .../migrate-from-0-11-to-0-12.md | 12 +++--- .../migrate-from-0-12-to-0-13.md | 6 +-- .../migrate-from-0-13-to-0-14.md | 6 +-- .../migrate-from-0-14-to-0-15.md | 40 +++++++++++++++++++ web/package-lock.json | 8 +++- web/sidebars.js | 28 +++++++------ 6 files changed, 74 insertions(+), 26 deletions(-) rename web/docs/{ => migration-guides}/migrate-from-0-11-to-0-12.md (99%) rename web/docs/{ => migration-guides}/migrate-from-0-12-to-0-13.md (90%) rename web/docs/{ => migration-guides}/migrate-from-0-13-to-0-14.md (97%) create mode 100644 web/docs/migration-guides/migrate-from-0-14-to-0-15.md diff --git a/web/docs/migrate-from-0-11-to-0-12.md b/web/docs/migration-guides/migrate-from-0-11-to-0-12.md similarity index 99% rename from web/docs/migrate-from-0-11-to-0-12.md rename to web/docs/migration-guides/migrate-from-0-11-to-0-12.md index 3d9394197c..97ae4b9e91 100644 --- a/web/docs/migrate-from-0-11-to-0-12.md +++ b/web/docs/migration-guides/migrate-from-0-11-to-0-12.md @@ -2,7 +2,7 @@ title: Migration from 0.11.X to 0.12.X --- -import { EmailPill, UsernameAndPasswordPill, GithubPill, GooglePill } from "./auth/Pills"; +import { EmailPill, UsernameAndPasswordPill, GithubPill, GooglePill } from "../auth/Pills"; :::note Migrating to the latest version @@ -71,9 +71,9 @@ The main differences are: no longer start with `@server` or `@client`. - Your project now features a top-level `public` dir. Wasp will publicly serve all the files it finds in this directory. Read more about it - [here](/project/static-assets.md). + [here](../project/static-assets.md). -Our [Overview docs](./tutorial/02-project-structure.md) explain the new +Our [Overview docs](../tutorial/02-project-structure.md) explain the new structure in detail, while this page provides a [quick guide](#migrating-your-project-to-the-new-structure) for migrating existing projects. @@ -160,7 +160,7 @@ Auth field customization is no longer possible using the `_waspCustomValidations ::: -You can read more about the new auth system in the [Accessing User Data](./auth/entities) section. +You can read more about the new auth system in the [Accessing User Data](../auth/entities) section. ## How to Migrate? @@ -597,7 +597,7 @@ You can follow these steps to migrate to the new auth system (assuming you alrea If you want to properly type the `profile` object, we recommend you use a validation library like Zod to define the shape of the `profile` object. - Read more about this and the `defineUserSignupFields` function in the [Auth Overview - Defining Extra Fields](./auth/overview.md#1-defining-extra-fields) section. + Read more about this and the `defineUserSignupFields` function in the [Auth Overview - Defining Extra Fields](../auth/overview.md#1-defining-extra-fields) section. @@ -693,7 +693,7 @@ Your app should be working correctly and using new auth, but to finish the migra After doing the steps above successfully locally and making sure everything is working, it is time to push these changes to the deployed app again. - _Deploy the app again_, either via `wasp deploy` or manually. Check our [Deployment docs](advanced/deployment/overview.md) for more details. + _Deploy the app again_, either via `wasp deploy` or manually. Check our [Deployment docs](../advanced/deployment/overview.md) for more details. The database migrations will automatically run on successful deployment of the server and delete the now redundant auth-related `User` columns from the database. diff --git a/web/docs/migrate-from-0-12-to-0-13.md b/web/docs/migration-guides/migrate-from-0-12-to-0-13.md similarity index 90% rename from web/docs/migrate-from-0-12-to-0-13.md rename to web/docs/migration-guides/migrate-from-0-12-to-0-13.md index f303f71c9e..8fe518ebad 100644 --- a/web/docs/migrate-from-0-12-to-0-13.md +++ b/web/docs/migration-guides/migrate-from-0-12-to-0-13.md @@ -42,7 +42,7 @@ Follow the steps below to migrate: If you are migrating a deployed app, you will need to define the `WASP_SERVER_URL` server env variable in your deployment environment. - Read more about setting env variables in production [here](./project/env-vars#defining-env-vars-in-production). + Read more about setting env variables in production [here](../project/env-vars#defining-env-vars-in-production). ::: 2. **Update the redirect URLs** for the OAuth providers @@ -64,7 +64,7 @@ Follow the steps below to migrate: - Check the new redirect URLs for [Google](./auth/social-auth/google.md#3-creating-a-google-oauth-app) and [GitHub](./auth/social-auth/github.md#3-creating-a-github-oauth-app) in Wasp's docs. + Check the new redirect URLs for [Google](../auth/social-auth/google.md#3-creating-a-google-oauth-app) and [GitHub](../auth/social-auth/github.md#3-creating-a-github-oauth-app) in Wasp's docs. 3. **Update the `configFn`** for the OAuth providers @@ -129,7 +129,7 @@ Follow the steps below to migrate: - Wasp now directly forwards what it receives from the OAuth providers. You can check the data format for [Google](./auth/social-auth/google.md#data-received-from-google) and [GitHub](./auth/social-auth/github.md#data-received-from-github) in Wasp's docs. + Wasp now directly forwards what it receives from the OAuth providers. You can check the data format for [Google](../auth/social-auth/google.md#data-received-from-google) and [GitHub](../auth/social-auth/github.md#data-received-from-github) in Wasp's docs. That's it! diff --git a/web/docs/migrate-from-0-13-to-0-14.md b/web/docs/migration-guides/migrate-from-0-13-to-0-14.md similarity index 97% rename from web/docs/migrate-from-0-13-to-0-14.md rename to web/docs/migration-guides/migrate-from-0-13-to-0-14.md index 97bd5fd064..8c6ec01c1e 100644 --- a/web/docs/migrate-from-0-13-to-0-14.md +++ b/web/docs/migration-guides/migrate-from-0-13-to-0-14.md @@ -396,7 +396,7 @@ All that's left to do is migrate the database. To avoid type errors, it's best to take care of database migrations after you've migrated the rest of the code. So, just keep reading, and we will remind you to migrate the database as [the last step of the migration guide](#migrate-the-database). -Read more about the [Prisma Schema File](./data-model/prisma-file.md) and how Wasp uses it to generate the database schema and Prisma client. +Read more about the [Prisma Schema File](../data-model/prisma-file.md) and how Wasp uses it to generate the database schema and Prisma client. ### Migrate how you access user auth fields @@ -659,8 +659,8 @@ wasp db migrate-dev This command generates the Prisma client based on the `schema.prisma` file. -Read more about the [Prisma Schema File](./data-model/prisma-file.md) and how Wasp uses it to generate the database schema and Prisma client. +Read more about the [Prisma Schema File](../data-model/prisma-file.md) and how Wasp uses it to generate the database schema and Prisma client. That's it! -You should now be able to run your app with the new Wasp 0.14.0. We recommend reading through the updated [Accessing User Data](./auth/entities/entities.md) section to get a better understanding of the new API. +You should now be able to run your app with the new Wasp 0.14.0. We recommend reading through the updated [Accessing User Data](../auth/entities/entities.md) section to get a better understanding of the new API. diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md new file mode 100644 index 0000000000..7e2f4c3ee1 --- /dev/null +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -0,0 +1,40 @@ +--- +title: Migration from 0.14.X to 0.15.X +--- + +## What's new in 0.15.0? + +### TS SDK for Wasp (preview) + +TODO: write this section + +### Prisma 5 + +TODO: write this section + +### React Router 6 + +TODO: write this section + +## How to migrate? + +To migrate your app to Wasp 0.15.x, you must: + +1. Bump the version in `main.wasp` ... + +### Bump the version + +Let's start with something simple. Update the version field in your Wasp file to `^0.15.0`: + +```wasp title="main.wasp" +app MyApp { + wasp: { + // highlight-next-line + version: "^0.15.0" + }, +} +``` + +That's it! + +You should now be able to run your app with the new Wasp 0.15.0. \ No newline at end of file diff --git a/web/package-lock.json b/web/package-lock.json index 2d42b1dfb3..789c4a068e 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -4557,7 +4557,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001474", + "version": "1.0.30001662", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001662.tgz", + "integrity": "sha512-sgMUVwLmGseH8ZIrm1d51UbrhqMCH3jvS7gF/M6byuHOnKyLOBL7W8yz5V02OHwgLGA36o/AFhWzzh4uc5aqTA==", "funding": [ { "type": "opencollective", @@ -17628,7 +17630,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001474" + "version": "1.0.30001662", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001662.tgz", + "integrity": "sha512-sgMUVwLmGseH8ZIrm1d51UbrhqMCH3jvS7gF/M6byuHOnKyLOBL7W8yz5V02OHwgLGA36o/AFhWzzh4uc5aqTA==" }, "ccount": { "version": "1.1.0" diff --git a/web/sidebars.js b/web/sidebars.js index 48dd6ea98f..87fc395380 100644 --- a/web/sidebars.js +++ b/web/sidebars.js @@ -29,7 +29,7 @@ module.exports = { { type: 'link', label: 'Examples', - href: 'https://github.com/wasp-lang/wasp/tree/release/examples' + href: 'https://github.com/wasp-lang/wasp/tree/release/examples', }, { type: 'category', @@ -50,7 +50,7 @@ module.exports = { }, 'data-model/crud', 'data-model/backends', - 'data-model/prisma-file' + 'data-model/prisma-file', ], }, { @@ -76,7 +76,7 @@ module.exports = { ], }, 'auth/entities/entities', - 'auth/auth-hooks' + 'auth/auth-hooks', ], }, { @@ -139,18 +139,22 @@ module.exports = { }, { type: 'category', - label: 'Miscellaneous', - collapsed: false, + label: 'Migration guides', + collapsed: true, collapsible: true, items: [ - 'contributing', - 'telemetry', - 'vision', - 'contact', - 'migrate-from-0-11-to-0-12', - 'migrate-from-0-12-to-0-13', - 'migrate-from-0-13-to-0-14' + 'migration-guides/migrate-from-0-14-to-0-15', + 'migration-guides/migrate-from-0-13-to-0-14', + 'migration-guides/migrate-from-0-12-to-0-13', + 'migration-guides/migrate-from-0-11-to-0-12', ], }, + { + type: 'category', + label: 'Miscellaneous', + collapsed: true, + collapsible: true, + items: ['contributing', 'telemetry', 'vision', 'contact'], + }, ], } From 6c254b11691d75c8cb3a8581ef0c3ce1dd7e6a17 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Mon, 23 Sep 2024 13:05:21 +0200 Subject: [PATCH 02/10] Structure --- .../migrate-from-0-14-to-0-15.md | 47 +++++++++++++++++-- 1 file changed, 43 insertions(+), 4 deletions(-) diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md index 7e2f4c3ee1..48a183e937 100644 --- a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -4,23 +4,34 @@ title: Migration from 0.14.X to 0.15.X ## What's new in 0.15.0? +Wasp 0.15.0 brings some exciting experimental features and upgrades to the existing ones. Let's see what's new. + ### TS SDK for Wasp (preview) -TODO: write this section +TODO: @sodic has to write this part ### Prisma 5 -TODO: write this section +Wasp is now using the latest Prisma 5 version, which brings a lot of performance improvements and new features. + +From the Prisma docs: +> Prisma ORM 5.0.0 introduces a number of changes, including the usage of our new JSON Protocol, which make Prisma Client faster by default. + +This means that your Wasp app will be faster and more reliable with the new Prisma 5 version. ### React Router 6 -TODO: write this section +Wasp also upgraded its React Router version from `5.3.4` to `6.26.2`. This means that we are now using the latest React Router version, which brings up to speed and opens up new possibilities for Wasp e.g. potentially using loaders and actions in the future. + +There are some breaking changes in React Router 6, so you will need to update your app to use the new hooks and components. ## How to migrate? To migrate your app to Wasp 0.15.x, you must: -1. Bump the version in `main.wasp` ... +1. Bump the version in `main.wasp` ... +2. Update the `prisma` version in `package.json` to `5.19.1` +3. Migrate from old React Router 5 APIs to new React Router 6 APIs ### Bump the version @@ -35,6 +46,34 @@ app MyApp { } ``` +### Update your `package.json` file + +Update the `prisma` version in your `package.json` file to `5.19.1`: + +```json title="package.json" +{ + "dependencies": { + "prisma": "5.19.1" + } +} +``` + +### Use latest React Router APIs + +- `useHistory()` -> `useNavigate()` +- `` -> `` +- `props.match.params` -> `useParams()` + +### Update your root component + +- Wasp's root component feature requires rendering `` instead of rendering `children` + +```tsx title="src/App.tsx" +import { Outlet } from 'react-router-dom'; + +... +``` + That's it! You should now be able to run your app with the new Wasp 0.15.0. \ No newline at end of file From 8855848801443b7d4ad917e03b1eb8eb64442920 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Mon, 23 Sep 2024 13:59:01 +0200 Subject: [PATCH 03/10] Update docs --- .../migrate-from-0-14-to-0-15.md | 205 ++++++++++++++++-- 1 file changed, 189 insertions(+), 16 deletions(-) diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md index 48a183e937..7e3b17b4ee 100644 --- a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -4,7 +4,7 @@ title: Migration from 0.14.X to 0.15.X ## What's new in 0.15.0? -Wasp 0.15.0 brings some exciting experimental features and upgrades to the existing ones. Let's see what's new. +Wasp 0.15.0 brings the experimental Typescript SDK and upgrades to some of Wasp's most important dependencies. Let's see what's new. ### TS SDK for Wasp (preview) @@ -12,7 +12,7 @@ TODO: @sodic has to write this part ### Prisma 5 -Wasp is now using the latest Prisma 5 version, which brings a lot of performance improvements and new features. +Wasp is now using the latest Prisma 5, which brings a lot of performance improvements and new features. From the Prisma docs: > Prisma ORM 5.0.0 introduces a number of changes, including the usage of our new JSON Protocol, which make Prisma Client faster by default. @@ -21,7 +21,7 @@ This means that your Wasp app will be faster and more reliable with the new Pris ### React Router 6 -Wasp also upgraded its React Router version from `5.3.4` to `6.26.2`. This means that we are now using the latest React Router version, which brings up to speed and opens up new possibilities for Wasp e.g. potentially using loaders and actions in the future. +Wasp also upgraded its React Router version from `5.3.4` to `6.26.2`. This means that we are now using the latest React Router version, which brings us up to speed and opens up new possibilities for Wasp e.g. potentially using loaders and actions in the future. There are some breaking changes in React Router 6, so you will need to update your app to use the new hooks and components. @@ -29,13 +29,14 @@ There are some breaking changes in React Router 6, so you will need to update yo To migrate your app to Wasp 0.15.x, you must: -1. Bump the version in `main.wasp` ... -2. Update the `prisma` version in `package.json` to `5.19.1` +1. Bump the version in `main.wasp` +2. Update the `package.json` file 3. Migrate from old React Router 5 APIs to new React Router 6 APIs +4. Migrate your client root component -### Bump the version +### 1. Bump the Wasp version -Let's start with something simple. Update the version field in your Wasp file to `^0.15.0`: +Update the version field in your Wasp file to `^0.15.0`: ```wasp title="main.wasp" app MyApp { @@ -46,33 +47,205 @@ app MyApp { } ``` -### Update your `package.json` file +### 2. Update the `package.json` file Update the `prisma` version in your `package.json` file to `5.19.1`: ```json title="package.json" { "dependencies": { + // highlight-next-line "prisma": "5.19.1" - } + } } ``` -### Use latest React Router APIs +### 3. Use the latest React Router APIs + +Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. + +- If you used the `useHistory()` hook, you should now use the `useNavigate()` hook. + + + + + ```tsx title="src/SomePage.tsx" + import { useHistory } from 'react-router-dom'; + + export function SomePage() { + const history = useHistory(); + const handleClick = () => { + // highlight-next-line + history.push('/new-route'); + } + return ( + + ) + } + ``` + + + + ```tsx title="src/SomePage.tsx" + import { useNavigate } from 'react-router-dom'; + + export function SomePage() { + const navigate = useNavigate(); + const handleClick = () => { + // highlight-next-line + navigate('/new-route'); + } + return ( + + ) + } + ``` + + + + Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-navigate#optionsreplace) for more information on the `useNavigate()` hook. + +- If you used the `` component, you should now use the `` component. + + The default behaviour changed from `replace` to `push` in v6, so if you want to keep the old behaviour, you should add the `replace` prop. + + + + + ```tsx title="src/SomePage.tsx" + import { Redirect } from 'react-router-dom'; + + export function SomePage() { + return ( + // highlight-next-line + + ) + } + ``` + + + + ```tsx title="src/SomePage.tsx" + import { Navigate } from 'react-router-dom'; + + export function SomePage() { + return ( + // highlight-next-line + + ) + } + ``` + + + + Check the [React Router 6 docs](https://reactrouter.com/en/main/components/navigate) for more information on the `` component. + +- If you accessed the route params using `props.match.params`, you should now use the `useParams()` hook. + + + + + ```tsx title="src/SomePage.tsx" + import { RouteComponentProps } from 'react-router-dom'; + + export function SomePage(props: RouteComponentProps) { + // highlight-next-line + const { id } = props.match.params; + return ( +
+

Item {id}

+
+ ) + } + ``` +
+ + + ```tsx title="src/SomePage.tsx" + import { useParams } from 'react-router-dom'; + + export function SomePage() { + // highlight-next-line + const { id } = useParams(); + return ( +
+

Item {id}

+
+ ) + } + ``` +
+
+ + Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-params) for more information on the `useParams()` hook. -- `useHistory()` -> `useNavigate()` -- `` -> `` -- `props.match.params` -> `useParams()` +### 4. Update your root component -### Update your root component +- The `client.rootComponent` now requires rendering `` instead the `children` prop. -- Wasp's root component feature requires rendering `` instead of rendering `children` + + + + +```wasp title="main.wasp" +app MyApp { + title: "My app", + // ... + client: { + rootComponent: import { App } from "@src/App.tsx", + } +} +``` + +```tsx title="src/App.tsx" +export function App({ children }: { children: React.ReactNode }) { + return ( +
+
+

My App

+
+ // highlight-next-line + {children} +
+

My App footer

+
+
+ ) +} +``` +
+ + +```wasp title="main.wasp" +app MyApp { + title: "My app", + // ... + client: { + rootComponent: import { App } from "@src/App.tsx", + } +} +``` ```tsx title="src/App.tsx" import { Outlet } from 'react-router-dom'; -... +export function App() { + return ( +
+
+

My App

+
+ // highlight-next-line + +
+

My App footer

+
+
+ ) +} ``` +
+
That's it! From 2df590f5d3e8636681291ef3849a8b72188b140f Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Mon, 23 Sep 2024 14:25:40 +0200 Subject: [PATCH 04/10] Changelog. Redirects --- waspc/ChangeLog.md | 21 +++++++++++++++++++ .../migrate-from-0-11-to-0-12.md | 2 +- web/docusaurus.config.js | 14 +++++++++++++ 3 files changed, 36 insertions(+), 1 deletion(-) diff --git a/waspc/ChangeLog.md b/waspc/ChangeLog.md index 64605414ac..27666a7265 100644 --- a/waspc/ChangeLog.md +++ b/waspc/ChangeLog.md @@ -1,5 +1,26 @@ # Changelog +## 0.15.0 + +### 🎉 New Features + +- Wasp now has experimental support for defining your app in pure Typescript or as we call it the Typescript SDK. +- Wasp upgrades to the latest Prisma verion +- Wasp upgrades to the latest React Router version + +### ⚠️ Breaking Changes + +There are some breaking changes with React Router 6 which will require you to update your code. + +Read more about them in the migration guide: https://wasp-lang.dev/docs/migration-guides/migrate-from-0-14-to-0-15 + +### 🐞 Bug fixes + +- Allow setting a custom server URL when deploying to Fly.io (by @Case-E) +- If the user uses native DB types for the `userEntity`, Wasp will now correctly use them + +Community contributions by @Case-E @therumbler + ## 0.14.2 (2024-09-09) Updated GPT models used in Wasp AI to latest models, since 3.5 are getting deprecated. diff --git a/web/docs/migration-guides/migrate-from-0-11-to-0-12.md b/web/docs/migration-guides/migrate-from-0-11-to-0-12.md index 97ae4b9e91..f3ca373781 100644 --- a/web/docs/migration-guides/migrate-from-0-11-to-0-12.md +++ b/web/docs/migration-guides/migrate-from-0-11-to-0-12.md @@ -642,7 +642,7 @@ You should see the new `Auth`, `AuthIdentity` and `Session` tables in your datab Instead, you can now use `getUsername(user)` to get the username obtained from Username & Password auth method, or `getEmail(user)` to get the email obtained from Email auth method. - Read more about the helpers in the [Accessing User Data](auth/entities#accessing-the-auth-fields) section. + Read more about the helpers in the [Accessing User Data](../auth/entities#accessing-the-auth-fields) section. 1. Finally, **check that your app now fully works as it worked before**. If all the above steps were done correctly, everything should be working now. diff --git a/web/docusaurus.config.js b/web/docusaurus.config.js index f230de6e6e..cbce758f6e 100644 --- a/web/docusaurus.config.js +++ b/web/docusaurus.config.js @@ -228,6 +228,8 @@ module.exports = { }, } }, + // This plugin is always inactive in development and only active in + // production because it works on the build output. [ '@docusaurus/plugin-client-redirects', { @@ -280,6 +282,18 @@ module.exports = { from: '/docs/tutorials/todo-app', to: '/docs/tutorial/create', }, + { + from: '/docs/migrate-from-0-11-to-0-12', + to: '/docs/migration-guides/migrate-from-0-11-to-0-12', + }, + { + from: '/docs/migrate-from-0-12-to-0-13', + to: '/docs/migration-guides/migrate-from-0-12-to-0-13', + }, + { + from: '/docs/migrate-from-0-13-to-0-14', + to: '/docs/migration-guides/migrate-from-0-13-to-0-14' + } ], }, ], From e114bb8c45b0a1a0f2c1f2834abd829bf182b9d4 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Fri, 27 Sep 2024 13:16:05 +0200 Subject: [PATCH 05/10] Add Mailgun note --- waspc/ChangeLog.md | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/waspc/ChangeLog.md b/waspc/ChangeLog.md index 27666a7265..156e583155 100644 --- a/waspc/ChangeLog.md +++ b/waspc/ChangeLog.md @@ -5,8 +5,8 @@ ### 🎉 New Features - Wasp now has experimental support for defining your app in pure Typescript or as we call it the Typescript SDK. -- Wasp upgrades to the latest Prisma verion -- Wasp upgrades to the latest React Router version +- Wasp upgrades to the latest Prisma verion. +- Wasp upgrades to the latest React Router version. ### ⚠️ Breaking Changes @@ -16,8 +16,12 @@ Read more about them in the migration guide: https://wasp-lang.dev/docs/migratio ### 🐞 Bug fixes -- Allow setting a custom server URL when deploying to Fly.io (by @Case-E) -- If the user uses native DB types for the `userEntity`, Wasp will now correctly use them +- Allow setting a custom server URL when deploying to Fly.io. (by @Case-E) +- If the user uses native DB types for the `userEntity`, Wasp will now correctly use them. + +### 🔧 Small improvements + +- Enable users to use Mailgun's EU region by setting the `MAILGUN_API_URL` env variable. Community contributions by @Case-E @therumbler From d23d770d274134d7078a5de037670913a4e15417 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Fri, 27 Sep 2024 13:22:29 +0200 Subject: [PATCH 06/10] Update text --- waspc/ChangeLog.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/waspc/ChangeLog.md b/waspc/ChangeLog.md index 156e583155..f7ff65003c 100644 --- a/waspc/ChangeLog.md +++ b/waspc/ChangeLog.md @@ -4,9 +4,9 @@ ### 🎉 New Features -- Wasp now has experimental support for defining your app in pure Typescript or as we call it the Typescript SDK. -- Wasp upgrades to the latest Prisma verion. -- Wasp upgrades to the latest React Router version. +- Experimental support for defining your app in pure Typescript or as we call it the Typescript SDK. +- Upgrade to the latest Prisma version which makes Wasp faster! +- Upgrade to the latest React Router version which sets us up for some cool new features in the future. ### ⚠️ Breaking Changes @@ -17,7 +17,7 @@ Read more about them in the migration guide: https://wasp-lang.dev/docs/migratio ### 🐞 Bug fixes - Allow setting a custom server URL when deploying to Fly.io. (by @Case-E) -- If the user uses native DB types for the `userEntity`, Wasp will now correctly use them. +- If the user uses native DB types for the `userEntity`, Wasp will use them correctly. ### 🔧 Small improvements From 79a9740d30f5ea099d83f5ce9ba202663d85ec36 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Mon, 30 Sep 2024 18:19:19 +0200 Subject: [PATCH 07/10] NavLink update --- .../migrate-from-0-14-to-0-15.md | 128 +++++++++++++----- 1 file changed, 93 insertions(+), 35 deletions(-) diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md index 7e3b17b4ee..2fb7e213d4 100644 --- a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -15,6 +15,7 @@ TODO: @sodic has to write this part Wasp is now using the latest Prisma 5, which brings a lot of performance improvements and new features. From the Prisma docs: + > Prisma ORM 5.0.0 introduces a number of changes, including the usage of our new JSON Protocol, which make Prisma Client faster by default. This means that your Wasp app will be faster and more reliable with the new Prisma 5 version. @@ -27,12 +28,7 @@ There are some breaking changes in React Router 6, so you will need to update yo ## How to migrate? -To migrate your app to Wasp 0.15.x, you must: - -1. Bump the version in `main.wasp` -2. Update the `package.json` file -3. Migrate from old React Router 5 APIs to new React Router 6 APIs -4. Migrate your client root component +To migrate your Wasp app from 0.14.X to 0.15.X, follow these steps: ### 1. Bump the Wasp version @@ -56,7 +52,7 @@ Update the `prisma` version in your `package.json` file to `5.19.1`: "dependencies": { // highlight-next-line "prisma": "5.19.1" - } + } } ``` @@ -68,38 +64,36 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. - + ```tsx title="src/SomePage.tsx" - import { useHistory } from 'react-router-dom'; + import { useHistory } from 'react-router-dom' export function SomePage() { - const history = useHistory(); + const history = useHistory() const handleClick = () => { // highlight-next-line - history.push('/new-route'); + history.push('/new-route') } - return ( - - ) + return } ``` + - + ```tsx title="src/SomePage.tsx" - import { useNavigate } from 'react-router-dom'; + import { useNavigate } from 'react-router-dom' export function SomePage() { - const navigate = useNavigate(); + const navigate = useNavigate() const handleClick = () => { // highlight-next-line - navigate('/new-route'); + navigate('/new-route') } - return ( - - ) + return } ``` + @@ -111,9 +105,9 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. - + ```tsx title="src/SomePage.tsx" - import { Redirect } from 'react-router-dom'; + import { Redirect } from 'react-router-dom' export function SomePage() { return ( @@ -122,11 +116,12 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. ) } ``` + - + ```tsx title="src/SomePage.tsx" - import { Navigate } from 'react-router-dom'; + import { Navigate } from 'react-router-dom' export function SomePage() { return ( @@ -135,6 +130,7 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. ) } ``` + @@ -144,13 +140,13 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. - + ```tsx title="src/SomePage.tsx" - import { RouteComponentProps } from 'react-router-dom'; + import { RouteComponentProps } from 'react-router-dom' export function SomePage(props: RouteComponentProps) { // highlight-next-line - const { id } = props.match.params; + const { id } = props.match.params return (

Item {id}

@@ -158,15 +154,16 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. ) } ``` + - + ```tsx title="src/SomePage.tsx" - import { useParams } from 'react-router-dom'; + import { useParams } from 'react-router-dom' export function SomePage() { // highlight-next-line - const { id } = useParams(); + const { id } = useParams() return (

Item {id}

@@ -174,19 +171,78 @@ Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. ) } ``` + Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-params) for more information on the `useParams()` hook. +- If you used the `` component and its `isActive` prop to set the active link state, you should now set the `className` prop directly. + + + + + ```tsx title="src/SomePage.tsx" + import { NavLink } from 'react-router-dom' + + export function SomePage() { + return ( + { + return location.pathname === '/new-route' + }} + // highlight-end + className={(isActive) => + cn('text-blue-500', { + underline: isActive, + }) + } + > + Go to new route + + ) + } + ``` + + + + + ```tsx title="src/SomePage.tsx" + import { NavLink, useLocation } from 'react-router-dom' + + export function SomePage() { + // highlight-next-line + const location = useLocation() + return ( + + cn('text-blue-500', { + // highlight-next-line + underline: location.pathname === '/new-route', + }) + } + > + Go to new route + + ) + } + ``` + + + + + Check the [React Router 6 docs](https://reactrouter.com/en/main/components/nav-link#navlink) for more information on the `` component. + ### 4. Update your root component -- The `client.rootComponent` now requires rendering `` instead the `children` prop. +The `client.rootComponent` now requires rendering `` instead the `children` prop. - ```wasp title="main.wasp" app MyApp { title: "My app", @@ -213,6 +269,7 @@ export function App({ children }: { children: React.ReactNode }) { ) } ``` + @@ -227,7 +284,7 @@ app MyApp { ``` ```tsx title="src/App.tsx" -import { Outlet } from 'react-router-dom'; +import { Outlet } from 'react-router-dom' export function App() { return ( @@ -244,9 +301,10 @@ export function App() { ) } ``` + That's it! -You should now be able to run your app with the new Wasp 0.15.0. \ No newline at end of file +You should now be able to run your app with the new Wasp 0.15.0. From b328acd5c8b28cb587ada1a974d4ea44878de14e Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Tue, 1 Oct 2024 14:04:59 +0200 Subject: [PATCH 08/10] Update docs --- .../migrate-from-0-14-to-0-15.md | 308 +++++++++--------- 1 file changed, 155 insertions(+), 153 deletions(-) diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md index 2fb7e213d4..bb0f535fe2 100644 --- a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -45,196 +45,198 @@ app MyApp { ### 2. Update the `package.json` file -Update the `prisma` version in your `package.json` file to `5.19.1`: +1. Update the `prisma` version in your `package.json` file to `5.19.1`: -```json title="package.json" -{ - "dependencies": { - // highlight-next-line - "prisma": "5.19.1" - } -} -``` + ```json title="package.json" + { + "dependencies": { + // highlight-next-line + "prisma": "5.19.1" + } + } + ``` + +1. If you have `@types/react-router-dom` in your `package.json`, you can remove it as it is no longer needed. ### 3. Use the latest React Router APIs -Update the usage of the old React Router 5 APIs to the new React Router 6 APIs. +Update the usage of the old React Router 5 APIs to the new React Router 6 APIs: -- If you used the `useHistory()` hook, you should now use the `useNavigate()` hook. +1. If you used the `useHistory()` hook, you should now use the `useNavigate()` hook. - - + + - ```tsx title="src/SomePage.tsx" - import { useHistory } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { useHistory } from 'react-router-dom' - export function SomePage() { - const history = useHistory() - const handleClick = () => { - // highlight-next-line - history.push('/new-route') + export function SomePage() { + const history = useHistory() + const handleClick = () => { + // highlight-next-line + history.push('/new-route') + } + return } - return - } - ``` + ``` - - + + - ```tsx title="src/SomePage.tsx" - import { useNavigate } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { useNavigate } from 'react-router-dom' - export function SomePage() { - const navigate = useNavigate() - const handleClick = () => { - // highlight-next-line - navigate('/new-route') + export function SomePage() { + const navigate = useNavigate() + const handleClick = () => { + // highlight-next-line + navigate('/new-route') + } + return } - return - } - ``` + ``` - - + + - Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-navigate#optionsreplace) for more information on the `useNavigate()` hook. + Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-navigate#optionsreplace) for more information on the `useNavigate()` hook. -- If you used the `` component, you should now use the `` component. +1. If you used the `` component, you should now use the `` component. - The default behaviour changed from `replace` to `push` in v6, so if you want to keep the old behaviour, you should add the `replace` prop. + The default behaviour changed from `replace` to `push` in v6, so if you want to keep the old behaviour, you should add the `replace` prop. - - + + - ```tsx title="src/SomePage.tsx" - import { Redirect } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { Redirect } from 'react-router-dom' - export function SomePage() { - return ( - // highlight-next-line - - ) - } - ``` + export function SomePage() { + return ( + // highlight-next-line + + ) + } + ``` - - + + - ```tsx title="src/SomePage.tsx" - import { Navigate } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { Navigate } from 'react-router-dom' - export function SomePage() { - return ( - // highlight-next-line - - ) - } - ``` + export function SomePage() { + return ( + // highlight-next-line + + ) + } + ``` - - + + - Check the [React Router 6 docs](https://reactrouter.com/en/main/components/navigate) for more information on the `` component. + Check the [React Router 6 docs](https://reactrouter.com/en/main/components/navigate) for more information on the `` component. -- If you accessed the route params using `props.match.params`, you should now use the `useParams()` hook. +1. If you accessed the route params using `props.match.params`, you should now use the `useParams()` hook. - - + + - ```tsx title="src/SomePage.tsx" - import { RouteComponentProps } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { RouteComponentProps } from 'react-router-dom' - export function SomePage(props: RouteComponentProps) { - // highlight-next-line - const { id } = props.match.params - return ( -
-

Item {id}

-
- ) - } - ``` + export function SomePage(props: RouteComponentProps) { + // highlight-next-line + const { id } = props.match.params + return ( +
+

Item {id}

+
+ ) + } + ``` -
- + + - ```tsx title="src/SomePage.tsx" - import { useParams } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { useParams } from 'react-router-dom' - export function SomePage() { - // highlight-next-line - const { id } = useParams() - return ( -
-

Item {id}

-
- ) - } - ``` - -
-
- - Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-params) for more information on the `useParams()` hook. - -- If you used the `` component and its `isActive` prop to set the active link state, you should now set the `className` prop directly. - - - - - ```tsx title="src/SomePage.tsx" - import { NavLink } from 'react-router-dom' - - export function SomePage() { - return ( - { - return location.pathname === '/new-route' - }} - // highlight-end - className={(isActive) => - cn('text-blue-500', { - underline: isActive, - }) - } - > - Go to new route - - ) - } - ``` + export function SomePage() { + // highlight-next-line + const { id } = useParams() + return ( +
+

Item {id}

+
+ ) + } + ``` + +
+
+ + Check the [React Router 6 docs](https://reactrouter.com/en/main/hooks/use-params) for more information on the `useParams()` hook. + +1. If you used the `` component and its `isActive` prop to set the active link state, you should now set the `className` prop directly. + + + + + ```tsx title="src/SomePage.tsx" + import { NavLink } from 'react-router-dom' + + export function SomePage() { + return ( + { + return location.pathname === '/new-route' + }} + // highlight-end + className={(isActive) => + cn('text-blue-500', { + underline: isActive, + }) + } + > + Go to new route + + ) + } + ``` - - + + - ```tsx title="src/SomePage.tsx" - import { NavLink, useLocation } from 'react-router-dom' + ```tsx title="src/SomePage.tsx" + import { NavLink, useLocation } from 'react-router-dom' - export function SomePage() { - // highlight-next-line - const location = useLocation() - return ( - - cn('text-blue-500', { - // highlight-next-line - underline: location.pathname === '/new-route', - }) - } - > - Go to new route - - ) - } - ``` + export function SomePage() { + // highlight-next-line + const location = useLocation() + return ( + + cn('text-blue-500', { + // highlight-next-line + underline: location.pathname === '/new-route', + }) + } + > + Go to new route + + ) + } + ``` - - +
+
- Check the [React Router 6 docs](https://reactrouter.com/en/main/components/nav-link#navlink) for more information on the `` component. + Check the [React Router 6 docs](https://reactrouter.com/en/main/components/nav-link#navlink) for more information on the `` component. ### 4. Update your root component From d0358b4c0b2419d88571481ca997cdb2e5f74d66 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Wed, 2 Oct 2024 11:25:47 +0200 Subject: [PATCH 09/10] Update ChangeLog.md --- waspc/ChangeLog.md | 1 + 1 file changed, 1 insertion(+) diff --git a/waspc/ChangeLog.md b/waspc/ChangeLog.md index f7ff65003c..c37965aa78 100644 --- a/waspc/ChangeLog.md +++ b/waspc/ChangeLog.md @@ -22,6 +22,7 @@ Read more about them in the migration guide: https://wasp-lang.dev/docs/migratio ### 🔧 Small improvements - Enable users to use Mailgun's EU region by setting the `MAILGUN_API_URL` env variable. +- Validate `userEntity` ID field's `@default` attribute. Community contributions by @Case-E @therumbler From d36277be3a8914fa486be081cf11f5e0dc82f980 Mon Sep 17 00:00:00 2001 From: Mihovil Ilakovac Date: Wed, 2 Oct 2024 16:35:23 +0200 Subject: [PATCH 10/10] Remove mentions of TS SDK --- waspc/ChangeLog.md | 1 - web/docs/migration-guides/migrate-from-0-14-to-0-15.md | 6 +----- 2 files changed, 1 insertion(+), 6 deletions(-) diff --git a/waspc/ChangeLog.md b/waspc/ChangeLog.md index c37965aa78..7cc4ab7cf6 100644 --- a/waspc/ChangeLog.md +++ b/waspc/ChangeLog.md @@ -4,7 +4,6 @@ ### 🎉 New Features -- Experimental support for defining your app in pure Typescript or as we call it the Typescript SDK. - Upgrade to the latest Prisma version which makes Wasp faster! - Upgrade to the latest React Router version which sets us up for some cool new features in the future. diff --git a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md index bb0f535fe2..f618396df8 100644 --- a/web/docs/migration-guides/migrate-from-0-14-to-0-15.md +++ b/web/docs/migration-guides/migrate-from-0-14-to-0-15.md @@ -4,11 +4,7 @@ title: Migration from 0.14.X to 0.15.X ## What's new in 0.15.0? -Wasp 0.15.0 brings the experimental Typescript SDK and upgrades to some of Wasp's most important dependencies. Let's see what's new. - -### TS SDK for Wasp (preview) - -TODO: @sodic has to write this part +Wasp 0.15.0 brings upgrades to some of Wasp's most important dependencies. Let's see what's new. ### Prisma 5