Setup project structure and react query

.eslintignore

@@ -1,2 +1,2 @@
-node_modules
-dist
+node_modules
+dist

.prettierrc

@@ -1,7 +1,7 @@
-{
-  "semi": false,
-  "singleQuote": true,
-  "tabWidth": 2,
-  "trailingComma": "es5",
-  "useTabs": false
-}
+{
+  "semi": false,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "es5",
+  "useTabs": false
+}

package.json

@@ -10,6 +10,7 @@
     "format": "prettier --write src/**/*.{ts,tsx}"
   },
   "dependencies": {
+    "axios": "^0.27.2",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "react-query": "^3.39.1",

readme.md

@@ -1,2 +1,2 @@
-Care Dashboard
+Care Dashboard
 ---

src/App.tsx

@@ -1,6 +1,10 @@
 import { BrowserRouter, Route, Routes } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from 'react-query'
+
 import { routes } from './router'
 
+const queryClient = new QueryClient()
+
 function App() {
   return (
     <Routes>
@@ -14,8 +18,10 @@ function App() {
 // eslint-disable-next-line react/display-name
 export default () => {
   return (
-    <BrowserRouter>
-      <App />
-    </BrowserRouter>
+    <QueryClientProvider client={queryClient}>
+      <BrowserRouter>
+        <App />
+      </BrowserRouter>
+    </QueryClientProvider>
   )
 }

src/api/mutation/useCreateExample.ts

@@ -0,0 +1,23 @@
+import axios from 'axios'
+import { useMutation, useQuery } from 'react-query'
+
+export type CreateExamplePaylaod = {
+  some: string
+}
+
+export type CreateExampleResponse = {
+  success: boolean
+}
+
+export const CREATE_EXAMPLE_KEY = 'create_example_key'
+
+export const useCreateExample = () => {
+  return useMutation<
+    CreateExampleResponse,
+    unknown,
+    CreateExamplePaylaod,
+    unknown
+  >(CREATE_EXAMPLE_KEY, (payload) =>
+    axios.post('https://example.com/example', payload)
+  )
+}

src/api/queries/useGetItems.tsx

@@ -0,0 +1,8 @@
+import axios from 'axios'
+import { useQuery } from 'react-query'
+
+export const GET_ITEMS_KEY = 'getItems'
+
+export const useGetItems = () => {
+  useQuery(GET_ITEMS_KEY, () => axios.get('https://example.com/feedbacks'))
+}

src/components/SideBar.tsx

@@ -0,0 +1,5 @@
+import React from 'react'
+
+export const SideBar = () => {
+  return <div>SideBar</div>
+}

src/types/index.ts

@@ -0,0 +1 @@
+export type example = string

src/utils/example.ts

@@ -0,0 +1 @@
+export const add = (a: number, b: number) => a + b