import { CSS_NAME } from 'config'

type ClassNameProps = Record<string, boolean> | string[] | string | undefined

export const className = (...classes: ClassNameProps[]) =>
  classes
    .flat()
    .map((c) => {
      if (typeof c === 'object') {
        return Object.entries(c)
          .map(([key, value]) => (value ? key : ''))
          .join(' ')
      }
      return c
    })
    .filter((c) => typeof c === 'string')
    .map((c) => c?.split(' '))
    .flat()
    .filter((c) => c && c.length)
    .map((c) => {
      // This rule makes sure the CSS_NAME is not added yet
      if (c && c.indexOf(CSS_NAME) > -1) {
        return c
      }
      return [CSS_NAME, c].join('-')
    })
    .join(' ')