Fix prettier

TanStack · May 31, 2023 · 104e852 · 104e852
1 parent f1d9242
commit 104e852
Show file tree

Hide file tree

Showing 9 changed files with 161 additions and 161 deletions.
diff --git a/examples/react/basic-graphql-request/src/index.jsx b/examples/react/basic-graphql-request/src/index.jsx
@@ -1,29 +1,29 @@
 /* eslint-disable jsx-a11y/anchor-is-valid */
-import React from "react";
-import ReactDOM from "react-dom/client";
+import React from 'react'
+import ReactDOM from 'react-dom/client'
 import {
   useQuery,
   useQueryClient,
   QueryClient,
   QueryClientProvider,
-} from "@tanstack/react-query";
-import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
-import { request, gql } from "graphql-request";
+} from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
+import { request, gql } from 'graphql-request'
 
-const endpoint = "https://graphqlzero.almansi.me/api";
+const endpoint = 'https://graphqlzero.almansi.me/api'
 
-const queryClient = new QueryClient();
+const queryClient = new QueryClient()
 
 function App() {
-  const [postId, setPostId] = React.useState(-1);
+  const [postId, setPostId] = React.useState(-1)
 
   return (
     <QueryClientProvider client={queryClient}>
       <p>
         As you visit the posts below, you will notice them in a loading state
         the first time you load them. However, after you return to this list and
         click on any posts you have already visited again, you will see them
-        load instantly and background refresh right before your eyes!{" "}
+        load instantly and background refresh right before your eyes!{' '}
         <strong>
           (You may need to throttle your network speed to simulate longer
           loading sequences)
@@ -36,12 +36,12 @@ function App() {
       )}
       <ReactQueryDevtools initialIsOpen />
     </QueryClientProvider>
-  );
+  )
 }
 
 function usePosts() {
   return useQuery({
-    queryKey: ["posts"],
+    queryKey: ['posts'],
     queryFn: async () => {
       const {
         posts: { data },
@@ -56,24 +56,24 @@ function usePosts() {
               }
             }
           }
-        `
-      );
-      return data;
+        `,
+      )
+      return data
     },
-  });
+  })
 }
 
 function Posts({ setPostId }) {
-  const queryClient = useQueryClient();
-  const { status, data, error, isFetching } = usePosts();
+  const queryClient = useQueryClient()
+  const { status, data, error, isFetching } = usePosts()
 
   return (
     <div>
       <h1>Posts</h1>
       <div>
-        {status === "pending" ? (
-          "Loading..."
-        ) : status === "error" ? (
+        {status === 'pending' ? (
+          'Loading...'
+        ) : status === 'error' ? (
           <span>Error: {error.message}</span>
         ) : (
           <>
@@ -86,10 +86,10 @@ function Posts({ setPostId }) {
                     style={
                       // We can find the existing query data here to show bold links for
                       // ones that are cached
-                      queryClient.getQueryData(["post", post.id])
+                      queryClient.getQueryData(['post', post.id])
                         ? {
-                            fontWeight: "bold",
-                            color: "green",
+                            fontWeight: 'bold',
+                            color: 'green',
                           }
                         : {}
                     }
@@ -99,17 +99,17 @@ function Posts({ setPostId }) {
                 </p>
               ))}
             </div>
-            <div>{isFetching ? "Background Updating..." : " "}</div>
+            <div>{isFetching ? 'Background Updating...' : ' '}</div>
           </>
         )}
       </div>
     </div>
-  );
+  )
 }
 
 function usePost(postId) {
   return useQuery(
-    ["post", postId],
+    ['post', postId],
     async () => {
       const { post } = await request(
         endpoint,
@@ -121,19 +121,19 @@ function usePost(postId) {
             body
           }
         }
-        `
-      );
+        `,
+      )
 
-      return post;
+      return post
     },
     {
       enabled: !!postId,
-    }
-  );
+    },
+  )
 }
 
 function Post({ postId, setPostId }) {
-  const { status, data, error, isFetching } = usePost(postId);
+  const { status, data, error, isFetching } = usePost(postId)
 
   return (
     <div>
@@ -142,22 +142,22 @@ function Post({ postId, setPostId }) {
           Back
         </a>
       </div>
-      {!postId || status === "pending" ? (
-        "Loading..."
-      ) : status === "error" ? (
+      {!postId || status === 'pending' ? (
+        'Loading...'
+      ) : status === 'error' ? (
         <span>Error: {error.message}</span>
       ) : (
         <>
           <h1>{data.title}</h1>
           <div>
             <p>{data.body}</p>
           </div>
-          <div>{isFetching ? "Background Updating..." : " "}</div>
+          <div>{isFetching ? 'Background Updating...' : ' '}</div>
         </>
       )}
     </div>
-  );
+  )
 }
 
-const rootElement = document.getElementById("root");
-ReactDOM.createRoot(rootElement).render(<App />);
+const rootElement = document.getElementById('root')
+ReactDOM.createRoot(rootElement).render(<App />)
diff --git a/examples/react/basic/src/index.jsx b/examples/react/basic/src/index.jsx
@@ -1,27 +1,27 @@
 /* eslint-disable jsx-a11y/anchor-is-valid */
-import React from "react";
-import ReactDOM from "react-dom/client";
-import axios from "axios";
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import axios from 'axios'
 import {
   useQuery,
   useQueryClient,
   QueryClient,
   QueryClientProvider,
-} from "@tanstack/react-query";
-import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+} from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 
-const queryClient = new QueryClient();
+const queryClient = new QueryClient()
 
 function App() {
-  const [postId, setPostId] = React.useState(-1);
+  const [postId, setPostId] = React.useState(-1)
 
   return (
     <QueryClientProvider client={queryClient}>
       <p>
         As you visit the posts below, you will notice them in a loading state
         the first time you load them. However, after you return to this list and
         click on any posts you have already visited again, you will see them
-        load instantly and background refresh right before your eyes!{" "}
+        load instantly and background refresh right before your eyes!{' '}
         <strong>
           (You may need to throttle your network speed to simulate longer
           loading sequences)
@@ -34,32 +34,32 @@ function App() {
       )}
       <ReactQueryDevtools initialIsOpen />
     </QueryClientProvider>
-  );
+  )
 }
 
 function usePosts() {
   return useQuery({
-    queryKey: ["posts"],
+    queryKey: ['posts'],
     queryFn: async () => {
       const { data } = await axios.get(
-        "https://jsonplaceholder.typicode.com/posts"
-      );
-      return data;
+        'https://jsonplaceholder.typicode.com/posts',
+      )
+      return data
     },
-  });
+  })
 }
 
 function Posts({ setPostId }) {
-  const queryClient = useQueryClient();
-  const { status, data, error, isFetching } = usePosts();
+  const queryClient = useQueryClient()
+  const { status, data, error, isFetching } = usePosts()
 
   return (
     <div>
       <h1>Posts</h1>
       <div>
-        {status === "pending" ? (
-          "Loading..."
-        ) : status === "error" ? (
+        {status === 'pending' ? (
+          'Loading...'
+        ) : status === 'error' ? (
           <span>Error: {error.message}</span>
         ) : (
           <>
@@ -72,10 +72,10 @@ function Posts({ setPostId }) {
                     style={
                       // We can access the query data here to show bold links for
                       // ones that are cached
-                      queryClient.getQueryData(["post", post.id])
+                      queryClient.getQueryData(['post', post.id])
                         ? {
-                            fontWeight: "bold",
-                            color: "green",
+                            fontWeight: 'bold',
+                            color: 'green',
                           }
                         : {}
                     }
@@ -85,31 +85,31 @@ function Posts({ setPostId }) {
                 </p>
               ))}
             </div>
-            <div>{isFetching ? "Background Updating..." : " "}</div>
+            <div>{isFetching ? 'Background Updating...' : ' '}</div>
           </>
         )}
       </div>
     </div>
-  );
+  )
 }
 
 const getPostById = async (id) => {
   const { data } = await axios.get(
-    `https://jsonplaceholder.typicode.com/posts/${id}`
-  );
-  return data;
-};
+    `https://jsonplaceholder.typicode.com/posts/${id}`,
+  )
+  return data
+}
 
 function usePost(postId) {
   return useQuery({
-    queryKey: ["post", postId],
+    queryKey: ['post', postId],
     queryFn: () => getPostById(postId),
     enabled: !!postId,
-  });
+  })
 }
 
 function Post({ postId, setPostId }) {
-  const { status, data, error, isFetching } = usePost(postId);
+  const { status, data, error, isFetching } = usePost(postId)
 
   return (
     <div>
@@ -118,22 +118,22 @@ function Post({ postId, setPostId }) {
           Back
         </a>
       </div>
-      {!postId || status === "pending" ? (
-        "Loading..."
-      ) : status === "error" ? (
+      {!postId || status === 'pending' ? (
+        'Loading...'
+      ) : status === 'error' ? (
         <span>Error: {error.message}</span>
       ) : (
         <>
           <h1>{data.title}</h1>
           <div>
             <p>{data.body}</p>
           </div>
-          <div>{isFetching ? "Background Updating..." : " "}</div>
+          <div>{isFetching ? 'Background Updating...' : ' '}</div>
         </>
       )}
     </div>
-  );
+  )
 }
 
-const rootElement = document.getElementById("root");
-ReactDOM.createRoot(rootElement).render(<App />);
+const rootElement = document.getElementById('root')
+ReactDOM.createRoot(rootElement).render(<App />)