strapi-plugin-radiocult-uploader 1.0.0

package/dist/admin/App-Cd-TZrqC.mjs

@@ -0,0 +1,1179 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { useAuth, Page as Page$1 } from "@strapi/strapi/admin";
+import { useNavigate, useParams, Routes, Route } from "react-router-dom";
+import { Main, Typography, Box, Flex, Button } from "@strapi/design-system";
+import * as React from "react";
+import styled from "styled-components";
+import { f as fetchStatus, P as PLATFORMS, a as PLATFORM_LABEL, b as apiError, c as fetchUiConfig, s as saveTrackDetails, u as uploadTrack, p as publishTrack } from "./index-Dj3e3A79.mjs";
+import { u as useGoogleFont, g as googleFontHref, r as resolveFont, t as themeToCssVars } from "./tokens-ACCekCH6.mjs";
+const HomePage = () => {
+  const navigate = useNavigate();
+  return /* @__PURE__ */ jsxs(Main, { padding: 8, children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "alpha", tag: "h1", children: "Radio Cult Uploader" }),
+    /* @__PURE__ */ jsx(Box, { paddingTop: 2, paddingBottom: 6, children: /* @__PURE__ */ jsx(Typography, { variant: "epsilon", textColor: "neutral600", children: "Upload show episodes to Radio Cult and publish them to SoundCloud and Mixcloud." }) }),
+    /* @__PURE__ */ jsx(Box, { background: "neutral0", hasRadius: true, shadow: "filterShadow", padding: 6, style: { maxWidth: 720 }, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 4, children: [
+      /* @__PURE__ */ jsxs(Typography, { children: [
+        "The uploader opens from an episode: go to your episode content type in the Content Manager, open an entry, and use the",
+        " ",
+        /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: "Upload to Soundcloud/Mixcloud/Radio Cult" }),
+        " ",
+        "panel on the right."
+      ] }),
+      /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: "Before first use, set your Radio Cult API key and map your episode content type in the plugin settings. You can also change the uploader's colours and logo there." }),
+      /* @__PURE__ */ jsx(Button, { onClick: () => navigate("/settings/radiocult-uploader"), children: "Open settings" })
+    ] }) })
+  ] });
+};
+const POLL_MS = 3e4;
+const MAX_BYTES = 750 * 1024 * 1024;
+const mb = (bytes) => `${(bytes / 1024 / 1024).toFixed(1)}MB`;
+let nextId = 1;
+const Page = styled.div`
+  font-family: var(--rcu-fontFamily, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
+  background: linear-gradient(160deg, var(--rcu-pageBg), var(--rcu-pageBgDeep) 100%);
+  background-attachment: fixed;
+  color: var(--rcu-text);
+  min-height: 100vh;
+  padding: 40px 20px 80px;
+
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
+  .wrap {
+    max-width: 860px;
+    margin: 0 auto;
+  }
+
+  /* ---------- header ---------- */
+  header {
+    display: flex;
+    align-items: center;
+    gap: 18px;
+    margin-bottom: 34px;
+    animation: rcu-rise 0.6s ease both;
+  }
+  .eq {
+    flex: none;
+    width: 62px;
+    height: 62px;
+    display: block;
+  }
+  .eq img,
+  .eq svg {
+    width: 100%;
+    height: 100%;
+    display: block;
+    animation: rcu-breathe 2.4s ease-in-out infinite;
+  }
+  @keyframes rcu-breathe {
+    50% {
+      transform: scale(1.07);
+      opacity: 0.78;
+    }
+  }
+  .eq.paused img,
+  .eq.paused svg {
+    animation: none;
+    transform: none;
+  }
+
+  h1 {
+    font-size: 26px;
+    letter-spacing: 0.04em;
+    font-weight: 800;
+    margin: 0;
+    background: linear-gradient(
+      90deg,
+      var(--rcu-text),
+      var(--rcu-contrast) 35%,
+      var(--rcu-textDim) 60%,
+      var(--rcu-text)
+    );
+    background-size: 200% auto;
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    animation: rcu-sheen 6s linear infinite;
+  }
+  @keyframes rcu-sheen {
+    to {
+      background-position: 200% center;
+    }
+  }
+  .strap {
+    color: var(--rcu-textDim);
+    font-size: 13px;
+    margin-top: 4px;
+  }
+  .strap b {
+    color: var(--rcu-text);
+    font-weight: 600;
+  }
+
+  /* ---------- cards / steps ---------- */
+  .card {
+    background: var(--rcu-card);
+    border: 1px solid var(--rcu-cardBorder);
+    border-radius: 18px;
+    padding: 26px 28px;
+    margin-bottom: 22px;
+    backdrop-filter: blur(14px);
+    -webkit-backdrop-filter: blur(14px);
+    animation: rcu-rise 0.6s ease both;
+    transition: border-color 0.4s, box-shadow 0.4s;
+  }
+  .card:nth-of-type(1) {
+    animation-delay: 0.05s;
+  }
+  .card:nth-of-type(2) {
+    animation-delay: 0.12s;
+  }
+  .card:nth-of-type(3) {
+    animation-delay: 0.19s;
+  }
+  .card:nth-of-type(4) {
+    animation-delay: 0.26s;
+  }
+  @keyframes rcu-rise {
+    from {
+      opacity: 0;
+      transform: translateY(14px);
+    }
+    to {
+      opacity: 1;
+      transform: none;
+    }
+  }
+  .card.active {
+    border-color: var(--rcu-text);
+    box-shadow: 0 6px 26px var(--rcu-shadowSoft);
+  }
+  .card.done {
+    border-color: var(--rcu-green);
+  }
+
+  .step-head {
+    display: flex;
+    align-items: center;
+    gap: 14px;
+    margin-bottom: 16px;
+  }
+  .badge {
+    width: 34px;
+    height: 34px;
+    border-radius: 50%;
+    flex: none;
+    display: grid;
+    place-items: center;
+    font-weight: 800;
+    font-size: 15px;
+    color: var(--rcu-buttonText);
+    background: linear-gradient(135deg, var(--rcu-text), var(--rcu-contrast));
+    transition: transform 0.3s;
+  }
+  .card.done .badge {
+    background: linear-gradient(135deg, var(--rcu-green), var(--rcu-vinylMid));
+    animation: rcu-pop 0.45s ease;
+  }
+  @keyframes rcu-pop {
+    50% {
+      transform: scale(1.25);
+    }
+  }
+  .step-head h2 {
+    font-size: 17px;
+    font-weight: 700;
+    letter-spacing: 0.02em;
+    margin: 0;
+  }
+  .step-head .hint {
+    margin-left: auto;
+    font-size: 12px;
+    color: var(--rcu-textDim);
+    text-align: right;
+  }
+
+  .locked {
+    opacity: 0.45;
+    pointer-events: none;
+    filter: saturate(0.5);
+  }
+
+  /* ---------- form ---------- */
+  .grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 14px;
+  }
+  .grid .full {
+    grid-column: 1 / -1;
+  }
+  @media (max-width: 620px) {
+    .grid {
+      grid-template-columns: 1fr;
+    }
+  }
+  label {
+    display: block;
+    font-size: 11px;
+    text-transform: uppercase;
+    letter-spacing: 0.12em;
+    color: var(--rcu-textDim);
+    margin-bottom: 6px;
+  }
+  input[type='text'],
+  textarea {
+    width: 100%;
+    color: var(--rcu-text);
+    font-size: 14px;
+    font-family: inherit;
+    background: var(--rcu-inputBg);
+    border: 1px solid var(--rcu-cardBorder);
+    border-radius: 10px;
+    padding: 11px 13px;
+    transition: border-color 0.25s, box-shadow 0.25s;
+  }
+  input[type='text']:focus,
+  textarea:focus {
+    outline: none;
+    border-color: var(--rcu-text);
+    box-shadow: 0 0 0 3px var(--rcu-shadowSoft);
+  }
+  textarea {
+    resize: vertical;
+    min-height: 92px;
+  }
+  .fine {
+    font-size: 12px;
+    color: var(--rcu-textDim);
+    margin-top: 5px;
+  }
+
+  .artwork {
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    margin-top: 16px;
+  }
+  .artwork img {
+    width: 88px;
+    height: 88px;
+    object-fit: cover;
+    border-radius: 12px;
+    border: 1px solid var(--rcu-cardBorder);
+    box-shadow: 0 6px 20px var(--rcu-shadow);
+  }
+  .artwork .fine {
+    margin: 0;
+  }
+
+  /* ---------- buttons ---------- */
+  .btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    font-size: 14px;
+    font-weight: 700;
+    font-family: inherit;
+    letter-spacing: 0.02em;
+    color: var(--rcu-buttonText);
+    background: linear-gradient(135deg, var(--rcu-text), var(--rcu-contrast));
+    border: none;
+    border-radius: 12px;
+    padding: 12px 22px;
+    cursor: pointer;
+    box-shadow: 0 4px 16px var(--rcu-shadow);
+    transition: transform 0.15s, box-shadow 0.25s, filter 0.2s;
+  }
+  .btn:hover:not(:disabled) {
+    transform: translateY(-2px);
+    box-shadow: 0 8px 22px var(--rcu-shadow);
+  }
+  .btn:active:not(:disabled) {
+    transform: translateY(0);
+  }
+  .btn:disabled {
+    opacity: 0.38;
+    cursor: not-allowed;
+    box-shadow: none;
+  }
+  .btn.ghost {
+    background: transparent;
+    border: 1px solid var(--rcu-cardBorder);
+    box-shadow: none;
+    color: var(--rcu-text);
+  }
+  .btn.ghost:hover:not(:disabled) {
+    border-color: var(--rcu-text);
+    background: var(--rcu-inputBg);
+  }
+  .btn.danger {
+    background: linear-gradient(135deg, var(--rcu-red), var(--rcu-contrast));
+    box-shadow: 0 4px 16px var(--rcu-shadow);
+  }
+  .btn.small {
+    font-size: 12px;
+    padding: 8px 14px;
+    border-radius: 9px;
+  }
+  .btn .spin {
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    flex: none;
+    border: 2px solid var(--rcu-shadowSoft);
+    border-top-color: var(--rcu-buttonText);
+    animation: rcu-rot 0.8s linear infinite;
+  }
+  @keyframes rcu-rot {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  .row {
+    display: flex;
+    gap: 10px;
+    flex-wrap: wrap;
+    align-items: center;
+    margin-top: 16px;
+  }
+
+  /* ---------- dropzone / progress ---------- */
+  .dropzone {
+    border: 2px dashed var(--rcu-cardBorder);
+    border-radius: 14px;
+    padding: 30px 20px;
+    text-align: center;
+    cursor: pointer;
+    transition: border-color 0.25s, background 0.25s, transform 0.15s;
+  }
+  .dropzone:hover,
+  .dropzone.over {
+    border-color: var(--rcu-text);
+    background: var(--rcu-inputBg);
+  }
+  .dropzone.over {
+    transform: scale(1.01);
+  }
+  .dropzone .big {
+    font-size: 15px;
+    font-weight: 600;
+  }
+  .dropzone .fine {
+    margin-top: 6px;
+  }
+  .filechip {
+    display: inline-flex;
+    align-items: center;
+    gap: 10px;
+    margin-top: 14px;
+    font-family: 'SF Mono', ui-monospace, Menlo, Consolas, monospace;
+    font-size: 13px;
+    background: var(--rcu-inputBg);
+    border: 1px solid var(--rcu-cardBorder);
+    border-radius: 999px;
+    padding: 8px 16px;
+  }
+  .filechip .x {
+    cursor: pointer;
+    color: var(--rcu-textDim);
+    font-weight: 700;
+  }
+  .filechip .x:hover {
+    color: var(--rcu-red);
+  }
+
+  .vinyl {
+    width: 46px;
+    height: 46px;
+    border-radius: 50%;
+    flex: none;
+    background: radial-gradient(
+      circle at center,
+      var(--rcu-pageBg) 0 17%,
+      var(--rcu-vinylDark) 18% 30%,
+      var(--rcu-vinylMid) 31% 33%,
+      var(--rcu-vinylDark) 34% 46%,
+      var(--rcu-vinylMid) 47% 49%,
+      var(--rcu-vinylDark) 50% 62%,
+      var(--rcu-vinylMid) 63% 65%,
+      var(--rcu-vinylDark) 66% 100%
+    );
+    border: 1px solid var(--rcu-cardBorder);
+    animation: rcu-rot 2.2s linear infinite;
+    box-shadow: 0 3px 12px var(--rcu-shadow);
+  }
+  .bar {
+    height: 12px;
+    border-radius: 999px;
+    overflow: hidden;
+    background: var(--rcu-sunk);
+    border: 1px solid var(--rcu-cardBorder);
+  }
+  .bar > div {
+    height: 100%;
+    width: 0%;
+    background: linear-gradient(
+      90deg,
+      var(--rcu-text),
+      var(--rcu-contrast),
+      var(--rcu-textDim),
+      var(--rcu-text)
+    );
+    background-size: 300% 100%;
+    animation: rcu-sheen 2.2s linear infinite;
+    transition: width 0.3s ease;
+    border-radius: 999px;
+  }
+  .bar.indeterminate > div {
+    width: 100% !important;
+    opacity: 0.75;
+  }
+  .progress-label {
+    font-family: 'SF Mono', ui-monospace, Menlo, Consolas, monospace;
+    font-size: 12px;
+    color: var(--rcu-textDim);
+    margin-top: 8px;
+  }
+
+  .okline {
+    color: var(--rcu-green);
+    font-weight: 600;
+    font-size: 14px;
+  }
+  .warnline {
+    color: var(--rcu-amber);
+    font-size: 13px;
+    margin-top: 8px;
+  }
+
+  /* ---------- platforms ---------- */
+  .platforms {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 14px;
+  }
+  @media (max-width: 620px) {
+    .platforms {
+      grid-template-columns: 1fr;
+    }
+  }
+  .platform {
+    border: 1px solid var(--rcu-cardBorder);
+    border-radius: 14px;
+    padding: 18px;
+    background: var(--rcu-card);
+    transition: border-color 0.3s, box-shadow 0.3s;
+  }
+  .platform[data-platform='mixcloud'].glow {
+    border-color: var(--rcu-mixcloud);
+    box-shadow: 0 4px 18px var(--rcu-shadowSoft);
+  }
+  .platform[data-platform='soundcloud'].glow {
+    border-color: var(--rcu-soundcloud);
+    box-shadow: 0 4px 18px var(--rcu-shadowSoft);
+  }
+  .platform h3 {
+    font-size: 14px;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    margin: 0 0 10px;
+  }
+  .platform[data-platform='mixcloud'] h3 {
+    color: var(--rcu-mixcloud);
+  }
+  .platform[data-platform='soundcloud'] h3 {
+    color: var(--rcu-soundcloud);
+  }
+  .pstatus {
+    font-size: 13px;
+    color: var(--rcu-textDim);
+    min-height: 20px;
+    margin-bottom: 12px;
+  }
+  .pstatus a {
+    color: var(--rcu-text);
+    word-break: break-all;
+  }
+  .pulse {
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: var(--rcu-amber);
+    margin-right: 7px;
+    animation: rcu-pulse 1.4s ease infinite;
+  }
+  @keyframes rcu-pulse {
+    50% {
+      opacity: 0.25;
+      transform: scale(0.8);
+    }
+  }
+
+  /* ---------- log ---------- */
+  .log {
+    font-family: 'SF Mono', ui-monospace, Menlo, Consolas, monospace;
+    font-size: 12px;
+    line-height: 1.75;
+    background: var(--rcu-sunk);
+    border: 1px solid var(--rcu-cardBorder);
+    border-radius: 12px;
+    padding: 16px 18px;
+    max-height: 300px;
+    overflow-y: auto;
+  }
+  .log .entry {
+    animation: rcu-rise 0.3s ease both;
+    overflow-wrap: break-word;
+  }
+  .log .t {
+    color: var(--rcu-textDim);
+    margin-right: 8px;
+  }
+  .log .info {
+    color: var(--rcu-text);
+  }
+  .log .warn {
+    color: var(--rcu-amber);
+  }
+  .log .error {
+    color: var(--rcu-red);
+  }
+  .log .detail {
+    color: var(--rcu-textDim);
+    padding-left: 20px;
+    white-space: pre-wrap;
+  }
+  .log .cursor {
+    display: inline-block;
+    width: 8px;
+    height: 13px;
+    background: var(--rcu-text);
+    vertical-align: text-bottom;
+    animation: rcu-blink 1.1s steps(1) infinite;
+  }
+  @keyframes rcu-blink {
+    50% {
+      opacity: 0;
+    }
+  }
+
+  /* ---------- toasts / notice ---------- */
+  .toasts {
+    position: fixed;
+    top: 18px;
+    right: 18px;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    z-index: 50;
+  }
+  .toast {
+    padding: 13px 18px;
+    border-radius: 12px;
+    font-size: 13px;
+    font-weight: 600;
+    color: var(--rcu-buttonText);
+    background: var(--rcu-text);
+    border: 1px solid var(--rcu-contrast);
+    box-shadow: 0 10px 30px var(--rcu-shadow);
+    animation: rcu-slidein 0.35s cubic-bezier(0.2, 0.9, 0.3, 1.2) both;
+    max-width: 340px;
+  }
+  .toast.success {
+    border-color: var(--rcu-green);
+  }
+  .toast.danger {
+    border-color: var(--rcu-red);
+  }
+  @keyframes rcu-slidein {
+    from {
+      opacity: 0;
+      transform: translateX(40px);
+    }
+  }
+
+  .notice {
+    text-align: center;
+    padding: 60px 30px;
+  }
+  .notice .moon {
+    font-size: 44px;
+    display: block;
+    margin-bottom: 18px;
+    animation: rcu-bob 3s ease-in-out infinite;
+  }
+  @keyframes rcu-bob {
+    50% {
+      transform: translateY(-8px);
+    }
+  }
+  .notice p {
+    color: var(--rcu-textDim);
+    margin-top: 10px;
+    line-height: 1.6;
+  }
+`;
+const DefaultLogo = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 62 62", "aria-hidden": "true", children: [
+  /* @__PURE__ */ jsx("circle", { cx: "31", cy: "31", r: "29", fill: "none", stroke: "currentColor", strokeWidth: "3" }),
+  /* @__PURE__ */ jsx("circle", { cx: "31", cy: "31", r: "6", fill: "currentColor" }),
+  /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M31 44 V22 M22 30 L31 20 L40 30",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "4",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  )
+] });
+const Uploader = () => {
+  const { documentId } = useParams();
+  const token = useAuth("RadiocultUploader", (state) => state.token);
+  const [theme, setTheme] = React.useState(null);
+  const [status, setStatus] = React.useState(null);
+  const [notice, setNotice] = React.useState(null);
+  const [logEntries, setLogEntries] = React.useState([]);
+  const [toasts, setToasts] = React.useState([]);
+  const [form, setForm] = React.useState({
+    title: "",
+    artist: "",
+    album: "",
+    tags: "",
+    description: ""
+  });
+  const formReady = React.useRef(false);
+  const [file, setFile] = React.useState(null);
+  const [dragOver, setDragOver] = React.useState(false);
+  const [uploading, setUploading] = React.useState(false);
+  const [progress, setProgress] = React.useState(0);
+  const [warnings, setWarnings] = React.useState([]);
+  const [saving, setSaving] = React.useState(false);
+  const [publishing, setPublishing] = React.useState(null);
+  const [checking, setChecking] = React.useState(false);
+  const xhrRef = React.useRef(null);
+  const fileInput = React.useRef(null);
+  const statusRef = React.useRef(null);
+  const uploadingRef = React.useRef(false);
+  uploadingRef.current = uploading;
+  const log = React.useCallback(
+    (level, text, detail) => {
+      setLogEntries(
+        (entries) => [
+          { id: nextId++, time: (/* @__PURE__ */ new Date()).toLocaleTimeString("en-GB"), level, text, detail },
+          ...entries
+        ].slice(0, 200)
+      );
+    },
+    []
+  );
+  const toast = React.useCallback((kind, text) => {
+    const id = nextId++;
+    setToasts((all) => [...all, { id, kind, text }]);
+    setTimeout(() => setToasts((all) => all.filter((t) => t.id !== id)), 5200);
+  }, []);
+  const loadStatus = React.useCallback(
+    async (refresh) => {
+      if (!documentId) return null;
+      try {
+        const data = await fetchStatus(documentId, refresh);
+        const prev = statusRef.current;
+        statusRef.current = data;
+        PLATFORMS.forEach((p) => {
+          if (!prev?.platforms[p].link && data.platforms[p].link) {
+            log("info", `${PLATFORM_LABEL[p]} link saved to the entry`, data.platforms[p].link);
+            toast("success", `${PLATFORM_LABEL[p]} link saved to the entry ✨`);
+          }
+        });
+        if (data.rateLimitMessage) log("warn", data.rateLimitMessage);
+        if (!formReady.current) {
+          const d = data.details;
+          setForm({
+            title: d.title || "",
+            artist: d.artist || "",
+            album: d.album || "",
+            tags: (d.genres || []).join(", "),
+            description: d.description || ""
+          });
+          formReady.current = true;
+          log("info", "Entry loaded", `documentId ${documentId}`);
+        }
+        const tabName = data.details.showName || data.details.title || "";
+        document.title = tabName ? `↑${tabName}` : "↑ Episode Uploader";
+        setStatus(data);
+        setNotice(null);
+        return data;
+      } catch (error) {
+        const message = apiError(error);
+        log("error", "Could not load the entry status", message);
+        if (!statusRef.current) {
+          setNotice({
+            title: "Could not load the entry",
+            text: `${message} — check the plugin settings and the server, then reload this page.`
+          });
+        }
+        return null;
+      }
+    },
+    [documentId, log, toast]
+  );
+  React.useEffect(() => {
+    fetchUiConfig().then(({ theme: t }) => setTheme(t)).catch(() => setTheme(null));
+    loadStatus(false);
+  }, [loadStatus]);
+  useGoogleFont(googleFontHref(resolveFont(theme)));
+  const anyPublishing = PLATFORMS.some((p) => status?.platforms[p].state === "publishing");
+  React.useEffect(() => {
+    if (!anyPublishing) return void 0;
+    const timer = setInterval(() => {
+      if (document.visibilityState === "visible" && !uploadingRef.current) loadStatus(false);
+    }, POLL_MS);
+    return () => clearInterval(timer);
+  }, [anyPublishing, loadStatus]);
+  React.useEffect(() => {
+    const handler = (e) => {
+      if (uploadingRef.current) {
+        e.preventDefault();
+        e.returnValue = "";
+      }
+    };
+    window.addEventListener("beforeunload", handler);
+    return () => window.removeEventListener("beforeunload", handler);
+  }, []);
+  const pickFile = (f) => {
+    if (f) {
+      const ext = (f.name.match(/\.[^.]+$/) || [""])[0].toLowerCase();
+      if (ext !== ".mp3" && ext !== ".m4a") {
+        log("error", `Rejected "${f.name}"`, "Radio Cult only accepts .mp3 or .m4a");
+        toast("danger", "Only .mp3 or .m4a files can be uploaded");
+        return;
+      }
+      if (f.size > MAX_BYTES) {
+        log("error", `Rejected "${f.name}"`, `Over Radio Cult’s 750MB limit (${mb(f.size)})`);
+        toast("danger", "File is over the 750MB limit");
+        return;
+      }
+      log("info", `Selected "${f.name}" (${mb(f.size)})`);
+    }
+    setFile(f);
+  };
+  const startUpload = (force) => {
+    if (!file || uploading || !documentId || !token) return;
+    const meta = { title: form.title.trim(), artist: form.artist.trim(), album: form.album.trim() };
+    setUploading(true);
+    setProgress(0);
+    log(
+      "info",
+      `${force ? "Replacing track with" : "Uploading"} "${file.name}" (${mb(file.size)})`,
+      `title "${meta.title}" · artist "${meta.artist}" · album "${meta.album}"`
+    );
+    xhrRef.current = uploadTrack(documentId, file, meta, force, token, {
+      onProgress: setProgress,
+      onDone: (body) => {
+        log("info", `Track uploaded to Radio Cult (id ${body.trackId})`);
+        (body.warnings || []).forEach((w) => log("warn", w));
+        setWarnings(body.warnings || []);
+        toast("success", "Episode uploaded to Radio Cult 🎉");
+        setFile(null);
+        setUploading(false);
+        loadStatus(false);
+      },
+      onConflict: (message) => {
+        setUploading(false);
+        if (window.confirm(
+          `${message}
+
+Replace it with the new file? The old track stays in the Radio Cult library until you delete it there.`
+        )) {
+          startUpload(true);
+        } else {
+          log("warn", "Upload cancelled — entry already has a Radio Cult track");
+        }
+      },
+      onError: (message, httpStatus) => {
+        log("error", "Upload to Radio Cult failed", `${message}${httpStatus ? ` (HTTP ${httpStatus})` : ""}`);
+        toast("danger", "Upload to Radio Cult failed");
+        setUploading(false);
+      },
+      onAbort: () => {
+        log("warn", "Upload cancelled");
+        setUploading(false);
+      }
+    });
+  };
+  const saveDetails = async () => {
+    if (saving || !documentId) return;
+    setSaving(true);
+    const meta = { title: form.title.trim(), artist: form.artist.trim(), album: form.album.trim() };
+    try {
+      await saveTrackDetails(documentId, meta);
+      log(
+        "info",
+        "Track details saved to Radio Cult",
+        `title "${meta.title}" · artist "${meta.artist}" · album "${meta.album}"`
+      );
+      toast("success", "Track details saved to Radio Cult");
+    } catch (error) {
+      log("error", "Saving track details failed", apiError(error));
+      toast("danger", "Saving track details failed");
+    } finally {
+      setSaving(false);
+    }
+  };
+  const doPublish = async (platform, force) => {
+    if (publishing || !documentId) return;
+    setPublishing(platform);
+    const tags = form.tags.split(",").map((t) => t.trim()).filter(Boolean);
+    log("info", `Requesting ${PLATFORM_LABEL[platform]} publish`, `title "${form.title.trim()}" · tags [${tags.join(", ")}]`);
+    try {
+      await publishTrack(
+        documentId,
+        platform,
+        { title: form.title.trim(), tags, description: form.description },
+        force
+      );
+      log(
+        "info",
+        `${PLATFORM_LABEL[platform]} publish requested — Radio Cult is transferring; the link lands on the entry automatically`
+      );
+      toast("success", `Publish to ${PLATFORM_LABEL[platform]} requested`);
+      setPublishing(null);
+      await loadStatus(false);
+    } catch (error) {
+      setPublishing(null);
+      const message = apiError(error);
+      const httpStatus = error?.response?.status;
+      if (httpStatus === 409 && !force) {
+        if (window.confirm(`${message}
+
+Send the request anyway?`)) return doPublish(platform, true);
+        log("warn", `${PLATFORM_LABEL[platform]} publish not sent`, message);
+      } else {
+        log("error", `${PLATFORM_LABEL[platform]} publish failed`, message);
+        toast("danger", `${PLATFORM_LABEL[platform]} publish failed`);
+      }
+    }
+  };
+  const checkNow = async () => {
+    if (checking) return;
+    setChecking(true);
+    log("info", "Checking Radio Cult for new links…");
+    const data = await loadStatus(true);
+    if (data) {
+      log(
+        "info",
+        `Check finished — ${PLATFORMS.map((p) => `${PLATFORM_LABEL[p]}: ${data.platforms[p].state.replace("_", " ")}`).join(" · ")}`
+      );
+    }
+    setChecking(false);
+  };
+  const cssVars = themeToCssVars(theme);
+  const stationName = theme?.stationName || "";
+  const hasTrack = !!status?.trackId;
+  const allLinked = !!status && PLATFORMS.every((p) => status.platforms[p].state === "linked");
+  const busyAnim = uploading || anyPublishing;
+  const renderBody = () => {
+    if (!documentId) {
+      return /* @__PURE__ */ jsx(Notice, { title: "No entry selected", text: "Open this page with the uploader button on an entry's edit page in the Strapi admin." });
+    }
+    if (notice) return /* @__PURE__ */ jsx(Notice, { title: notice.title, text: notice.text });
+    if (!status) return /* @__PURE__ */ jsx(Notice, { title: "Loading…", text: "Fetching the entry's Radio Cult status." });
+    if (!status.enabled) {
+      return /* @__PURE__ */ jsx(
+        Notice,
+        {
+          title: "Radio Cult is switched off",
+          text: "Uploads are disabled — check the API key, station ID and enabled toggle in Settings → Radio Cult Uploader."
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsxs("section", { className: `card ${hasTrack ? "done" : "active"}`, children: [
+        /* @__PURE__ */ jsxs("div", { className: "step-head", children: [
+          /* @__PURE__ */ jsx("div", { className: "badge", children: hasTrack ? "✓" : "1" }),
+          /* @__PURE__ */ jsx("h2", { children: "Track details" }),
+          /* @__PURE__ */ jsxs("div", { className: "hint", children: [
+            "Prefilled from the entry — edit freely.",
+            /* @__PURE__ */ jsx("br", {}),
+            "Changes never touch the Strapi entry."
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "grid", children: [
+          /* @__PURE__ */ jsxs("div", { className: "full", children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "f-title", children: "Title" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                id: "f-title",
+                autoComplete: "off",
+                value: form.title,
+                onChange: (e) => setForm({ ...form, title: e.target.value })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "f-artist", children: "Artist" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                id: "f-artist",
+                autoComplete: "off",
+                value: form.artist,
+                onChange: (e) => setForm({ ...form, artist: e.target.value })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "f-album", children: "Album" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                id: "f-album",
+                autoComplete: "off",
+                value: form.album,
+                onChange: (e) => setForm({ ...form, album: e.target.value })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "full", children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "f-tags", children: "Tags" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                id: "f-tags",
+                autoComplete: "off",
+                value: form.tags,
+                onChange: (e) => setForm({ ...form, tags: e.target.value })
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "fine", children: "Comma-separated. Used on Mixcloud (first 5) and SoundCloud." })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "full", children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "f-desc", children: "Description" }),
+            /* @__PURE__ */ jsx(
+              "textarea",
+              {
+                id: "f-desc",
+                value: form.description,
+                onChange: (e) => setForm({ ...form, description: e.target.value })
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "fine", children: "Used on Mixcloud and SoundCloud." })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "artwork", children: status.details.image?.previewUrl ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("img", { src: status.details.image.previewUrl, alt: status.details.image.name }),
+          /* @__PURE__ */ jsxs("div", { className: "fine", children: [
+            "Artwork comes from the entry image — change it on the entry page.",
+            status.details.image.usable ? "" : " ⚠ No jpeg/png version under 2MB, so Mixcloud/SoundCloud may get no artwork."
+          ] })
+        ] }) : /* @__PURE__ */ jsx("div", { className: "warnline", children: "No image set on the entry — the track and publishes will have no artwork." }) }),
+        hasTrack ? /* @__PURE__ */ jsxs("div", { className: "row", children: [
+          /* @__PURE__ */ jsxs("button", { className: "btn ghost small", onClick: saveDetails, disabled: saving, children: [
+            saving ? /* @__PURE__ */ jsx("span", { className: "spin" }) : null,
+            "Save details to Radio Cult"
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "fine", children: "Pushes title / artist / album to the already-uploaded track." })
+        ] }) : null
+      ] }),
+      /* @__PURE__ */ jsxs("section", { className: `card ${hasTrack ? "done" : "active"}`, children: [
+        /* @__PURE__ */ jsxs("div", { className: "step-head", children: [
+          /* @__PURE__ */ jsx("div", { className: "badge", children: hasTrack ? "✓" : "2" }),
+          /* @__PURE__ */ jsx("h2", { children: "Upload to Radio Cult" }),
+          /* @__PURE__ */ jsx("div", { className: "hint", children: hasTrack ? "Pick a new file only if you need to replace the audio" : ".mp3 or .m4a · up to 750MB" })
+        ] }),
+        hasTrack ? /* @__PURE__ */ jsxs("div", { className: "okline", children: [
+          "✓ Track uploaded",
+          status.uploadedAt ? ` on ${new Date(status.uploadedAt).toLocaleString("en-GB")}` : "",
+          " (id",
+          " ",
+          status.trackId,
+          ")"
+        ] }) : null,
+        !uploading ? /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `dropzone ${dragOver ? "over" : ""}`,
+              onClick: () => fileInput.current?.click(),
+              onDragEnter: (e) => {
+                e.preventDefault();
+                setDragOver(true);
+              },
+              onDragOver: (e) => {
+                e.preventDefault();
+                setDragOver(true);
+              },
+              onDragLeave: (e) => {
+                e.preventDefault();
+                setDragOver(false);
+              },
+              onDrop: (e) => {
+                e.preventDefault();
+                setDragOver(false);
+                if (e.dataTransfer.files[0]) pickFile(e.dataTransfer.files[0]);
+              },
+              children: [
+                /* @__PURE__ */ jsx("div", { className: "big", children: "Drop the episode audio here" }),
+                /* @__PURE__ */ jsx("div", { className: "fine", children: "or click to browse — mp3 gets the entry image embedded as artwork" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: fileInput,
+              type: "file",
+              accept: ".mp3,.m4a,audio/mpeg,audio/mp4",
+              style: { display: "none" },
+              onChange: (e) => pickFile(e.target.files?.[0] ?? null)
+            }
+          ),
+          file ? /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: "filechip", children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              "♫ ",
+              file.name,
+              " · ",
+              mb(file.size)
+            ] }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "x",
+                title: "Remove",
+                onClick: () => pickFile(null),
+                children: "✕"
+              }
+            )
+          ] }) }) : null,
+          /* @__PURE__ */ jsx("div", { className: "row", children: /* @__PURE__ */ jsx(
+            "button",
+            {
+              className: `btn ${hasTrack ? "danger" : ""}`,
+              disabled: !file,
+              onClick: () => startUpload(false),
+              children: hasTrack ? "Replace track on Radio Cult" : "Upload to Radio Cult"
+            }
+          ) })
+        ] }) : /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: "row", style: { marginTop: 4 }, children: [
+          /* @__PURE__ */ jsx("div", { className: "vinyl" }),
+          /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
+            /* @__PURE__ */ jsx("div", { className: `bar ${progress === null ? "indeterminate" : ""}`, children: /* @__PURE__ */ jsx("div", { style: { width: `${progress ?? 100}%` } }) }),
+            /* @__PURE__ */ jsx("div", { className: "progress-label", children: progress === null ? "File received — Radio Cult is processing… keep this tab open." : `Sending file… ${progress}%` })
+          ] }),
+          /* @__PURE__ */ jsx("button", { className: "btn danger small", onClick: () => xhrRef.current?.abort(), children: "Cancel" })
+        ] }) }),
+        /* @__PURE__ */ jsx("div", { children: warnings.map((w) => /* @__PURE__ */ jsxs("div", { className: "warnline", children: [
+          "⚠ ",
+          w
+        ] }, w)) })
+      ] }),
+      /* @__PURE__ */ jsxs(
+        "section",
+        {
+          className: `card ${!hasTrack ? "locked" : allLinked ? "done" : "active"}`,
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "step-head", children: [
+              /* @__PURE__ */ jsx("div", { className: "badge", children: allLinked ? "✓" : "3" }),
+              /* @__PURE__ */ jsx("h2", { children: "Publish to Mixcloud & SoundCloud" }),
+              /* @__PURE__ */ jsx("div", { className: "hint", children: hasTrack ? "" : "Unlocks after step 2 — publishing goes through Radio Cult." })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "platforms", children: PLATFORMS.map((p) => {
+              const s = status.platforms[p];
+              return /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: `platform ${s.state === "publishing" || s.state === "linked" ? "glow" : ""}`,
+                  "data-platform": p,
+                  children: [
+                    /* @__PURE__ */ jsx("h3", { children: PLATFORM_LABEL[p] }),
+                    /* @__PURE__ */ jsx("div", { className: "pstatus", children: s.state === "linked" && s.link ? /* @__PURE__ */ jsx("a", { href: s.link, target: "_blank", rel: "noreferrer", children: s.link }) : s.state === "publishing" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("span", { className: "pulse" }),
+                      "Publishing… link is saved to the entry automatically."
+                    ] }) : s.state === "stalled" ? "No link after 7 days — the transfer probably failed." : "Not published yet." }),
+                    s.state !== "linked" && s.state !== "publishing" ? /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        className: "btn small",
+                        disabled: !hasTrack || !!publishing,
+                        onClick: () => doPublish(p, false),
+                        children: [
+                          publishing === p ? /* @__PURE__ */ jsx("span", { className: "spin" }) : null,
+                          s.state === "stalled" ? "Publish again" : `Publish to ${PLATFORM_LABEL[p]}`
+                        ]
+                      }
+                    ) : null
+                  ]
+                },
+                p
+              );
+            }) }),
+            /* @__PURE__ */ jsxs("div", { className: "row", children: [
+              /* @__PURE__ */ jsxs("button", { className: "btn ghost small", onClick: checkNow, disabled: checking, children: [
+                checking ? /* @__PURE__ */ jsx("span", { className: "spin" }) : null,
+                "Check for links now"
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "fine", children: "Links are also checked automatically every 10 minutes and saved straight onto the entry." })
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs("section", { className: "card", children: [
+        /* @__PURE__ */ jsxs("div", { className: "step-head", children: [
+          /* @__PURE__ */ jsx("div", { className: "badge", style: { boxShadow: "none" }, children: "▤" }),
+          /* @__PURE__ */ jsx("h2", { children: "Activity log" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "log", children: [
+          /* @__PURE__ */ jsx("span", { className: "cursor" }),
+          logEntries.map((entry) => /* @__PURE__ */ jsxs("div", { className: "entry", children: [
+            /* @__PURE__ */ jsx("span", { className: "t", children: entry.time }),
+            /* @__PURE__ */ jsx("span", { className: entry.level, children: entry.text }),
+            entry.detail ? /* @__PURE__ */ jsx("div", { className: "detail", children: entry.detail }) : null
+          ] }, entry.id))
+        ] })
+      ] })
+    ] });
+  };
+  return /* @__PURE__ */ jsxs(Page, { style: cssVars, children: [
+    /* @__PURE__ */ jsxs("div", { className: "wrap", children: [
+      /* @__PURE__ */ jsxs("header", { children: [
+        /* @__PURE__ */ jsx("div", { className: `eq ${busyAnim ? "" : "paused"}`, children: theme?.logoUrl ? /* @__PURE__ */ jsx("img", { src: theme.logoUrl, alt: stationName || "logo" }) : /* @__PURE__ */ jsx(DefaultLogo, {}) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("h1", { children: "Episode Uploader" }),
+          /* @__PURE__ */ jsxs("div", { className: "strap", children: [
+            stationName ? `${stationName} · ` : "",
+            /* @__PURE__ */ jsx("b", { children: status?.details.title || "loading entry…" })
+          ] })
+        ] })
+      ] }),
+      renderBody()
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "toasts", children: toasts.map((t) => /* @__PURE__ */ jsx("div", { className: `toast ${t.kind}`, children: t.text }, t.id)) })
+  ] });
+};
+const Notice = ({ title, text }) => /* @__PURE__ */ jsxs("section", { className: "card notice", children: [
+  /* @__PURE__ */ jsx("span", { className: "moon", children: "🌙" }),
+  /* @__PURE__ */ jsx("h2", { children: title }),
+  /* @__PURE__ */ jsx("p", { children: text })
+] });
+const App = () => {
+  return /* @__PURE__ */ jsxs(Routes, { children: [
+    /* @__PURE__ */ jsx(Route, { index: true, element: /* @__PURE__ */ jsx(HomePage, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "upload/:documentId", element: /* @__PURE__ */ jsx(Uploader, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "*", element: /* @__PURE__ */ jsx(Page$1.Error, {}) })
+  ] });
+};
+export {
+  App as default
+};