diff --git a/src/s2-homeworks/hw05/pages/Junior.tsx b/src/s2-homeworks/hw05/pages/Junior.tsx index 0e5ef16..1edd987 100644 --- a/src/s2-homeworks/hw05/pages/Junior.tsx +++ b/src/s2-homeworks/hw05/pages/Junior.tsx @@ -1,6 +1,7 @@ import React from 'react' import HW6 from '../../hw06/HW6' import HW7 from '../../hw07/HW7' +import HW8 from '../../hw08/HW8' function Junior() { return ( @@ -8,7 +9,7 @@ function Junior() { junior page - {/**/} + {/**/} ) diff --git a/src/s2-homeworks/hw08/HW8.module.css b/src/s2-homeworks/hw08/HW8.module.css new file mode 100644 index 0000000..7efb3f1 --- /dev/null +++ b/src/s2-homeworks/hw08/HW8.module.css @@ -0,0 +1,7 @@ +.item { + display: flex; + justify-content: space-between; + width: 200px; + + margin-left: 10px; +} \ No newline at end of file diff --git a/src/s2-homeworks/hw08/HW8.tsx b/src/s2-homeworks/hw08/HW8.tsx new file mode 100644 index 0000000..eb146bf --- /dev/null +++ b/src/s2-homeworks/hw08/HW8.tsx @@ -0,0 +1,58 @@ +import React, {useState} from 'react' +import {homeWorkReducer} from './bll/homeWorkReducer' +import s from './HW8.module.css' +import s2 from '../../s1-main/App.module.css' +import SuperButton from '../hw04/common/c2-SuperButton/SuperButton' +import User from './User' + +export type UserType = { // need to fix any + _id: number + name: string + age: number +} + +const initialPeople: UserType[] = [ // студенты могут поменять имя/возраст/количество объектов, _id должны быть целочисленные + {_id: 0, name: 'Кот', age: 3}, + {_id: 1, name: 'Александр', age: 66}, + {_id: 2, name: 'Коля', age: 16}, + {_id: 3, name: 'Виктор', age: 44}, + {_id: 4, name: 'Дмитрий', age: 40}, + {_id: 5, name: 'Ирина', age: 55}, +] + +const HW8 = () => { + const [people, setPeople] = useState(initialPeople) // need to fix any + + // need to fix any + const finalPeople = people.map((u: UserType) => ) + + const sortUp = () => setPeople(homeWorkReducer(initialPeople, {type: 'sort', payload: 'up'})) // в алфавитном порядке a.name > b.name + const sortDown = () => setPeople(homeWorkReducer(initialPeople, {type: 'sort', payload: 'down'})) // в обратном порядке a.name < b.name + const check18 = () => setPeople(homeWorkReducer(initialPeople, {type: 'check', payload: 18})) // совершеннолетние + + return ( +
+
+ {/*можно убрать этот тег*/} + +
homeworks 8
+ +
+ {finalPeople} +
+ +
+ sort up + sort down + check 18 +
+ +
+ {/*можно убрать этот тег*/} +
+ {/*можно убрать этот тег*/} +
+ ) +} + +export default HW8 diff --git a/src/s2-homeworks/hw08/User.tsx b/src/s2-homeworks/hw08/User.tsx new file mode 100644 index 0000000..2a9a229 --- /dev/null +++ b/src/s2-homeworks/hw08/User.tsx @@ -0,0 +1,20 @@ +import React from 'react' +import {UserType} from './HW8' +import s from './HW8.module.css' + +// types +type UserPropsType = { + u: UserType +} + +const User: React.FC = ({u}) => { + + return ( +
+ {u.name} + {u.age} +
+ ) +} + +export default User diff --git a/src/s2-homeworks/hw08/bll/homeWorkReducer.ts b/src/s2-homeworks/hw08/bll/homeWorkReducer.ts new file mode 100644 index 0000000..0ff8fbf --- /dev/null +++ b/src/s2-homeworks/hw08/bll/homeWorkReducer.ts @@ -0,0 +1,21 @@ +import {UserType} from '../HW8' + +type ActionType = {type: 'sort', payload: 'up' | 'down'} | {type: 'check', payload: number} + +export const homeWorkReducer = (state: UserType[], action: ActionType): UserType[] => { // need to fix any + switch (action.type) { // делают студенты + case 'sort': { + const newState = [...state].sort((a, b) => { + if (a.name > b.name) return 1 + else if (a.name < b.name) return -1 + else return 0 + }) + + return action.payload === 'up' ? newState : newState.reverse() + } + case 'check': { + return state.filter(a => a.age >= action.payload) + } + default: return state + } +} \ No newline at end of file diff --git a/src/s2-homeworks/hw08/bll/tests/homeWorkReducer.test.tsx b/src/s2-homeworks/hw08/bll/tests/homeWorkReducer.test.tsx new file mode 100644 index 0000000..2449d33 --- /dev/null +++ b/src/s2-homeworks/hw08/bll/tests/homeWorkReducer.test.tsx @@ -0,0 +1,32 @@ +import React from 'react' +import {homeWorkReducer} from '../homeWorkReducer' +import {UserType} from '../../HW8' + +let initialState: UserType[] // need to fix any + +beforeEach(() => { + initialState = [ + {_id: 0, name: 'Кот', age: 3}, + {_id: 1, name: 'Александр', age: 66}, + {_id: 2, name: 'Коля', age: 16}, + {_id: 3, name: 'Виктор', age: 44}, + {_id: 4, name: 'Дмитрий', age: 40}, + {_id: 5, name: 'Ирина', age: 55}, + ] +}) + +test('sort name up', () => { + const newState = homeWorkReducer(initialState, {type: 'sort', payload: 'up'}) + + expect(newState[0]._id).toBe(1) +}) +test('sort name down', () => { + const newState = homeWorkReducer(initialState, {type: 'sort', payload: 'down'}) + + expect(newState[0]._id).toBe(0) +}) +test('check age 18', () => { + const newState = homeWorkReducer(initialState, {type: 'check', payload: 18}) + + expect(newState.length).toBe(4) +})