feat: added .env.example file to template secret variables

frontend/.env.example

@@ -0,0 +1 @@
+REACT_APP_API=

frontend/.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

frontend/src/App.js

@@ -1,10 +1,10 @@
 import './App.css';
 import { BrowserRouter, Route, Routes } from "react-router-dom";
-import Navbar from "./component/Navbar";
+import Navbar from "./components/Navbar";
 import Home from "./pages/Home";
 import Search from './pages/Search';
 import { DataProvider } from './context/DataContext';
-import ImageTree from './pages/ImageTree';
+import ImageTree from './pages/3DTree';
 import React, { useEffect, useState } from 'react';
 import axios from 'axios';
 import { ToastContainer, toast } from 'react-toastify';

frontend/src/pages/DTree.jsx → frontend/src/components/2DTree.jsx

@@ -1,11 +1,11 @@
 import React, { useState } from 'react';
 import Tree from 'react-d3-tree';
-import '../Style/home.css'
+import '../assets/Style/home.css'
 import { CircularProgressbar } from 'react-circular-progressbar';
 import 'react-circular-progressbar/dist/styles.css';
-import Profile from '../component/Profile';
+import Profile from './Profile';
 
-const DTree = ({ data }) => {
+const TwoDTree = ({ data }) => {
   const [roll, setroll] = useState()
   const [showModal, setShowModal] = useState(false);
   const value = 0.5;
@@ -104,4 +104,4 @@ const DTree = ({ data }) => {
   )
 }
 
-export default DTree
+export default TwoDTree

frontend/src/pages/IitjTree.jsx → frontend/src/components/Family.jsx

@@ -1,7 +1,7 @@
-import '../Style/tree.css'
+import '../assets/Style/tree.css'
 import React, { useState } from 'react'
-import Profile from "../component/Profile";
-import profileimg from '../image/download.jpeg'
+import Profile from "./Profile";
+import profileimg from '../assets/image/download.jpeg'
 
 const IitjTree = ({ data }) => {
   const studentid = data.student
@@ -60,12 +60,12 @@ const IitjTree = ({ data }) => {
         <ul>
           {treeDatas.map((item, index) =>
             <li className={item.name + index} key={index}>
-              <div className={item.rollNo == 'B22AI063' ? "container_JYOTIN  " : "container"}
+              <div className={item.rollNo === 'B22AI063' ? "container_JYOTIN  " : "container"}
               // "container ${item.rollNo}" 
               >
                 <div 
                 // className="container_info"
-                className={item.rollNo == 'B22AI063' ? "container_info_JYOTIN  " : "container_info"}
+                className={item.rollNo === 'B22AI063' ? "container_info_JYOTIN  " : "container_info"}
                 >
                   <div className="hovertext" onClick={() => toggleModal(item.rollNo)}>{item.name.slice(0,15) + ''}</div>
                   <div className="info">

frontend/src/component/Navbar.jsx → frontend/src/components/Navbar.jsx

@@ -1,6 +1,6 @@
-import "../Style/navbar.css";
+import "../assets/Style/navbar.css";
 import { Link } from "react-router-dom";
-import logo from "../image/logo.png";
+import logo from "../assets/image/logo.png";
 import React, { useState } from "react";
 import { useQuery, gql } from "@apollo/client";
 import { useNavigate } from 'react-router-dom';

frontend/src/component/Profile.jsx → frontend/src/components/Profile.jsx

@@ -1,11 +1,10 @@
 import React from 'react'
-import '../Style/profile.css'
+import '../assets/Style/profile.css'
 import { Link } from "react-router-dom";
-import { AiOutlineCloseCircle } from 'react-icons/ai';
 import { FaLinkedin } from 'react-icons/fa';
 import { useQuery, gql } from "@apollo/client";
 import { FaChevronRight } from 'react-icons/fa';
-import demo from '../image/download.jpeg'
+import demo from '../assets/image/download.jpeg'
 function Profile({ toggleModal, rollNo }) {
   const FILMS_QUERY = gql`
     query Query($rollNo: String!) {

frontend/src/pages/Team.jsx → frontend/src/components/Team.jsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react'
-import '../Style/team.css'
+import '../assets/Style/team.css'
 import { FaLinkedin, FaGithub} from 'react-icons/fa';
 import { AiOutlineCloseCircle } from 'react-icons/ai';
 
@@ -16,10 +16,10 @@ const Team = ({ team, teamshow }) => {
         <AiOutlineCloseCircle style={{ fontSize: '2rem', }} onClick={team} className='closeshomepro' />
         <p>Ashutosh kumar (B22CS015)</p>
         <div className='iconsocialmedia'>
-          <a href='https://www.linkedin.com/in/ashutosh-kumar-5aa3b3259/' target='_blank'>
+          <a href='https://www.linkedin.com/in/ashutosh-kumar-5aa3b3259/' target='_blank' rel="noreferrer">
             <FaLinkedin style={{ fontSize: '2rem', color: 'white' }} onClick={team} />
           </a>
-          <a href='https://github.com/a19hu/' target='_blank'>
+          <a href='https://github.com/a19hu/' target='_blank' rel="noreferrer">
             <FaGithub style={{ fontSize: '2rem', color: 'white' }} onClick={team} />
           </a>
         </div>

frontend/src/pages/ImageTree.jsx → frontend/src/pages/3DTree.jsx

@@ -1,9 +1,9 @@
 import { ForceGraph3D } from 'react-force-graph';
 import React from 'react';
 import * as THREE from 'three';
-import defaultimage from '../image/download.jpeg'
-import logo from '../image/logo.png'
-import background from '../image/b1.jpg'
+import defaultimage from '../assets/image/download.jpeg'
+import logo from '../assets/image/logo.png'
+import background from '../assets/image/b1.jpg'
 
 const ImageTree = ({ data }) => {
   const nodes = [{
@@ -13,10 +13,8 @@ const ImageTree = ({ data }) => {
     img: logo
   }];
   const links = [];
-  var image;
   if (data[0]) {
 
-    image = data[0].picture.replace('open', 'thumbnail')
   }
 
   const processNode = (node, parentId) => {

frontend/src/pages/Home.jsx

@@ -1,8 +1,8 @@
 import React, {useState} from 'react'
-import '../Style/home.css'
-import DTree from './DTree';
-import Team from './Team';
-import background from '../image/b1.jpg'
+import '../assets/Style/home.css'
+import TwoDTree from '../components/2DTree';
+import Team from '../components/Team';
+import background from '../assets/image/b1.jpg'
 const Home = ({data}) => {
   const [teamshow,setteamshow] = useState(false)
   const team=()=>{
@@ -26,7 +26,7 @@ const Home = ({data}) => {
        {teamshow && (
         <Team team={team} teamshow={teamshow}/>
        )}    
-        <DTree data={data}/>
+        <TwoDTree data={data}/>
 
 
     </div>

frontend/src/pages/Search.jsx

@@ -1,10 +1,10 @@
 import React from 'react';
 import { useQuery, gql, } from "@apollo/client";
-import IitjTree from './IitjTree';
+import IitjTree from '../components/Family';
 import { useNavigate,useParams } from 'react-router-dom';
 import { ToastContainer, toast } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
-import background from '../image/b1.jpg'
+import background from '../assets/image/b1.jpg'
 
 const Search = () => {
   const navigate = useNavigate();