Skip to content

Commit

Permalink
refactor: replace react-query by swr
Browse files Browse the repository at this point in the history
  • Loading branch information
@julienc91
julienc91 committed Oct 15, 2023
1 parent 641baa5 commit acac96a
Show file tree
Hide file tree
Showing 7 changed files with 77 additions and 126 deletions.
27 changes: 0 additions & 27 deletions hooks/article.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
import { useMutation } from "react-query";

import { ArticleId, EncodedArticle } from "@caviardeul/types";
import { BASE_URL } from "@caviardeul/utils/config";

Expand Down Expand Up @@ -34,28 +32,3 @@ export const getEncodedArticle = (
};
});
};

export const useCreateCustomGame = () => {
return useMutation(
(pageId: string) => {
return fetch(`${BASE_URL}/api/articles/custom`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ pageId }),
})
.then((res) => res.json())
.then((res) => {
if (res.error) {
throw res.error;
}
const { articleId, pageName } = res;
return { articleId, pageName };
});
},
{
retry: false,
},
);
};
41 changes: 41 additions & 0 deletions lib/queries.ts
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,19 @@
import useSWRMutation from "swr/mutation";

import { ArticleId } from "@caviardeul/types";
import { BASE_URL } from "@caviardeul/utils/config";

class APIError extends Error {
status: number;
details: any;

constructor(status: number, details: any) {
super("API Call error");
this.status = status;
this.details = details;
}
}

export const saveGameScore = (
articleId: ArticleId,
custom: boolean,
Expand All @@ -15,3 +28,31 @@ export const saveGameScore = (
},
});
};

const sendRequest = async (endpoint: string, { arg }: any) => {
const response = await fetch(`${BASE_URL}/${endpoint}`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(arg),
});

if (!response.ok) {
const status = response.status;
const details = await response.json();
throw new APIError(status, details);
}

return response.json();
};

export const useCreateCustomGame = () => {
const sender = async (
endpoint: string,
{ arg }: { arg: { pageId: string } },
): Promise<{ articleId: string; pageName: string }> => {
return await sendRequest(endpoint, { arg });
};
return useSWRMutation(`api/articles/custom`, sender, { throwOnError: false });
};
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
"react-dom": "^18.1.0",
"react-icons": "^4.6.0",
"react-markdown": "^9.0.0",
"react-query": "^3.39.0",
"swr": "^2.2.4",
"turndown": "^7.1.2"
},
"//": "https://github.com/mixmark-io/turndown/issues/378",
Expand Down
11 changes: 3 additions & 8 deletions pages/_app.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,14 @@
import type { AppProps } from "next/app";
import { QueryClient, QueryClientProvider } from "react-query";

import Layout from "@caviardeul/components/layout";

import "../styles/style.scss";

const queryClient = new QueryClient();

const Caviardeul = ({ Component, pageProps }: AppProps) => {
return (
<QueryClientProvider client={queryClient}>
<Layout>
<Component {...pageProps} />
</Layout>
</QueryClientProvider>
<Layout>
<Component {...pageProps} />
</Layout>
);
};

Expand Down
25 changes: 15 additions & 10 deletions pages/custom/nouveau.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,7 @@ import { useRouter } from "next/router";
import React, { FormEvent, useCallback, useState } from "react";

import Loader from "@caviardeul/components/utils/loader";
import { useCreateCustomGame } from "@caviardeul/hooks/article";
import { CustomGameCreation } from "@caviardeul/types";
import { useCreateCustomGame } from "@caviardeul/lib/queries";
import { copyToClipboard } from "@caviardeul/utils/clipboard";
import { BASE_URL } from "@caviardeul/utils/config";

Expand Down Expand Up @@ -45,7 +44,13 @@ const NewCustomGame: React.FC = () => {
);

const handleSubmissionCreated = useCallback(
async ({ articleId, pageName }: CustomGameCreation) => {
async ({
articleId,
pageName,
}: {
articleId: string;
pageName: string;
}) => {
setArticleId(articleId);
setPageName(pageName);
await handleCopyToClipboard(gameUrl);
Expand All @@ -56,12 +61,12 @@ const NewCustomGame: React.FC = () => {
const handleSubmit = useCallback(
(event: FormEvent) => {
event.preventDefault();
if (gameId) {
if (gameId || !pageId) {
return;
}
mutation.mutate(pageId, {
onSuccess: handleSubmissionCreated,
});
mutation
.trigger({ pageId })
.then((param) => param && handleSubmissionCreated(param));
},
[gameId, handleSubmissionCreated, mutation, pageId],
);
Expand Down Expand Up @@ -104,12 +109,12 @@ const NewCustomGame: React.FC = () => {
</label>
<input
type="submit"
disabled={!pageId.length || mutation.isLoading || !!gameId}
disabled={!pageId.length || mutation.isMutating || !!gameId}
value="Créer"
/>
</p>
{mutation.isLoading && <Loader />}
{mutation.isError && (
{mutation.isMutating && <Loader />}
{mutation.error && (
<p>
Impossibe de créer une partie personnalisée à partir de cet
article.
Expand Down
5 changes: 0 additions & 5 deletions types/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,11 +42,6 @@ export type ArticleInfo = {
stats: ArticleInfoStats;
};

export type CustomGameCreation = {
articleId: string;
pageName: string;
};

export type History = [string, number][];

export type GameState = {
Expand Down
92 changes: 17 additions & 75 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.0.tgz#da950e622420bf96ca0d0f2909cdddac3acd8719"
integrity sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==

"@babel/runtime@^7.12.5", "@babel/runtime@^7.20.7", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2":
"@babel/runtime@^7.20.7":
version "7.23.2"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.2.tgz#062b0ac103261d68a966c4c7baf2ae3e62ec3885"
integrity sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==
Expand Down Expand Up @@ -676,7 +676,7 @@ balanced-match@^1.0.0:
resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==

big-integer@^1.6.16, big-integer@^1.6.44:
big-integer@^1.6.44:
version "1.6.51"
resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.51.tgz#0df92a5d9880560d3ff2d5fd20245c889d130686"
integrity sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==
Expand Down Expand Up @@ -713,20 +713,6 @@ braces@^3.0.2, braces@~3.0.2:
dependencies:
fill-range "^7.0.1"

broadcast-channel@^3.4.1:
version "3.7.0"
resolved "https://registry.yarnpkg.com/broadcast-channel/-/broadcast-channel-3.7.0.tgz#2dfa5c7b4289547ac3f6705f9c00af8723889937"
integrity sha512-cIAKJXAxGJceNZGTZSBzMxzyOn72cVgPnKx4dc6LRjQgbaJUQqhy5rzL3zbMxkMWsGKkv2hSFkPRMEXfoMZ2Mg==
dependencies:
"@babel/runtime" "^7.7.2"
detect-node "^2.1.0"
js-sha3 "0.8.0"
microseconds "0.2.0"
nano-time "1.0.0"
oblivious-set "1.0.0"
rimraf "3.0.2"
unload "2.2.0"

bundle-name@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/bundle-name/-/bundle-name-3.0.0.tgz#ba59bcc9ac785fb67ccdbf104a2bf60c099f0e1a"
Expand Down Expand Up @@ -796,7 +782,7 @@ character-entities@^2.0.0:
optionalDependencies:
fsevents "~2.3.2"

client-only@0.0.1:
client-only@0.0.1, client-only@^0.0.1:
version "0.0.1"
resolved "https://registry.yarnpkg.com/client-only/-/client-only-0.0.1.tgz#38bba5d403c41ab150bff64a95c85013cf73bca1"
integrity sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==
Expand Down Expand Up @@ -961,11 +947,6 @@ dequal@^2.0.0, dequal@^2.0.3:
resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==

detect-node@^2.0.4, detect-node@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.1.0.tgz#c9c70775a49c3d03bc2c06d9a73be550f978f8b1"
integrity sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==

devlop@^1.0.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/devlop/-/devlop-1.1.0.tgz#4db7c2ca4dc6e0e834c30be70c94bbc976dc7018"
Expand Down Expand Up @@ -2003,11 +1984,6 @@ javascript-natural-sort@0.7.1:
resolved "https://registry.yarnpkg.com/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz#f9e2303d4507f6d74355a73664d1440fb5a0ef59"
integrity sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==

js-sha3@0.8.0:
version "0.8.0"
resolved "https://registry.yarnpkg.com/js-sha3/-/js-sha3-0.8.0.tgz#b9b7a5da73afad7dedd0f8c463954cbde6818840"
integrity sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==

"js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
Expand Down Expand Up @@ -2120,14 +2096,6 @@ lru-cache@^6.0.0:
dependencies:
yallist "^4.0.0"

match-sorter@^6.0.2:
version "6.3.1"
resolved "https://registry.yarnpkg.com/match-sorter/-/match-sorter-6.3.1.tgz#98cc37fda756093424ddf3cbc62bfe9c75b92bda"
integrity sha512-mxybbo3pPNuA+ZuCUhm5bwNkXrJTbsk5VWbR5wiwz/GC6LIiegBGn2w3O08UG/jdbYLinw51fSQ5xNU1U3MgBw==
dependencies:
"@babel/runtime" "^7.12.5"
remove-accents "0.4.2"

mdast-util-from-markdown@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/mdast-util-from-markdown/-/mdast-util-from-markdown-2.0.0.tgz#52f14815ec291ed061f2922fd14d6689c810cb88"
Expand Down Expand Up @@ -2379,11 +2347,6 @@ micromatch@^4.0.4:
braces "^3.0.2"
picomatch "^2.3.1"

microseconds@0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/microseconds/-/microseconds-0.2.0.tgz#233b25f50c62a65d861f978a4a4f8ec18797dc39"
integrity sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==

mimic-fn@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b"
Expand Down Expand Up @@ -2416,13 +2379,6 @@ ms@^2.1.1:
resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==

nano-time@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/nano-time/-/nano-time-1.0.0.tgz#b0554f69ad89e22d0907f7a12b0993a5d96137ef"
integrity sha512-flnngywOoQ0lLQOTRNexn2gGSNuM9bKj9RZAWSzhQ+UJYaAFG9bac4DW9VHjUAzrOaIcajHybCTHe/bkvozQqA==
dependencies:
big-integer "^1.6.16"

nanoid@^3.3.4:
version "3.3.6"
resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
Expand Down Expand Up @@ -2566,11 +2522,6 @@ object.values@^1.1.6:
define-properties "^1.2.0"
es-abstract "^1.22.1"

oblivious-set@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/oblivious-set/-/oblivious-set-1.0.0.tgz#c8316f2c2fb6ff7b11b6158db3234c49f733c566"
integrity sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==

once@^1.3.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
Expand Down Expand Up @@ -2772,15 +2723,6 @@ react-markdown@^9.0.0:
unist-util-visit "^5.0.0"
vfile "^6.0.0"

react-query@^3.39.0:
version "3.39.3"
resolved "https://registry.yarnpkg.com/react-query/-/react-query-3.39.3.tgz#4cea7127c6c26bdea2de5fb63e51044330b03f35"
integrity sha512-nLfLz7GiohKTJDuT4us4X3h/8unOh+00MLb2yJoGTPjxKs2bc1iDhkNx2bd5MKklXnOD3NrVZ+J2UXujA5In4g==
dependencies:
"@babel/runtime" "^7.5.5"
broadcast-channel "^3.4.1"
match-sorter "^6.0.2"

react@^18.1.0:
version "18.2.0"
resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"
Expand Down Expand Up @@ -2842,11 +2784,6 @@ remark-rehype@^11.0.0:
unified "^11.0.0"
vfile "^6.0.0"

remove-accents@0.4.2:
version "0.4.2"
resolved "https://registry.yarnpkg.com/remove-accents/-/remove-accents-0.4.2.tgz#0a43d3aaae1e80db919e07ae254b285d9e1c7bb5"
integrity sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==

resolve-from@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
Expand Down Expand Up @@ -2880,7 +2817,7 @@ reusify@^1.0.4:
resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==

rimraf@3.0.2, rimraf@^3.0.2:
rimraf@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a"
integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
Expand Down Expand Up @@ -3110,6 +3047,14 @@ supports-preserve-symlinks-flag@^1.0.0:
resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==

swr@^2.2.4:
version "2.2.4"
resolved "https://registry.yarnpkg.com/swr/-/swr-2.2.4.tgz#03ec4c56019902fbdc904d78544bd7a9a6fa3f07"
integrity sha512-njiZ/4RiIhoOlAaLYDqwz5qH/KZXVilRLvomrx83HjzCWTfa+InyfAjv05PSFxnmLzZkNO9ZfvgoqzAaEI4sGQ==
dependencies:
client-only "^0.0.1"
use-sync-external-store "^1.2.0"

synckit@^0.8.5:
version "0.8.5"
resolved "https://registry.yarnpkg.com/synckit/-/synckit-0.8.5.tgz#b7f4358f9bb559437f9f167eb6bc46b3c9818fa3"
Expand Down Expand Up @@ -3304,14 +3249,6 @@ unist-util-visit@^5.0.0:
unist-util-is "^6.0.0"
unist-util-visit-parents "^6.0.0"

unload@2.2.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/unload/-/unload-2.2.0.tgz#ccc88fdcad345faa06a92039ec0f80b488880ef7"
integrity sha512-B60uB5TNBLtN6/LsgAf3udH9saB5p7gqJwcFfbOEZ8BcBHnGwCf6G/TGiEqkRAxX7zAFIUtzdrXQSdL3Q/wqNA==
dependencies:
"@babel/runtime" "^7.6.2"
detect-node "^2.0.4"

untildify@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b"
Expand All @@ -3324,6 +3261,11 @@ uri-js@^4.2.2:
dependencies:
punycode "^2.1.0"

use-sync-external-store@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==

vfile-message@^4.0.0:
version "4.0.2"
resolved "https://registry.yarnpkg.com/vfile-message/-/vfile-message-4.0.2.tgz#c883c9f677c72c166362fd635f21fc165a7d1181"
Expand Down

1 comment on commit acac96a

@vercel
Copy link

@vercel vercel bot commented on acac96a Oct 15, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

caviardeul – ./

caviardeul-julienc91.vercel.app
caviardeul-git-main-julienc91.vercel.app
caviardeul.vercel.app
www.caviardeul.fr
caviardeul.fr
caviardeul.julienc.io

Please sign in to comment.