function MainComponent() { const [stats, setStats] = React.useState({ posts: null, likes: null, bookmarks: null, comments: null }); const [loading, setLoading] = React.useState(true); const [error, setError] = React.useState(null); React.useEffect(()=>{ let ignore = false; setLoading(true); setError(null); async function fetchStats() { try { const [postsRes, likesRes, bookmarksRes, commentsRes] = await Promise.all([ fetch("/api/forks/stats", { method: "POST" }), fetch("/api/likes/stats", { method: "POST" }), fetch("/api/bookmarks/stats", { method: "POST" }), fetch("/api/comments/stats", { method: "POST" }) ]); if (!postsRes.ok) throw new Error("投稿数の取得に失敗しました"); if (!likesRes.ok) throw new Error("いいね数の取得に失敗しました"); if (!bookmarksRes.ok) throw new Error("ブックマーク数の取得に失敗しました"); if (!commentsRes.ok) throw new Error("コメント数の取得に失敗しました"); const postsData = await postsRes.json(); const likesData = await likesRes.json(); const bookmarksData = await bookmarksRes.json(); const commentsData = await commentsRes.json(); if (!ignore) { setStats({ posts: postsData.totalCount ?? 0, likes: likesData.totalCount ?? 0, bookmarks: bookmarksData.totalCount ?? 0, comments: commentsData.totalCount ?? 0 }); } } catch (err) { if (!ignore) { setError("データの取得に失敗しました"); console.error(err); } } finally{ if (!ignore) setLoading(false); } } fetchStats(); return ()=>{ ignore = true; }; }, []); const [postChartData, setPostChartData] = React.useState([]); const [chartType, setChartType] = React.useState("posts"); // 'posts' | 'comments' | 'likes' | 'bookmarks' const [commentChartData, setCommentChartData] = React.useState([]); const [likeChartData, setLikeChartData] = React.useState([]); const [bookmarkChartData, setBookmarkChartData] = React.useState([]); const [chartLoading, setChartLoading] = React.useState(true); const [chartError, setChartError] = React.useState(null); React.useEffect(()=>{ let ignore = false; setChartLoading(true); setChartError(null); async function fetchChartData() { try { const [postRes, commentRes, likeRes, bookmarkRes] = await Promise.all([ fetch("/api/forks/count-by-date", { method: "POST" }), fetch("/api/comments/count-by-date", { method: "POST" }), fetch("/api/likes/count-by-date", { method: "POST" }), fetch("/api/bookmarks/count-by-date", { method: "POST" }) ]); if (!postRes.ok) throw new Error("投稿数グラフの取得に失敗しました"); if (!commentRes.ok) throw new Error("コメント数グラフの取得に失敗しました"); if (!likeRes.ok) throw new Error("いいね数グラフの取得に失敗しました"); if (!bookmarkRes.ok) throw new Error("ブックマーク数グラフの取得に失敗しました"); const postData = await postRes.json(); const commentData = await commentRes.json(); const likeData = await likeRes.json(); const bookmarkData = await bookmarkRes.json(); if (!ignore) { setPostChartData(postData); setCommentChartData(commentData); setLikeChartData(likeData); setBookmarkChartData(bookmarkData); } } catch (err) { if (!ignore) { setChartError("グラフの取得に失敗しました"); console.error(err); } } finally{ if (!ignore) setChartLoading(false); } } fetchChartData(); return ()=>{ ignore = true; }; }, []); const [resultBreakdown, setResultBreakdown] = React.useState([]); const [ageBreakdown, setAgeBreakdown] = React.useState([]); const [breakdownLoading, setBreakdownLoading] = React.useState(true); const [breakdownError, setBreakdownError] = React.useState(null); React.useEffect(()=>{ let ignore = false; setBreakdownLoading(true); setBreakdownError(null); async function fetchBreakdowns() { try { const [resultRes, ageRes] = await Promise.all([ fetch("/api/forks/result-breakdown", { method: "POST" }), fetch("/api/forks/age-breakdown", { method: "POST" }) ]); if (!resultRes.ok) throw new Error("結果内訳の取得に失敗しました"); if (!ageRes.ok) throw new Error("年齢内訳の取得に失敗しました"); const resultData = await resultRes.json(); const ageData = await ageRes.json(); if (!ignore) { setResultBreakdown(resultData && Array.isArray(resultData.breakdown) ? resultData.breakdown : []); setAgeBreakdown(ageData && Array.isArray(ageData.breakdown) ? ageData.breakdown : []); } } catch (err) { if (!ignore) { setBreakdownError("内訳データの取得に失敗しました"); console.error(err); } } finally{ if (!ignore) setBreakdownLoading(false); } } fetchBreakdowns(); return ()=>{ ignore = true; }; }, []); const [typeBreakdown, setTypeBreakdown] = React.useState([]); const [typeBreakdownLoading, setTypeBreakdownLoading] = React.useState(true); const [typeBreakdownError, setTypeBreakdownError] = React.useState(null); React.useEffect(()=>{ let ignore = false; setTypeBreakdownLoading(true); setTypeBreakdownError(null); async function fetchTypeBreakdown() { try { const res = await fetch("/api/forks/type-breakdown", { method: "POST" }); if (!res.ok) throw new Error("fork_type内訳の取得に失敗しました"); const data = await res.json(); if (!ignore) setTypeBreakdown(data); } catch (err) { if (!ignore) { setTypeBreakdownError("fork_type内訳の取得に失敗しました"); console.error(err); } } finally{ if (!ignore) setTypeBreakdownLoading(false); } } fetchTypeBreakdown(); return ()=>{ ignore = true; }; }, []); const [publicPrivateStats, setPublicPrivateStats] = React.useState({ publicCount: null, privateCount: null }); const [publicPrivateLoading, setPublicPrivateLoading] = React.useState(true); const [publicPrivateError, setPublicPrivateError] = React.useState(null); React.useEffect(()=>{ let ignore = false; setPublicPrivateLoading(true); setPublicPrivateError(null); async function fetchPublicPrivate() { try { const res = await fetch("/api/forks/public-private-stats", { method: "POST" }); if (!res.ok) throw new Error("公開/非公開割合の取得に失敗しました"); const data = await res.json(); if (!ignore) setPublicPrivateStats(data); } catch (err) { if (!ignore) { setPublicPrivateError("公開/非公開割合の取得に失敗しました"); console.error(err); } } finally{ if (!ignore) setPublicPrivateLoading(false); } } fetchPublicPrivate(); return ()=>{ ignore = true; }; }, []); const StatCard = ({ icon, label, value, color })=>/*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center bg-white rounded-xl shadow-md p-6 w-full min-w-[140px]", __source: { fileName: "", lineNumber: 223, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `text-4xl mb-2 ${color}`, __source: { fileName: "", lineNumber: 224, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: icon, __source: { fileName: "", lineNumber: 225, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold text-gray-900 font-roboto", __source: { fileName: "", lineNumber: 227, columnNumber: 7 }, __self: this }, value !== null && value !== undefined ? value.toLocaleString() : "-"), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-600 mt-1 font-roboto", __source: { fileName: "", lineNumber: 230, columnNumber: 7 }, __self: this }, label)); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 py-10 px-4", __source: { fileName: "", lineNumber: 235, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto", __source: { fileName: "", lineNumber: 236, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl md:text-3xl font-bold text-gray-800 mb-8 text-center font-roboto", __source: { fileName: "", lineNumber: 237, columnNumber: 9 }, __self: this }, "サイト全体の統計"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2 mb-2 justify-center", __source: { fileName: "", lineNumber: 241, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `px-3 py-1 rounded font-roboto text-sm ${chartType === "posts" ? "bg-indigo-500 text-white" : "bg-gray-200 text-gray-700"}`, onClick: ()=>setChartType("posts"), __source: { fileName: "", lineNumber: 242, columnNumber: 11 }, __self: this }, "投稿数"), /*#__PURE__*/ React.createElement("button", { className: `px-3 py-1 rounded font-roboto text-sm ${chartType === "likes" ? "bg-pink-500 text-white" : "bg-gray-200 text-gray-700"}`, onClick: ()=>setChartType("likes"), __source: { fileName: "", lineNumber: 252, columnNumber: 11 }, __self: this }, "いいね数"), /*#__PURE__*/ React.createElement("button", { className: `px-3 py-1 rounded font-roboto text-sm ${chartType === "comments" ? "bg-green-500 text-white" : "bg-gray-200 text-gray-700"}`, onClick: ()=>setChartType("comments"), __source: { fileName: "", lineNumber: 262, columnNumber: 11 }, __self: this }, "コメント数"), /*#__PURE__*/ React.createElement("button", { className: `px-3 py-1 rounded font-roboto text-sm ${chartType === "bookmarks" ? "bg-yellow-500 text-white" : "bg-gray-200 text-gray-700"}`, onClick: ()=>setChartType("bookmarks"), __source: { fileName: "", lineNumber: 272, columnNumber: 11 }, __self: this }, "ブックマーク数")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center w-full", __source: { fileName: "", lineNumber: 284, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full overflow-x-auto max-w-2xl flex justify-center", __source: { fileName: "", lineNumber: 285, columnNumber: 11 }, __self: this }, (()=>{ let data = []; let label = ""; let color = ""; if (chartType === "posts") { data = postChartData; label = "投稿数"; color = "#6366f1"; } else if (chartType === "likes") { data = likeChartData; label = "いいね数"; color = "#ec4899"; } else if (chartType === "comments") { data = commentChartData; label = "コメント数"; color = "#22c55e"; } else if (chartType === "bookmarks") { data = bookmarkChartData; label = "ブックマーク数"; color = "#eab308"; } if (chartLoading) { return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-40", __source: { fileName: "", lineNumber: 309, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "animate-spin h-6 w-6 text-indigo-500", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 310, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", fill: "none", __source: { fileName: "", lineNumber: 314, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z", __source: { fileName: "", lineNumber: 323, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 329, columnNumber: 21 }, __self: this }, "読み込み中...")); } if (chartError) { return /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded text-center", __source: { fileName: "", lineNumber: 337, columnNumber: 19 }, __self: this }, chartError); } if (!data || data.length === 0) { return /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 text-center font-roboto py-8", __source: { fileName: "", lineNumber: 344, columnNumber: 19 }, __self: this }, "データがありません"); } return /*#__PURE__*/ React.createElement("svg", { width: Math.max(data.length * 32 + 60, 320), height: "200", viewBox: `0 0 ${Math.max(data.length * 32 + 60, 320)} 200`, className: "block mx-auto", __source: { fileName: "", lineNumber: 350, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("text", { x: "10", y: "20", fontSize: "12", fill: "#555", className: "font-roboto", __source: { fileName: "", lineNumber: 357, columnNumber: 19 }, __self: this }, label), data.map((d, i)=>{ const month = d.date.slice(5, 7); const isFirstOfMonth = i === 0 || d.date.slice(5, 7) !== data[i - 1].date.slice(5, 7); return isFirstOfMonth && /*#__PURE__*/ React.createElement("text", { key: d.date + "-month", x: 32 * i + 40, y: "35", fontSize: "11", fill: "#1e293b", textAnchor: "middle", className: "font-roboto", __source: { fileName: "", lineNumber: 374, columnNumber: 25 }, __self: this }, parseInt(month, 10), "月"); }), data.map((d, i)=>/*#__PURE__*/ React.createElement("text", { key: d.date, x: 32 * i + 40, y: "185", fontSize: "10", fill: "#888", textAnchor: "middle", className: "font-roboto", __source: { fileName: "", lineNumber: 390, columnNumber: 21 }, __self: this }, (()=>{ const dateOnly = d.date.slice(8, 10); return dateOnly.startsWith("0") ? dateOnly.slice(1) : dateOnly; })())), (()=>{ const max = Math.max(...data.map((d)=>d.count), 1); return data.map((d, i)=>{ const barHeight = Math.round(d.count / max * 120); return /*#__PURE__*/ React.createElement("g", { key: d.date, __source: { fileName: "", lineNumber: 413, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("rect", { x: 32 * i + 28, y: 150 - barHeight, width: "20", height: barHeight, fill: color, rx: "4", __source: { fileName: "", lineNumber: 414, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("text", { x: 32 * i + 38, y: 150 - barHeight - 6, fontSize: "10", fill: "#333", textAnchor: "middle", className: "font-roboto", __source: { fileName: "", lineNumber: 422, columnNumber: 27 }, __self: this }, d.count)); }); })(), /*#__PURE__*/ React.createElement("line", { x1: "30", y1: "30", x2: "30", y2: "150", stroke: "#bbb", strokeWidth: "1", __source: { fileName: "", lineNumber: 437, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("line", { x1: "30", y1: "150", x2: 32 * data.length + 30, y2: "150", stroke: "#bbb", strokeWidth: "1", __source: { fileName: "", lineNumber: 446, columnNumber: 19 }, __self: this })); })())), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-6 md:grid-cols-4", __source: { fileName: "", lineNumber: 460, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(StatCard, { icon: "fas fa-database", label: "投稿数", value: stats.posts !== null && stats.posts !== undefined ? `${stats.posts.toLocaleString()}${publicPrivateLoading ? "" : publicPrivateStats.privateCount !== null && publicPrivateStats.privateCount !== undefined && publicPrivateStats.privateCount > 0 ? `（${publicPrivateStats.privateCount.toLocaleString()}）` : ""}` : "-", color: "text-indigo-500", __source: { fileName: "", lineNumber: 461, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement(StatCard, { icon: "fas fa-heart", label: "いいね数", value: stats.likes, color: "text-pink-500", __source: { fileName: "", lineNumber: 479, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement(StatCard, { icon: "fas fa-comments", label: "コメント数", value: stats.comments, color: "text-green-500", __source: { fileName: "", lineNumber: 485, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement(StatCard, { icon: "fas fa-bookmark", label: "ブックマーク数", value: stats.bookmarks, color: "text-yellow-500", __source: { fileName: "", lineNumber: 491, columnNumber: 11 }, __self: this })), !publicPrivateLoading && publicPrivateStats.privateCount !== null && publicPrivateStats.privateCount !== undefined && publicPrivateStats.privateCount > 0 && /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-500 mt-1 mb-4 text-center font-roboto", __source: { fileName: "", lineNumber: 503, columnNumber: 13 }, __self: this }, "※カッコ内の数字は非公開投稿数です"), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-md p-6 mb-8", __source: { fileName: "", lineNumber: 508, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold text-gray-700 mb-4 font-roboto flex items-center", __source: { fileName: "", lineNumber: 509, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-flag-checkered text-indigo-500 mr-2", __source: { fileName: "", lineNumber: 510, columnNumber: 13 }, __self: this }), "投稿結果の内訳"), breakdownError && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded mb-4 text-center", __source: { fileName: "", lineNumber: 514, columnNumber: 13 }, __self: this }, breakdownError), breakdownLoading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-16", __source: { fileName: "", lineNumber: 519, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "animate-spin h-5 w-5 text-indigo-500", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 520, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", fill: "none", __source: { fileName: "", lineNumber: 524, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z", __source: { fileName: "", lineNumber: 533, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 539, columnNumber: 15 }, __self: this }, "読み込み中...")) : /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row gap-4 justify-center", __source: { fileName: "", lineNumber: 544, columnNumber: 13 }, __self: this }, (()=>{ // 表示順を固定 const resultLabels = [ { key: "成功", label: "成功", color: "text-green-600", icon: "fas fa-check-circle" }, { key: "微妙", label: "微妙/わからない", color: "text-yellow-600", icon: "fas fa-question-circle" }, { key: "わからない", label: "微妙/わからない", color: "text-yellow-600", icon: "fas fa-question-circle" }, { key: "失敗", label: "失敗", color: "text-red-600", icon: "fas fa-times-circle" } ]; // 結果をマージ（微妙/わからないを合算） const merged = { 成功: 0, "微妙/わからない": 0, 失敗: 0 }; resultBreakdown.forEach((r)=>{ let key = ""; if (r.result.includes("成功")) key = "成功"; else if (r.result.includes("失敗")) key = "失敗"; else if (r.result.includes("微妙") || r.result.includes("わからない")) key = "微妙/わからない"; if (key) merged[key] += Number(r.count); }); return [ { label: "成功", value: merged["成功"], color: "text-green-600", icon: "fas fa-check-circle" }, { label: "微妙/わからない", value: merged["微妙/わからない"], color: "text-yellow-600", icon: "fas fa-question-circle" }, { label: "失敗", value: merged["失敗"], color: "text-red-600", icon: "fas fa-times-circle" } ].map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.label, className: "flex-1 flex flex-col items-center justify-center bg-gray-50 rounded-lg p-4 min-w-[120px]", __source: { fileName: "", lineNumber: 606, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `text-3xl mb-1 ${item.color}`, __source: { fileName: "", lineNumber: 610, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: item.icon, __source: { fileName: "", lineNumber: 611, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-xl font-bold text-gray-900 font-roboto", __source: { fileName: "", lineNumber: 613, columnNumber: 21 }, __self: this }, item.value.toLocaleString()), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-600 mt-1 font-roboto", __source: { fileName: "", lineNumber: 616, columnNumber: 21 }, __self: this }, item.label))); })())), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-md p-6 mb-8", __source: { fileName: "", lineNumber: 627, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold text-gray-700 mb-4 font-roboto flex items-center", __source: { fileName: "", lineNumber: 628, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-layer-group text-indigo-500 mr-2", __source: { fileName: "", lineNumber: 629, columnNumber: 13 }, __self: this }), "タイプの内訳"), typeBreakdownError && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-2 rounded mb-4 text-center", __source: { fileName: "", lineNumber: 633, columnNumber: 13 }, __self: this }, typeBreakdownError), typeBreakdownLoading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-16", __source: { fileName: "", lineNumber: 638, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "animate-spin h-5 w-5 text-indigo-500", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 639, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", fill: "none", __source: { fileName: "", lineNumber: 643, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z", __source: { fileName: "", lineNumber: 652, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 658, columnNumber: 15 }, __self: this }, "読み込み中...")) : /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 justify-center", __source: { fileName: "", lineNumber: 663, columnNumber: 13 }, __self: this }, (()=>{ // 個人・組織でグループ分け const personalTypes = [ "personal", "個人", "private", "note", "blog", "YouTube", "tiktok", "podcast", "other", "", null ]; const orgTypes = [ "organization", "団体", "company", "business", "school", "university", "NPO", "NGO" ]; let personal = []; let org = []; let unknown = []; typeBreakdown.forEach((item)=>{ if (personalTypes.includes(item.fork_type)) { personal.push(item); } else if (orgTypes.includes(item.fork_type)) { org.push(item); } else { unknown.push(item); } }); return /*#__PURE__*/ React.createElement("div", { className: "w-full flex flex-col md:flex-row gap-6", __source: { fileName: "", lineNumber: 702, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-50 rounded-lg p-4", __source: { fileName: "", lineNumber: 703, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-md font-bold text-indigo-700 mb-2 flex items-center", __source: { fileName: "", lineNumber: 704, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user mr-2", __source: { fileName: "", lineNumber: 705, columnNumber: 25 }, __self: this }), "個人"), personal.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 font-roboto", __source: { fileName: "", lineNumber: 708, columnNumber: 25 }, __self: this }, "データなし") : personal.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.fork_type || "未設定", className: "flex items-center mb-2", __source: { fileName: "", lineNumber: 713, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-gray-900 font-roboto mr-2", __source: { fileName: "", lineNumber: 717, columnNumber: 29 }, __self: this }, item.count.toLocaleString()), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 720, columnNumber: 29 }, __self: this }, item.fork_type || "未設定")))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-50 rounded-lg p-4", __source: { fileName: "", lineNumber: 727, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-md font-bold text-indigo-700 mb-2 flex items-center", __source: { fileName: "", lineNumber: 728, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-building mr-2", __source: { fileName: "", lineNumber: 729, columnNumber: 25 }, __self: this }), "組織"), org.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 font-roboto", __source: { fileName: "", lineNumber: 732, columnNumber: 25 }, __self: this }, "データなし") : org.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.fork_type, className: "flex items-center mb-2", __source: { fileName: "", lineNumber: 737, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-gray-900 font-roboto mr-2", __source: { fileName: "", lineNumber: 741, columnNumber: 29 }, __self: this }, item.count.toLocaleString()), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 744, columnNumber: 29 }, __self: this }, item.fork_type)))), unknown.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-50 rounded-lg p-4", __source: { fileName: "", lineNumber: 752, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-md font-bold text-indigo-700 mb-2 flex items-center", __source: { fileName: "", lineNumber: 753, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-question mr-2", __source: { fileName: "", lineNumber: 754, columnNumber: 27 }, __self: this }), "その他"), unknown.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.fork_type || "unknown", className: "flex items-center mb-2", __source: { fileName: "", lineNumber: 757, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-gray-900 font-roboto mr-2", __source: { fileName: "", lineNumber: 761, columnNumber: 29 }, __self: this }, item.count.toLocaleString()), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 764, columnNumber: 29 }, __self: this }, item.fork_type || "未設定"))))); })())), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6 text-center", __source: { fileName: "", lineNumber: 782, columnNumber: 11 }, __self: this }, error), loading && /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mt-8", __source: { fileName: "", lineNumber: 787, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 788, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "animate-spin h-6 w-6 text-indigo-500", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 789, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", fill: "none", __source: { fileName: "", lineNumber: 793, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z", __source: { fileName: "", lineNumber: 802, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 808, columnNumber: 15 }, __self: this }, "読み込み中..."))), /*#__PURE__*/ React.createElement("div", { className: "mt-12 text-center", __source: { fileName: "", lineNumber: 812, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "inline-flex items-center px-5 py-2.5 bg-indigo-600 text-white rounded-md font-medium hover:bg-indigo-700 transition-colors font-roboto", __source: { fileName: "", lineNumber: 813, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-home mr-2", __source: { fileName: "", lineNumber: 817, columnNumber: 13 }, __self: this }), "ホームに戻る")))); }