Commit workspace changes
This commit is contained in:
47
resources/js/Pages/Studio/StudioGroupReleases.jsx
Normal file
47
resources/js/Pages/Studio/StudioGroupReleases.jsx
Normal file
@@ -0,0 +1,47 @@
|
||||
import React from 'react'
|
||||
import { router, usePage } from '@inertiajs/react'
|
||||
import StudioLayout from '../../Layouts/StudioLayout'
|
||||
|
||||
export default function StudioGroupReleases() {
|
||||
const { props } = usePage()
|
||||
const listing = props.listing || {}
|
||||
const items = Array.isArray(listing.items) ? listing.items : []
|
||||
const bucketOptions = Array.isArray(listing.bucket_options) ? listing.bucket_options : []
|
||||
const currentBucket = listing.filters?.bucket || 'all'
|
||||
|
||||
return (
|
||||
<StudioLayout title={props.title} subtitle={props.description}>
|
||||
<div className="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div className="text-sm text-slate-400">Track the release pipeline from draft through public launch, with milestones and contributor credits.</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<select value={currentBucket} onChange={(event) => router.get(window.location.pathname, { bucket: event.target.value }, { preserveScroll: true, preserveState: true })} className="rounded-full border border-white/10 bg-white/[0.04] px-4 py-2 text-sm text-white outline-none">
|
||||
{bucketOptions.map((option) => <option key={option.value} value={option.value}>{option.label}</option>)}
|
||||
</select>
|
||||
{props.createUrl ? <a href={props.createUrl} className="rounded-full border border-white/10 bg-white/[0.04] px-4 py-2 text-sm font-semibold text-white">Create release</a> : null}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-6 grid gap-4 lg:grid-cols-2">
|
||||
{items.length > 0 ? items.map((release) => (
|
||||
<div key={release.id} className="overflow-hidden rounded-[24px] border border-white/10 bg-white/[0.03]">
|
||||
{release.cover_url ? <img src={release.cover_url} alt={release.title} className="aspect-[4/3] w-full object-cover" /> : <div className="flex aspect-[4/3] items-center justify-center bg-white/[0.03] text-slate-500"><i className="fa-solid fa-rocket text-2xl" /></div>}
|
||||
<div className="p-5">
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<span className="rounded-full border border-white/10 bg-white/[0.04] px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-300">{release.status}</span>
|
||||
<span className="rounded-full border border-white/10 bg-white/[0.04] px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-300">{release.current_stage}</span>
|
||||
<span className="rounded-full border border-white/10 bg-white/[0.04] px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-300">{release.visibility}</span>
|
||||
</div>
|
||||
<h2 className="mt-3 text-xl font-semibold text-white">{release.title}</h2>
|
||||
<p className="mt-2 text-sm leading-6 text-slate-400">{release.summary || 'Release page'}</p>
|
||||
<div className="mt-4 text-xs text-slate-500">{release.counts?.artworks || 0} artworks • {release.counts?.contributors || 0} contributors • {release.counts?.milestones || 0} milestones</div>
|
||||
<div className="mt-4 flex flex-wrap gap-2">
|
||||
<a href={release.urls?.edit || release.url} className="rounded-full border border-white/10 bg-white/[0.04] px-4 py-2 text-sm font-semibold text-white">Manage</a>
|
||||
{release.urls?.public ? <a href={release.urls.public} className="rounded-full border border-white/10 bg-black/20 px-4 py-2 text-sm font-semibold text-white">View public</a> : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)) : <div className="rounded-[24px] border border-dashed border-white/10 bg-white/[0.02] p-6 text-sm text-slate-400">No releases yet.</div>}
|
||||
</div>
|
||||
</StudioLayout>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user