How to update multiple state properties with React hooks

export default function Showcase(props) {
    const factory = props.factory
    const [state, setState] = useState(
        {
            factory,
            selectedFilter: { name: '' }
        }
    )

    const onFilterClick = (filter) => {
        setState({
            selectedFilter: filter,
            factory: factory.filter((app) => {
                return app.showcase.platforms.includes(filter.name)
            }) 
        })
    }

    let cards = state.factory.map((app, index) => {
        return (
            <Card app={app} key={app.slug} />
        )
    })

    return (
        <div>
            <FilterBar onClick={onFilterClick} />
            <div css={css`
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: flex-start;
                margin: 0 auto;
                padding: 0 8vw;
            `}>
                {cards}
            </div>
        </div>

    )
}