fix(vue-query-app): update sample

Author: Marcel-G

samples/vue-query/orval.config.ts

@@ -9,6 +9,7 @@ export default defineConfig({
       schemas: 'src/api/model',
       client: 'vue-query',
       mock: true,
+      prettier: true,
       override: {
         mutator: {
           path: './src/api/mutator/custom-instance.ts',

samples/vue-query/package.json

@@ -18,6 +18,7 @@
     "@vue/compiler-sfc": "3.2.36",
     "msw": "^0.32.0",
     "orval": "link:../../packages/orval/dist",
+    "prettier": "^3.0.3",
     "typescript": "^4.3.2",
     "vite": "^2.4.2",
     "vue-tsc": "^0.0.24"

samples/vue-query/src/App.vue

@@ -4,6 +4,7 @@
       <img src="./assets/logo.svg" class="App-logo" alt="logo" />
       <Pet
         v-if="selectedPetId"
+        :key="selectedPetId"
         :pet-id="selectedPetId"
         :id="'selected-pet-' + selectedPetId"
       />

samples/vue-query/src/api/endpoints/petstoreFromFileSpecWithTransformer.ts

@@ -38,8 +38,11 @@ export const listPets = (
   version = 1,
   signal?: AbortSignal,
 ) => {
+  params = unref(params);
+  version = unref(version);
+
   return customInstance<Pets>({
-    url: `/v${unref(version)}/pets`,
+    url: `/v${version}/pets`,
     method: 'get',
     params,
     signal,
@@ -49,7 +52,11 @@ export const listPets = (
 export const getListPetsQueryKey = (
   params?: MaybeRef<ListPetsParams>,
   version = 1,
-) => ['v', version, 'pets', ...(params ? [params] : [])] as const;
+) => {
+  params = unref(params);
+  version = unref(version);
+  return [`/v${version}/pets`, ...(params ? [params] : [])] as const;
+};
 
 export const getListPetsInfiniteQueryOptions = <
   TData = Awaited<ReturnType<typeof listPets>>,
@@ -184,8 +191,11 @@ export const createPets = (
   createPetsBody: MaybeRef<CreatePetsBody>,
   version = 1,
 ) => {
+  createPetsBody = unref(createPetsBody);
+  version = unref(version);
+
   return customInstance<Pet>({
-    url: `/v${unref(version)}/pets`,
+    url: `/v${version}/pets`,
     method: 'post',
     headers: { 'Content-Type': 'application/json' },
     data: createPetsBody,
@@ -252,15 +262,24 @@ export const showPetById = (
   version = 1,
   signal?: AbortSignal,
 ) => {
+  petId = unref(petId);
+  version = unref(version);
+
   return customInstance<Pet>({
-    url: `/v${unref(version)}/pets/${unref(petId)}`,
+    url: `/v${version}/pets/${petId}`,
     method: 'get',
     signal,
   });
 };
 
-export const getShowPetByIdQueryKey = (petId: MaybeRef<string>, version = 1) =>
-  ['v', version, 'pets', petId] as const;
+export const getShowPetByIdQueryKey = (
+  petId: MaybeRef<string>,
+  version = 1,
+) => {
+  petId = unref(petId);
+  version = unref(version);
+  return [`/v${version}/pets/${petId}`] as const;
+};
 
 export const getShowPetByIdInfiniteQueryOptions = <
   TData = Awaited<ReturnType<typeof showPetById>>,

samples/vue-query/yarn.lock

@@ -835,6 +835,11 @@ postcss@^8.1.10, postcss@^8.3.5:
     nanoid "^3.1.23"
     source-map-js "^0.6.2"
 
+prettier@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.0.3.tgz#432a51f7ba422d1469096c0fdc28e235db8f9643"
+  integrity sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==
+
 process-nextick-args@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"