Skip to content

Commit 7d3ff75

Browse files
TheSYNcoderTheSYNcoder
authored
Merge pull request #3 from TheSYNcoder/nextjs-refactor
next-js refactor
2 parents d1df661 + 6265ff6 commit 7d3ff75

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

61 files changed

+3328
-1312
lines changed

‎.gitignore

+4
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,7 @@
2121
npm-debug.log*
2222
yarn-debug.log*
2323
yarn-error.log*
24+
25+
#next
26+
.next
27+
.vscode

‎components/mac/Constants/timelineData.json

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
[
2+
{
3+
"title": "CICBA",
4+
"description": "Gave a presentation on my paper at CICBA",
5+
"date": "7-9 January 2021"
6+
},
7+
{
8+
"title": "First Paper Acceptance",
9+
"description": "My Paper on Knowledge Distillation got accepted at CICBA International Conference",
10+
"date": "22 December 2020"
11+
},
12+
{
13+
"title": "Blogging",
14+
"description": "Wrote many blogs on platforms like medium and GFG",
15+
"date": "Sep-Oct 2020"
16+
},
17+
{
18+
"title": "Amazon SDE intern",
19+
"description": "Selected as an Amazon Summer SDE Intern through campus internship drive of Jadavpur University",
20+
"date": "8 September 2020"
21+
},
22+
{
23+
"title": "SIH Winner",
24+
"description": "My team become the winners of SIH 2020 for our app - EcoEden ( written in flutter )",
25+
"date": "3 July 2020"
26+
},
27+
{
28+
"title": "Analytical Intern at My Ways",
29+
"description": "Started working as an analytical intern at My Ways",
30+
"date": "4 June 2020"
31+
},
32+
{
33+
"title": "Undergraduate Reasearch Intern at IIT Bombay",
34+
"description": "Started working under professor Biblab Banerjee of IIT Bombay.",
35+
"date": "4 April 2020"
36+
},
37+
{
38+
"title": "Undergraduate Reasearch Intern at Jadavpur University",
39+
"description": "Started working as an undergraduate researcher in CMATER(DVLP) Lab of Jadavpur University under Professor Nibaran Das.",
40+
"date": "24 April 2019"
41+
},
42+
{
43+
"title": "Jadavpur University, Kolkata ( CS 2022 Batch )",
44+
"description": "My journey with Computer Science started with the orientation.",
45+
"date": "2 August 2018"
46+
}
47+
]

‎components/mac/Screens/About.tsx

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import React from 'react';
2+
import Image from 'next/image'
3+
import Typewriter from 'typewriter-effect';
4+
5+
6+
const About = () : any => {
7+
return (
8+
<div>
9+
<div className="items-center flex flex-col h-full w-full">
10+
<Image unoptimized src="/assets/photo.jpg" alt='A selfie of myself' height={70} width={60} className="h-2/5 w-4/5 overflow-hidden rounded-3xl mt-2 ring-4 ring-black"></Image>
11+
<div className="text-black dark:text-white mt-4 font-black text-2xl">Shuvayan Ghosh Dastidar</div>
12+
<div className="text-black dark:text-white mt-4 font-semibold text-lg flex flex-row">Hey, I am a<Typewriter
13+
options={{
14+
strings: ['- Web Developer', '- Computer Vision Enthusiast', '- Competitive Programmer'],
15+
autoStart: true,
16+
loop: true,
17+
}}
18+
19+
/> </div>
20+
<div className="absolute bottom-0 mb-4 flex flex-row justify-center">
21+
<a href="https://www.facebook.com/shuvayan.ghoshdastidar">
22+
<ion-icon name="logo-facebook" style={{ fontSize: "30px", color: "blue", margin: "2px" }}/>
23+
</a>
24+
<a href="https://www.instagram.com/chroma_mania/">
25+
<Image src="/assets/insta.jpeg" alt='Instagram icon' width={30} height={100} style={{ margin:"2px" }}/>
26+
</a>
27+
<a href="https://www.linkedin.com/in/shuvayan-ghosh-dastidar/">
28+
<ion-icon name="logo-linkedin" style={{ fontSize: "30px", color: "#0077B5", margin: "2px" }}/>
29+
</a>
30+
<a href="https://github.com/TheSYNcoder/">
31+
<ion-icon name="logo-github" style={{ fontSize: "30px", color: "black", margin :"2px" }} />
32+
</a>
33+
<a href="https://twitter.com/TheSYNcoder">
34+
<ion-icon name="logo-twitter" style={{ fontSize: "30px", color: "lightblue", margin: "2px" }}/>
35+
</a>
36+
</div>
37+
</div>
38+
</div>
39+
)
40+
}
41+
42+
export default About;

‎components/mac/Screens/Projects.tsx

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import React from 'react';
2+
const Projects = () => {
3+
4+
const projectList = [
5+
{
6+
title : 'Jadavpur University Compiler Compiler',
7+
description : 'A LL(1) parser written in C++. It supports dynamic grammar files for parsing different languages and visualizes the abstract syntax tree using Treant.js',
8+
link: 'https://github.com/TheSYNcoder/JuCC',
9+
featImage: 'https://user-images.githubusercontent.com/42897033/116920657-8acdf480-ac70-11eb-8d3f-46cf27fcb1a1.png' ,
10+
},
11+
{
12+
title : 'An Assembler',
13+
description: 'Implementation of a two-pass assembler involving tries for fast in-memory opcode fetch and has implementation of loader and linkers for linking the object file created to make an executable file.',
14+
link: 'https://github.com/TheSYNcoder/ProprietaryAssembler',
15+
featImage: 'https://images.unsplash.com/photo-1583109193439-1ebb113bceac?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1237&q=80' ,
16+
},
17+
// {
18+
// title : 'Budgify',
19+
// description: 'A personal savings app to maintain your day to day expenses and incomes. The app has many features such as tracking expenses and visualizing them',
20+
// link: 'https://play.google.com/store/apps/details?id=com.budgify',
21+
// featImage: 'https://play-lh.googleusercontent.com/WN77wvQymKgTcOBXt1o-C6hSQfTOcorhkYr6VpXAWf0bvm5tDHSAPPRNC7ev-nn3fPM=s180-rw',
22+
// },
23+
]
24+
25+
return (
26+
<div className="h-full w-full flex flex-col items-center ">
27+
<div className="text-black dark:text-white font-black text-xl mt-2 p-2">Featured Projects</div>
28+
<div className="flex w-11/12 flex-col">{
29+
projectList.map(proj => <div key={proj.title} className="border-2 border-blue-500 p-2 my-2 flex flex-col w-full shadow-xl">
30+
<div className="flex flex-row">
31+
<img className=" w-4/12 rounded-xl " src={proj.featImage}></img>
32+
<div className="ml-2 w-8/12">
33+
<div className="text-md dark:text-white text-black font-bold ">{proj.title}</div>
34+
<div className="text-md dark:text-gray-200 text-gray-600 font-normal ">{proj.description}</div>
35+
<a className="text-sm dark:text-white text-black font-medium hover:text-gray-800" href={proj.link}> <ion-icon name="link-outline" size="large" />View Project </a>
36+
</div>
37+
</div>
38+
</div>)
39+
}</div>
40+
</div>
41+
)
42+
}
43+
44+
export default Projects;

‎components/mac/Screens/Research.tsx

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import React from 'react';
2+
3+
const Research = () => {
4+
return (
5+
<div>
6+
<div className="items-center flex flex-col h-full w-full">
7+
<div className="text-xl dark:text-white text-black font-black">Research Work</div>
8+
<div className="flex mx-7 my-3">
9+
<ul className="list-none">
10+
<li className="text-md font-medium dark:text-white text-black my-2">Worked at Jadavapur University CMATER (DVLP) Lab and was involved in making classification and segmentation models for the task of scene text detection. Also worked on making of the <a className="border-b-2 border-black dark:border-white" href="https://dvlp.herokuapp.com/">Lab website</a></li>
11+
<li className="text-md font-medium dark:text-white text-black my-2">Worked under Prof. Biplab Banerjee of Indian Institute of Technology, Bombay to develop models for screening of covid affected patients from Chest-Xray images. Many appraches were experimented upon including an adversarial approach involving domain adaptation.</li>
12+
</ul>
13+
</div>
14+
<div className="text-xl dark:text-white text-black font-black">Publications and Blogs</div>
15+
<div className="flex mx-7 my-3">
16+
<ul className="list-decimal">
17+
<li className="text-md font-medium dark:text-white text-black my-2">Accepted at CICBA international conference - Exploring Knowledge Distillation of a Deep Neural Network for Multi-Script identification . <a className="border-b-2 border-black dark:border-white" href="https://arxiv.org/abs/2102.10335">[Link]</a> . <a className="border-b-2 border-black dark:border-white" href="https://drive.google.com/file/d/1ReOFt0V73ASUDIk02pL1ubYUb_duEVgH/view?usp=sharing">[Certificate]</a> </li>
18+
<li className="text-md font-medium dark:text-white text-black my-2">Image processing with OpenCV published in medium publication - Towards AI. <a className="border-b-2 border-black dark:border-white" href="https://pub.towardsai.net/image-processing-basics-through-opencv-e9cbc6130821">[Link]</a></li>
19+
<li className="text-md font-medium dark:text-white text-black my-2">Spring Boot web application and making a docker container and dockerizing it in medium publication - Geek Culture. <a className="border-b-2 border-black dark:border-white" href="https://medium.com/geekculture/a-full-stack-e-commerce-application-using-spring-boot-and-making-a-docker-container-eff46f6f4e14">[Link]</a></li>
20+
<li className="text-md font-medium dark:text-white text-black my-2">A React frontend for a spring boot application in medium publication - Geek Culture. <a className="border-b-2 border-black dark:border-white" href="https://medium.com/geekculture/a-reactjs-web-application-with-a-spring-boot-backend-and-containerizing-it-using-docker-3eeaed8cb45a">[Link]</a></li>
21+
</ul>
22+
</div>
23+
</div>
24+
</div>
25+
)
26+
}
27+
28+
export default Research;

‎components/mac/Screens/Resume.tsx

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
2+
const Resume = () => {
3+
return <iframe className="h-full w-full" src="/assets/shuvayan.pdf" title="Shuvayan's Resume"></iframe>
4+
}
5+
6+
export default Resume;

‎components/mac/Screens/Timeline.tsx

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import React from "react";
2+
3+
import { gsap } from "gsap";
4+
import data from "../Constants/timelineData.json";
5+
6+
const Timeline = () => {
7+
const items = data;
8+
9+
10+
const hide = (elem: JSX.Element) => {
11+
gsap.set(elem, { autoAlpha: 0 });
12+
};
13+
14+
15+
return (
16+
<div className="flex flex-col">
17+
<div className="dark:text-white text-black font-black text-2xl mt-4 w-full text-center">Timeline</div>
18+
<div className="timeline">
19+
<ul>
20+
{items.map((te, idx) => {
21+
return (
22+
<li key={`${te.title}_${te.date}`}>
23+
<div className="content">
24+
<h3
25+
className={`animate ${idx % 2 === 0 ? "slide_from_left" : "slide_from_right"
26+
}`}
27+
>
28+
{te.title}
29+
</h3>
30+
<p
31+
className={`animate ${idx % 2 === 0 ? "slide_from_left" : "slide_from_right"
32+
}`}
33+
>
34+
{te.description}
35+
</p>
36+
</div>
37+
<div
38+
className={`time animate ${idx % 2 === 0 ? "slide_from_right" : "slide_from_left"
39+
}`}
40+
>
41+
<h4>{te.date}</h4>
42+
</div>
43+
</li>
44+
);
45+
})}
46+
<div style={{ clear: "both" }}></div>
47+
</ul>
48+
</div>
49+
</div>
50+
);
51+
};
52+
53+
export default Timeline;

‎components/mac/background.tsx

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
2+
import React from 'react';
3+
import { Context } from '../../lib/store';
4+
import { useContext } from 'react';
5+
6+
7+
const Background = () => {
8+
9+
const {state, dispatch} = useContext(Context) as AppStoreContextType;
10+
11+
const currState = React.useRef(state);
12+
13+
React.useEffect(() => {
14+
currState.current = state;
15+
}, [state]);
16+
17+
const getPic = () => {
18+
if ( currState.current.backgroundImage === 'pic1') {
19+
return '/assets/pic1.jpg';
20+
} else if ( currState.current.backgroundImage === 'pic2'){
21+
return '/assets/pic2.jpg';
22+
} else {
23+
return '/assets/pic3.jpg';
24+
}
25+
}
26+
27+
return <div className="fixed top-0 w-screen h-screen bg-cover z-0">
28+
<img src={getPic()} className="w-screen h-screen bg-no-repeat absolute md:top-0 md:right-0 md:left-0 md:bottom-0"></img>
29+
</div>
30+
}
31+
32+
33+
export default Background;

‎components/mac/banner.tsx

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react';
2+
3+
const Banner = () => {
4+
5+
6+
const [show, setShow] = React.useState(true);
7+
8+
return (
9+
<div id="banner" role='alert' className={"absolute top-1/4 left-1/4 z-10 w-6/12 flex flex-col h-30 rounded-xl bg-blue-100 border-t-4 border-blue-500 rounded-b text-blue-900 px-4 py-3 shadow-md " + (show ? "" : "hidden")} >
10+
<strong className="font-bold">Hey welcome!</strong>
11+
<span className="block sm:inline">This is my space. Use the terminal if you are a geek :). Click on About me to know about me. Right click anywhere for more fun. Use ctrl + space to open up spotlight to go to any application. Wanna contact me for some chat or projects, shoot a mail using the mail app! Have fun!!</span>
12+
<span className="absolute top-0 bottom-0 right-0 px-4 py-3" onClick={() => setShow(false)}>
13+
<svg className="fill-current h-6 w-6 text-blue-500" role="button" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><title>Close</title><path d="M14.348 14.849a1.2 1.2 0 0 1-1.697 0L10 11.819l-2.651 3.029a1.2 1.2 0 1 1-1.697-1.697l2.758-3.15-2.759-3.152a1.2 1.2 0 1 1 1.697-1.697L10 8.183l2.651-3.031a1.2 1.2 0 1 1 1.697 1.697l-2.758 3.152 2.758 3.15a1.2 1.2 0 0 1 0 1.698z" /></svg>
14+
</span>
15+
</div>
16+
)
17+
}
18+
19+
export default Banner;

‎components/mac/changeBackground.tsx

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import React from 'react';
2+
import { Context } from '../../lib/store';
3+
4+
const ChangeBackground = (props: {context: {height: number, width: number}}) => {
5+
6+
const {state, dispatch} = React.useContext(Context) as AppStoreContextType;
7+
8+
var context = props.context;
9+
const currState = React.useRef(state);
10+
11+
React.useEffect(() => {
12+
currState.current = state;
13+
}, [state]);
14+
15+
const getPic = () => {
16+
if (currState.current.backgroundImage === 'pic1') {
17+
return '/assets/pic1.jpg';;
18+
} else if (currState.current.backgroundImage === 'pic2') {
19+
return '/assets/pic2.jpg';;
20+
} else {
21+
return '/assets/pic3.jpg';;
22+
}
23+
}
24+
25+
return (
26+
<div className="flex flex-col relative bg-white dark:bg-gray-900 rounded-bl-xl rounded-br-xl" style={{ height: context.height, width: context.width, minHeight: "35rem" }}>
27+
<div className="flex flex-row justify-around w-full h-1/4">
28+
<div className="w-1/4 text-black font-black dark:text-white text-2xl">Current Background :</div>
29+
<img className="w-1/2 rounded-xl overflow-hidden" src={getPic()}></img>
30+
</div>
31+
<div className="text-black dark:text-white font-black flex w-full items-center justify-center mt-3">Select your choice</div>
32+
<div className="grid grid-cols-2 gap-4 h-3/4 ml-8 mr-2 mt-5">
33+
<img onClick={() => dispatch({ type: "CHANGE_BACKGROUND", payload: "pic1" })}
34+
src='/assets/pic1.jpg' className="w-5/6 h-40 rounded-xl cursor-pointer"></img>
35+
<img onClick={() => dispatch({ type: "CHANGE_BACKGROUND", payload: "pic2" })}
36+
src='/assets/pic2.jpg' className="w-5/6 h-40 rounded-xl cursor-pointer"></img>
37+
<img onClick={() => dispatch({ type: "CHANGE_BACKGROUND", payload: "pic3" })}
38+
src='/assets/pic3.jpg' className="w-5/6 h-40 rounded-xl cursor-pointer"></img>
39+
</div>
40+
</div>
41+
)
42+
}
43+
44+
export default ChangeBackground;

‎components/mac/defaultContextMenu.tsx

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import React from 'react';
2+
import { Context } from '../../lib/store';
3+
import { useTheme } from 'next-themes';
4+
5+
const DefaultContextMenu = () => {
6+
const { theme, setTheme } = useTheme();
7+
const {state, dispatch} = React.useContext(Context) as AppStoreContextType;
8+
return (
9+
<div className="relative h-auto w-auto flex flex-col rounded-lg p-2 ring-1 ring-gray-600 ring-inset" style={{minWidth :"13rem", zIndex : 10 , backgroundColor : "rgb(34, 35, 54, 0.3)"}}>
10+
<div className="text-xs text-white pl-5 pt-0.5 rounded-sm hover:bg-blue-500 mb-1 cursor-pointer">New Folder</div>
11+
<hr className="border border-gray-300 ml-2 mr-2 opacity-50"/>
12+
<div className="text-xs text-white pl-5 pt-1 pb-0.5 mt-1 rounded-sm hover:bg-blue-500 mb-1 cursor-pointer"
13+
onClick={() => dispatch({ type: "NEW_WINDOW", payload: { id: 'PROFILE', header: true } }) }
14+
>Get Info</div>
15+
<div
16+
onClick={() => dispatch({ type: "NEW_WINDOW", payload: { id: 'CHANGE_BACKGROUND', header: true, title : "change background image" } })}
17+
className="text-xs text-white pl-5 pt-1 pb-0.5 rounded-sm hover:bg-blue-500 mb-1 cursor-pointer">Change Desktop Background</div>
18+
<div
19+
onClick={() => setTheme( theme === 'dark' ? 'light' : 'dark') }
20+
className="text-xs text-white pl-5 pt-1 pb-0.5 rounded-sm hover:bg-blue-500 mb-1 cursor-pointer">Change Theme</div>
21+
<hr className="border border-gray-300 ml-2 mr-2 opacity-50" />
22+
<div className="text-xs text-gray-300 pl-5 pt-1 mt-1 rounded-sm hover:bg-blue-500 mb-1 cursor-not-allowed">✓ Use Stacks</div>
23+
</div>
24+
)
25+
};
26+
27+
export default DefaultContextMenu;

0 commit comments

Comments
 (0)