40 lines
1.0 KiB
TypeScript
40 lines
1.0 KiB
TypeScript
"use client"
|
|
import { LineChart, Line, CartesianGrid, XAxis, YAxis, PieChart, Pie } from "recharts"
|
|
import { SubComplete } from "./page"
|
|
export function SubsChart({ data }: { data: Array<SubComplete> }) {
|
|
const pieData: Array<{ story: string, occurrences: number }> = []
|
|
data.forEach(dataRow => {
|
|
const story = dataRow.story.title
|
|
const exists = pieData.findIndex(pieRow => story === pieRow.story)
|
|
if (exists === -1) {
|
|
//add the story to pieData if it doesn't already exist
|
|
pieData.push({ story: story, occurrences: 0 })
|
|
return
|
|
}
|
|
pieData[exists].occurrences++
|
|
})
|
|
console.log(pieData)
|
|
|
|
|
|
|
|
return (
|
|
<>
|
|
<PieChart width={400} height={400}>
|
|
<Pie data={pieData} dataKey="story" outerRadius={50} fill="teal" />
|
|
</PieChart>
|
|
|
|
|
|
|
|
|
|
<LineChart width={400} height={400} data={data}>
|
|
<Line type="monotone" dataKey="id" stroke="#8884d8" />
|
|
<CartesianGrid />
|
|
<XAxis dataKey="submitted" />
|
|
<YAxis />
|
|
|
|
</LineChart>
|
|
</>
|
|
|
|
)
|
|
}
|