Merge pull request #9 from aahna-ashina/fix-build-error

Prepare for Vercel deployment

package.json

@@ -24,6 +24,7 @@
   },
   "devDependencies": {
     "@types/node": "18.7.7",
+    "@types/papaparse": "^5.3.5",
     "@types/react": "18.0.17",
     "@types/react-dom": "18.0.6",
     "autoprefixer": "^10.4.0",

pages/index.tsx

@@ -1,9 +1,6 @@
-import React, { Context, useEffect, useRef, useState } from "react"
-import { IdentificationIcon } from "@heroicons/react/24/outline"
+import React, { useEffect, useRef, useState } from "react"
 import type { NextPage } from "next"
 import Image from "next/image"
-import Link from "next/link"
-import GradientLink from "../components/GradientLink"
 import HomeCard from '../components/CitizenCard'
 import flag from '../public/flag.svg'
 import Papa from 'papaparse'
@@ -13,18 +10,20 @@ import {
   CategoryScale,
   LinearScale,
   PointElement,
+  LineController,
   LineElement,
   Title,
   Tooltip,
   Legend,
   Filler,
   ChartData
 } from 'chart.js'
-import { Line } from 'react-chartjs-2'
+import { Chart } from 'react-chartjs-2'
 ChartJS.register(
   CategoryScale,
   LinearScale,
   PointElement,
+  LineController,
   LineElement,
   Filler,
   Title,
@@ -70,7 +69,7 @@ export function CitizenChart() {
         const week_end_dates: string[] = []
         const total_citizen_count: number[] = []
         const active_citizen_count: number[] = []
-        result.data.forEach((row: Object, i: number) => {
+        result.data.forEach((row: any, i: number) => {
           console.info(`row ${i}`, row)
           week_end_dates[i] = String(row.week_end)
           total_citizen_count[i] = Number(row.total_citizens)
@@ -105,7 +104,7 @@ export function CitizenChart() {
     })
   }, [])
 
-  return <Line ref={chartRef} data={chartData} />
+  return <Chart type='line' ref={chartRef} data={chartData} />
 }
 
 export function CitizenList() {
@@ -136,8 +135,9 @@ export function CitizenList() {
     <>
       <div className="grid xl:grid-cols-2 mt-2 gap-8">
         {
-          citizenData.map((citizen) => (
+          citizenData.map((citizen: any) => (
             <HomeCard
+              key={citizen.passport_id}
               passportId={citizen.passport_id}
               ethAddress={citizen.eth_address}
               ensName={citizen.ens_name}