Build world campaigns rewards and recaps

resources/js/components/worlds/WorldChallengeEntriesRail.jsx

@@ -0,0 +1,24 @@
+import React from 'react'
+import WorldChallengeArtworkCard from './WorldChallengeArtworkCard'
+
+export default function WorldChallengeEntriesRail({ section, challengeId = null }) {
+  const items = Array.isArray(section?.items) ? section.items : []
+
+  if (items.length === 0) {
+    return null
+  }
+
+  return (
+    <section className="mt-10">
+      <div className="mb-5 flex items-end justify-between gap-4">
+        <div>
+          <h2 className="text-2xl font-semibold tracking-[-0.03em] text-white">{section.title || 'Challenge entries'}</h2>
+          {section.description ? <p className="mt-2 max-w-3xl text-sm leading-6 text-slate-400">{section.description}</p> : null}
+        </div>
+      </div>
+      <div className="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
+        {items.map((item) => <WorldChallengeArtworkCard key={item.id} item={item} sectionKey="challenge_entries" challengeId={challengeId} />)}
+      </div>
+    </section>
+  )
+}