diff --git a/app/components/Accordian.tsx b/app/components/Accordian.tsx new file mode 100644 index 0000000..4bf136c --- /dev/null +++ b/app/components/Accordian.tsx @@ -0,0 +1,103 @@ +import * as React from "react"; +import Accordion from "@mui/material/Accordion"; +import AccordionSummary from "@mui/material/AccordionSummary"; +import AccordionDetails from "@mui/material/AccordionDetails"; +import Typography from "@mui/material/Typography"; +import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; +import Link from "next/link"; +import { poppins } from "@/public/assets/fonts/fonts"; + +export default function Accordian() { + return ( +
+ + Frequently asked questions + + + + } + aria-controls="panel1a-content" + id="panel1a-header" + > + + Why are u getting username wrong? + + + + +
  • + You don't have your phone number linked with your Twitter account. +
  • +
  • You have not tweeted recently.
  • +
  • Our API might be down, retry after sometime.
  • +
    +
    +
    + + } + aria-controls="panel1a-content" + id="panel1a-header" + > + How does it work? + + + + Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quasi cum + laboriosam porro eius fugiat magnam, ab sint autem! Iusto nobis + minima facilis asperiores quidem dolorum officia recusandae pariatur + voluptate doloribus? + + + + + } + aria-controls="panel1a-content" + id="panel1a-header" + > + Where can I see the source code + + + + It's available right here in our{" "} + + Github repository + + + + + + } + aria-controls="panel2a-content" + id="panel2a-header" + > + Can I contribute to the project? + + + + Definitely yes, this project is completely open-source and open to + your valuable contributions. + + + + {/* + } + aria-controls="panel3a-content" + id="panel3a-header" + > + Disabled Accordion + + */} +
    + ); +} diff --git a/app/components/DownloadCanvas.tsx b/app/components/DownloadCanvas.tsx index cba493e..6a38708 100644 --- a/app/components/DownloadCanvas.tsx +++ b/app/components/DownloadCanvas.tsx @@ -8,6 +8,7 @@ import Streak from "../dashboard/Streak"; import ContributionGraph from "../dashboard/ContributionGraph"; import Logo from "./Logo"; import UserProfile from "./UserProfile"; +import { poppins } from "@/public/assets/fonts/fonts"; type DownloadCanvasProps = { dates: any; @@ -67,11 +68,11 @@ const DownloadCanvas: FC = ({
    -

    Streaks

    +

    Streaks

    -

    +

    Contribution Graph

    = ({ height={height} /> + + + + + + + +
    + ); +}; + +export default Faqs; diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx index d0e3b04..d05bc3c 100644 --- a/app/components/Footer.tsx +++ b/app/components/Footer.tsx @@ -1,27 +1,32 @@ +import { poppins } from "@/public/assets/fonts/fonts"; import Link from "next/link"; import type { FC } from "react"; import { AiFillGithub } from "react-icons/ai"; import { AiOutlineTwitter } from "react-icons/ai"; +import Faqs from "./Faqs"; type FooterProps = {}; -// bg-[#EAF3FE] +// bg-[#EAF3FE] const Footer: FC = () => { return (
    -

    - FAQ -

    -

    + +

    Open source |{" "} MIT License 2023 - {" "}
    - 100DaysOfCodeTracker + {" "} +
    + + 100DaysOfCodeTracker +

    diff --git a/app/components/Navbar.tsx b/app/components/Navbar.tsx index 3513203..a6dfd5a 100644 --- a/app/components/Navbar.tsx +++ b/app/components/Navbar.tsx @@ -6,7 +6,7 @@ type NavbarProps = {}; const Navbar: FC = () => { return ( -
    -

    Star Us

    +

    + Star Us +

    ); }; diff --git a/app/components/UserProfile.tsx b/app/components/UserProfile.tsx index b3bcec1..345cf98 100644 --- a/app/components/UserProfile.tsx +++ b/app/components/UserProfile.tsx @@ -1,6 +1,9 @@ +"use client"; + import Image from "next/image"; import { FC, useState } from "react"; import fallbackImage from "public/assets/fallback.jpg"; +import { poppins } from "@/public/assets/fonts/fonts"; type UserProfileProps = { userProfile: any; @@ -19,15 +22,19 @@ const UserProfile: FC = ({ userProfile }) => { height={200} className="rounded-full w-12 aspect-square object-cover" /> - + {count}
    -

    +

    {userProfile?.name}

    -

    +

    @{userProfile?.username}

    diff --git a/app/context/MyContext.tsx b/app/context/MyContext.tsx new file mode 100644 index 0000000..70afae7 --- /dev/null +++ b/app/context/MyContext.tsx @@ -0,0 +1,37 @@ +import { createContext, FC, useContext, useState } from "react"; +import UserProfile from "../components/UserProfile"; + +const StateContext = createContext< + { setProfile: (data: UserProfile) => void } | undefined +>(undefined); + + +interface UserProfile { + name: string; + username: string; + profile_img: string; +} + +export const ContextProvider = ({ children }: any) => { + const [userProfile, setUserProfile] = useState({ + name: "", + username: "", + profile_img: "", + }); + + const setProfile = (data: UserProfile) => { + setUserProfile({ + name: data.name, + username: data.username, + profile_img: data.profile_img, + }); + }; + + return ( + + {children} + + ); +}; + +export const useStateContext = () => useContext(StateContext); diff --git a/app/dashboard/ContributionGraph.tsx b/app/dashboard/ContributionGraph.tsx index 95d36a3..79597e7 100644 --- a/app/dashboard/ContributionGraph.tsx +++ b/app/dashboard/ContributionGraph.tsx @@ -8,6 +8,7 @@ import { FC, useState } from "react"; import Tooltip from "react-tippy"; import useTweetStore from "../store/tweetStore"; import Image from "next/image"; +import { poppins } from "@/public/assets/fonts/fonts"; interface ContributionGraphProps { tweets: any; dates: string[]; @@ -89,14 +90,16 @@ const ContributionGraph: FC = ({ className="rounded-full w-12 object-cover" />
    -

    {userProfile.name}

    -

    @{userProfile.username}

    +

    {userProfile.name}

    +

    + @{userProfile.username} +

    -

    +

    {tweets.find((tweet: any) => tweet.date === selectedDate).content}

    -

    +

    {new Date(selectedDate).toDateString()}

    diff --git a/app/dashboard/Sidebar.tsx b/app/dashboard/Sidebar.tsx index 43935ec..ffbaea8 100644 --- a/app/dashboard/Sidebar.tsx +++ b/app/dashboard/Sidebar.tsx @@ -8,6 +8,7 @@ import DonutLargeIcon from "@mui/icons-material/DonutLarge"; import { usePathname } from "next/navigation"; import { FC, useState } from "react"; import UserProfile from "../components/UserProfile"; +import { poppins } from "@/public/assets/fonts/fonts"; const links = [ { @@ -40,7 +41,9 @@ const Sidebar: FC = ({ userProfile }) => { const pathname = usePathname(); return ( -
    +
    @@ -48,7 +51,7 @@ const Sidebar: FC = ({ userProfile }) => {
    {link.icon} -

    {link.name}

    +

    {link.name}

    ))} diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx index 43d9d87..490ea51 100644 --- a/app/dashboard/page.tsx +++ b/app/dashboard/page.tsx @@ -15,12 +15,13 @@ import { FormEvent, useEffect, useState } from "react"; import { Dialog } from "@headlessui/react"; import { redirect } from "next/navigation"; import Link from "next/link"; +import { poppins } from "@/public/assets/fonts/fonts"; -const poppins = Poppins({ - subsets: ["latin"], - weight: ["100", "200", "300", "400", "500", "600", "700"], - variable: "--font-Poppins", -}); +// const poppins = Poppins({ +// subsets: ["latin"], +// weight: ["100", "200", "300", "400", "500", "600", "700"], +// variable: "--font-Poppins", +// }); interface Person { name: string; @@ -135,19 +136,19 @@ const dashboardPage = () => { } return ( -
    +
    -
    +
    -
    +
    {/* top */}
    {/* streaks */}
    -

    +

    Saturday, Jan 21

    -

    +

    Hello, {username}

    @@ -157,7 +158,7 @@ const dashboardPage = () => {