From e6c30e98306b7999e72572477950d80fa0b3ec87 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 06:51:01 +0530 Subject: [PATCH 01/10] Refactor User model to include social media links --- prisma/schema.prisma | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/prisma/schema.prisma b/prisma/schema.prisma index 41852a74..38ed65dc 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -20,11 +20,12 @@ model User { email String @unique emailVerified DateTime? - skills String[] - experience Experience[] - project Project[] - resume String? - + skills String[] + experience Experience[] + project Project[] + resume String? + socials Socials[] + oauthProvider OauthProvider? // Tracks OAuth provider (e.g., 'google') oauthId String? @@ -32,6 +33,14 @@ model User { onBoard Boolean @default(false) } +model Socials { + id String @id @default(cuid()) + userId String + platform String + link String + user User @relation(fields: [userId], references: [id], onDelete: Cascade) +} + enum OauthProvider { GOOGLE } From dee934bed9da566b099e39a9a7e44ecbfcd56802 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 06:51:14 +0530 Subject: [PATCH 02/10] Refactor CSS to hide scrollbars --- src/app/globals.css | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/app/globals.css b/src/app/globals.css index df05297e..5cb16d18 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -407,3 +407,6 @@ html { html { scroll-behavior: smooth; } +.no-scrollbar::-webkit-scrollbar { + display: none; +} From 21aa6c9eb1280d3830826c54dc3600c123cba2ec Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 06:57:03 +0530 Subject: [PATCH 03/10] Refactor profile edit page to add social media links --- src/app/profile/edit/page.tsx | 2 + src/app/profile/layout.tsx | 2 +- src/components/profile/AddSocials.tsx | 144 +++++++++++++++++++++++++ src/components/profile/ProfileInfo.tsx | 16 ++- 4 files changed, 162 insertions(+), 2 deletions(-) create mode 100644 src/components/profile/AddSocials.tsx diff --git a/src/app/profile/edit/page.tsx b/src/app/profile/edit/page.tsx index a5e50f8c..97430952 100644 --- a/src/app/profile/edit/page.tsx +++ b/src/app/profile/edit/page.tsx @@ -1,4 +1,5 @@ 'use client'; +import { AddSocials } from '@/components/profile/AddSocials'; import { EditProfile } from '@/components/profile/EditProfile'; import APP_PATHS from '@/config/path.config'; import { useSession } from 'next-auth/react'; @@ -20,6 +21,7 @@ const EditProfilePage = () => { Edit Profile + ); }; diff --git a/src/app/profile/layout.tsx b/src/app/profile/layout.tsx index a7cba91d..738f71d2 100644 --- a/src/app/profile/layout.tsx +++ b/src/app/profile/layout.tsx @@ -34,7 +34,7 @@ const ProfileLayout = ({ children }: { children: React.ReactNode }) => { return (
-
+
{children}
diff --git a/src/components/profile/AddSocials.tsx b/src/components/profile/AddSocials.tsx new file mode 100644 index 00000000..f65887f9 --- /dev/null +++ b/src/components/profile/AddSocials.tsx @@ -0,0 +1,144 @@ +'use client'; + +import { useEffect } from 'react'; + +import { useSession } from 'next-auth/react'; +import { useRouter } from 'next/navigation'; +import { zodResolver } from '@hookform/resolvers/zod'; +import { useForm } from 'react-hook-form'; + +import APP_PATHS from '@/config/path.config'; +import { Input } from '@/components/ui/input'; +import { Button } from '../ui/button'; + +import { + UserProfileSchema, + UserProfileSchemaType, +} from '@/lib/validators/user.profile.validator'; + +// import { useToast } from '../ui/use-toast'; + +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from '../ui/form'; + +// import Loader from '../loader'; +type Props = { + name: string; + email: string; +}; +export const AddSocials = ({}: Props) => { + const router = useRouter(); + const session = useSession(); + // const { toast } = useToast(); + + // const [isPending, startTransition] = useTransition(); + + const form = useForm({ + resolver: zodResolver(UserProfileSchema), + defaultValues: { + name: '', + email: '', + }, + }); + + const handleInputChange = (e: React.ChangeEvent) => { + form.setValue(e.target.name as keyof UserProfileSchemaType, e.target.value); + }; + + // const handleFormSubmit = async (data: UserProfileSchemaType) => { + // try { + // startTransition(() => { + // updateUser(data) + // .then((res) => { + // res.error + // ? toast({ + // title: (res.error as string) || 'something went wrong', + // variant: 'destructive', + // }) + // : toast({ title: res.success as string, variant: 'success' }); + // }) + // .then(() => { + // session.update({ ...session, user: { ...user, ...data } }); + // }); + // }); + // } catch (error: any) { + // toast({ + // title: error?.message || 'Internal server error', + // variant: 'destructive', + // }); + // } + // }; + + useEffect(() => { + if (session.status !== 'loading' && session.status === 'unauthenticated') + router.push(`${APP_PATHS.SIGNIN}?redirectTo=/profile/edit`); + }); + return ( +
+ +
+ Add Socials +
+
+
+
+ ( + + Social Platform Name + + + + + + )} + /> +
+
+ ( + + Social URL + + + + + + )} + /> +
+
+
+ +
+
+
+ + ); +}; diff --git a/src/components/profile/ProfileInfo.tsx b/src/components/profile/ProfileInfo.tsx index 181c3c49..145d09db 100644 --- a/src/components/profile/ProfileInfo.tsx +++ b/src/components/profile/ProfileInfo.tsx @@ -13,7 +13,8 @@ import { Input } from '@/components/ui/input'; import APP_PATHS from '@/config/path.config'; import { getNameInitials } from '@/lib/utils'; - +import icons from '@/lib/icons'; +import Link from 'next/link'; export const ProfileInfo = () => { const router = useRouter(); const session = useSession(); @@ -33,6 +34,19 @@ export const ProfileInfo = () => {
+
+
+ Socials +
+
+
+ + + @curiouscoder00 + +
+
+
Profile Info From b48b74a116f703a2098c82de8e9d22daa0ad5dff Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:04:58 +0530 Subject: [PATCH 04/10] Refactor user.profile.validator.ts to include user social media links validation --- src/lib/validators/user.profile.validator.ts | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/src/lib/validators/user.profile.validator.ts b/src/lib/validators/user.profile.validator.ts index 8e7d94cd..86258f1f 100644 --- a/src/lib/validators/user.profile.validator.ts +++ b/src/lib/validators/user.profile.validator.ts @@ -73,12 +73,11 @@ export const projectSchema = z.object({ 'OTHERS', ]), }); - -export type projectSchemaType = z.infer; -export type expFormSchemaType = z.infer; -export type addSkillsSchemaType = z.infer; -export type UserPasswordSchemaType = z.infer; - +export const userSocialSchema = z.object({ + id: z.string().optional(), + platform: z.string().min(1, { message: 'Name is required' }), + link: z.string().url({ message: 'Invalid URL format' }), +}); export const UserProfileDestroySchema = z.object({ random: z .string({ message: 'Required' }) @@ -86,4 +85,9 @@ export const UserProfileDestroySchema = z.object({ .max(8, { message: "Can't be more long" }), }); +export type projectSchemaType = z.infer; +export type expFormSchemaType = z.infer; +export type addSkillsSchemaType = z.infer; +export type UserPasswordSchemaType = z.infer; export type UserProfileDestroyType = z.infer; +export type userSocialSchemaType = z.infer; From 2e0e75a0414e5051753a998f03c91348437c16bd Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:05:42 +0530 Subject: [PATCH 05/10] Refactor user.profile.actions.ts to include user social media links management --- src/actions/user.profile.actions.ts | 81 +++++++++++++++++++++++++++++ 1 file changed, 81 insertions(+) diff --git a/src/actions/user.profile.actions.ts b/src/actions/user.profile.actions.ts index 51128cda..3d2d3660 100644 --- a/src/actions/user.profile.actions.ts +++ b/src/actions/user.profile.actions.ts @@ -5,6 +5,7 @@ import { expFormSchemaType, projectSchemaType, UserProfileSchemaType, + userSocialSchemaType, } from '@/lib/validators/user.profile.validator'; import bcryptjs from 'bcryptjs'; import { authOptions } from '@/lib/authOptions'; @@ -317,3 +318,83 @@ export const getUserDetails = async () => { return new ErrorHandler('Internal server error', 'DATABASE_ERROR'); } }; + +export const getUserSocials = async () => { + const auth = await getServerSession(authOptions); + if (!auth || !auth?.user?.id) + throw new ErrorHandler('Not Authorized', 'UNAUTHORIZED'); + try { + const res = await prisma.user.findFirst({ + where: { + id: auth.user.id, + }, + select: { + socials: true, + }, + }); + return new SuccessResponse( + 'Socials SuccessFully Fetched', + 200, + res + ).serialize(); + } catch (_error) { + return new ErrorHandler('Internal server error', 'DATABASE_ERROR'); + } +}; + +export const addUserSocials = withServerActionAsyncCatcher< + userSocialSchemaType, + ServerActionReturnType +>(async (data) => { + const auth = await getServerSession(authOptions); + + if (!auth || !auth?.user?.id) + throw new ErrorHandler('Not Authorized', 'UNAUTHORIZED'); + + try { + await prisma.socials.create({ + data: { + ...data, + userId: auth.user.id, + }, + }); + return new SuccessResponse('Project updated successfully', 200).serialize(); + } catch (_error) { + return new ErrorHandler('Internal server error', 'DATABASE_ERROR'); + } +}); + +export const deleteUserSocials = withServerActionAsyncCatcher< + { socialId: string }, + ServerActionReturnType +>(async ({ socialId }) => { + const auth = await getServerSession(authOptions); + + if (!auth || !auth?.user?.id) + throw new ErrorHandler('Not Authorized', 'UNAUTHORIZED'); + await prisma.socials.delete({ + where: { + id: socialId, + }, + }); + return new SuccessResponse('Socials deleted successfully', 200).serialize(); +}); + +export const updateUserSocials = withServerActionAsyncCatcher< + { socialId: string; data: userSocialSchemaType }, + ServerActionReturnType +>(async ({ socialId, data }) => { + const auth = await getServerSession(authOptions); + + if (!auth || !auth?.user?.id) + throw new ErrorHandler('Not Authorized', 'UNAUTHORIZED'); + await prisma.socials.update({ + where: { + id: socialId, + }, + data: { + ...data, + }, + }); + return new SuccessResponse('Socials updated successfully', 200).serialize(); +}); From b5cbe0a1f3745b80e32079bc75f6d17f3a961dd8 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:06:07 +0530 Subject: [PATCH 06/10] Refactor AddSocials component to include social media links management and validation --- src/components/profile/AddSocials.tsx | 177 +++++++++++++++++--------- 1 file changed, 118 insertions(+), 59 deletions(-) diff --git a/src/components/profile/AddSocials.tsx b/src/components/profile/AddSocials.tsx index f65887f9..3e6049bd 100644 --- a/src/components/profile/AddSocials.tsx +++ b/src/components/profile/AddSocials.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useEffect } from 'react'; +import { useEffect, useTransition } from 'react'; import { useSession } from 'next-auth/react'; import { useRouter } from 'next/navigation'; @@ -12,11 +12,11 @@ import { Input } from '@/components/ui/input'; import { Button } from '../ui/button'; import { - UserProfileSchema, - UserProfileSchemaType, + userSocialSchema, + userSocialSchemaType, } from '@/lib/validators/user.profile.validator'; -// import { useToast } from '../ui/use-toast'; +import { useToast } from '../ui/use-toast'; import { Form, @@ -26,78 +26,114 @@ import { FormLabel, FormMessage, } from '../ui/form'; +import { + addUserSocials, + deleteUserSocials, +} from '@/actions/user.profile.actions'; -// import Loader from '../loader'; +import Loader from '../loader'; +import { Trash } from 'lucide-react'; type Props = { - name: string; - email: string; + socials?: userSocialSchemaType; }; -export const AddSocials = ({}: Props) => { +export const AddSocials = ({ socials }: Props) => { const router = useRouter(); const session = useSession(); - // const { toast } = useToast(); - - // const [isPending, startTransition] = useTransition(); + const { toast } = useToast(); + const [isPending, startTransition] = useTransition(); - const form = useForm({ - resolver: zodResolver(UserProfileSchema), + const form = useForm({ + resolver: zodResolver(userSocialSchema), defaultValues: { - name: '', - email: '', + platform: socials?.platform || '', + link: socials?.link || '', }, }); const handleInputChange = (e: React.ChangeEvent) => { - form.setValue(e.target.name as keyof UserProfileSchemaType, e.target.value); + form.setValue(e.target.name as keyof userSocialSchemaType, e.target.value); }; - // const handleFormSubmit = async (data: UserProfileSchemaType) => { - // try { - // startTransition(() => { - // updateUser(data) - // .then((res) => { - // res.error - // ? toast({ - // title: (res.error as string) || 'something went wrong', - // variant: 'destructive', - // }) - // : toast({ title: res.success as string, variant: 'success' }); - // }) - // .then(() => { - // session.update({ ...session, user: { ...user, ...data } }); - // }); - // }); - // } catch (error: any) { - // toast({ - // title: error?.message || 'Internal server error', - // variant: 'destructive', - // }); - // } - // }; + const handleFormSubmit = async (data: userSocialSchemaType) => { + try { + startTransition(() => { + addUserSocials(data).then((res) => { + if (res.status) { + toast({ + title: 'Socials added successfully', + variant: 'success', + }); + form.reset(); + } else { + toast({ + title: res.message || 'Internal server error', + variant: 'destructive', + }); + } + }); + }); + } catch (error: any) { + toast({ + title: error?.message || 'Internal server error', + variant: 'destructive', + }); + } + }; + const delteteSocial = async (id: string) => { + try { + startTransition(() => { + deleteUserSocials({ socialId: id }).then((res) => { + if (res.status) { + toast({ + title: 'Socials deleted successfully', + variant: 'success', + }); + } else { + toast({ + title: res.message || 'Internal server error', + variant: 'destructive', + }); + } + }); + }); + } catch (error: any) { + toast({ + title: error?.message || 'Internal server error', + variant: 'destructive', + }); + } + }; useEffect(() => { if (session.status !== 'loading' && session.status === 'unauthenticated') router.push(`${APP_PATHS.SIGNIN}?redirectTo=/profile/edit`); }); + return (
- -
- Add Socials -
-
-
-
+ +
+
+
( Social Platform Name @@ -107,17 +143,19 @@ export const AddSocials = ({}: Props) => { )} />
-
+
( Social URL @@ -128,14 +166,35 @@ export const AddSocials = ({}: Props) => { />
-
- +
+ {socials ? ( +
+ + +
+ ) : ( + + )}
From 9bfca9d25b1235da7ceb0a0d164ebdef187d8379 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:06:27 +0530 Subject: [PATCH 07/10] Refactor profile edit page to remove AddSocials component --- src/app/profile/edit/page.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/app/profile/edit/page.tsx b/src/app/profile/edit/page.tsx index 97430952..a5e50f8c 100644 --- a/src/app/profile/edit/page.tsx +++ b/src/app/profile/edit/page.tsx @@ -1,5 +1,4 @@ 'use client'; -import { AddSocials } from '@/components/profile/AddSocials'; import { EditProfile } from '@/components/profile/EditProfile'; import APP_PATHS from '@/config/path.config'; import { useSession } from 'next-auth/react'; @@ -21,7 +20,6 @@ const EditProfilePage = () => { Edit Profile
-
); }; From 24f72723846cfb666e957faaa0b7d84f061418c7 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:06:49 +0530 Subject: [PATCH 08/10] Refactor EditProfile and ProfileInfo components to include social media links management and display --- src/components/profile/EditProfile.tsx | 46 +++++++++++++++++++++++-- src/components/profile/ProfileInfo.tsx | 42 +++++++++++++++++----- src/components/profile/social-icons.tsx | 24 +++++++++++++ src/lib/social-usernames.ts | 13 +++++++ 4 files changed, 113 insertions(+), 12 deletions(-) create mode 100644 src/components/profile/social-icons.tsx create mode 100644 src/lib/social-usernames.ts diff --git a/src/components/profile/EditProfile.tsx b/src/components/profile/EditProfile.tsx index bdaffb90..b13e4124 100644 --- a/src/components/profile/EditProfile.tsx +++ b/src/components/profile/EditProfile.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useEffect, useTransition } from 'react'; +import { useEffect, useState, useTransition } from 'react'; import { useSession } from 'next-auth/react'; import { useRouter } from 'next/navigation'; @@ -17,9 +17,10 @@ import { Button } from '../ui/button'; import { UserProfileSchema, UserProfileSchemaType, + userSocialSchemaType, } from '@/lib/validators/user.profile.validator'; -import { updateUser } from '@/actions/user.profile.actions'; +import { getUserSocials, updateUser } from '@/actions/user.profile.actions'; import { useToast } from '../ui/use-toast'; import { @@ -42,6 +43,7 @@ import { import Loader from '../loader'; import { DeleteAccountDialog } from './DeleteAccountDialog'; +import { AddSocials } from './AddSocials'; type Props = { name: string; @@ -54,7 +56,7 @@ export const EditProfile = ({ name, email }: Props) => { const { toast } = useToast(); const [isPending, startTransition] = useTransition(); - + const [socials, setSocials] = useState([]); const user = session.data?.user; const form = useForm({ resolver: zodResolver(UserProfileSchema), @@ -97,6 +99,16 @@ export const EditProfile = ({ name, email }: Props) => { } }; + const fetchUserSocials = async () => { + const res = await getUserSocials(); + if (res.status) { + setSocials(res.additional?.socials || []); + } + }; + useEffect(() => { + fetchUserSocials(); + }, [socials]); + useEffect(() => { if (session.status !== 'loading' && session.status === 'unauthenticated') router.push(`${APP_PATHS.SIGNIN}?redirectTo=/profile/edit`); @@ -180,6 +192,34 @@ export const EditProfile = ({ name, email }: Props) => {
+
+
+ Add Socials + + + + + + + Add Socials + + Add your social media links to your profile. + + + + + +
+ {socials.length > 0 ? ( + socials.map((social, index) => ( + + )) + ) : ( +
+ No socials added yet +
+ )} +
); }; diff --git a/src/components/profile/ProfileInfo.tsx b/src/components/profile/ProfileInfo.tsx index 145d09db..6804b0e0 100644 --- a/src/components/profile/ProfileInfo.tsx +++ b/src/components/profile/ProfileInfo.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { useSession } from 'next-auth/react'; import { useRouter } from 'next/navigation'; @@ -13,11 +13,24 @@ import { Input } from '@/components/ui/input'; import APP_PATHS from '@/config/path.config'; import { getNameInitials } from '@/lib/utils'; -import icons from '@/lib/icons'; import Link from 'next/link'; +import Icon from '../ui/icon'; +import { userSocialSchemaType } from '@/lib/validators/user.profile.validator'; +import { getUserSocials } from '@/actions/user.profile.actions'; +import SocialUsername from '@/lib/social-usernames'; export const ProfileInfo = () => { const router = useRouter(); const session = useSession(); + const [socials, setSocials] = useState([]); + const fetchUserSocials = async () => { + const res = await getUserSocials(); + if (res.status) { + setSocials(res.additional?.socials || []); + } + }; + useEffect(() => { + fetchUserSocials(); + }, [socials]); useEffect(() => { if (session.status !== 'loading' && session.status === 'unauthenticated') @@ -38,13 +51,24 @@ export const ProfileInfo = () => {
Socials
-
-
- - - @curiouscoder00 - -
+
+ {socials.length > 0 ? ( + socials.map((social, index) => ( + + + {SocialUsername(social.platform, social.link)} + + )) + ) : ( +
+ No socials added yet +
+ )}
diff --git a/src/components/profile/social-icons.tsx b/src/components/profile/social-icons.tsx new file mode 100644 index 00000000..132406b8 --- /dev/null +++ b/src/components/profile/social-icons.tsx @@ -0,0 +1,24 @@ +import { RiTwitterXFill } from 'react-icons/ri'; +import { + FaGithub, + FaInstagram, + FaLinkedin, + FaTelegramPlane, + FaYoutube, +} from 'react-icons/fa'; + +const icons: { [key: string]: React.ComponentType } = { + twitter: RiTwitterXFill, + youtube: FaYoutube, + linkedin: FaLinkedin, + github: FaGithub, + instagram: FaInstagram, + telergam: FaTelegramPlane, +}; + +const Icon = ({ name }: { name: keyof typeof icons }) => { + const Icon = icons[name]; + return ; +}; + +export default Icon; diff --git a/src/lib/social-usernames.ts b/src/lib/social-usernames.ts new file mode 100644 index 00000000..fe9f33e3 --- /dev/null +++ b/src/lib/social-usernames.ts @@ -0,0 +1,13 @@ +const username = (link: string) => { + return link.split('/')[link.split('/').length - 1]; +}; +const SocialUsername = (platform: string, link: string) => { + if (platform === 'twitter') return '@' + username(link); + if (platform === 'youtube') return username(link); + if (platform === 'linkedin') return 'in/' + username(link); + if (platform === 'github') return '@' + username(link); + if (platform === 'instagram') return '@' + username(link); + if (platform === 'telegram') return '@' + username(link); + return null; +}; +export default SocialUsername; From ff6a2d136a96aea1f7b1723f3c9c2c1e1a8198b1 Mon Sep 17 00:00:00 2001 From: Kapil Jangid Date: Tue, 22 Oct 2024 13:12:23 +0530 Subject: [PATCH 09/10] Refactor profile sidebar to include prefetching of links --- src/components/profile/AddSocials.tsx | 1 + src/components/profile/sidebar.tsx | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/profile/AddSocials.tsx b/src/components/profile/AddSocials.tsx index 3e6049bd..f996488a 100644 --- a/src/components/profile/AddSocials.tsx +++ b/src/components/profile/AddSocials.tsx @@ -89,6 +89,7 @@ export const AddSocials = ({ socials }: Props) => { title: 'Socials deleted successfully', variant: 'success', }); + window.location.reload(); } else { toast({ title: res.message || 'Internal server error', diff --git a/src/components/profile/sidebar.tsx b/src/components/profile/sidebar.tsx index 04e40189..5b059dcf 100644 --- a/src/components/profile/sidebar.tsx +++ b/src/components/profile/sidebar.tsx @@ -79,6 +79,7 @@ const NavItem = ({ path, label }: { path: string; label: string }) => { if (!session) return; return ( Date: Tue, 22 Oct 2024 13:55:00 +0530 Subject: [PATCH 10/10] Refactor social media icons in ProfileInfo and social-icons components --- src/components/profile/ProfileInfo.tsx | 6 +++++- src/components/profile/social-icons.tsx | 14 ++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/src/components/profile/ProfileInfo.tsx b/src/components/profile/ProfileInfo.tsx index 6804b0e0..852f0ad5 100644 --- a/src/components/profile/ProfileInfo.tsx +++ b/src/components/profile/ProfileInfo.tsx @@ -15,6 +15,7 @@ import APP_PATHS from '@/config/path.config'; import { getNameInitials } from '@/lib/utils'; import Link from 'next/link'; import Icon from '../ui/icon'; +import icons from '@/lib/icons'; import { userSocialSchemaType } from '@/lib/validators/user.profile.validator'; import { getUserSocials } from '@/actions/user.profile.actions'; import SocialUsername from '@/lib/social-usernames'; @@ -60,7 +61,10 @@ export const ProfileInfo = () => { href={social.link} target="_blank" > - + {SocialUsername(social.platform, social.link)} )) diff --git a/src/components/profile/social-icons.tsx b/src/components/profile/social-icons.tsx index 132406b8..34797581 100644 --- a/src/components/profile/social-icons.tsx +++ b/src/components/profile/social-icons.tsx @@ -13,12 +13,18 @@ const icons: { [key: string]: React.ComponentType } = { linkedin: FaLinkedin, github: FaGithub, instagram: FaInstagram, - telergam: FaTelegramPlane, + telegram: FaTelegramPlane, }; -const Icon = ({ name }: { name: keyof typeof icons }) => { - const Icon = icons[name]; - return ; +type Platform = keyof typeof icons; + +interface IconProps { + name: Platform; +} + +const Icon = ({ name }: IconProps) => { + const SelectedIcon = icons[name]; + return ; }; export default Icon;