├── middleware.ts ├── lib ├── base-url.ts ├── fetcher.ts ├── stripe.ts ├── prismadb.ts ├── utils.ts ├── helper.ts ├── validation │ └── auth-validate.ts └── auth.ts ├── app ├── favicon.ico ├── api │ ├── auth │ │ └── [...nextauth] │ │ │ └── route.ts │ ├── check-username │ │ └── route.ts │ ├── posts │ │ ├── [postId] │ │ │ └── route.ts │ │ └── route.ts │ ├── edit │ │ └── route.ts │ ├── notifications │ │ └── route.ts │ ├── current-user │ │ └── route.ts │ ├── users │ │ ├── route.ts │ │ └── [username] │ │ │ └── route.ts │ ├── register │ │ └── route.tsx │ ├── stripe │ │ └── route.ts │ ├── webhook │ │ └── route.ts │ └── search │ │ └── route.ts ├── (dashboard) │ ├── (routes) │ │ ├── home │ │ │ ├── loading.tsx │ │ │ └── page.tsx │ │ ├── notifications │ │ │ └── page.tsx │ │ ├── search │ │ │ └── page.tsx │ │ ├── settings │ │ │ └── page.tsx │ │ ├── [username] │ │ │ ├── page.tsx │ │ │ └── post │ │ │ │ └── [postId] │ │ │ │ └── page.tsx │ │ └── layout.tsx │ └── _components │ │ ├── CommentFeed.tsx │ │ ├── Rightbar.tsx │ │ ├── PostFeed.tsx │ │ ├── _common │ │ ├── SubscribeAds.tsx │ │ ├── FollowButton.tsx │ │ ├── Header.tsx │ │ ├── ProfileImageUpload.tsx │ │ ├── CoverImageUpload.tsx │ │ ├── CommentItem.tsx │ │ └── SidebarItem.tsx │ │ ├── NotificationFeed.tsx │ │ ├── UserHero.tsx │ │ ├── SearchForm.tsx │ │ ├── UserBio.tsx │ │ ├── FollowList.tsx │ │ ├── Sidebar.tsx │ │ └── SearchFeed.tsx ├── (auth) │ ├── layout.tsx │ ├── _components │ │ ├── SocialLogin.tsx │ │ └── LoginForm.tsx │ └── page.tsx ├── actions │ ├── upload.action.ts │ ├── birthday.action.ts │ ├── subcription.ts │ ├── auth.action.ts │ ├── follow.action.ts │ ├── comment.action.ts │ └── like.action.ts ├── layout.tsx └── globals.css ├── public ├── images │ └── creditcard.png └── assets │ └── google-logo.svg ├── postcss.config.mjs ├── types ├── post.type.ts ├── comment.type.ts └── user.type.ts ├── svgr.d.ts ├── context ├── session-provider.tsx ├── theme-provider.tsx ├── query-provider.tsx ├── modal-provider.tsx └── currentuser-provider.tsx ├── hooks ├── useDebounce.ts ├── useNotification.ts ├── useUsers.ts ├── useUser.ts ├── useSearch.ts ├── usePost.ts ├── useStore.ts ├── useFollow.ts ├── useLike.ts ├── useUploadcare.ts └── use-toast.ts ├── next.config.mjs ├── components.json ├── .gitignore ├── components ├── section-label │ └── index.tsx ├── spinner │ └── index.tsx ├── ui │ ├── label.tsx │ ├── textarea.tsx │ ├── input.tsx │ ├── toaster.tsx │ ├── avatar.tsx │ ├── tabs.tsx │ ├── card.tsx │ ├── button.tsx │ ├── dialog.tsx │ ├── form.tsx │ └── toast.tsx ├── settings │ ├── upgrade-card.tsx │ ├── subscription-button.tsx │ ├── billing-settings.tsx │ └── dark-mode.tsx ├── logo │ └── index.tsx ├── badge │ └── index.tsx ├── draft-editor │ └── index.tsx ├── upload-button │ └── index.tsx ├── themes-placeholder │ ├── darkmode.tsx │ ├── lightmode.tsx │ └── systemmode.tsx ├── modal │ └── index.tsx ├── check-username │ └── index.tsx ├── pro-modal │ └── index.tsx └── birthday-modal │ └── index.tsx ├── next-auth.d.ts ├── tsconfig.json ├── .env.example ├── constants └── pricing-plans.tsx ├── markdown └── database.md ├── README.md ├── tailwind.config.ts ├── package.json └── prisma └── schema.prisma /middleware.ts: -------------------------------------------------------------------------------- 1 | export { auth as middleware } from "@/lib/auth"; 2 | -------------------------------------------------------------------------------- /lib/base-url.ts: -------------------------------------------------------------------------------- 1 | export const BASE_URL = process.env.NEXT_PUBLIC_BASE_URL; 2 | -------------------------------------------------------------------------------- /app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TechWithEmmaYT/Social-X-Clone-Course/HEAD/app/favicon.ico -------------------------------------------------------------------------------- /app/api/auth/[...nextauth]/route.ts: -------------------------------------------------------------------------------- 1 | import { handlers } from "@/lib/auth"; 2 | export const { GET, POST } = handlers; 3 | -------------------------------------------------------------------------------- /public/images/creditcard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TechWithEmmaYT/Social-X-Clone-Course/HEAD/public/images/creditcard.png -------------------------------------------------------------------------------- /lib/fetcher.ts: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | 3 | const fetcher = (url: string) => axios.get(url).then((res) => res.data); 4 | export default fetcher; 5 | -------------------------------------------------------------------------------- /postcss.config.mjs: -------------------------------------------------------------------------------- 1 | /** @type {import('postcss-load-config').Config} */ 2 | const config = { 3 | plugins: { 4 | tailwindcss: {}, 5 | }, 6 | }; 7 | 8 | export default config; 9 | -------------------------------------------------------------------------------- /lib/stripe.ts: -------------------------------------------------------------------------------- 1 | import Stripe from "stripe"; 2 | 3 | export const stripe = new Stripe(process.env.STRIPE_API_KEY!, { 4 | apiVersion: "2024-09-30.acacia", 5 | typescript: true, 6 | }); 7 | -------------------------------------------------------------------------------- /types/post.type.ts: -------------------------------------------------------------------------------- 1 | type PostType = { 2 | id: number; 3 | body: string; 4 | userId: number; 5 | comments: []; 6 | likeIds: number[]; 7 | postImage: string; 8 | createdAt: string; 9 | updatedAt: string; 10 | user: UserType; 11 | }; 12 | -------------------------------------------------------------------------------- /types/comment.type.ts: -------------------------------------------------------------------------------- 1 | type CommentType = { 2 | id: number; 3 | body: string; 4 | userId: number; 5 | postId: number; 6 | commentImage: string; 7 | createdAt: string; 8 | updatedAt: string; 9 | user: UserType; 10 | post: PostType; 11 | }; 12 | -------------------------------------------------------------------------------- /lib/prismadb.ts: -------------------------------------------------------------------------------- 1 | import { PrismaClient } from "@prisma/client"; 2 | 3 | const globalForPrisma = globalThis as unknown as { prisma: PrismaClient }; 4 | 5 | export const prisma = globalForPrisma.prisma || new PrismaClient(); 6 | 7 | if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma; 8 | -------------------------------------------------------------------------------- /lib/utils.ts: -------------------------------------------------------------------------------- 1 | import { clsx, type ClassValue } from "clsx"; 2 | import { twMerge } from "tailwind-merge"; 3 | 4 | export function cn(...inputs: ClassValue[]) { 5 | return twMerge(clsx(inputs)); 6 | } 7 | 8 | export function absoluteUrl(path: string) { 9 | return `${process.env.NEXT_PUBLIC_BASE_URL}${path}`; 10 | } 11 | -------------------------------------------------------------------------------- /svgr.d.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | declare module "*.svg" { 3 | import { FC, SVGProps } from "react"; 4 | const content: FC>; 5 | export default content; 6 | } 7 | 8 | declare module "*.svg?url" { 9 | const content: any; 10 | export default content; 11 | } 12 | -------------------------------------------------------------------------------- /context/session-provider.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import { ReactNode } from "react"; 3 | import { SessionProvider } from "next-auth/react"; 4 | 5 | interface Props { 6 | children: ReactNode; 7 | } 8 | 9 | export default function SessionProviders({ children }: Props) { 10 | return {children}; 11 | } 12 | -------------------------------------------------------------------------------- /context/theme-provider.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | 3 | import * as React from "react"; 4 | import { ThemeProvider as NextThemesProvider } from "next-themes"; 5 | import { type ThemeProviderProps } from "next-themes/dist/types"; 6 | 7 | export function ThemeProvider({ children, ...props }: ThemeProviderProps) { 8 | return {children}; 9 | } 10 | -------------------------------------------------------------------------------- /app/(dashboard)/(routes)/home/loading.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Spinner } from "@/components/spinner"; 3 | 4 | const Loading = () => { 5 | return ( 6 |
7 |
8 | 9 |
10 |
11 | ); 12 | }; 13 | 14 | export default Loading; 15 | -------------------------------------------------------------------------------- /context/query-provider.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import { ReactNode } from "react"; 3 | import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; 4 | 5 | interface Props { 6 | children: ReactNode; 7 | } 8 | 9 | export default function QueryProvider({ children }: Props) { 10 | const queryClient = new QueryClient(); 11 | return ( 12 | {children} 13 | ); 14 | } 15 | -------------------------------------------------------------------------------- /app/(dashboard)/(routes)/notifications/page.tsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from "react"; 2 | import Header from "../../_components/_common/Header"; 3 | import NotificationFeed from "../../_components/NotificationFeed"; 4 | 5 | const Notifications = () => { 6 | return ( 7 | 8 |
9 | 10 | 11 | ); 12 | }; 13 | 14 | export default Notifications; 15 | -------------------------------------------------------------------------------- /lib/helper.ts: -------------------------------------------------------------------------------- 1 | export const generateBaseUsername = (name: string, email?: string) => { 2 | let baseUsername = ""; 3 | if (name) { 4 | baseUsername = name.split(" ")?.[0]?.toLowerCase(); 5 | } else if (email) { 6 | baseUsername = email.split(" ")?.[0]?.toLowerCase(); 7 | } else { 8 | baseUsername = `user`; 9 | } 10 | 11 | const randomNumber = Math.floor(100000 + Math.random() * 900000); 12 | return `${baseUsername}${randomNumber}`; 13 | }; 14 | -------------------------------------------------------------------------------- /hooks/useDebounce.ts: -------------------------------------------------------------------------------- 1 | import { useEffect, useState } from "react"; 2 | 3 | export function useDebounce(value: T, delay: number): T { 4 | const [debouncedValue, setDebouncedValue] = useState(value); 5 | 6 | useEffect(() => { 7 | const handler = setTimeout(() => { 8 | setDebouncedValue(value); 9 | }, delay); 10 | 11 | return () => { 12 | clearTimeout(handler); 13 | }; 14 | }, [value, delay]); 15 | 16 | return debouncedValue; 17 | } 18 | -------------------------------------------------------------------------------- /app/(dashboard)/_components/CommentFeed.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import CommentItem from "./_common/CommentItem"; 3 | 4 | interface PropsType { 5 | comments: CommentType[]; 6 | } 7 | 8 | const CommentFeed: React.FC = ({ comments }) => { 9 | return ( 10 |
11 | {comments?.map((comment) => ( 12 | 13 | ))} 14 |
15 | ); 16 | }; 17 | 18 | export default CommentFeed; 19 | -------------------------------------------------------------------------------- /next.config.mjs: -------------------------------------------------------------------------------- 1 | /** @type {import('next').NextConfig} */ 2 | const nextConfig = { 3 | reactStrictMode: false, 4 | images: { 5 | remotePatterns: [ 6 | { 7 | protocol: "https", 8 | hostname: "ucarecdn.com", 9 | port: "", 10 | }, 11 | ], 12 | }, 13 | webpack(config) { 14 | config.module.rules.push({ 15 | test: /\.svg$/, 16 | use: ["@svgr/webpack"], 17 | }); 18 | return config; 19 | }, 20 | }; 21 | 22 | export default nextConfig; 23 | -------------------------------------------------------------------------------- /app/(dashboard)/(routes)/home/page.tsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from "react"; 2 | import Header from "../../_components/_common/Header"; 3 | import PostForm from "../../_components/_common/PostForm"; 4 | import PostFeed from "../../_components/PostFeed"; 5 | 6 | const Home = async () => { 7 | return ( 8 | 9 |
10 | 11 | 12 | 13 | ); 14 | }; 15 | 16 | export default Home; 17 | -------------------------------------------------------------------------------- /components.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://ui.shadcn.com/schema.json", 3 | "style": "new-york", 4 | "rsc": true, 5 | "tsx": true, 6 | "tailwind": { 7 | "config": "tailwind.config.ts", 8 | "css": "app/globals.css", 9 | "baseColor": "slate", 10 | "cssVariables": true, 11 | "prefix": "" 12 | }, 13 | "aliases": { 14 | "components": "@/components", 15 | "utils": "@/lib/utils", 16 | "ui": "@/components/ui", 17 | "lib": "@/lib", 18 | "hooks": "@/hooks" 19 | } 20 | } -------------------------------------------------------------------------------- /app/(dashboard)/(routes)/search/page.tsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from "react"; 2 | import Header from "../../_components/_common/Header"; 3 | import SearchForm from "../../_components/SearchForm"; 4 | import SearchFeed from "../../_components/SearchFeed"; 5 | 6 | const Search = () => { 7 | return ( 8 | 9 |
10 | 11 |
12 | 13 | 14 | ); 15 | }; 16 | 17 | export default Search; 18 | -------------------------------------------------------------------------------- /app/(dashboard)/(routes)/settings/page.tsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from "react"; 2 | import Header from "../../_components/_common/Header"; 3 | import BillingSettings from "@/components/settings/billing-settings"; 4 | import DarkModetoggle from "@/components/settings/dark-mode"; 5 | 6 | const Settings = () => { 7 | return ( 8 | 9 |
10 | 11 | 12 | 13 | ); 14 | }; 15 | 16 | export default Settings; 17 | -------------------------------------------------------------------------------- /hooks/useNotification.ts: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import { BASE_URL } from "@/lib/base-url"; 3 | import fetcher from "@/lib/fetcher"; 4 | import { useQuery } from "@tanstack/react-query"; 5 | 6 | const useNotifications = () => { 7 | const { data, error, isLoading, refetch } = useQuery({ 8 | queryKey: ["notifications"], 9 | queryFn: () => fetcher(`${BASE_URL}/api/notifications`), 10 | }); 11 | return { 12 | data, 13 | error, 14 | isLoading, 15 | refetch, 16 | }; 17 | }; 18 | 19 | export default useNotifications; 20 | -------------------------------------------------------------------------------- /app/(auth)/layout.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { auth } from "@/lib/auth"; 3 | import { redirect } from "next/navigation"; 4 | 5 | async function AuthLayout({ 6 | children, 7 | }: Readonly<{ 8 | children: React.ReactNode; 9 | }>) { 10 | const session = await auth(); 11 | if (session?.user) { 12 | return redirect("/home"); 13 | } 14 | return ( 15 |
16 |
{children}
17 |
18 | ); 19 | } 20 | 21 | export default AuthLayout; 22 | -------------------------------------------------------------------------------- /hooks/useUsers.ts: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import { BASE_URL } from "@/lib/base-url"; 3 | import fetcher from "@/lib/fetcher"; 4 | import { useQuery } from "@tanstack/react-query"; 5 | 6 | const useUsers = () => { 7 | const { data, error, isLoading, refetch } = useQuery({ 8 | queryKey: ["users", "allusers"], 9 | queryFn: () => fetcher(`${BASE_URL}/api/users`), 10 | staleTime: Infinity, 11 | }); 12 | return { 13 | data, 14 | error, 15 | isLoading, 16 | refetch, 17 | }; 18 | }; 19 | 20 | export default useUsers; 21 | -------------------------------------------------------------------------------- /types/user.type.ts: -------------------------------------------------------------------------------- 1 | type UserType = { 2 | id: number; 3 | name: string | null; 4 | username: string | null; 5 | bio: string | null; 6 | email: string; 7 | dateOfBirth: Date | null; 8 | emailVerified: Date | null; 9 | coverImage: string | null; 10 | profileImage: string | null; 11 | createdAt: Date; 12 | updatedAt: Date; 13 | followingIds: number[]; 14 | hasNotification: boolean | null; 15 | isVerified?: boolean; 16 | followersCount?: number; 17 | subscription: { 18 | plan: string; 19 | } | null; 20 | }; 21 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | .yarn/install-state.gz 8 | 9 | # testing 10 | /coverage 11 | 12 | # next.js 13 | /.next/ 14 | /out/ 15 | 16 | # production 17 | /build 18 | 19 | # misc 20 | .DS_Store 21 | *.pem 22 | 23 | # debug 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | 28 | # local env files 29 | .env 30 | .env*.local 31 | 32 | # vercel 33 | .vercel 34 | 35 | # typescript 36 | *.tsbuildinfo 37 | next-env.d.ts 38 | -------------------------------------------------------------------------------- /context/modal-provider.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import BirthDayModal from "@/components/birthday-modal"; 3 | import ProModal from "@/components/pro-modal"; 4 | import React, { useEffect } from "react"; 5 | 6 | const ModalProvider = () => { 7 | const [isMounted, setIsMounted] = React.useState(false); 8 | 9 | useEffect(() => { 10 | setIsMounted(true); 11 | }, []); 12 | 13 | if (!isMounted) { 14 | return null; 15 | } 16 | return ( 17 | <> 18 | 19 | 20 | 21 | ); 22 | }; 23 | 24 | export default ModalProvider; 25 | -------------------------------------------------------------------------------- /components/section-label/index.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | type SectionProps = { 4 | label: string; 5 | message?: string; 6 | children?: React.ReactNode; 7 | }; 8 | 9 | const Section = ({ label, message, children }: SectionProps) => { 10 | return ( 11 |
12 |
13 |
{label}
14 | {message &&

{message}

} 15 |
16 |
{children}
17 |
18 | ); 19 | }; 20 | 21 | export default Section; 22 | -------------------------------------------------------------------------------- /hooks/useUser.ts: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import { BASE_URL } from "@/lib/base-url"; 3 | import fetcher from "@/lib/fetcher"; 4 | import { useQuery } from "@tanstack/react-query"; 5 | 6 | const useUser = (username: string) => { 7 | const url = username ? `${BASE_URL}/api/users/${username}` : null; 8 | const { data, error, isLoading, refetch } = useQuery({ 9 | queryKey: ["user", username], 10 | queryFn: () => 11 | url ? fetcher(url) : Promise.reject("No username provided"), 12 | enabled: !!url, 13 | }); 14 | return { 15 | data, 16 | error, 17 | isLoading, 18 | refetch, 19 | }; 20 | }; 21 | 22 | export default useUser; 23 | -------------------------------------------------------------------------------- /next-auth.d.ts: -------------------------------------------------------------------------------- 1 | import { DefaultSession } from "next-auth"; 2 | 3 | declare module "next-auth" { 4 | interface Session { 5 | user: { 6 | id: string; 7 | email?: string | null; 8 | name?: string | null; 9 | username?: string; 10 | } & DefaultSession["user"]; 11 | } 12 | 13 | interface User { 14 | id: number; 15 | name?: string | null; 16 | email?: string | null; 17 | username?: string; 18 | } 19 | } 20 | 21 | import { DefaultJWT } from "next-auth/jwt"; 22 | declare module "next-auth/jwt" { 23 | interface JWT extends DefaultJWT { 24 | id?: string; 25 | name?: string | null; 26 | email?: string | null; 27 | username?: string; 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "lib": ["dom", "dom.iterable", "esnext"], 4 | "allowJs": true, 5 | "skipLibCheck": true, 6 | "strict": true, 7 | "noEmit": true, 8 | "esModuleInterop": true, 9 | "module": "esnext", 10 | "moduleResolution": "bundler", 11 | "resolveJsonModule": true, 12 | "isolatedModules": true, 13 | "jsx": "preserve", 14 | "incremental": true, 15 | "plugins": [ 16 | { 17 | "name": "next" 18 | } 19 | ], 20 | "paths": { 21 | "@/*": ["./*"] 22 | } 23 | }, 24 | "include": [ 25 | "svgr.d.ts", 26 | "next-env.d.ts", 27 | "**/*.ts", 28 | "**/*.tsx", 29 | ".next/types/**/*.ts" 30 | ], 31 | "exclude": ["node_modules"] 32 | } 33 | -------------------------------------------------------------------------------- /hooks/useSearch.ts: -------------------------------------------------------------------------------- 1 | import { BASE_URL } from "@/lib/base-url"; 2 | import fetcher from "@/lib/fetcher"; 3 | import { useQuery } from "@tanstack/react-query"; 4 | 5 | interface PropsType { 6 | query: string; 7 | filter?: string; 8 | } 9 | const useSearch = ({ query, filter }: PropsType) => { 10 | const url = query ? `${BASE_URL}/api/search?q=${query}&f=${filter}` : null; 11 | 12 | const { data, error, isLoading, refetch, isFetching } = useQuery({ 13 | queryKey: ["search", query], 14 | queryFn: () => fetcher(url!), 15 | enabled: !!url, 16 | }); 17 | 18 | const loading = isLoading || isFetching; 19 | 20 | return { 21 | data, 22 | error, 23 | isLoading: loading, 24 | refetch, 25 | }; 26 | }; 27 | 28 | export default useSearch; 29 | -------------------------------------------------------------------------------- /components/spinner/index.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { cva, type VariantProps } from "class-variance-authority"; 3 | import { Loader } from "lucide-react"; 4 | import { cn } from "@/lib/utils"; 5 | 6 | const spinnerVariants = cva("animate-spin fill-current", { 7 | variants: { 8 | size: { 9 | default: "h-4 w-4", 10 | sm: "h-2 w-2", 11 | lg: "h-6 w-6", 12 | icon: "h-10 w-10", 13 | }, 14 | }, 15 | defaultVariants: { 16 | size: "default", 17 | }, 18 | }); 19 | 20 | interface SpinnerProps extends VariantProps { 21 | className?: string; 22 | } 23 | export const Spinner = ({ size, className }: SpinnerProps) => { 24 | return ; 25 | }; 26 | -------------------------------------------------------------------------------- /app/(auth)/_components/SocialLogin.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Button } from "@/components/ui/button"; 3 | import GoogleLogo from "@/public/assets/google-logo.svg"; 4 | import { doSocialLogin } from "@/app/actions/auth.action"; 5 | 6 | const SocialLogin = () => { 7 | return ( 8 |
9 | 22 |
23 | ); 24 | }; 25 | 26 | export default SocialLogin; 27 | -------------------------------------------------------------------------------- /app/(dashboard)/_components/Rightbar.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import { usePathname } from "next/navigation"; 4 | import SubscribeAds from "./_common/SubscribeAds"; 5 | import FollowList from "./FollowList"; 6 | import SearchForm from "./SearchForm"; 7 | 8 | const Rightbar = (props: { isPro: boolean }) => { 9 | const pathname = usePathname(); 10 | return ( 11 |
16 |
17 | {/* Search Form */} 18 | {pathname !== "/search" && } 19 | {!props.isPro && } 20 | 21 |
22 |
23 | ); 24 | }; 25 | 26 | export default Rightbar; 27 | -------------------------------------------------------------------------------- /components/ui/label.tsx: -------------------------------------------------------------------------------- 1 | "use client" 2 | 3 | import * as React from "react" 4 | import * as LabelPrimitive from "@radix-ui/react-label" 5 | import { cva, type VariantProps } from "class-variance-authority" 6 | 7 | import { cn } from "@/lib/utils" 8 | 9 | const labelVariants = cva( 10 | "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" 11 | ) 12 | 13 | const Label = React.forwardRef< 14 | React.ElementRef, 15 | React.ComponentPropsWithoutRef & 16 | VariantProps 17 | >(({ className, ...props }, ref) => ( 18 | 23 | )) 24 | Label.displayName = LabelPrimitive.Root.displayName 25 | 26 | export { Label } 27 | -------------------------------------------------------------------------------- /components/ui/textarea.tsx: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | import { cn } from "@/lib/utils" 4 | 5 | export interface TextareaProps 6 | extends React.TextareaHTMLAttributes {} 7 | 8 | const Textarea = React.forwardRef( 9 | ({ className, ...props }, ref) => { 10 | return ( 11 |