Skip to content

Commit

Permalink
add
Browse files Browse the repository at this point in the history
  • Loading branch information
@sayandedotcom
sayandedotcom committed Nov 29, 2024
1 parent d3e8fcd commit 2c4bfad
Show file tree
Hide file tree
Showing 21 changed files with 947 additions and 520 deletions.
285 changes: 158 additions & 127 deletions apps/web/app/(portals)/[profile]/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,37 +1,63 @@
import { Metadata } from "next";
"use client";

import Image from "next/image";
import Link from "next/link";
import { useRouter } from "next/navigation";

import Loading from "@/app/loading";
import { expired, fromNow } from "@refhiredcom/utils";
import { useQuery } from "@tanstack/react-query";
import { Calendar, Mail, MapPin } from "lucide-react";
import { ArrowRight } from "lucide-react";
import { useSession } from "next-auth/react";

import { Button, Separator } from "@referrer/ui";

import { ProfilePage } from "@/components/profile/profile";
import { PostCard } from "@/components/custom-components";
import {
ApplyStatus,
BookmarkButton,
MultipleButtons,
ShareButton,
StarButton,
} from "@/components/custom-components/post-card/post-buttons";
import Navigate from "@/components/navigate";
import { ApplyDialog } from "@/components/ui";

import { auth } from "@/lib/auth";
import { request } from "@/lib/axios";

import { TProfile } from "@/types/types";
import { cn } from "@/utils";

export const metadata: Metadata = {
title: "Profile",
description: "Get job referrals to the top best companies of the world",
};
import { TProfile } from "@/types/types";

type paramsProps = {
params: { profile: string };
};

async function getProfile<T>(profile) {
const response = await request.get<T>(`/username/${profile}`);

return response.data;
}

const Profile = async ({ params }: paramsProps) => {
export default function ProfilePage({ params }: paramsProps) {
const { profile } = params;

const session = await auth();
const { data: session } = useSession();
const router = useRouter();

const {
data: profileData,
error,
isStale,
isLoading,
isFetching,
} = useQuery<TProfile>({
queryKey: ["username", profile],
queryFn: () => {
return request.get(`/username/${profile}`);
},
// refetchInterval: 5000,
// staleTime: 200000,
// gcTime: Infinity,
});

const data = profileData?.data?.data;

console.log(isLoading, isFetching, isStale);

if (profile === "profile")
return (
Expand All @@ -55,7 +81,7 @@ const Profile = async ({ params }: paramsProps) => {
</>
);

const { data } = await getProfile<TProfile>(profile);
if (isLoading) return <Loading />;

if (!data)
return (
Expand All @@ -77,113 +103,118 @@ const Profile = async ({ params }: paramsProps) => {
);

return (
<ProfilePage data={data} />
// <>
// <div className="flex flex-col items-center gap-2 p-2">
// <Image
// alt="img"
// src={data.image ?? "/images/avatar/avatar.png"}
// width={120}
// height={120}
// className="cursor-pointer rounded-full"
// />
// <p className="font-heading text-center text-sm md:text-xl">{data.name}</p>
// <p>@{data?.userName}</p>
// <span>{data?.bio}</span>
// <div className="flex items-center justify-center gap-3">
// <div className="flex gap-2">
// <Mail className="h-6" />
// <span>{data?.email}</span>
// </div>
// {data?.location && (
// <div className="flex gap-2">
// <MapPin />
// <span>{data.location}</span>
// </div>
// )}
// <div className="flex gap-2">
// <Calendar className="h-5" />
// <span>Joined {fromNow(data.createdAt)}</span>
// </div>
// {/* <div className="flex gap-2">
// <BriefcaseBusiness />
// <span>{data?.workingAt}</span>
// </div> */}
// </div>
// {session?.user.userName === data?.userName && (
// <Link
// href="/settings/profile"
// className={cn(
// "focus-visible:ring-ring ring-offset-background bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-10 items-center justify-center rounded-lg px-4 py-2 text-sm font-semibold transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
// )}>
// Edit Profile
// </Link>
// )}
// </div>
// <Separator />
// {data?.posts.map((postData) => (
// <PostCard key={postData.id}>
// <PostCard.Image
// src={data?.image ?? "/images/avatar/avatar.png"}
// name={data.name}
// userName={data.userName}
// bio={data.bio}
// />
// <PostCard.Content>
// <PostCard.Header
// name={data.name}
// userName={data.userName}
// image={data.image ?? "/images/avatar/avatar.png"}
// bio={data.bio}
// time={fromNow(data.createdAt)}
// timeLeft={postData.expiresAt ? fromNow(postData.expiresAt) : "No Expiry"}
// postType={postData.postType}
// isAuthor={session?.user?.id === data.id}
// expired={expired(postData.expiresAt)}
// />
// <Navigate userName={data.userName} postId={data.id}>
// <PostCard.Description showMore={true}>
// {postData.description.substring(0, 350).concat(" ...")}
// </PostCard.Description>
// </Navigate>
// <PostCard.Tags
// allTags={false}
// companyName={postData.companyName}
// locationType={postData.jobLocationType}
// location={postData.jobLocation}
// experience={postData.jobExperience}
// jobType={postData.jobType}
// role={postData.jobRole}
// salary={postData.jobCompensation}
// />
// <PostCard.Footer>
// <MultipleButtons>
// {/* <CommentButton /> */}
// <ShareButton link={`${data.userName}/posts/${data.id}`} title={postData.description} />
// <BookmarkButton />
// <ApplyStatus totalApplied={postData.totalApplied} acceptLimit={postData.acceptLimit} />
// <StarButton star={data.stars} />
// </MultipleButtons>
// {session?.user.id === data.id ? (
// <></>
// ) : (
// // <Button className="h-9 rounded-full text-sm md:w-36">Analytics</Button>
// <ApplyDialog
// myObject={postData.accept}
// postId={postData.id}
// stars={postData.stars}
// totalApplied={postData.totalApplied}
// acceptLimit={postData.acceptLimit}
// authorId={postData.userId}
// expired={expired(postData.expiresAt)}
// />
// )}
// </PostCard.Footer>
// </PostCard.Content>
// </PostCard>
// ))}
// </>
<>
<div className="flex flex-col items-center gap-2 p-2">
<Image
alt="img"
src={data.image ?? "/images/avatar/avatar.png"}
width={120}
height={120}
className="cursor-pointer rounded-full"
/>
<p className="font-heading text-center text-sm md:text-xl">{data.name}</p>
<p>@{data?.userName}</p>
<span>{data?.bio}</span>
<div className="flex items-center justify-center gap-3">
<div className="flex gap-2">
<Mail className="h-6" />
<span>{data?.email}</span>
</div>
{data?.location && (
<div className="flex gap-2">
<MapPin />
<span>{data.location}</span>
</div>
)}
<div className="flex gap-2">
<Calendar className="h-5" />
<span>Joined {fromNow(data.createdAt)}</span>
</div>
{/* <div className="flex gap-2">
<BriefcaseBusiness />
<span>{data?.workingAt}</span>
</div> */}
</div>
{session?.user.userName === data?.userName && (
<Button
onClick={() => {
router.push("/settings/profile");
}}
className={cn("rounded-3xl")}>
Edit Profile
</Button>
)}
</div>
<Separator />
{data?.posts.map((postData) => (
<PostCard key={postData.id}>
<PostCard.Image
src={data?.image ?? "/images/avatar/avatar.png"}
name={data.name}
userName={data.userName}
bio={data.bio}
/>
<PostCard.Content>
<PostCard.Header
name={data.name}
userName={data.userName}
image={data.image ?? "/images/avatar/avatar.png"}
bio={data.bio}
time={fromNow(data.createdAt)}
timeLeft={postData.expiresAt ? fromNow(postData.expiresAt) : "No Expiry"}
postType={postData.postType}
isAuthor={session?.user?.id === data.id}
expired={expired(postData.expiresAt)}
/>
<Navigate userName={data.userName} postId={data.id}>
<PostCard.Description showMore={true}>
{postData.description.substring(0, 350).concat(" ...")}
</PostCard.Description>
</Navigate>
<PostCard.Tags
allTags={false}
companyName={postData.companyName}
locationType={postData.jobLocationType}
location={postData.jobLocation}
experience={postData.jobExperience}
jobType={postData.jobType}
role={postData.jobRole}
salary={postData.jobCompensation}
/>
<PostCard.Footer>
<MultipleButtons>
{/* <CommentButton /> */}
<ShareButton link={`${data.userName}/posts/${data.id}`} title={postData.description} />
<BookmarkButton />
<ApplyStatus totalApplied={postData.totalApplied} acceptLimit={postData.acceptLimit} />
<StarButton star={postData.stars} />
</MultipleButtons>
{session?.user.id === data.id ? (
postData.totalApplied > 0 && (
<Button
onClick={() => {
router.push(`/dashboard/requests?postId=${data.id}`);
}}
className="h-9 rounded-full text-sm md:w-36">
Explore Requests
</Button>
)
) : (
// <Button className="h-9 rounded-full text-sm md:w-36">Analytics</Button>
<ApplyDialog
myObject={postData.accept}
postId={postData.id}
stars={postData.stars}
totalApplied={postData.totalApplied}
acceptLimit={postData.acceptLimit}
authorId={postData.userId}
expired={expired(postData.expiresAt)}
/>
)}
</PostCard.Footer>
</PostCard.Content>
</PostCard>
))}
</>
);
};

export default Profile;
}
8 changes: 4 additions & 4 deletions apps/web/app/(portals)/post/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const DynamicDrafts = dynamic(() => import("@/components/ui/post-forms/drafts"),
loading: () => <Loading />,
});

type TabParams = { tab: "referral" | "find" | "normal" | "drafts" };
type TabParams = { tab: "referral" | "find" | "post" | "drafts" };

export default function Post() {
const pathName = usePathname();
Expand Down Expand Up @@ -63,9 +63,9 @@ export default function Post() {
</TabsTrigger>
<TabsTrigger
onClick={() => {
router.push(pathName + "?" + createQueryString("tab", "normal"));
router.push(pathName + "?" + createQueryString("tab", "post"));
}}
value="normal">
value="post">
Post
</TabsTrigger>
<TabsTrigger
Expand All @@ -82,7 +82,7 @@ export default function Post() {
<TabsContent value="find">
<DynamicFindReferrer />
</TabsContent>
<TabsContent value="normal">
<TabsContent value="post">
<DynamicNormalPost />
</TabsContent>
<TabsContent value="drafts">
Expand Down
19 changes: 19 additions & 0 deletions apps/web/app/(portals)/provider.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
import { useEffect, useState } from "react";

import { useSession } from "next-auth/react";
import setupIndexedDB from "use-indexeddb";
import { useLocalStorage } from "usehooks-ts";

import { Walkthrough } from "@/components/custom-components";
Expand All @@ -12,6 +13,20 @@ import { PostSteps, Steps } from "@/config";

import { useStore } from "@/store/store";

const idbConfig = {
databaseName: "refhired-db",
version: 1,
stores: [
{
name: "posts", // Store name
id: { keyPath: "id", autoIncrement: true }, // Primary key setup
indices: [
{ name: "body", keyPath: "body", options: { unique: false } }, // Index for the "body" field
],
},
],
};

export function Provider({ children }: { children: React.ReactNode }) {
const { data: session } = useSession();

Expand All @@ -30,6 +45,10 @@ export function Provider({ children }: { children: React.ReactNode }) {
}, [session?.error]);

useEffect(() => {
setupIndexedDB(idbConfig)
.then(() => console.log("success"))
.catch((e) => console.error("error / unsupported", e));

const timer = setTimeout(() => {
setShowComponent(true);
}, 3000);
Expand Down
Loading

0 comments on commit 2c4bfad

Please sign in to comment.