// Root App
const { useState, useEffect } = React;
function App() {
const [activeId, setActiveId] = useState(() => {
return localStorage.getItem("cm.activeId") || AppData.GROUPS[0].id;
});
const [broadcastOpen, setBroadcastOpen] = useState(false);
const [broadcastPrefill, setBroadcastPrefill] = useState(null);
const [editMode, setEditMode] = useState(false);
const [tweaks, setTweaks] = useState(() => ({ ...window.TWEAK_DEFAULTS }));
useEffect(() => { window.applyTweaks(tweaks); }, []);
useEffect(() => { localStorage.setItem("cm.activeId", activeId); }, [activeId]);
// Edit-mode host protocol
useEffect(() => {
const onMsg = (e) => {
if (!e.data || typeof e.data !== "object") return;
if (e.data.type === "__activate_edit_mode") setEditMode(true);
if (e.data.type === "__deactivate_edit_mode") setEditMode(false);
};
window.addEventListener("message", onMsg);
window.parent.postMessage({ type: "__edit_mode_available" }, "*");
return () => window.removeEventListener("message", onMsg);
}, []);
const activeGroup = AppData.GROUPS.find(g => g.id === activeId) || AppData.GROUPS[0];
return (
{ setBroadcastPrefill(null); setBroadcastOpen(true); }}/>
setActiveId(g.id)}
onOpenBroadcast={() => { setBroadcastPrefill(null); setBroadcastOpen(true); }}
/>
setBroadcastOpen(false)}
groups={AppData.GROUPS}
prefillGroup={broadcastPrefill}
/>
{editMode && (
setEditMode(false)}/>
)}
);
}
const TopBar = ({ onOpenBroadcast }) => {
return (
实时同步中
} onClick={onOpenBroadcast}>
群发消息
管
);
};
ReactDOM.createRoot(document.getElementById("root")).render();