Resolve "test competition view"

client/package-lock.json

@@ -2518,6 +2518,15 @@
         "@types/react": "*"
       }
     },
+    "@types/redux-mock-store": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@types/redux-mock-store/-/redux-mock-store-1.0.2.tgz",
+      "integrity": "sha512-6LBtAQBN34i7SI5X+Qs4zpTEZO1tTDZ6sZ9fzFjYwTl3nLQXaBtwYdoV44CzNnyKu438xJ1lSIYyw0YMvunESw==",
+      "dev": true,
+      "requires": {
+        "redux": "^4.0.5"
+      }
+    },
     "@types/resolve": {
       "version": "0.0.8",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -10723,6 +10732,11 @@
       "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA=",
       "dev": true
     },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+    },
     "lodash.memoize": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -13903,6 +13917,14 @@
       "resolved": "https://registry.npmjs.org/redux-devtools-extension/-/redux-devtools-extension-2.13.8.tgz",
       "integrity": "sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg=="
     },
+    "redux-mock-store": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/redux-mock-store/-/redux-mock-store-1.5.4.tgz",
+      "integrity": "sha512-xmcA0O/tjCLXhh9Fuiq6pMrJCwFRaouA8436zcikdIpYWWCjU76CRk+i2bHx8EeiSiMGnB85/lZdU3wIJVXHTA==",
+      "requires": {
+        "lodash.isplainobject": "^4.0.6"
+      }
+    },
     "redux-thunk": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",

client/package.json

@@ -25,6 +25,7 @@
     "react-scripts": "4.0.2",
     "redux": "^4.0.5",
     "redux-devtools-extension": "^2.13.8",
+    "redux-mock-store": "^1.5.4",
     "redux-thunk": "^2.3.0",
     "styled-components": "^5.2.1",
     "typescript": "^4.1.3",
@@ -35,6 +36,7 @@
     "@types/enzyme": "^3.10.8",
     "@types/react-redux": "^7.1.16",
     "@types/react-router-dom": "^5.1.7",
+    "@types/redux-mock-store": "^1.0.2",
     "@types/styled-components": "^5.1.9",
     "@typescript-eslint/eslint-plugin": "4.2.0",
     "@typescript-eslint/parser": "4.2.0",

client/src/App.test.tsx

 import { render } from '@testing-library/react'
 import React from 'react'
+import { act } from 'react-dom/test-utils'
 import { Provider } from 'react-redux'
 import App from './App'
 import store from './store'
 
-test('renders app', () => {
-  render(
-    <Provider store={store}>
-      <App />
-    </Provider>
-  )
+test('renders app', async () => {
+  await act(async () => {
+    render(
+      <Provider store={store}>
+        <App />
+      </Provider>
+    )
+  })
 })

client/src/__mocks__/axios.js

 export default {
   get: jest.fn().mockImplementation(),
+  post: jest.fn().mockImplementation(),
 }

client/src/actions/user.ts

@@ -30,15 +30,10 @@ export const getUserData = () => async (dispatch: AppDispatch) => {
   await axios
     .get('/users')
     .then((res) => {
+      console.log(res.data)
       dispatch({
         type: Types.SET_USER,
-        payload: {
-          id: res.data.id,
-          name: res.data.name,
-          email: res.data.email,
-          roleId: res.data.role_id,
-          cityId: res.data.city_id,
-        },
+        payload: res.data,
       })
     })
     .catch((err) => {

client/src/interfaces/Competition.ts

+import { City } from './City'
+
 export interface Competition {
   name: string
-  city_id: number
-  style_id: number
-  year: number
   id: number
+  city: City
+  year: number
 }

client/src/interfaces/Role.ts

+import { City } from './City'
+
+export interface Competition {
+  name: string
+  city: City
+  style_id: number
+  year: number
+  id: number
+}

client/src/pages/admin/components/AddCompetition.test.tsx

+import { render } from '@testing-library/react'
+import React from 'react'
+import { Provider } from 'react-redux'
+import { BrowserRouter } from 'react-router-dom'
+import store from '../../../store'
+import AddCompetition from './AddCompetition'
+
+it('renders add competition', () => {
+  render(
+    <BrowserRouter>
+      <Provider store={store}>
+        <AddCompetition />
+      </Provider>
+    </BrowserRouter>
+  )
+})

client/src/pages/admin/components/AddCompetition.tsx

@@ -37,8 +37,9 @@ const competitionSchema: Yup.SchemaOf<AddCompetitionFormModel> = Yup.object({
 
 const AddCompetition: React.FC = (props: any) => {
   const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null)
-  const [selectedCity, setSelectedCity] = React.useState<City | undefined>()
   const cities = useAppSelector((state) => state.cities.cities)
+  const userCity = useAppSelector((state) => state.user.userInfo?.city)
+  const [selectedCity, setSelectedCity] = React.useState<City | undefined>(userCity)
   const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
     setAnchorEl(event.currentTarget)
   }
@@ -80,7 +81,7 @@ const AddCompetition: React.FC = (props: any) => {
   }
 
   const competitionInitialValues: AddCompetitionFormModel = {
-    model: { name: '', city: noCitySelected, year: currentYear },
+    model: { name: '', city: userCity?.name ? userCity.name : noCitySelected, year: currentYear },
   }
   return (
     <div>

client/src/pages/admin/components/CompetitionManager.test.tsx

@@ -8,37 +8,41 @@ import CompetitionManager from './CompetitionManager'
 
 it('renders competition manager', () => {
   const cityRes: any = {
-    data: [
-      {
-        id: 1,
-        name: 'Link\u00f6ping',
-      },
-      {
-        id: 2,
-        name: 'Stockholm',
-      },
-    ],
+    data: {
+      items: [
+        {
+          id: 1,
+          name: 'Link\u00f6ping',
+        },
+        {
+          id: 2,
+          name: 'Stockholm',
+        },
+      ],
+      count: 2,
+      total_count: 3,
+    },
   }
   const compRes: any = {
     data: {
-      competitions: [
+      items: [
         {
           id: 21,
           name: 'ggff',
           year: 2021,
           style_id: 1,
-          city_id: 1,
+          city: cityRes.data.items[0],
         },
         {
           id: 22,
           name: 'sssss',
           year: 2021,
           style_id: 1,
-          city_id: 1,
+          city: cityRes.data.items[1],
         },
       ],
       count: 2,
-      total: 3,
+      total_count: 3,
     },
   }
 

client/src/pages/admin/components/CompetitionManager.tsx

@@ -152,7 +152,7 @@ const CompetitionManager: React.FC = (props: any) => {
                       {row.name}
                     </Button>
                   </TableCell>
-                  <TableCell align="right">{cities.find((city) => city.id === row.city_id)?.name || ''}</TableCell>
+                  <TableCell align="right">{cities.find((city) => city.id === row.city.id)?.name || ''}</TableCell>
                   <TableCell align="right">{row.year}</TableCell>
                   <TableCell align="right">
                     <Button onClick={(event) => handleClick(event, row.id)}>

client/src/reducers/userReducer.ts

-//in userReducer.ts
 import { AnyAction } from 'redux'
 import Types from '../actions/types'
+import { City } from '../interfaces/City'
+import { Competition } from './../interfaces/Competition'
 
 interface UserInfo {
   name: string
   email: string
-  roleId: number
-  cityId: number
+  role: Competition
+  city: City
+  id: number
 }
 
 interface UserState {

client/src/utils/checkAuthentication.ts

@@ -22,12 +22,7 @@ export const CheckAuthentication = async () => {
           store.dispatch({ type: Types.SET_AUTHENTICATED })
           store.dispatch({
             type: Types.SET_USER,
-            payload: {
-              name: res.data.name,
-              email: res.data.email,
-              roleId: res.data.role_id,
-              cityId: res.data.city_id,
-            },
+            payload: res.data,
           })
         })
         .catch((error) => {