fix: a lot of bugs from internal testing

src/app/(dashboard)/layout.tsx

@@ -78,7 +78,8 @@ function Dashboard({
       />
       <div className="flex flex-col w-full ml-[rem(60)] sm:ml-[rem(300)]">
         <HeaderTabs />
-        {Organisation === null || Is_approved === false ? (
+        {(Organisation === null || Is_approved === false) &&
+        !pathname.includes("profile") ? (
           <ManageOrg />
         ) : (
           <div className="m-4 relative rounded-md h-full overflow-auto">

src/app/(dashboard)/profile/page.tsx

@@ -1,11 +1,10 @@
 /* eslint-disable @next/next/no-img-element */
 "use client";
 
-import Image from "next/image";
 import { authStore } from "@/store/auth";
 import { organisationStore } from "@/store/organisation";
 import { FaRegCopy } from "react-icons/fa";
-import { toast, ToastContainer, ToastItem } from "react-toastify";
+import { toast, ToastContainer } from "react-toastify";
 import { Avatar, Modal, TextInput, Button } from "@mantine/core";
 import { FaEdit } from "react-icons/fa";
 import { useDisclosure } from "@mantine/hooks";
@@ -17,7 +16,7 @@ import { getSponsorsByUser } from "@/utils/organisation";
 import { sponsorships } from "@/types/org";
 
 export default function Profile() {
-  const { name, email, profile_pic, accessToken, update, getUser } =
+  const { name, email, profile_pic, accessToken, update, getUser, organisation } =
     authStore();
   const [sponsors, setSponsors] = useState<sponsorships[]>([]);
   const { org } = organisationStore();
@@ -43,7 +42,7 @@ export default function Profile() {
   };
 
   useEffect(() => {
-    if (accessToken === "") {
+    if (accessToken === "" || organisation === null) {
       return;
     }
     async function fetchData() {
@@ -121,14 +120,14 @@ export default function Profile() {
       </div>
       <div className="flex flex-col h-full md:flex-row gap-4 items-center justify-center">
         <div className="flex flex-col h-full gap-4 w-full">
-          <div className="border p-4 border-black rounded-md w-full flex flex-col">
+          <div className="border p-4 border-black rounded-md max-w-[500px] w-full flex flex-col">
             <p className="font-semibold">Username</p>
             <p>@{name}</p>
             <br />
             <p className="font-semibold">Email</p>
             <p>{email}</p>
           </div>
-          <div className="h-fit  p-4 w-full border border-black rounded-md ">
+          <div className={`h-fit  p-4 w-full border border-black rounded-md ${organisation === null ? 'hidden' : ""} `}>
             <h1 className="text-lg font-bold">Team Information</h1>
             <div className="flex flex-row gap-4">
               <p className="font-semibold">Organisation:</p>
@@ -155,7 +154,7 @@ export default function Profile() {
             </div>
           </div>
         </div>
-        <div className="w-full flex h-full flex-col border border-black rounded-md p-4">
+        <div className={`w-full flex h-full flex-col border border-black rounded-md p-4 ${organisation === null ? "hidden" : ""}`}>
           <h1 className="font-bold h-full text-lg mb-2">
             Recently Contacted Sponsors
           </h1>

src/app/(dashboard)/team/[id]/generateMail/page.tsx

@@ -241,7 +241,7 @@ export default function CreateEvent() {
             </Button>
           </div>
         </form>
-        <div className="w-full h-12 flex flex-row justify-end max-w-[900px]">
+        <div className={`w-full h-12 flex flex-row justify-end max-w-[900px] ${formContent.values.content.length === 0 ? "hidden" : ""}`}>
           <FaRegCopy
             className="w-5 h-5 cursor-pointer"
             onClick={() => {
@@ -251,10 +251,10 @@ export default function CreateEvent() {
           />
         </div>
         <form
-          className="w-full  gap-4 max-w-[900px] items-center self-center"
-          onSubmit={formContent.onSubmit(() => {
-            console.log("hello");
-          })}
+          className={`w-full gap-4 max-w-[900px] items-center self-center ${formContent.values.content.length === 0 ? "hidden" : ""}`}
+          // onSubmit={formContent.onSubmit(() => {
+          //   console.log("hello");
+          // })}
         >
           <Textarea
             label="Draft"
@@ -264,7 +264,7 @@ export default function CreateEvent() {
             mb={16}
             {...formContent.getInputProps("content")}
           />
-          <Textarea
+          {/* <Textarea
             label="Additional Prompt (Optional)"
             placeholder="Make it shorter and more crispy etc ..."
             size="md"
@@ -279,7 +279,7 @@ export default function CreateEvent() {
             >
               <BiRefresh className="text-2xl font-bold" /> Create New Event
             </button>
-          </div>
+          </div> */}
         </form>
       </Paper>
     </div>

src/app/(dashboard)/team/[id]/sponsorships/createNew/page.tsx

@@ -237,7 +237,7 @@ export default function CreateEvent() {
               <div className="flex flex-row w-full justify-between">
                 <TextInput
                   label={`Name of PoC ${index + 1}`}
-                  placeholder="Google"
+                  placeholder="Dhruv Shah"
                   size="md"
                   w={"100%"}
                   classNames={{ input: "bg-white w-full" }}
@@ -275,7 +275,7 @@ export default function CreateEvent() {
                 />
                 <TextInput
                   label="Linkedin"
-                  placeholder="Tech"
+                  placeholder="https://linkedin.com/in/dhruvshah"
                   size="md"
                   w={"100%"}
                   classNames={{ input: "bg-white w-full" }}
@@ -286,7 +286,7 @@ export default function CreateEvent() {
               <div className="flex flex-col select-none md:flex-row gap-4">
                 <TextInput
                   label="Phone Number"
-                  placeholder="Google"
+                  placeholder="9954672314"
                   size="md"
                   w={"100%"}
                   classNames={{ input: "bg-white w-full" }}
@@ -295,7 +295,7 @@ export default function CreateEvent() {
                 />
                 <TextInput
                   label="Email Address"
-                  placeholder="Tech"
+                  placeholder="dhruv.shah@gmail.com"
                   size="md"
                   w={"100%"}
                   classNames={{ input: "bg-white w-full" }}

src/app/page.tsx

@@ -19,10 +19,10 @@ export default function Home() {
         className="h-[100vh] bg-[#191919] p-4 w-full flex flex-row justify-center items-center"
       >
         <div className="w-[30rem]">
-          <h1 className="text-[3rem] md:text-[4rem] font-bold text-white w-full leading-[110%]">
+          <h1 className="text-[2rem] md:text-[4rem] font-bold text-white w-full leading-[110%]">
             tracking <br /> sponsorships <br/> <span className="text-[#5379F6]">made easy</span>
           </h1>
-          <p className="mt-4 text-[1.75rem]  text-white">
+          <p className="mt-4 text-[1.5rem] md:text-[1.75rem]  text-white">
             introducing gibspons, draft mails, track sponsorships, and manage
             negotiations, all in one place!
           </p>

src/components/Footer.tsx

@@ -1,17 +1,17 @@
-'use client'
+"use client";
 import Image from "next/image";
 import Link from "next/link";
 
 export default function Footer() {
   return (
     <div className="w-full min-h-[40vh] bg-[#5379F6]">
       <div className="flex flex-col justify-center items-end">
-        <div className="min-h-[30vh] w-full flex flex-col p-8 justify-between items-center md:flex-row">
+        <div className="min-h-[30vh] w-full p-2 md:p-8 flex flex-col justify-between items-center md:flex-row">
           <div className="flex flex-col justify-center items-center">
             <div className="flex flex-row justify-center items-center ">
               <Image
                 src="/icon.svg"
-                className="h-[5rem] w-auto m-auto"
+                className="h-[3rem] md:h-[5rem] w-auto m-auto"
                 alt="logo"
                 width={50}
                 height={50}
@@ -27,9 +27,9 @@ export default function Footer() {
               Lorem ipsum dolor sit amet <br /> consectetur
             </h1>
           </div>
-          <div className="flex flex-row m-auto w-[85vw] h-full justify-between content-between items-center md:max-w-[40vw] lg:m-0 lg:w-[30vw]">
-            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-white text-[1rem] text-left">
-              <h1 className="text-[1.5rem] text-black mb-2">About</h1>
+          <div className="flex flex-row m-auto w-full h-full justify-between text-[0.7rem] text-white md:text-[1rem] content-between items-center md:max-w-[40vw] lg:m-0 lg:w-[30vw]">
+            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-left">
+              <h1 className="text-[1rem] md:text-[1.5rem] text-black mb-2">About</h1>
               <Link href="#features" className=" hover:scale-[110%]">
                 Features
               </Link>
@@ -40,17 +40,17 @@ export default function Footer() {
                 Contact
               </Link>
             </div>
-            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-white text-[1rem] text-left">
-              <h1 className="text-[1.5rem] text-black mb-2">Community</h1>
+            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-left">
+              <h1 className="text-[1rem] md:text-[1.5rem] text-black mb-2">Community</h1>
               <Link href="#Tutorials" className=" hover:scale-[110%]">
                 Tutorials
               </Link>
               <Link href="#Blog" className=" hover:scale-[110%]">
                 Blog
               </Link>
             </div>
-            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-white text-[1rem] text-left">
-              <h1 className="text-[1.5rem] text-black mb-2">Socials</h1>
+            <div className="flex flex-col m-4 h-full justify-center self-start gap-2 text-left">
+              <h1 className="text-[1rem] md:text-[1.5rem] text-black mb-2">Socials</h1>
               <Link
                 href="https://facebook.com/gdscvitvellore"
                 className=" hover:scale-[110%]"
@@ -73,11 +73,11 @@ export default function Footer() {
           </div>
         </div>
         <div className="h-[10vh] w-full bg-[#F8F8F8] flex flex-row justify-center items-center">
-          <div className="flex flex-col m-4 w-auto justify-center items-center">
-            <h1 className="text-[1.5rem] text-clip text-[#070707] font-[600] md:text-[2rem]">
+          <div className="flex flex-col sm:m-4 w-auto justify-center items-center">
+            <h1 className="text-[1.25rem] text-clip text-[#070707] font-[600] md:text-[2rem]">
               Made with &#10084;&#65039; by GDSC VIT.
             </h1>
-            <p className="text-[0.75rem] pb-2 text-[#555] md:text-[1rem]">
+            <p className="text-[0.75rem] pb-2 text-center text-[#555] md:text-[1rem]">
               2023 &#169; All Rights Reserved, Google Developer Student Clubs
               VIT.
             </p>

src/components/ManageOrg.tsx

@@ -21,24 +21,19 @@ import { organisation, organisationStore } from "@/store/organisation";
 import { getOrganisation } from "@/utils/organisation";
 
 function ManageOrg() {
-  const { accessToken, organisation, update, getUser } = authStore();
+  const { accessToken, organisation, update, getUser } =
+    authStore();
   const { updateOrganisation } = organisationStore();
   const [hasJoined, setHasJoined] = useState(false);
   const [createOrg, setCreateOrg] = useState(false);
-  const [showCreateOrg, setShowCreateOrg] = useState(false);
 
   useEffect(() => {
     if (organisation !== null) {
       setHasJoined(true);
+      console.log(organisation);
     }
   }, [organisation]);
 
-  useEffect(() => {
-    if (createOrg) {
-      setShowCreateOrg(true);
-    }
-  }, [createOrg]);
-
   const form = useForm({
     initialValues: {
       orgCode: "",
@@ -70,7 +65,6 @@ function ManageOrg() {
   });
 
   const refreshData = async () => {
-    //todo: put logic here once backend is updated
     const respUser: user = await getUserData(accessToken);
     const User = getUser();
     const respOrg: organisation = await getOrganisation(accessToken);
@@ -81,11 +75,13 @@ function ManageOrg() {
       is_approved: respUser.is_approved,
     });
     updateOrganisation(respOrg);
+    if (respUser.organisation !== null)
     setHasJoined(true);
   };
 
   useEffect(() => {
-    if(accessToken === "") return;
+    if (accessToken === "") return;
+
     refreshData();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
@@ -125,7 +121,7 @@ function ManageOrg() {
     <div className="h-full">
       <ToastContainer />
 
-      {showCreateOrg ? (
+      {createOrg ? (
         <Paper className={classes.form} p={30}>
           <Title order={2} className={classes.title} ta="center" mt="md">
             Create Your Team
@@ -192,7 +188,7 @@ function ManageOrg() {
             </Button>
           </form>
         </Paper>
-      ) : hasJoined ? (
+      ) : !hasJoined ? (
         <Paper className={classes.form} p={30}>
           <Title
             order={2}
@@ -258,7 +254,7 @@ function ManageOrg() {
             Your team joining request is pending. Contact your admin to approve
             request to join the team.
           </Title>
-          <div className="flex flex-col gap-8 md:flex-row justify-between items-center w-full max-w-[400px]">
+          <div className="flex flex-col gap-8 md:flex-row justify-between items-center w-full max-w-[500px]">
             <Button
               key="change-join-code"
               mt="xl"

src/components/Navbar.tsx

@@ -1,19 +1,19 @@
-'use client'
+"use client";
 
 import Link from "next/link";
 
 /* eslint-disable @next/next/no-img-element */
 export default function Navbar() {
   return (
-    <div className="fixed h-[64px] top-0 left-0 w-full bg-white text-xl text-black flex flex-row justify-between px-8 align-middle items-center">
+    <div className="fixed h-[64px] top-0 left-0 w-full bg-white text-xl text-black flex flex-row justify-between px-2 sm:px-8 align-middle items-center">
       <a className="h-[80%] w-auto flex flex-row" href="localhost:3000">
         <img src="/icon.svg" alt="logo" className="h-full w-auto" />
         <div className="flex flex-col justify-center items-center p-2">
           <h1 className="text-2xl font-bold leading-[100%]">gibspons</h1>
           <p className="text-sm">by GDSC VIT.</p>
         </div>
       </a>
-      <div className="flex flex-row justify-center items-center text-xl">
+      <div className="flex flex-row justify-center items-center text-sm sm:text-xl">
         <Link
           href="#home"
           className="hover:bg-gray-200 rounded-full p-2 hidden md:block"
@@ -38,8 +38,8 @@ export default function Navbar() {
         >
           <p className="px-4">Blogs</p>
         </Link>
-        <Link href="/login" className="hover:scale-110">
-          <p className="px-4 m-0 md:ml-4 py-2 text-white bg-black rounded-full">
+        <Link href="/login">
+          <p className="px-4 m-0 md:ml-4 py-2 text-white bg-black hover:bg-gray-600 rounded-full">
             Get Started
           </p>
         </Link>

src/components/companyForm.tsx

@@ -34,7 +34,7 @@ type PoC = {
 };
 
 export default function ModifyCompany({ company_id, close }: { company_id: number, close: (success?:boolean, data?:string) => void}) {
-  const { accessToken, organisation } = authStore();
+  const { accessToken, organisation, role } = authStore();
   // const [pocCount, setPocCount] = useState<number>(1);
   const event_id = usePathname().split("/")[2];
   const [data, setData] = useState<pocResp[]>([]);
@@ -178,7 +178,7 @@ export default function ModifyCompany({ company_id, close }: { company_id: numbe
               data={[
                 { label: "Select status", value: "" },
                 { label: "Not Contacted", value: "Not Contacted" },
-                { label: "Accepted", value: "Accepted" },
+                { label: "Accepted", value: "Accepted", disabled: (role === 'user') },
                 { label: "No Reply", value: "No Reply" },
                 { label: "In Progress", value: "In Progress" },
                 { label: "Rejected", value: "Rejected" },
@@ -211,9 +211,10 @@ export default function ModifyCompany({ company_id, close }: { company_id: numbe
             />
             <TextInput
               label="Money Donated"
-              placeholder="10000"
+              placeholder="donation amount"
               size="md"
               w={"100%"}
+              disabled = {form.values.status === "accepted" ? false : true}
               classNames={{ input: "bg-white w-full " }}
               mb={10}
               {...form.getInputProps("money_donated")}