Implement creator studio and upload updates

resources/js/Pages/Studio/StudioCollections.jsx

@@ -0,0 +1,37 @@
+import React from 'react'
+import { usePage } from '@inertiajs/react'
+import StudioLayout from '../../Layouts/StudioLayout'
+import StudioContentBrowser from '../../Components/Studio/StudioContentBrowser'
+
+function SummaryCard({ label, value, icon }) {
+  return (
+    <div className="rounded-[24px] border border-white/10 bg-white/[0.03] p-5">
+      <div className="flex items-center gap-3 text-slate-300">
+        <i className={icon} />
+        <span className="text-sm">{label}</span>
+      </div>
+      <div className="mt-3 text-3xl font-semibold text-white">{Number(value || 0).toLocaleString()}</div>
+    </div>
+  )
+}
+
+export default function StudioCollections() {
+  const { props } = usePage()
+  const summary = props.summary || {}
+
+  return (
+    <StudioLayout title={props.title} subtitle={props.description}>
+      <div className="mb-6 grid gap-4 md:grid-cols-4">
+        <SummaryCard label="Collections" value={summary.count} icon="fa-solid fa-layer-group" />
+        <SummaryCard label="Drafts" value={summary.draft_count} icon="fa-solid fa-file-pen" />
+        <SummaryCard label="Published" value={summary.published_count} icon="fa-solid fa-rocket" />
+        <a href={props.dashboardUrl} className="rounded-[24px] border border-sky-300/20 bg-sky-300/10 p-5 text-sky-100 transition hover:border-sky-300/35 hover:bg-sky-300/15">
+          <p className="text-[11px] font-semibold uppercase tracking-[0.2em]">Collection dashboard</p>
+          <p className="mt-3 text-sm leading-6">Open the full collection workflow surface for rules, history, and collaboration.</p>
+        </a>
+      </div>
+
+      <StudioContentBrowser listing={props.listing} quickCreate={props.quickCreate} hideModuleFilter />
+    </StudioLayout>
+  )
+}