Files
home-works/src/s2-homeworks/hw02/HW2.tsx
2022-06-25 15:02:56 +02:00

71 lines
2.9 KiB
TypeScript

import React, { useState } from 'react'
import Affairs from './Affairs'
import s from './Affairs.module.css'
import s2 from '../../s1-main/App.module.css'
// types
export type AffairPriorityType = any // 'high' | 'low' | 'middle' // need to fix any
export type AffairType = {
_id: any // number // need to fix any
name: any // string // need to fix any
priority: AffairPriorityType
}
export type FilterType = 'all' | AffairPriorityType
// constants
const defaultAffairs: any = [ // need to fix any // AffairType[]
{_id: 1, name: 'React', priority: 'high'}, // студенты могут изменить содержимое name и количество элементов в массиве, ...priority не менять!
{_id: 2, name: 'anime', priority: 'low'},
{_id: 3, name: 'games', priority: 'low'},
{_id: 4, name: 'work', priority: 'high'},
{_id: 5, name: 'html & css', priority: 'middle'},
]
// pure helper functions
export const filterAffairs = (affairs: any, filter: any): any => { // need to fix any // (affairs: AffairType[], filter: FilterType): AffairType[]
if (filter === 'all') return affairs // создаёт студент
// else if (filter === 'low') return affairs.filter(a => a.priority === 'low')
// else if (filter === 'middle') return affairs.filter(a => a.priority === 'middle')
// else if (filter === 'high') return affairs.filter(a => a.priority === 'high')
// else {
// }
// return []
else return affairs.filter((a: any) => a.priority === filter) // need to fix // создаёт студент
}
export const deleteAffair = (affairs: any, _id: any): any => { // need to fix any // (affairs: AffairType[], _id: number): AffairType[]
return affairs.filter((a: any) => a._id !== _id) // need to fix // создаёт студент
}
function HW2() {
const [affairs, setAffairs] = useState<any>(defaultAffairs) // need to fix any // AffairType[]
const [filter, setFilter] = useState<any>('all') // need to fix any // FilterType
const filteredAffairs = filterAffairs(affairs, filter)
const deleteAffairCallback = (_id: any) => setAffairs(deleteAffair(affairs, _id)) // need to fix any // number
return (
<div id={'hw2'} className={s2.hw} style={{marginTop: '39px'}}>
{/*<hr/>*/}
{/*можно убрать этот тег*/}
<div className={s2.hwTitle}>Homework #2</div>
<hr/>
{/*не менять*/}
<Affairs
data={filteredAffairs}
setFilter={setFilter}
deleteAffairCallback={deleteAffairCallback}
filter={filter}
/>
{/*<hr/>*/}
{/*можно убрать этот тег*/}
<hr/>
{/*можно убрать этот тег*/}
</div>
)
}
export default HW2