I have a component that display text base on state ('success' or 'loading')

const Button = (state) => <button>{state === 'success' ? 'Sucess!' : state === 'loading' ? 'Please wait...' : ''}</button>

and I've to write test like so:

test('Button approved state', () => {
    render(<Button state="success" />)
    expect(screen.getByText('Sucess!'))
})

test('Button pending state', () => {
    render(<Button state="loading" />)
    expect(screen.getByText('Please wait...'))
})

Is it possible to them in one test? I tried

test('Button approved and pending state', () => {
    render(<Button state="success" />)
    expect(screen.getByText('Sucess!'))

    //need to reset here?

    render(<Button state="loading" />)
    expect(screen.getByText('Please wait...'))
})

the test failed. how do I do some sort of reset in between?