File size: 4,537 Bytes
55d7c10 31767a7 a2242ea 31767a7 17388ad 4646723 a2242ea d4a7cd9 a2242ea 17388ad f831b65 a2242ea f831b65 17388ad f831b65 17388ad f831b65 17388ad 31767a7 17388ad 633e5e5 17388ad 31767a7 55d7c10 31767a7 22aa376 633e5e5 17a3607 31767a7 55d7c10 31767a7 55d7c10 428d2d6 22aa376 55d7c10 428d2d6 31767a7 428d2d6 5e26aa6 22aa376 17388ad 31767a7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 |
import React, { useState, useEffect, useMemo } from "react";
// import { generateCalendarData } from "../utils/calendar";
// import {
// OpenSourceHeatmapProps,
// ProviderInfo,
// ModelData,
// CalendarData,
// } from "../types/heatmap";
// import Heatmap from "../components/Heatmap";
// import { fetchAllProvidersData, fetchAllAuthorsData } from "../utils/authors";
// import UserSearchDialog from "../components/UserSearchDialog";
import AIPoliciesTable from "../components/AIPoliciesTable";
import fs from 'fs';
import path from 'path';
import matter from 'gray-matter';
import { PolicyData } from "../types";
// const PROVIDERS: ProviderInfo[] = [
// { color: "#ff7000", authors: ["mistralai"] },
// { color: "#1877F2", authors: ["meta-llama", "facebook", ] },
// { color: "#10A37F", authors: ["openai"] },
// { color: "#cc785c", authors: ["Anthropic"] },
// { color: "#DB4437", authors: ["google"] },
// { color: "#5E35B1", authors: ["allenai"] },
// { color: "#0088cc", authors: ["apple"] },
// { color: "#FEB800", authors: ["microsoft"] },
// { color: "#76B900", authors: ["nvidia"] },
// { color: "#0088cc", authors: ["deepseek-ai"] },
// { color: "#0088cc", authors: ["Qwen"] },
// { color: "#4C6EE6", authors: ["CohereForAI"] },
// { color: "#4C6EE6", authors: ["ibm-granite"] },
// { color: "#A020F0", authors: ["stabilityai"] },
// ];
export async function getStaticProps() {
try {
// Read policy data from policies.json
const policiesFilePath = path.join(process.cwd(), 'content', 'policies.json');
const policiesContent = fs.readFileSync(policiesFilePath, 'utf-8');
const rawPolicyData = JSON.parse(policiesContent);
// Transform the policy data into the expected format
const policyData = rawPolicyData.map((policy: any) => ({
zh: policy.zh,
en: policy.en,
link: {
zh: policy.link.zh || null, // Only include link if provided
en: policy.link.en || null, // Only include link if provided
},
releaseDate: policy.releaseDate,
}));
// Sort policyData based on releaseDate in descending order
policyData.sort((a: PolicyData, b: PolicyData) => {
const dateA = a.releaseDate ? new Date(a.releaseDate).getTime() : 0;
const dateB = b.releaseDate ? new Date(b.releaseDate).getTime() : 0;
return dateB - dateA;
});
return {
props: {
policyData,
},
revalidate: 3600,
};
} catch (error) {
console.error("Error fetching data:", error);
return {
props: {
policyData: [], // Pass empty policy data as props
},
revalidate: 60, // retry after 1 minute if there was an error
};
}
}
// const ProviderHeatmap = React.memo(({ provider, calendarData }: { provider: ProviderInfo, calendarData: CalendarData }) => {
// const providerName = provider.fullName || provider.authors[0];
// return (
// <div key={providerName} className="flex flex-col items-center">
// <Heatmap
// data={calendarData[providerName]}
// color={provider.color}
// providerName={providerName}
// fullName={provider.fullName ?? providerName}
// avatarUrl={provider.avatarUrl ?? ''}
// />
// </div>
// );
// });
const OpenSourceHeatmap: React.FC<{ policyData: PolicyData[] }> = ({
policyData,
}) => {
return (
<div className="w-full min-h-screen bg-white dark:bg-gray-900 dark:text-white">
<div className="max-w-screen-lg mx-auto p-4 py-16">
<h1 className="text-3xl lg:text-5xl mt-16 font-bold text-center mb-2">
China AI policy research 🤗
</h1>
<AIPoliciesTable policies={policyData} />
</div>
{/* <div className="text-center text-sm my-8 space-y-4">
<p>
Models, Datasets, and Spaces from the top AI labs.
</p>
<div className="flex justify-center space-x-4">
<UserSearchDialog />
</div>
</div>
<div className="h-px max-w-lg mx-auto bg-gray-200 dark:bg-gray-700 my-16" />
{isLoading ? (
<p className="text-center">Loading...</p>
) : (
<div className="space-y-16">
{sortedProviders.map((provider) => (
<ProviderHeatmap
key={provider.fullName || provider.authors[0]}
provider={provider}
calendarData={calendarData}
/>
))}
</div>
)} */}
</div>
);
};
export default React.memo(OpenSourceHeatmap);
|