32 lines
2.2 KiB
JavaScript
32 lines
2.2 KiB
JavaScript
import React from 'react'
|
|
import { router, usePage } from '@inertiajs/react'
|
|
import StudioLayout from '../../Layouts/StudioLayout'
|
|
|
|
export default function StudioGroupActivity() {
|
|
const { props } = usePage()
|
|
const items = Array.isArray(props.activity) ? props.activity : []
|
|
|
|
return (
|
|
<StudioLayout title={props.title} subtitle={props.description}>
|
|
<div className="space-y-4">
|
|
{items.length > 0 ? items.map((item) => (
|
|
<div key={item.id} className="rounded-[24px] border border-white/10 bg-white/[0.03] p-5">
|
|
<div className="flex items-start justify-between gap-4">
|
|
<div>
|
|
<div className="flex flex-wrap items-center gap-2">
|
|
<h2 className="text-base font-semibold text-white">{item.headline}</h2>
|
|
{item.is_pinned ? <span className="rounded-full border border-amber-300/20 bg-amber-300/10 px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-amber-100">Pinned</span> : null}
|
|
<span className="rounded-full border border-white/10 bg-white/[0.04] px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-300">{item.visibility}</span>
|
|
</div>
|
|
{item.summary ? <p className="mt-2 text-sm leading-6 text-slate-400">{item.summary}</p> : null}
|
|
<div className="mt-3 text-xs text-slate-500">{item.actor?.name || item.actor?.username || 'System'} • {item.occurred_at ? new Date(item.occurred_at).toLocaleString() : 'Recently'}</div>
|
|
{item.subject?.url ? <a href={item.subject.url} className="mt-3 inline-flex text-sm font-semibold text-sky-200">Open subject</a> : null}
|
|
</div>
|
|
{props.pinPattern ? <button type="button" onClick={() => router.post(props.pinPattern.replace('__ITEM__', String(item.id)), { is_pinned: !item.is_pinned })} className="rounded-full border border-white/10 bg-white/[0.04] px-3 py-1.5 text-sm font-semibold text-white">{item.is_pinned ? 'Unpin' : 'Pin'}</button> : null}
|
|
</div>
|
|
</div>
|
|
)) : <div className="rounded-[24px] border border-dashed border-white/10 bg-white/[0.02] p-6 text-sm text-slate-400">No activity yet.</div>}
|
|
</div>
|
|
</StudioLayout>
|
|
)
|
|
} |