import React from 'react'
// Fix issue with astro/vite/rollup, no export
import "use-sync-external-store/with-selector.js"
import { Provider } from 'react-redux'
import { getBrowserStore } from './client.mjs'

export const ReduxAstroProvider = (Component) => {
  const Wrapped = (props) => {
    const {
      ASTRO_STORE: possibleStore = {},
      ...rest
    } = props
    const store = possibleStore.dispatch ? possibleStore : getBrowserStore()

    return (
      <Provider store={store}><Component {...rest}/></Provider>
    )
  }
  if (Component.defaultProps) Wrapped.defaultProps = Component.defaultProps
  if (Component.propTypes) Wrapped.propTypes = Component.propTypes
  if (Component.displayName) Wrapped.displayName = Component.displayName
  return Wrapped
}