{isDelete ? (
<>This removes the play from your dashboard. Revision history, stage state, and feedback notes are gone. This cannot be undone.
) : (
<>The play returns to Stage 1 · Narrative. Stage index, revision history, status, and feedback notes are cleared. Files in SharePoint stay.
)}
{isDelete && (
)}
{err && (
{err}
)}
);
}
window.PlayCardMenu = PlayCardMenu;
window.PlayActionModal = PlayActionModal;
// Small folder-icon link in the same top-right cluster as PlayCardMenu.
// Opens the play's SharePoint folder in a new tab. stopPropagation so the
// card-click navigation still works.
function PlayFolderLink({ persona }) {
if (!persona || !window.spPlayFolderUrl) return null;
const url = window.spPlayFolderUrl(persona);
const stop = (e) => e.stopPropagation();
return (
);
}
window.PlayFolderLink = PlayFolderLink;
/* Error boundary — catches any async/render error in a subtree and shows
a plain fallback instead of crashing the whole app. */
class ErrorBoundary extends React.Component {
constructor(props) {
super(props);
this.state = { hasError: false, msg: "" };
}
static getDerivedStateFromError(err) {
return { hasError: true, msg: err && err.message ? err.message : String(err) };
}
componentDidCatch(err, info) {
console.warn("[ErrorBoundary] caught:", err.message, info.componentStack);
}
render() {
if (this.state.hasError) {
return this.props.fallback || (
{this.props.label || "Section unavailable"}
);
}
return this.props.children;
}
}
window.ErrorBoundary = ErrorBoundary;
// Global notification toast — listens for t24:notification and shows a
// dismissible banner at the top of the screen for 8 seconds.
function NotificationToast() {
const [notif, setNotif] = React.useState(null);
React.useEffect(() => {
const handler = (e) => {
setNotif(e.detail);
setTimeout(() => setNotif(null), 8000);
};
window.addEventListener("t24:notification", handler);
return () => window.removeEventListener("t24:notification", handler);
}, []);
if (!notif) return null;
return (
{notif.title}
{notif.body}
);
}
window.NotificationToast = NotificationToast;
function Dashboard({ onOpenProject, onNewProject, onPlaysLoaded }) {
const [tab, setTab] = React.useState("active");
const [view, setView] = React.useState("grid");
const { loading, plays, error } = useLivePlays();
// Pipeline-completion notifications are watched at the App level so they
// fire regardless of which page is currently mounted (used to only run on
// dashboard, so transitions that happened while on workspace were missed).
React.useEffect(() => {
if (!loading && plays.length > 0 && onPlaysLoaded) onPlaysLoaded(plays);
}, [loading, plays]);
// Derive stats from live data
const allPlays = plays.length > 0 ? plays : [];
const active = allPlays.filter(p => !p.done);
const done = allPlays.filter(p => p.done);
const review = allPlays.filter(p => p.statusKind === "review" && !p.done);
const filtered =
tab === "active" ? active :
tab === "review" ? review :
tab === "done" ? done : allPlays;
const featured = active[0] || null;
const rest = filtered.filter(p => !featured || p.id !== (tab === "active" ? featured.id : "__none"));
// Live greeting
const now = new Date();
const dayName = now.toLocaleDateString("en-US", { weekday: "long" });
const dateStr = now.toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" });
const hour = now.getHours();
const greeting = hour < 12 ? "Good morning" : hour < 17 ? "Good afternoon" : "Good evening";
const reviewCount = review.length;
const deckReady = allPlays.filter(p => p.stageIndex === 3 && p.statusKind === "review").length;
const stuckPlays = allPlays.filter(p => (p.statusKind === "stuck" || p.statusKind === "error") && !p.done);
if (loading) return (
);
}
function NewPlayCard({ onClick }) {
return (
);
}
function PlayListView({ projects, onOpen }) {
return (
PlayCohortStageDueTeam
{projects.map(p => (
))}
);
}
function ActivityStrip({ plays = [] }) {
// Derive activity from real plays — show last activity per play, most recent first
const items = plays
.filter(p => p.lastActivity)
.sort((a, b) => (b.lastActivityAt || "").localeCompare(a.lastActivityAt || ""))
.slice(0, 5)
.map(p => ({
persona: p.persona,
target: `${p.persona} play`,
what: p.lastActivity,
statusKind: p.statusKind,
}));
return (