import React from 'react'

export default function WorldDuplicateActionMenu({ duplicateUrl, newEditionUrl, canCreateEdition, onDuplicate, onCreateEdition }) {
  if (!duplicateUrl && !newEditionUrl) {
    return null
  }

  return (
    <div className="rounded-[24px] border border-white/10 bg-black/20 p-4">
      <div className="flex items-start justify-between gap-4">
        <div>
          <div className="text-sm font-semibold text-white">Reuse this world</div>
          <p className="mt-1 text-sm leading-6 text-slate-400">Duplicate the current campaign structure or roll it forward into the next edition without rebuilding the curated setup.</p>
        </div>
        <div className="flex flex-wrap gap-2">
          {duplicateUrl ? <button type="button" onClick={onDuplicate} className="rounded-full border border-white/10 bg-white/[0.06] px-4 py-2 text-xs font-semibold uppercase tracking-[0.16em] text-white">Duplicate world</button> : null}
          {newEditionUrl ? <button type="button" onClick={onCreateEdition} disabled={!canCreateEdition} className="rounded-full border border-emerald-300/20 bg-emerald-400/10 px-4 py-2 text-xs font-semibold uppercase tracking-[0.16em] text-emerald-100 disabled:cursor-not-allowed disabled:opacity-50">Create next edition</button> : null}
        </div>
      </div>

      {!canCreateEdition ? <div className="mt-3 text-xs leading-5 text-slate-500">Next-edition creation unlocks once this world has recurrence data.</div> : null}
      <div className="mt-3 text-xs leading-5 text-slate-500">Template creation is prepared through duplication. A dedicated preset/template browser can be layered on top later without changing the editor data model.</div>
    </div>
  )
}