Skip to content

Commit

Permalink
add get contacts api
Browse files Browse the repository at this point in the history
  • Loading branch information
ParthGupta2510 committed Jul 31, 2024
1 parent bf83b50 commit dfb1142
Show file tree
Hide file tree
Showing 2 changed files with 129 additions and 97 deletions.
4 changes: 2 additions & 2 deletions src/apiService.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// const apiService = 'http://localhost:5050';
const apiService = 'https://gymkhana.iitkgp.ac.in';
// const apiService = 'http://localhost:5050/api';
const apiService = 'https://gymkhana.iitkgp.ac.in/api';

export default apiService;
222 changes: 127 additions & 95 deletions src/pages/Contacts/CurrentOfficeBearers.js
Original file line number Diff line number Diff line change
@@ -1,108 +1,140 @@
import React from "react";
import React, { useEffect, useState } from "react";
import ContactCard from "../../components/ContactCard";
import contactsData from "../../data/contactsData.js";
import Styles from "../../styles/pages/contacts.module.css";
import axios from "axios";
import apiService from "../../apiService.js";

export default function CurrentOfficeBearers() {
const President = contactsData.data.find(
(contact) => contact.Post === "President"
);
const HonoraryTreasurer = contactsData.data.find(
(contact) => contact.Post === "Honorary Treasurer"
);
const VicePresident = contactsData.data.find(
(contact) => contact.Post === "Vice President"
);
const thirdYearCouncil = contactsData.data.filter(
(element) =>
element.Category === "General Secretary" ||
element.Category === "Nominated"
);
const secretaries = contactsData.data.filter(
(element) => element.Category === "Secretary"
);
const [contacts, setContacts] = useState();
const [refreshContacts, setRefreshContacts] = useState(true);

return (
<>
<div className={Styles.contactsContainer}>
<div>
<div data-aos="zoom-in-up">
<ContactCard
name={President.Name}
designation={President.Post}
facebook={President.Facebook}
linkedin={President.LinkedIn}
email={President.Email}
imgSrc={`/data/media/images/contacts/${President.img}`}
/>
</div>
</div>
const President = contactsData.data.find(
(contact) => contact.Post === "President"
);
const HonoraryTreasurer = contactsData.data.find(
(contact) => contact.Post === "Honorary Treasurer"
);

<div>
<div data-aos="zoom-in-up">
<ContactCard
name={HonoraryTreasurer.Name}
designation={HonoraryTreasurer.Post}
facebook={HonoraryTreasurer.Facebook}
linkedin={HonoraryTreasurer.LinkedIn}
email={HonoraryTreasurer.Email}
imgSrc={`/data/media/images/contacts/${HonoraryTreasurer.img}`}
/>
</div>
</div>
// const VicePresident = contactsData.data.find(
// (contact) => contact.Post === "Vice President"
// );

<div>
<div data-aos="zoom-in-up">
<ContactCard
name={VicePresident.Name}
designation={VicePresident.Post}
facebook={VicePresident.Facebook}
linkedin={VicePresident.LinkedIn}
email={VicePresident.Email}
imgSrc={`/data/media/images/contacts/${VicePresident.img}`}
/>
</div>
</div>
const thirdYearCouncil = contactsData.data.filter(
(element) =>
element.Category === "General Secretary" ||
element.Category === "Nominated"
);
const secretaries = contactsData.data.filter(
(element) => element.Category === "Secretary"
);

<div>
<div className={Styles.multipleCards}>
{thirdYearCouncil.map((member, index) => {
return (
<div data-aos="zoom-in-up">
<ContactCard
name={member.Name}
designation={member.Post}
facebook={member.Facebook}
linkedin={member.LinkedIn}
email={member.Email}
imgSrc={`/data/media/images/contacts/${member.img}`}
/>
useEffect(() => {
const getContacts = async () => {
const response = await axios.get(
`${apiService}/user/getContacts/2024-2025`
);

if (response.status === 200) {
setContacts(response.data.contacts);
}
};

getContacts();
}, [refreshContacts]);

return (
<>
<div className={Styles.contactsContainer}>
<div>
<div data-aos="zoom-in-up">
<ContactCard
name={President.Name}
designation={President.Post}
facebook={President.Facebook}
linkedin={President.LinkedIn}
email={President.Email}
imgSrc={`/data/media/images/contacts/${President.img}`}
/>
</div>
</div>
);
})}
</div>
</div>

<div>
<h2 className={Styles.postHeading}>Secretaries</h2>
<div className={Styles.multipleCards}>
{secretaries.map((member, index) => {
return (
<div data-aos="zoom-in-up">
<ContactCard
name={member.Name}
designation={member.Post}
facebook={member.Facebook}
linkedin={member.LinkedIn}
email={member.Email}
imgSrc={`/data/media/images/contacts/${member.img}`}
/>
<div>
<div data-aos="zoom-in-up">
<ContactCard
name={HonoraryTreasurer.Name}
designation={HonoraryTreasurer.Post}
facebook={HonoraryTreasurer.Facebook}
linkedin={HonoraryTreasurer.LinkedIn}
email={HonoraryTreasurer.Email}
imgSrc={`/data/media/images/contacts/${HonoraryTreasurer.img}`}
/>
</div>
</div>
);
})}
</div>
</div>
</div>
</>
);
{contacts && (
<>
<div>
<div data-aos="zoom-in-up">
<ContactCard
name={contacts["VICE PRESIDENT"].name}
designation={contacts["VICE PRESIDENT"].por}
facebook={
contacts["VICE PRESIDENT"].fb_link
}
linkedin={
contacts["VICE PRESIDENT"].linkedin_link
}
email={contacts["VICE PRESIDENT"].email}
imgSrc={contacts["VICE PRESIDENT"].image}
/>
</div>
</div>

<div>
<div className={Styles.multipleCards}>
{contacts["THIRD YEAR COUNCIL"].map(
(member, index) => {
return (
<div data-aos="zoom-in-up">
<ContactCard
name={member.name}
designation={member.por}
facebook={member.fb_link}
linkedin={
member.linkedin_link
}
email={member.email}
imgSrc={member.image}
/>
</div>
);
}
)}
</div>
</div>

<div>
<h2 className={Styles.postHeading}>Secretaries</h2>
<div className={Styles.multipleCards}>
{contacts["SECRETARY"].map((member, index) => {
return (
<div data-aos="zoom-in-up">
<ContactCard
name={member.name}
designation={member.por}
facebook={member.fb_link}
linkedin={member.linkedin_link}
email={member.email}
imgSrc={member.image}
/>
</div>
);
})}
</div>
</div>
</>
)}
</div>
</>
);
}

0 comments on commit dfb1142

Please sign in to comment.