From e27fb3460da4692f92200eb7cf9ac1e641b82a89 Mon Sep 17 00:00:00 2001 From: "Khoa Chau (Finn)" <70827148+chaukhoa97@users.noreply.github.com> Date: Fri, 25 Nov 2022 23:16:31 +0700 Subject: [PATCH 1/3] Update the HTTP status code I think it is more right to be 403 instead of 401 according to MDN. --- docs/tutorials/jokes.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/tutorials/jokes.md b/docs/tutorials/jokes.md index dba05ae5d7b..29656f73fa4 100644 --- a/docs/tutorials/jokes.md +++ b/docs/tutorials/jokes.md @@ -4631,7 +4631,7 @@ Awesome! We're ready to handle errors and it didn't complicate our happy path on Oh, and don't you love how just like with the `ErrorBoundary`, it's all contextual? So the rest of the app continues to function just as well. Another point for user experience 💪 -You know what, while we're adding catch boundaries. Why don't we improve the `app/routes/jokes/$jokeId.tsx` route a bit by allowing users to delete the joke if they own it. If they don't, we can give them a 401 error in the catch boundary. +You know what, while we're adding catch boundaries. Why don't we improve the `app/routes/jokes/$jokeId.tsx` route a bit by allowing users to delete the joke if they own it. If they don't, we can give them a 403 error in the catch boundary. Unlike the 401 when the user needs to log in first, the 403 error means that although the user has been logged in, what he just attempt is forbidden (delete a joke that is not his). One thing to keep in mind with `delete` is that HTML forms only support `method="get"` and `method="post"`. They don't support `method="delete"`. So to make sure our form will work with and without JavaScript, it's a good idea to do something like this: From ba762314b20f972fca5db58e1cd2a276748b84d7 Mon Sep 17 00:00:00 2001 From: "Khoa Chau (Finn)" <70827148+chaukhoa97@users.noreply.github.com> Date: Fri, 25 Nov 2022 23:19:09 +0700 Subject: [PATCH 2/3] Update contributors.yml --- contributors.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/contributors.yml b/contributors.yml index fc860ea2850..14be49ef5b6 100644 --- a/contributors.yml +++ b/contributors.yml @@ -453,3 +453,4 @@ - zachdtaylor - zainfathoni - zhe +- chaukhoa97 From 03dd0ad345a03002a5fa51cbae3dcdc80536773b Mon Sep 17 00:00:00 2001 From: "Khoa Chau (Finn)" <70827148+chaukhoa97@users.noreply.github.com> Date: Sat, 26 Nov 2022 01:06:33 +0700 Subject: [PATCH 3/3] Replace all 401 to 403 if user is not the owner --- docs/tutorials/jokes.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/docs/tutorials/jokes.md b/docs/tutorials/jokes.md index 29656f73fa4..b7f773e9444 100644 --- a/docs/tutorials/jokes.md +++ b/docs/tutorials/jokes.md @@ -4631,7 +4631,7 @@ Awesome! We're ready to handle errors and it didn't complicate our happy path on Oh, and don't you love how just like with the `ErrorBoundary`, it's all contextual? So the rest of the app continues to function just as well. Another point for user experience 💪 -You know what, while we're adding catch boundaries. Why don't we improve the `app/routes/jokes/$jokeId.tsx` route a bit by allowing users to delete the joke if they own it. If they don't, we can give them a 403 error in the catch boundary. Unlike the 401 when the user needs to log in first, the 403 error means that although the user has been logged in, what he just attempt is forbidden (delete a joke that is not his). +You know what, while we're adding catch boundaries. Why don't we improve the `app/routes/jokes/$jokeId.tsx` route a bit by allowing users to delete the joke if they own it. If they don't, we can give them a 403 error in the catch boundary. One thing to keep in mind with `delete` is that HTML forms only support `method="get"` and `method="post"`. They don't support `method="delete"`. So to make sure our form will work with and without JavaScript, it's a good idea to do something like this: @@ -4708,7 +4708,7 @@ export const action: ActionFunction = async ({ throw new Response( "Pssh, nice try. That's not your joke", { - status: 401, + status: 403, } ); } @@ -4756,7 +4756,7 @@ export function CatchBoundary() { ); } - case 401: { + case 403: { return (
Sorry, but {params.jokeId} is not your joke. @@ -4852,7 +4852,7 @@ export const action: ActionFunction = async ({ throw new Response( "Pssh, nice try. That's not your joke", { - status: 401, + status: 403, } ); } @@ -4902,7 +4902,7 @@ export function CatchBoundary() {
); } - case 401: { + case 403: { return (
Sorry, but {params.jokeId} is not your joke.