diff --git a/README.md b/README.md
index bad35e834dd37df40cd5d98fb254b7bb8cf306c2..939946404c29cd3d5ac7443ca5929e28b709e854 100644
--- a/README.md
+++ b/README.md
@@ -17,7 +17,7 @@ spielt, dass man in den jeweiligen Feeds nur Beiträge zu diesem Spiel zu sehen
es also vllt. Spieler die bestimmte „Guide“ Beiträge verfassen, ihre Erfolge mit den anderen teilen
wollen oder sich zum Beispiel über ihren Lieblingscharakter in einem Spiel unterhalten wollen.
-Der direkte Kontakt zu anderen Personen soll in etwa so stattfinden, wie man es über Twitter
+Der direkte Kontakt zu anderen Personen soll in etwa so stattfinden, wie man es über Twitter
bereits kennt. Also in Form von Beiträgen, die dann von Usern kommentiert werden können (es
ist keine Live Chat Funktion in Planung).
diff --git a/app/(apidocs)/apidocs/page.tsx b/app/(apidocs)/apidocs/page.tsx
index e57b33bbab2a6b6356e30fbee8c829f01610cd17..6992e2d6a785ca2370d71c9d6625e38df94a3642 100644
--- a/app/(apidocs)/apidocs/page.tsx
+++ b/app/(apidocs)/apidocs/page.tsx
@@ -1,11 +1,11 @@
-import { getApiDocs } from '@/lib/swagger';
-import ReactSwagger from './react-swagger';
+import { getApiDocs } from '@/lib/swagger'
+import ReactSwagger from './react-swagger'
export default async function IndexPage() {
- const spec = await getApiDocs();
+ const spec = await getApiDocs()
return (
<section className="container">
<ReactSwagger spec={spec} />
</section>
- );
-}
+ )
+}
\ No newline at end of file
diff --git a/app/(apidocs)/apidocs/react-swagger.tsx b/app/(apidocs)/apidocs/react-swagger.tsx
index 7463d1a9b45861f20e6f2d88b44164ee512eae54..8decb68dec0077f3c939e545e96ffdc6bbfafb41 100644
--- a/app/(apidocs)/apidocs/react-swagger.tsx
+++ b/app/(apidocs)/apidocs/react-swagger.tsx
@@ -1,14 +1,14 @@
-'use client';
+'use client'
-import SwaggerUI from 'swagger-ui-react';
-import 'swagger-ui-react/swagger-ui.css';
+import SwaggerUI from 'swagger-ui-react'
+import 'swagger-ui-react/swagger-ui.css'
type Props = {
spec: Record<string, any>,
-};
+}
function ReactSwagger({ spec }: Props) {
- return <SwaggerUI spec={spec} />;
+ return <SwaggerUI spec={spec} />
}
-export default ReactSwagger;
+export default ReactSwagger
\ No newline at end of file
diff --git a/app/(content)/(user)/[username]/following/page.tsx b/app/(content)/(user)/[username]/following/page.tsx
index 5ea8f4daa5c5fef29b079a07c60284b12ab27cba..2208842f94471ab149b0c9fa949de636e98236f3 100644
--- a/app/(content)/(user)/[username]/following/page.tsx
+++ b/app/(content)/(user)/[username]/following/page.tsx
@@ -1,7 +1,26 @@
-export default async function Following() {
+import { BackHeader } from "@/components/back-header"
+import { GlobalLayout } from "@/components/global-layout"
+import { UserFollows } from "@/components/profile/components/user-follows"
+import { Card } from "@/components/ui/card"
+import { getCurrentUser } from "@/lib/session"
+
+export default async function Following({ params }: { params: { username: string } }) {
+ const session = await getCurrentUser()
+
return (
- <div>
- <h1>Following Page WIP</h1>
- </div>
+ <GlobalLayout
+ mainContent={
+ <Card className="w-full overflow-hidden ">
+ <div className="p-3">
+ <BackHeader>
+ <h1 className="font-bold">Following</h1>
+ </BackHeader>
+ </div>
+ <div className="px-5">
+ <UserFollows username={params.username} session={session} />
+ </div>
+ </Card>
+ }
+ />
)
}
\ No newline at end of file
diff --git a/app/api/games/route.ts b/app/api/games/route.ts
index 58e9accaa9ce7069b85784c54e654b5ca262103c..6aa3d6c0b7366aa49ef1e5589227c1545a2cc03f 100644
--- a/app/api/games/route.ts
+++ b/app/api/games/route.ts
@@ -9,7 +9,7 @@ import { NextRequest, NextResponse } from "next/server"
* @swagger
* /api/games:
* get:
- * description: Get Games through external API
+ * description: Get Games through external API
* content:
* application/json:
* schema:
@@ -17,10 +17,9 @@ import { NextRequest, NextResponse } from "next/server"
* 200:
* description: list of games
* 500:
- * description: error
+ * description: error
*/
-
export async function GET(req: NextRequest) {
const p = req.nextUrl.searchParams
try {
diff --git a/app/api/gweets/[id]/route.ts b/app/api/gweets/[id]/route.ts
index 35f72f301b027ecf674a10802a8b632baaad2d91..b3ead3b2b85e8f61221369120ac7334d2c4f8501 100644
--- a/app/api/gweets/[id]/route.ts
+++ b/app/api/gweets/[id]/route.ts
@@ -23,11 +23,11 @@ import { db } from "@/lib/db"
* 200:
* description: fetched gweets!
* 400:
- * description: Invalid request body!
+ * description: Invalid request body!
* 404:
- * description: Gweet not found!
+ * description: Gweet not found!
* 500:
- * description: Error
+ * description: Error
*/
export async function GET(request: Request, { params }: { params: { id: string } }) {
diff --git a/app/api/gweets/likes/route.ts b/app/api/gweets/likes/route.ts
index 1664f26d4c6263ff51aa1616d08540384b814fe2..2f22948db9234ff9281ab8be2b407ed3cca409ae 100644
--- a/app/api/gweets/likes/route.ts
+++ b/app/api/gweets/likes/route.ts
@@ -15,8 +15,8 @@ import { db } from "@/lib/db"
* 200:
* description: fetched like!
* 500:
- * description: Error
- *
+ * description: Error
+ *
* post:
* description: Creates Gweet
* responses:
@@ -29,8 +29,8 @@ import { db } from "@/lib/db"
* 404:
* description: Invalid request body !
* 500:
- * description: Error
- *
+ * description: Error
+ *
*/
export async function GET(request: Request) {
diff --git a/app/api/gweets/regweets/route.ts b/app/api/gweets/regweets/route.ts
index 611f0032c327143419839984469a7d1280b40ff3..cae8796f93f1be8da2ace7c2bb3627bf6c85f8c4 100644
--- a/app/api/gweets/regweets/route.ts
+++ b/app/api/gweets/regweets/route.ts
@@ -5,7 +5,7 @@ import { db } from "@/lib/db"
/**
* @swagger
- * /api/gweets/regweets:
+ * /api/gweets/regweets:
* post:
* description: Creates Regweet
* responses:
@@ -14,11 +14,11 @@ import { db } from "@/lib/db"
* 201:
* description: Gweet regweeted!
* 400:
- * description: Invalid request body
+ * description: Invalid request body
* 401:
* description: Unauthorized
* 500:
- * description: Error
+ * description: Error
*/
export async function POST(request: Request) {
diff --git a/app/api/gweets/route.ts b/app/api/gweets/route.ts
index 98cc65060cd767a20a3f39d3960513814f00d00b..036b8d3f26a88aff9fdb34705c7bccae42cac518 100644
--- a/app/api/gweets/route.ts
+++ b/app/api/gweets/route.ts
@@ -16,8 +16,8 @@ import { utapi } from "uploadthing/server"
* 200:
* description: fetched gweets!
* 500:
- * description: Error
- *
+ * description: Error
+ *
* post:
* description: Creates Gweet
* responses:
@@ -26,20 +26,19 @@ import { utapi } from "uploadthing/server"
* 401:
* description: Unauthorized
* 500:
- * description: Error
- *
+ * description: Error
+ *
* delete:
* description: Deletes Gweet
* responses:
* 200:
* description: deleted!
* 401:
- * description: Unauthorized
+ * description: Unauthorized
* 500:
- * description: Error
+ * description: Error
*/
-
export async function GET(request: Request) {
const { searchParams } = new URL(request.url)
diff --git a/app/api/hashtags/route.ts b/app/api/hashtags/route.ts
index 40ddb97fb2f1fcaf9f043f8e9394a6fa13377652..e1848debfe876be7640ef7376a4b0fed40ec19b9 100644
--- a/app/api/hashtags/route.ts
+++ b/app/api/hashtags/route.ts
@@ -16,7 +16,7 @@ import { db } from "@/lib/db"
* description: fetched hashtags!
* 500:
* description: Error
- *
+ *
* post:
* description: Creates Hashtag
* responses:
@@ -26,10 +26,9 @@ import { db } from "@/lib/db"
* description: Unauthorized
* 500:
* description: Error
- *
+ *
*/
-
export async function GET() {
try {
const hashtags = await db.hashtag.findMany({
diff --git a/app/api/signup/route.ts b/app/api/signup/route.ts
index 38f48354219e7089b0103384c370752d134b64aa..01c2b83b700b695ca40570fe01e56215d89641d8 100644
--- a/app/api/signup/route.ts
+++ b/app/api/signup/route.ts
@@ -6,7 +6,7 @@ import { normalize } from 'normalize-diacritics'
/**
* @swagger
* /api/signup:
- *
+ *
* post:
* description: Creates Account after Email was verified
* responses:
@@ -16,10 +16,9 @@ import { normalize } from 'normalize-diacritics'
* description: Email already used
* 500:
* description: Error!
- *
+ *
*/
-
export async function POST(req: Request) {
try {
const { username, email, password } = await req.json()
diff --git a/app/api/users/follow/route.ts b/app/api/users/follow/route.ts
index 7a679137fe038ebfd8f99d9a19ff5c69ee103957..0d856615070aa3012d62ffbc31b81b8cd73734b1 100644
--- a/app/api/users/follow/route.ts
+++ b/app/api/users/follow/route.ts
@@ -12,8 +12,8 @@ import { z } from "zod"
* 200:
* description: fetched follows!
* 500:
- * description: Error
- *
+ * description: Error
+ *
* put:
* description: Creates Following Record from one User to another
* requestBody:
@@ -36,18 +36,16 @@ import { z } from "zod"
* description: Unauthorized
* 500:
* description: Error
- *
+ *
*/
-
-// get following or followers information
export async function GET(request: Request) {
const { searchParams } = new URL(request.url)
- const userId = searchParams.get("userId") || undefined
+ const username = searchParams.get("userId") || undefined
const type = searchParams.get("type") || undefined
- const userIdSchema = z.string().cuid().optional()
- const zod = userIdSchema.safeParse(userId)
+ const userIdSchema = z.string().optional()
+ const zod = userIdSchema.safeParse(username)
if (!zod.success) {
return NextResponse.json(zod.error, { status: 400 })
@@ -58,19 +56,29 @@ export async function GET(request: Request) {
const followers = await db.user
.findUnique({
where: {
- id: userId,
+ username,
+ },
+ })
+ .followers({
+ include: {
+ followers: true,
+ following: true,
},
})
- .followers()
return NextResponse.json(followers, { status: 200 })
} else if (type === "following") {
const following = await db.user
.findUnique({
where: {
- id: userId,
+ username,
+ },
+ })
+ .following({
+ include: {
+ followers: true,
+ following: true,
},
})
- .following()
return NextResponse.json(following, { status: 200 })
}
@@ -79,7 +87,6 @@ export async function GET(request: Request) {
}
}
-// follow a user
export async function PUT(request: Request) {
const session = await getCurrentUser()
const { userId } = await request.json()
@@ -121,7 +128,6 @@ export async function PUT(request: Request) {
}
}
-// unfollow a user
export async function DELETE(request: Request) {
const session = await getCurrentUser()
const { userId } = await request.json()
diff --git a/app/api/users/gamelists/route.ts b/app/api/users/gamelists/route.ts
index 6a2327222d4e0572014eaa3d8ff53e45b5e0fe13..2bf2c83a1dc3658d227bc7e31eac0eecc8def98c 100644
--- a/app/api/users/gamelists/route.ts
+++ b/app/api/users/gamelists/route.ts
@@ -15,10 +15,9 @@ import { NextRequest, NextResponse } from "next/server"
* description: Request handled!
* 401:
* description: Unauthorized
- *
+ *
*/
-
export async function PUT(req: NextRequest) {
const sessionUser = await getCurrentUser()
diff --git a/components/create-gweet/components/create-gweet.tsx b/components/create-gweet/components/create-gweet.tsx
index 1b00d96b7bdea89719c80e5a0293f12f4302f4bf..491c57b1e6f8ff072408abb933d2cbed510cff12 100644
--- a/components/create-gweet/components/create-gweet.tsx
+++ b/components/create-gweet/components/create-gweet.tsx
@@ -3,7 +3,7 @@
import { zodResolver } from "@hookform/resolvers/zod"
import { useSession } from "next-auth/react"
import Image from "next/image"
-import { useRef, useState } from "react"
+import { useEffect, useRef, useState } from "react"
import { useForm } from "react-hook-form"
import * as z from "zod"
@@ -35,6 +35,10 @@ const FormSchema = z.object({
.max(240, { message: "Gweets cannot be more that 240 characters." }),
})
+const ImagesArraySchema = z.array(z.custom<File>().refine((file) => file instanceof File, { message: "Expected a file" })
+ .refine((file) => file?.size <= 4000000, { message: "Images must be less than 4MB" }))
+ .optional()
+
export const CreateGweet = ({
parent_gweet,
quoted_gweet,
@@ -52,12 +56,25 @@ export const CreateGweet = ({
const imageUploadRef = useRef<HTMLInputElement>(null)
const { data: session } = useSession()
- const { isLoading, mutate } = useCreateGweet()
+ const { isLoading, isSuccess, mutate } = useCreateGweet()
const form = useForm<z.infer<typeof FormSchema>>({
resolver: zodResolver(FormSchema),
})
+ let disable = true
+ if (!isLoading && session?.user.username !== undefined) {
+ // console.log("form is valid", form.formState.isValid)
+ if (form.formState.isDirty && form.formState.isValid) {
+ if (chosenImages.length !== 0) {
+ disable = false
+ } else {
+ disable = true
+ }
+ disable = false
+ }
+ }
+
async function onGweet(formData: z.infer<typeof FormSchema>) {
if (!session) return null
@@ -69,19 +86,37 @@ export const CreateGweet = ({
quoteGweetId: quoted_gweet?.id || null,
})
- toast({
- description: "Your gweet was send.",
- })
-
- form.setValue('gweet', '')
- setChosenImages([])
+ disable = true
}
+ useEffect(() => {
+ form.formState.isValid // needs to be checked to trigger validation on first load (weird behavior)
+ if (isSuccess) {
+ toast({
+ description: "Your gweet was send.",
+ })
+
+ form.reset()
+ form.setValue('gweet', '')
+ setChosenImages([])
+ }
+ }, [form, isSuccess])
+
const chooseImages = async (
event: React.ChangeEvent<HTMLInputElement>,
setChosenImages: (images: IChosenImages[]) => void,
) => {
const files = event.target.files
+ try {
+ const fileArray = Array.from(files?.length ? files : [])
+ ImagesArraySchema.parse(fileArray)
+ } catch (error: any) {
+ const err = error as z.ZodError
+ return toast({
+ variant: "destructive",
+ description: err.issues[0].message,
+ })
+ }
if (files && files.length > 0) {
const newImages: IChosenImages[] = []
@@ -185,7 +220,12 @@ export const CreateGweet = ({
<FormItem>
<FormControl>
<Textarea
- placeholder={placeholder || "What's on your mind?"}
+ placeholder={placeholder ||
+ chosenImages.length !== 0 ?
+ "Tell us something about your media."
+ :
+ "What's on your mind?"
+ }
className="resize-none min-h-[100px]"
disabled={isLoading || !session.user}
{...field}
@@ -222,19 +262,20 @@ export const CreateGweet = ({
{chosenImages.map((image, i) => {
const isFirstImage = chosenImages.length === 3 && i === 0
return (
- <Card key={i} className={`relative max-h-[600px] overflow-hidden ${isFirstImage ? "row-span-2" : ""}`}>
+ <Card key={i} className={`relative max-h-[600px] overflow-hidden ${isFirstImage ? "row-span-2" : ""} ${isLoading ? "opacity-50" : ""}`}>
<Button
type="button"
size="icon"
variant="secondary"
className="rounded-full absolute top-1 right-1 z-40"
+ disabled={isLoading}
onClick={() => {
setChosenImages(
chosenImages.filter((img, j) => j !== i),
)
}}
>
- <Icons.close className="w-6 h-6" />
+ <Icons.close />
</Button>
<Image
src={image.url as string}
@@ -252,7 +293,7 @@ export const CreateGweet = ({
</Card>
<div className="flex justify-end">
- <Button type="submit" size="lg" className="w-20" disabled={isLoading || !session.user}>
+ <Button type="submit" size="lg" className="w-20" disabled={disable}>
{isLoading ? (
<Icons.spinner className="h-4 w-4 animate-spin" />
) : (
diff --git a/components/follow-button.tsx b/components/follow-button.tsx
index 294bf2700fc7194870e5a28903a44378897ee6e3..ed87a2975dc22480f794d14462f530777f66c7ee 100644
--- a/components/follow-button.tsx
+++ b/components/follow-button.tsx
@@ -36,43 +36,48 @@ export const FollowButton = ({
}, [router, followMutation.isSuccess, unfollowMutation.isSuccess])
return (
- <Dialog open={open} onOpenChange={setOpen}>
- {isFollowing ? (
- <DialogTrigger asChild>
- <Button variant={`${isHovered ? "destructive" : "outline"}`} size="lg"
- className="w-24"
- onMouseEnter={() => {
- setText("Unfollow")
- setIsHovered(true)
- }}
- onMouseOut={() => {
- setText("Following")
- setIsHovered(false)
- }}>
- {text}
+ <div onClick={(e) => {
+ e.preventDefault()
+ e.stopPropagation()
+ }}>
+ <Dialog open={open} onOpenChange={setOpen}>
+ {isFollowing ? (
+ <DialogTrigger asChild >
+ <Button variant={`${isHovered ? "destructive" : "outline"}`} size="lg"
+ className="w-24"
+ onMouseEnter={() => {
+ setText("Unfollow")
+ setIsHovered(true)
+ }}
+ onMouseOut={() => {
+ setText("Following")
+ setIsHovered(false)
+ }}>
+ {text}
+ </Button>
+ </DialogTrigger>
+ ) : (
+ <Button size="lg" onClick={() => followMutation.mutate({ userId })}>
+ Follow
</Button>
- </DialogTrigger>
- ) : (
- <Button size="lg" onClick={() => followMutation.mutate({ userId })}>
- Follow
- </Button>
- )}
- <DialogContent>
- <DialogHeader>
- <DialogTitle>Unfollow @{username}?</DialogTitle>
- <DialogDescription>
- You can still view their profile, unless their Gweets are protected.
- </DialogDescription>
- </DialogHeader>
- <DialogFooter>
- <Button type="submit" onClick={() => unfollowMutation.mutate({ userId })} disabled={unfollowMutation.isLoading}>
- {unfollowMutation.isLoading && (
- <Icons.spinner className="mr-2 h-4 w-4 animate-spin" />
- )}
- Unfollow
- </Button>
- </DialogFooter>
- </DialogContent>
- </Dialog>
+ )}
+ <DialogContent>
+ <DialogHeader>
+ <DialogTitle>Unfollow @{username}?</DialogTitle>
+ <DialogDescription>
+ You can still view their profile, unless their Gweets are protected.
+ </DialogDescription>
+ </DialogHeader>
+ <DialogFooter>
+ <Button type="submit" onClick={() => unfollowMutation.mutate({ userId })} disabled={unfollowMutation.isLoading}>
+ {unfollowMutation.isLoading && (
+ <Icons.spinner className="mr-2 h-4 w-4 animate-spin" />
+ )}
+ Unfollow
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ </div>
)
}
\ No newline at end of file
diff --git a/components/gweets/components/gweet-options.tsx b/components/gweets/components/gweet-options.tsx
index da121bd6596790b803a8d7b329c0ae2107b242ce..9ce0ff115aa9bea191b552129e0121ece0e80836 100644
--- a/components/gweets/components/gweet-options.tsx
+++ b/components/gweets/components/gweet-options.tsx
@@ -10,7 +10,6 @@ import {
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { toast } from "@/components/ui/use-toast"
-import { env } from "@/env.mjs"
import getURL from "@/lib/utils"
import { useSession } from "next-auth/react"
import { useRef, useState } from "react"
diff --git a/components/profile/api/get-follows.ts b/components/profile/api/get-follows.ts
index dc83afb8de3fc7b2dc5c40f80186464b3f0ad418..bfb15781fd8e6246ab3bfba6b138e3c2c20680da 100644
--- a/components/profile/api/get-follows.ts
+++ b/components/profile/api/get-follows.ts
@@ -1,6 +1,6 @@
export const getFollows = async (id: string | undefined, type: string | undefined) => {
try {
- const data = await fetch(`/api/users/follow?type=${type}&user_id=${id}`)
+ const data = await fetch(`/api/users/follow?type=${type}&userId=${id}`)
.then((result) => result.json())
return data
diff --git a/components/profile/components/edit-profile-modal.tsx b/components/profile/components/edit-profile-modal.tsx
index bf4dbc6b54919ed0a4591bcea1404d6151da6591..d77e18860bd1da6799bd836a9a516efd079ae50d 100644
--- a/components/profile/components/edit-profile-modal.tsx
+++ b/components/profile/components/edit-profile-modal.tsx
@@ -36,7 +36,7 @@ const FormSchema = z.object({
})
const ImagesSchema = z.custom<File>().refine((file) => file instanceof File, { message: "Expected a file" })
- .refine((file) => file?.size < 4000000, { message: "Images must be less than 4MB" })
+ .refine((file) => file?.size <= 4000000, { message: "Images must be less than 4MB" })
.optional()
export const EditProfileModal = ({ user }: { user: IUser }) => {
diff --git a/components/profile/components/user-follows.tsx b/components/profile/components/user-follows.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..afd3d0fade42a736af50e264a4bef370a7eae3c7
--- /dev/null
+++ b/components/profile/components/user-follows.tsx
@@ -0,0 +1,62 @@
+"use client"
+
+import LoadingItem from "@/components/loading-item"
+import { TryAgain } from "@/components/try-again"
+import { User } from "next-auth"
+import { usePathname } from "next/navigation"
+import { useGetFollows } from "../hooks/use-get-follows"
+import { UserItem } from "./user-item"
+
+export const UserFollows = ({ username, session }: { username: string, session: User | undefined }) => {
+ const pathValue = usePathname().split("/")[2] || ""
+
+ const {
+ data: following,
+ isLoading,
+ isError,
+ } = useGetFollows({
+ id: username,
+ type: pathValue,
+ })
+
+ if (isLoading) {
+ return (
+ <LoadingItem />
+ )
+ }
+
+ if (isError || !following) {
+ return (
+ <TryAgain />
+ )
+ }
+
+ if (following?.length === 0) {
+ if (session?.username === username) {
+ return (
+ <div className="m-6 flex justify-center">
+ <div className="font-bold">
+ <h1>You are not following anyone.</h1>
+ <p>When you do, it'll show up here.</p>
+ </div>
+ </div>
+ )
+ }
+ return (
+ <div className="m-6 flex justify-center">
+ <div className="font-bold">
+ <h1><span className="text-sky-500">@{username}</span> is not following anyone yet.</h1>
+ <p>When they do, it'll show up here.</p>
+ </div>
+ </div>
+ )
+ }
+
+ return (
+ <div className="space-y-5 flex flex-col">
+ {following?.map((user) => {
+ return <UserItem key={user?.id} user={user} sessionId={session?.id} />
+ })}
+ </div>
+ )
+}
\ No newline at end of file
diff --git a/components/profile/components/user-games.tsx b/components/profile/components/user-games.tsx
index 4f9d414fa9519d54cd1be6c2e6fca86d458f36cd..df8e8fe1467ec1c43ad8b3ed244e9e540927f4a8 100644
--- a/components/profile/components/user-games.tsx
+++ b/components/profile/components/user-games.tsx
@@ -54,46 +54,52 @@ export const UserGames = async ({ username }: { username: string }) => {
<div className="p-3 space-y-12">
<div>
<h1 className="text-2xl font-bold pb-3">Favorite Games</h1>
- <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
- {favoritegames ? favoritegames.map((game: IGame) => (
- <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
- ))
- :
- <p>No favorites currently...</p>}
- </div>
+ {favoritegames ?
+ <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
+ {favoritegames.map((game: IGame) => (
+ <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
+ ))}
+ </div>
+ :
+ <span>No favorites currently...</span>
+ }
</div>
<div>
<h1 className="text-2xl font-bold pb-3">Currently playing</h1>
- <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
- {playingGames ? playingGames.map((game: IGame) => (
- <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
- ))
- :
- <p>Currently not playing any games...</p>}
- </div>
+ {playingGames ?
+ <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
+ {playingGames.map((game: IGame) => (
+ <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
+ ))}
+ </div>
+ :
+ <p>Currently not playing any games...</p>
+ }
</div>
<div>
<h1 className="text-2xl font-bold pb-3">Planning to play</h1>
- <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
- {planningGames ? planningGames.map((game: IGame) => (
- <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
- ))
- :
- <p>Currently not planning to play any games...</p>}
- </div>
+ {planningGames ?
+ <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
+ {planningGames.map((game: IGame) => (
+ <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
+ ))}
+ </div>
+ :
+ <p>Currently not planning to play any games...</p>}
</div>
<div>
<h1 className="text-2xl font-bold pb-3">Finished Games</h1>
- <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
- {finishedGames ? finishedGames.map((game: IGame) => (
- <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
- ))
- :
- <p>No finished games...</p>}
- </div>
+ {finishedGames ?
+ <div className="grid grid-cols-1 ss:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4 lg:gap-8 items-center">
+ {finishedGames.map((game: IGame) => (
+ <GameItem id={game.id} name={game.name} cover={game.cover} key={game.id} />
+ ))}
+ </div>
+ :
+ <p>No finished games...</p>}
</div>
</div >
)
diff --git a/components/profile/components/user-item.tsx b/components/profile/components/user-item.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8a8f81dba302e0a066c355f98ae5069516221803
--- /dev/null
+++ b/components/profile/components/user-item.tsx
@@ -0,0 +1,41 @@
+import { FollowButton } from "@/components/follow-button"
+import { UserAvatar } from "@/components/user-avatar"
+import Link from "next/link"
+import { IUser } from "../types"
+import { following } from "../utils/following"
+
+export const UserItem = ({ user, sessionId }: { user: IUser, sessionId: string | undefined }) => {
+ const isFollowing = following({
+ user,
+ sessionUserId: sessionId ? sessionId : "",
+ })
+
+ return (
+ <Link
+ href={`/${user?.username}`}
+ className="flex flex-row flex-shrink gap-3 hover:bg-accent active:bg-accent rounded-lg p-3 items-center">
+
+ <UserAvatar
+ user={{ username: user.username, image: user.image || null }}
+ className="h-12 w-12 aspect-square"
+ />
+
+ <div className="flex flex-col flex-shrink justify-center h-full w-full space-y-3 overflow-hidden">
+ <div className="flex justify-between">
+ <div className="whitespace-nowrap">
+ <h1 className="font-bold">{user.name}</h1>
+ <h1 className="text-sm text-sky-500">@{user.username}</h1>
+ </div>
+
+ <FollowButton
+ userId={user.id}
+ username={user.username ? user.username : ""}
+ isFollowing={isFollowing}
+ />
+ </div>
+
+ {user.bio ? (<p className="truncate w-full">{user.bio}</p>) : <p> </p>}
+ </div>
+ </Link>
+ )
+}
diff --git a/components/trends/components/trend.tsx b/components/trends/components/trend.tsx
index 2ce19c9b8c18a64ec4a0bc9d7c194a5f1e8b7f2c..a13ae5718754d1ba58e43d2e42ae4d1b4900ca3a 100644
--- a/components/trends/components/trend.tsx
+++ b/components/trends/components/trend.tsx
@@ -7,12 +7,12 @@ export const Trend = ({ ranking = 1, title, gweets = 1 }: iTrendProps) => {
return (
<Link
href={`/search?query=${title.toLowerCase()}`}
- className="flex flex-col justify-between hover:bg-accent active:bg-accent rounded-lg p-1">
+ className="flex flex-col justify-between hover:bg-accent active:bg-accent rounded-lg p-1 overflow-hidden">
<div className="text-xs text-muted-foreground">
{ranking} · Trending
</div>
- <div>#{title}</div>
+ <div className="truncate">#{title}</div>
<div className="text-xs text-muted-foreground">
{gweets} {gweets === 1 ? "gweet" : "gweets"}
</div>
diff --git a/lib/swagger.ts b/lib/swagger.ts
index fe7c14a595ba9e32282c720d89bdb50b1d54ee7b..c26db79c660253f660b8df110e3c6a4ef57a539d 100644
--- a/lib/swagger.ts
+++ b/lib/swagger.ts
@@ -1,4 +1,4 @@
-import { createSwaggerSpec } from 'next-swagger-doc';
+import { createSwaggerSpec } from 'next-swagger-doc'
export const getApiDocs = async () => {
const spec = createSwaggerSpec({
@@ -20,6 +20,6 @@ export const getApiDocs = async () => {
},
security: [],
},
- });
- return spec;
-};
+ })
+ return spec
+}
\ No newline at end of file