Skip to content

Commit ff637b6

Browse files
committed
utils created, making leetcodewrap page
1 parent 4af738a commit ff637b6

File tree

2 files changed

+92
-38
lines changed

2 files changed

+92
-38
lines changed

client/src/components/LeetCodeWrapped.jsx

Lines changed: 67 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,26 @@
11
import React from 'react'
2+
import '../index.css'
23
import { useState } from 'react'
4+
import { Link } from 'react-router-dom'
5+
import Heatmap from './Heatmap';
6+
import Profile from './Profile';
7+
import About from './About';
8+
import Stat from './Stat';
9+
import data from '../utils/tempdata'
10+
11+
312
const LeetCodeWrapped = () => {
413
const [activeButton, setActiveButton] = useState('profile');
514

15+
616
const handleClick = (button) => {
717
if (button !== activeButton) {
818
setActiveButton(button);
919
}
1020
};
1121
return (
12-
<>
22+
<div className='h-screen w-screen'>
23+
1324
{/* Header*/}
1425
<div className="flex sm:gap-4 items-center justify-center p-4">
1526
{/* SVG */}
@@ -52,46 +63,24 @@ const LeetCodeWrapped = () => {
5263
<p className="JakartaSans text-gray-200 text-sm hidden sm:block">Review your LeetCode activity from the past year</p>
5364
</div>
5465
</div>
55-
56-
{/* Bottom navigation */}
57-
58-
<div className="btm-nav">
59-
<button
60-
className={`text-accent ${activeButton === 'button1' ? 'active' : ''}`}
61-
onClick={() => handleClick('button1')}
62-
>
63-
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>
64-
65-
</button>
66-
<button
67-
className={`text-accent ${activeButton === 'profile' ? 'active' : ''}`}
68-
onClick={() => handleClick('profile')}
69-
>
70-
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
71-
72-
</button>
73-
<button
74-
className={`text-accent ${activeButton === 'button2' ? 'active' : ''}`}
75-
onClick={() => handleClick('button2')}
76-
>
77-
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" /></svg>
78-
79-
</button>
80-
</div>
81-
8266
<div style={{ height: '0.5px', backgroundColor: '#E0E0E0' }} className="h-[0.5px] bg-white" />
8367

84-
{/* Profile Card */}
85-
86-
87-
88-
89-
90-
9168

9269
{/* Community Stat */}
93-
<div className="flex ">
94-
<div className="stats shadow ">
70+
<div className=''>
71+
<div className="stats shadow flex flex-col sm:flex-row items-center justify-center rounded-none ">
72+
<div className="stat">
73+
<div className="stat-figure text-secondary">
74+
<div className="avatar">
75+
<div className="w-16 rounded-full">
76+
<img src="/assets/profile.png" />
77+
</div>
78+
</div>
79+
</div>
80+
<div className="stat-value">86%</div>
81+
<div className="stat-title">Tasks done</div>
82+
<div className="stat-desc text-secondary">31 tasks remaining</div>
83+
</div>
9584
<div className="stat">
9685
<div className="stat-figure text-secondary">
9786
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className="inline-block w-8 h-8 stroke-current"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
@@ -118,7 +107,47 @@ const LeetCodeWrapped = () => {
118107
</div>
119108
</div>
120109
</div>
121-
</>
110+
111+
{/* Bottom navigation */}
112+
<div className="btm-nav bg-inherit">
113+
114+
<Link to="/" >
115+
<button
116+
className={`text-accent flex gap-1 ${activeButton === 'button1' ? 'active' : ''}`}
117+
onClick={() => handleClick('button1')}>
118+
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>
119+
<span className='hidden sm:block'>Home</span>
120+
</button>
121+
</Link>
122+
123+
<button
124+
className={`text-accent bg-inherit ${activeButton === 'profile' ? 'active' : ''}`}
125+
onClick={() => handleClick('profile')}>
126+
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
127+
</button>
128+
129+
<a target="_blank" rel="noopener noreferrer" href="https://github.com/druvkotwani/Leetcode-Profiles/">
130+
<button className={`text-accent flex gap-1 ${activeButton === 'button2' ? 'active' : ''}`} onClick={() => handleClick('button2')}>
131+
<svg
132+
width="22px"
133+
height="22px"
134+
viewBox="0 0 24 24"
135+
fill="none"
136+
xmlns="http://www.w3.org/2000/svg"
137+
>
138+
<path
139+
d="M11.2691 4.41115C11.5006 3.89177 11.6164 3.63208 11.7776 3.55211C11.9176 3.48263 12.082 3.48263 12.222 3.55211C12.3832 3.63208 12.499 3.89177 12.7305 4.41115L14.5745 8.54808C14.643 8.70162 14.6772 8.77839 14.7302 8.83718C14.777 8.8892 14.8343 8.93081 14.8982 8.95929C14.9705 8.99149 15.0541 9.00031 15.2213 9.01795L19.7256 9.49336C20.2911 9.55304 20.5738 9.58288 20.6997 9.71147C20.809 9.82316 20.8598 9.97956 20.837 10.1342C20.8108 10.3122 20.5996 10.5025 20.1772 10.8832L16.8125 13.9154C16.6877 14.0279 16.6252 14.0842 16.5857 14.1527C16.5507 14.2134 16.5288 14.2807 16.5215 14.3503C16.5132 14.429 16.5306 14.5112 16.5655 14.6757L17.5053 19.1064C17.6233 19.6627 17.6823 19.9408 17.5989 20.1002C17.5264 20.2388 17.3934 20.3354 17.2393 20.3615C17.0619 20.3915 16.8156 20.2495 16.323 19.9654L12.3995 17.7024C12.2539 17.6184 12.1811 17.5765 12.1037 17.56C12.0352 17.5455 11.9644 17.5455 11.8959 17.56C11.8185 17.5765 11.7457 17.6184 11.6001 17.7024L7.67662 19.9654C7.18404 20.2495 6.93775 20.3915 6.76034 20.3615C6.60623 20.3354 6.47319 20.2388 6.40075 20.1002C6.31736 19.9408 6.37635 19.6627 6.49434 19.1064L7.4341 14.6757C7.46898 14.5112 7.48642 14.429 7.47814 14.3503C7.47081 14.2807 7.44894 14.2134 7.41394 14.1527C7.37439 14.0842 7.31195 14.0279 7.18708 13.9154L3.82246 10.8832C3.40005 10.5025 3.18884 10.3122 3.16258 10.1342C3.13978 9.97956 3.19059 9.82316 3.29993 9.71147C3.42581 9.58288 3.70856 9.55304 4.27406 9.49336L8.77835 9.01795C8.94553 9.00031 9.02911 8.99149 9.10139 8.95929C9.16534 8.93081 9.2226 8.8892 9.26946 8.83718C9.32241 8.77839 9.35663 8.70162 9.42508 8.54808L11.2691 4.41115Z"
140+
stroke="#00CDB7"
141+
strokeWidth="2"
142+
strokeLinecap="round"
143+
strokeLinejoin="round"
144+
></path>
145+
</svg>
146+
<span className='hidden sm:block'>Contribute</span>
147+
</button>
148+
</a>
149+
</div >
150+
</div>
122151
)
123152
}
124153

client/src/utils/tempdata.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
const data =
2+
{
3+
"fullName": "Dhruv Kotwani",
4+
"mediumTotal": "1549",
5+
"username": "druv_kotwani",
6+
"hardSolved": "20",
7+
"hardBeats": "77.6%",
8+
"badgeImg": "",
9+
"easyBeats": '96.9%',
10+
"github": { link: "https://github.com/druvkotwani", text: "druvkotwani" },
11+
"linkedin": { link: "https://linkedin.com/in/dhruv-kotwani", text: "dhruv-kotwani" },
12+
"website": { link: "https://dhruvkotwani.me", text: "dhruvkotwani.me" },
13+
"easySolved": "165",
14+
"totalQuestions": 2940,
15+
"rank": '234, 542',
16+
"mediumBeats": '84.8%',
17+
"twitter": { link: "https://twitter.com/druv_kotwani", text: "druv_kotwani" },
18+
"image": '/assets/profile.png',
19+
"hardTotal": "645",
20+
"mediumSolved": "92",
21+
"easyTotal": "745",
22+
"totalSolved": 195
23+
}
24+
25+
export default data;

0 commit comments

Comments
 (0)