add Statistics component

Author: Sorosliu1029

src/components/LeetCode.tsx

@@ -2,10 +2,11 @@ import React, { useEffect, useState } from 'react';
 import { getProfile, getStatistics } from '../services/leetcode';
 import { LeetCodeProfile, LeetCodeStatistics } from '../types/leetcode';
 import Profile from './Profile';
+import Statistics from './Statistics';
 
 const LeetCode = () => {
   const [profile, setProfile] = useState<LeetCodeProfile | null>(null);
-  const [_statistics, setStatistics] = useState<LeetCodeStatistics | null>(null);
+  const [statistics, setStatistics] = useState<LeetCodeStatistics | null>(null);
 
   useEffect(() => {
     getProfile().then(profile => {
@@ -26,7 +27,12 @@ const LeetCode = () => {
     });
   }, [profile]);
 
-  return profile ? <Profile profile={profile} /> : null;
+  return profile ? (
+    <div>
+      <Profile profile={profile} />
+      {statistics ? <Statistics statisitcs={statistics} /> : null}
+    </div>
+  ) : null;
 };
 
 export default LeetCode;

src/components/Statistics.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { LeetCodeStatistics } from '../types/leetcode';
+
+const Statistics = ({ statisitcs }: { statisitcs: LeetCodeStatistics }) => {
+  return (
+    <div>
+      <p>rank: {statisitcs.userPublicProfile.matchedUser.profile.ranking}</p>
+    </div>
+  );
+};
+
+export default Statistics;