Skip to content

Commit f5c897b

Browse files
a19hua19hu
authored
Merge branch 'main' into main
2 parents b7d4da9 + c059503 commit f5c897b

File tree

7,056 files changed

+790
-819838
lines changed

Some content is hidden

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

7,056 files changed

+790
-819838
lines changed

‎frontend/.gitignore‎ renamed to ‎.gitignore‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
22

33
# dependencies
4-
/node_modules
5-
/.pnp
4+
node_modules
5+
.pnp
66
.pnp.js
77
.yarn/install-state.gz
88

99
# testing
1010
/coverage
1111

1212
# next.js
13-
/.next/
14-
/out/
13+
.next/
14+
out/
1515

1616
# production
17-
/build
17+
build
1818

1919
# misc
2020
.DS_Store
@@ -33,4 +33,7 @@ yarn-error.log*
3333

3434
# typescript
3535
*.tsbuildinfo
36-
next-env.d.ts
36+
next-env.d.ts
37+
38+
env
39+
venv

‎frontend/.env‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
REACT_APP_BASE_URL=http://127.0.0.1:8000
2+

‎frontend/src/App.js‎

Lines changed: 66 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,79 @@
11
import './App.css';
22
import { BrowserRouter, Route, Routes } from "react-router-dom";
33
import Navbar from "./components/Navbar";
4-
import Home from "./pages/Home";
5-
import Search from './pages/Search';
4+
import React, { Suspense, useEffect, useState } from 'react';
65
import { DataProvider } from './context/DataContext';
7-
import ImageTree from './pages/3DTree';
8-
import React, { useEffect, useState } from 'react';
9-
import axios from 'axios';
106
import { ToastContainer, toast } from 'react-toastify';
117
import 'react-toastify/dist/ReactToastify.css';
8+
import { gql } from '@apollo/client';
9+
import { useQuery } from '@apollo/client';
10+
11+
// Lazy load components
12+
const Home = React.lazy(() => import('./pages/Home'));
13+
const Search = React.lazy(() => import('./pages/Search'));
14+
const ImageTree = React.lazy(() => import('./pages/3DTree'));
15+
16+
function generateQuery(depth) {
17+
if (depth === 0) {
18+
return `
19+
rollNo
20+
name
21+
parentId
22+
picture
23+
`;
24+
}
25+
return `
26+
rollNo
27+
name
28+
parentId
29+
picture
30+
children {
31+
${generateQuery(depth - 1)}
32+
}
33+
`;
34+
}
35+
36+
const GET_Query = gql`
37+
query GetNestedTree {
38+
studentTree {
39+
${generateQuery(10)}
40+
}
41+
}
42+
`;
1243

1344
function App() {
1445
const [data, setData] = useState([]);
15-
const [error,seterror]=useState(false)
16-
useEffect(() => {
17-
const fetchData = async () => {
18-
try {
19-
const response = await axios.get(`https://devluplabs.iitj.ac.in/ftadmin/tree/`);
20-
setData(response.data);
21-
} catch (error) {
22-
seterror(true)
23-
}
24-
};
25-
fetchData();
26-
}, []);
27-
28-
if(error){
29-
toast.error("server error",{
30-
autoClose:20000
31-
})
32-
}
33-
// console.log(window.location.pathname)
46+
const [error, setError] = useState(false);
47+
const { error: queryError, data: treeData } = useQuery(GET_Query);
48+
49+
useEffect(() => {
50+
if (treeData && treeData.studentTree) {
51+
setData(treeData.studentTree);
52+
}
53+
if (queryError) {
54+
setError(true);
55+
toast.error("GraphQL query error", {
56+
autoClose: 20000
57+
});
58+
}
59+
}, [treeData, queryError]);
60+
61+
// if (loading) return <p>Loading...</p>;
62+
3463
return (
35-
36-
<BrowserRouter
37-
basename="/familytree/"
38-
>
39-
<DataProvider>
40-
<ToastContainer />
41-
<Navbar error={error}/>
42-
<Routes>
43-
<Route path="/" element={<Home data={data}/>} />
44-
<Route path="/search/:id" element={<Search />} />
45-
<Route path="/ImageTree" element={<ImageTree data={data}/>} />
46-
</Routes>
47-
</DataProvider>
48-
</BrowserRouter>
64+
<BrowserRouter basename="/familytree/">
65+
<DataProvider>
66+
<ToastContainer />
67+
<Navbar error={error} />
68+
<Suspense fallback={<div className='w-full h-[100vh] flex justify-center items-center text-4xl bg-[rgb(147,170,213)] text-white'>Loading...</div>}>
69+
<Routes>
70+
<Route path="/" element={<Home data={data} />} />
71+
<Route path="/search" element={<Search />} />
72+
<Route path="/ImageTree" element={<ImageTree data={data} />} />
73+
</Routes>
74+
</Suspense>
75+
</DataProvider>
76+
</BrowserRouter>
4977
);
5078
}
5179

‎frontend/src/assets/Style/team.css‎

Lines changed: 102 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
.modalme{
1+
.modalme {
22
position: fixed;
33
top: 0;
44
left: 0;
@@ -8,108 +8,127 @@
88
display: flex;
99
justify-content: center;
1010
align-items: center;
11+
z-index: 1000;
1112
}
12-
.modal-contentme{
13-
padding: 20px;
14-
border-radius: 5px;
13+
14+
.modal-contentme {
15+
padding: 30px;
16+
border-radius: 10px;
1517
color: aliceblue;
16-
font-weight: 900;
17-
justify-content: center;
18+
background: rgba(20, 94, 135, 0.85);
19+
box-shadow: 0 8px 32px 0 rgba(243, 243, 243, 0.37);
20+
max-width: 800px;
21+
width: 90%;
22+
}
23+
24+
.team-header {
25+
display: flex;
26+
justify-content: space-between;
1827
align-items: center;
19-
background: rgba(20, 94, 135, 0.75);
20-
box-shadow: 0 8px 32px 0 rgba(243, 243, 243, 0.37);
21-
border-radius: 10px;
28+
margin-bottom: 20px;
29+
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
30+
padding-bottom: 15px;
31+
}
32+
33+
.team-header h2 {
34+
margin: 0;
35+
font-size: 1.8rem;
36+
}
37+
38+
.team-members-grid {
39+
display: grid;
40+
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
41+
gap: 25px;
42+
}
43+
44+
.team-member-card {
45+
background: rgba(255, 255, 255, 0.1);
46+
border-radius: 8px;
47+
padding: 20px;
48+
text-align: center;
49+
transition: transform 0.3s ease, box-shadow 0.3s ease;
50+
}
51+
52+
.team-member-card:hover {
53+
transform: translateY(-5px);
54+
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
55+
}
56+
57+
.team-member-card h3 {
58+
margin: 0 0 5px 0;
59+
font-size: 1.2rem;
2260
}
23-
.iconsocialmedia{
61+
62+
.member-id {
63+
color: rgba(255, 255, 255, 0.8);
64+
margin-bottom: 15px;
65+
font-size: 0.9rem;
66+
}
67+
68+
.iconsocialmedia {
2469
display: flex;
2570
justify-content: center;
2671
align-items: center;
2772
gap: 20px;
28-
color:aliceblue;
29-
}
30-
.closeshomepro{
31-
position: relative;
32-
top: 0px;
33-
right:0px !important;
34-
cursor: pointer;
35-
color:aliceblue;
36-
}
73+
margin-top: 15px;
74+
}
75+
76+
.iconsocialmedia a {
77+
transition: transform 0.2s ease;
78+
}
3779

80+
.iconsocialmedia a:hover {
81+
transform: scale(1.2);
82+
}
3883

84+
.closeshomepro {
85+
cursor: pointer;
86+
color: aliceblue;
87+
transition: transform 0.2s ease;
88+
}
3989

40-
/* Popup.css */
41-
.modalhelp {
42-
position: fixed;
43-
top: 0;
44-
left: 0;
45-
width: 100%;
46-
height: 100%;
47-
backdrop-filter: blur(3px);
48-
display: flex;
49-
justify-content: center;
50-
align-items: center;
90+
.closeshomepro:hover {
91+
transform: scale(1.1);
92+
color: #a3a3a3;
5193
}
5294

5395
.visible {
54-
animation: movedown 1s forwards;
96+
animation: movedown 0.5s forwards;
5597
}
5698

5799
.notvisible {
58-
animation: moveup 1s forwards;
100+
animation: moveup 0.5s forwards;
59101
}
60102

61103
@keyframes movedown {
62-
0% {
63-
transform: translateY(-400px);
64-
/* Start position: move up by 100px */
65-
}
66-
67-
60% {
68-
transform: translateY(100px);
69-
/* End position: move down to original position */
70-
}
71-
72-
100% {
73-
transform: translateY(0);
74-
/* End position: move down to original position */
75-
}
104+
0% {
105+
transform: translateY(-400px);
106+
opacity: 0;
107+
}
108+
100% {
109+
transform: translateY(0);
110+
opacity: 1;
111+
}
76112
}
77113

78114
@keyframes moveup {
79-
100% {
80-
transform: translateY(-400px);
81-
/* Start position: move up by 100px */
82-
}
83-
84-
0% {
85-
transform: translateY(0);
86-
/* End position: move down to original position */
87-
}
88-
}
89-
90-
.modal-contenthelp {
91-
/* background-color: rgba(255, 255, 255, 0.338); */
92-
padding: 20px;
93-
width: 400px;
94-
border-radius: 5px;
95-
box-shadow: 0 0 10px rgba(20, 20, 20, 0.3);
96-
color: aliceblue;
97-
font-weight: 900;
98-
99-
background: rgba(14, 14, 14, 0.4);
100-
box-shadow: 0 8px 32px 0 rgba(243, 243, 243, 0.37);
101-
border-radius: 10px;
102-
}
103-
104-
.closes {
105-
position: relative;
106-
top: 0px;
107-
right: 0px !important;
108-
cursor: pointer;
109-
}
110-
111-
@media screen and (max-width: 600px) {
112-
.modal-contenthelp {
113-
width: 250px;
114-
}
115-
}
115+
0% {
116+
transform: translateY(0);
117+
opacity: 1;
118+
}
119+
100% {
120+
transform: translateY(-400px);
121+
opacity: 0;
122+
}
123+
}
124+
125+
@media screen and (max-width: 768px) {
126+
.team-members-grid {
127+
grid-template-columns: 1fr;
128+
}
129+
130+
.modal-contentme {
131+
width: 85%;
132+
padding: 20px;
133+
}
134+
}

‎frontend/src/assets/Style/tree.css‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -13,23 +13,7 @@
1313
position: relative;
1414
display: block;
1515
}
16-
.container_JYOTIN{
17-
border: 3px solid #ffffff;
18-
box-shadow: 2px 2px 5px black;
19-
/* padding: 10px 10px; */
20-
color: #ffffff;
21-
font-family: arial, verdana, tahoma;
22-
font-size: 20px;
23-
display: inline-block;
24-
border-radius: 20px;
25-
transition: all 0.5s;
26-
-webkit-transition: all 0.5s;
27-
-moz-transition: all 0.5s;
28-
cursor: pointer;
29-
width: 100px;
30-
height: 120px;
31-
background-color: #3574b4;
32-
}
16+
3317
.tree_ li {
3418
float: left;
3519
text-align: center;

0 commit comments

Comments
 (0)