import React from 'react'
import { StyleSheet } from 'react-native'
import * as unistyles from '../web/services'
import { error, isServer } from '../web/utils'
import { serialize } from './serialize'
import { DefaultServerUnistylesSettings, type ServerUnistylesSettings } from './types'

export const getServerUnistyles = ({ includeRNWStyles = true }: ServerUnistylesSettings = DefaultServerUnistylesSettings) => {
    if (!isServer()) {
        throw error('Server styles should only be read on the server')
    }

    // @ts-ignore
    const rnwStyle: string | null = includeRNWStyles ? (StyleSheet?.getSheet().textContent ?? '') : null
    const css = unistyles.services.registry.css.getStyles()
    const state = unistyles.services.registry.css.getState()

    return (
        <>
            {rnwStyle && <style id='rnw-style'>{rnwStyle}</style>}
            <style id='unistyles-web'>{css}</style>
            {/* biome-ignore lint/security/noDangerouslySetInnerHtml: Needs the json quotes to be unescaped */}
            <script id='unistyles-script' defer dangerouslySetInnerHTML={{ __html: `window.__UNISTYLES_STATE__ = ${serialize(state)}`}} />
        </>
    )
}