Pass and read array from state in NavigationMixin.Navigate

I am trying to find a way to pass data when navigating from page 1 to page 2 using NavigationMixin.Navigate. Below is the sample code that is part of a POC:

Page 1: HTML

<template>
    <lightning-button variant="brand" label="Go To Next Page" onclick={navigateToNextPage} class="slds-m-left_medium"> </lightning-button>
</template>

JS:

import { LightningElement, wire, api } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
export default class Navigator_firstpage extends NavigationMixin(LightningElement) {
    @api someRecIds = [];
    
    navigateToNextPage(){
        for(let i=0; i<10; i++){
            this.someRecIds.push(i);
        }
        let storeState = this.someRecIds;
        this[NavigationMixin.Navigate]({
            type: 'standard__navItemPage',
            attributes: {
                apiName: 'second_page'
            },
            state: {
                filterName: 'xyz' 
            }
        }); 
    }
}

2nd Page:

<template>
    <lightning-card>
        This is 2nd page
    </lightning-card>
</template>

JS

import { LightningElement } from 'lwc';
import {CurrentPageReference} from 'lightning/navigation';
export default class Second_page extends LightningElement {
   // Is there a way to read the data from the state that was passed from the previous page?
   // I could not get the state in CurrentPageReference
   // OR is there any better way to pass the array when navigating?
}