import { createSelector } from '@reduxjs/toolkit'
import type { VisibilityOptions } from 'config.types'
import type { RootState } from 'domains/store'
import { visibilityStates } from 'domains/visibility/constants'

export const selectConfig = createSelector(
  ({ config }: RootState) => config,
  (config) => {
    let newConfig = {
      visible: (config?.layoutMode === 'inline'
        ? visibilityStates.open
        : visibilityStates.minimized) as VisibilityOptions,
      appContainerClassNames: config?.appContainerClassNames || [],
      ...config,
    }
    if (typeof newConfig.appContainerClassNames === 'function') {
      newConfig = {
        ...newConfig,
        appContainerClassNames: newConfig.appContainerClassNames(newConfig),
      }
    }
    return newConfig
  },
)