import React from 'react'

export default function WorldChallengeMeta({ items = [], className = '' }) {
  const filteredItems = Array.isArray(items) ? items.filter(Boolean) : []

  if (filteredItems.length === 0) {
    return null
  }

  return (
    <div className={`flex flex-wrap gap-2 text-xs uppercase tracking-[0.16em] text-slate-400 ${className}`.trim()}>
      {filteredItems.map((item) => (
        <span key={item}>{item}</span>
      ))}
    </div>
  )
}