Skip to content

Commit bd86dc8

Browse files
thebkhtthebkht
committed
Refactor UI icons in code
1 parent 6186735 commit bd86dc8

22 files changed

Lines changed: 204 additions & 87 deletions

‎app/(Main)/tags/page.tsx‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,7 @@
11
import { getSessionUser } from "@/components/get-session-user"
22
import TagsList from "@/components/tags/list"
33
import TagBadge from "@/components/tags/tag"
4-
import { Badge } from "@/components/ui/badge"
5-
import { Button } from "@/components/ui/button"
6-
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
7-
import postgres from "@/lib/postgres"
84
import { getPopularTags, getTags } from "@/lib/prisma/tags"
9-
import { Hash } from "lucide-react"
105
import Link from "next/link"
116

127
export default async function TagsPage() {

‎components/blog/comments/comment-card.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Badge } from "@/components/ui/badge";
55
import { Button } from "@/components/ui/button";
66
import { Card, CardContent, CardFooter, CardHeader } from "@/components/ui/card";
77
import UserHoverCard from "@/components/user-hover-card";
8-
import { Heart, MoreHorizontal, Pencil, Reply, Trash2 } from "lucide-react";
8+
import { MoreHorizontal, Pencil, Reply, Trash2 } from "lucide-react";
99
import Markdown from "markdown-to-jsx";
1010
import Link from "next/link";
1111
import {
@@ -146,12 +146,12 @@ export default function CommentCard({ comment: initialComment, post, session, ..
146146
{
147147
session ? (
148148
<Button className="h-10 w-10 mr-0.5" size={"icon"} variant={"ghost"} disabled={session?.id == comment.authorId} onClick={() => like(comment.id)} >
149-
<Heart className={`w-5 h-5 ${isLiked && 'fill-current'}`} strokeWidth={2} />
149+
<Icons.like className={`w-6 h-6 ${isLiked && 'fill-current'}`} />
150150
</Button>
151151
) : (
152152
<LoginDialog>
153153
<Button className="h-10 w-10 mr-0.5" size={"icon"} variant={"ghost"} >
154-
<Heart className={`w-5 h-5`} strokeWidth={2} />
154+
<Icons.like className={`w-6 h-6`} />
155155
</Button>
156156
</LoginDialog>
157157
)
@@ -162,7 +162,7 @@ export default function CommentCard({ comment: initialComment, post, session, ..
162162
comment._count.replies > 0 && (
163163
<div className="flex items-center">
164164
<Button className="h-10 w-10 mr-0.5" size={"icon"} variant={"ghost"} onClick={() => setOpenReply(!openReply)} >
165-
<Reply className="w-5 h-5" strokeWidth={2} />
165+
<Icons.commentBubble className="w-6 h-6" />
166166
</Button>
167167
<span className="text-sm">{comment?._count.replies}</span>
168168
</div>

‎components/blog/comments/delete-dialog.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414

1515
} from "@/components/ui/alert-dialog"
1616
import { Trash2 } from "lucide-react";
17+
import { Icons } from "@/components/icon";
1718

1819

1920
export default function CommentDeleteDialog({ comment, user, ...props }: React.ComponentPropsWithoutRef<typeof AlertDialog> & { comment: any, user: any }) {
@@ -23,7 +24,7 @@ export default function CommentDeleteDialog({ comment, user, ...props }: React.C
2324
<AlertDialog {...props}>
2425
<AlertDialogContent className="flex flex-col justify-center !w-72 !rounded-lg">
2526
<div className="flex h-20 w-20 items-center justify-center rounded-full bg-muted mx-auto">
26-
<Trash2 className={"h-10 w-10"} strokeWidth={1.25} />
27+
<Icons.trash className={"h-10 w-10"} />
2728
</div>
2829
<div className="flex flex-col space-y-2 text-center sm:text-left mx-auto">
2930
<h1 className="text-lg font-semibold leading-none tracking-tight text-center">Delete Comment</h1>

‎components/blog/feed-post-card.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { BlurImage as Image } from "../image";
88
import { Button } from "../ui/button";
99
import Link from "next/link";
1010
import { cn } from "@/lib/utils";
11-
import { Bookmark, MoreHorizontal } from "lucide-react";
11+
import { MoreHorizontal } from "lucide-react";
1212
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
1313
import UserHoverCard from "../user-hover-card";
1414
import { Icons } from "../icon";
@@ -94,7 +94,7 @@ export default function FeedPostCard(
9494
<div className="stats flex items-center justify-around gap-1">
9595
<div className="flex items-center space-x-1 text-muted-foreground text-sm feedpost__action-btn">
9696
<Button variant="ghost" size={"icon"} className=" text-muted-foreground">
97-
<Bookmark className={`h-5 w-5 ${isSaved && 'fill-current'}`} strokeWidth={2} onClick={() => save(props.post.id)} />
97+
<Icons.bookmark className={`h-5 w-5 ${isSaved && 'fill-current'}`} onClick={() => save(props.post.id)} />
9898
<span className="sr-only">Save</span>
9999
</Button>
100100
</div>
@@ -154,15 +154,15 @@ export default function FeedPostCard(
154154
<div className="stats flex items-center justify-around gap-1">
155155
<div className="flex items-center space-x-1 text-muted-foreground text-sm feedpost__action-btn">
156156
<Button variant="ghost" size={"icon"} className=" text-muted-foreground">
157-
<Bookmark className={`h-5 w-5 ${isSaved && 'fill-current'}`} strokeWidth={2} onClick={() => save(props.post.id)} />
157+
<Icons.bookmark className={`h-6 w-6 ${isSaved && 'fill-current'}`} onClick={() => save(props.post.id)} />
158158
<span className="sr-only">Save</span>
159159
</Button>
160160
</div>
161161
<div className="flex items-center space-x-1 text-muted-foreground text-sm feedpost__action-btn">
162162
<Button variant="ghost" size={"icon"} className=" text-muted-foreground">
163163
<ShareList url={`${process.env.DOMAIN}/@${props.post.author.username}/${props.post.url}`} text={props.post.title}>
164164
<div>
165-
<MoreHorizontal className="h-5 w-5" />
165+
<Icons.moreHorizontal className="h-6 w-6" />
166166
<span className="sr-only">Share</span>
167167
</div>
168168
</ShareList>

‎components/blog/landing-post-card.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { BlurImage as Image } from "../image";
77
import { Button } from "../ui/button";
88
import Link from "next/link";
99
import { cn } from "@/lib/utils";
10-
import { Bookmark } from "lucide-react";
1110
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
1211
import UserHoverCard from "../user-hover-card";
1312
import { Icons } from "../icon";
@@ -78,7 +77,7 @@ export default function LandingPostCard(
7877
<div className="flex items-center space-x-1 text-muted-foreground text-sm feedpost__action-btn">
7978
<LoginDialog>
8079
<Button variant="ghost" size={"icon"} className=" text-muted-foreground">
81-
<Bookmark className={`h-5 w-5 `} strokeWidth={2} />
80+
<Icons.bookmark className={`h-5 w-5 `} />
8281
<span className="sr-only">Save</span>
8382
</Button>
8483
</LoginDialog>

‎components/blog/mobile-navbar.tsx‎

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import LoginDialog from "../login-dialog";
1313
import { Separator } from "../ui/separator";
1414
import { validate } from "@/lib/revalidate";
1515
import { Post } from "@prisma/client";
16+
import { Icons } from "../icon";
1617

1718
export default function MobilePostTabs({ post: initialPost, className, session, author, onClicked }: { post: any, className?: string, session: any, author: any, onClicked: () => void }) {
1819
const [post, setPost] = useState<any>(initialPost);
@@ -48,15 +49,17 @@ export default function MobilePostTabs({ post: initialPost, className, session,
4849
<div className={cn("p-2 border rounded-full shadow-xl flex md:hidden mx-auto w-max sticky bottom-5 bg-background/60 backdrop-blur-md", className)}>
4950
<div className="flex items-center justify-between w-full gap-6 px-6">
5051
<div className="flex items-center justify-center flex-1">
51-
{
52+
{
5253
session ? (
5354
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={() => like(post.id)} disabled={session.id == post.authorId} >
54-
<Heart className={`w-5 h-5 ${isLiked && 'fill-current'}`} strokeWidth={1.75} />
55+
<Icons.like className={`w-6 h-6 ${isLiked && 'fill-current'}`} />
56+
<span className="sr-only">Like</span>
5557
</Button>
5658
) : (
5759
<LoginDialog>
5860
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
59-
<Heart className={`w-5 h-5`} strokeWidth={1.75} />
61+
<Icons.like className="w-6 h-6" />
62+
<span className="sr-only">Like</span>
6063
</Button>
6164
</LoginDialog>
6265
)
@@ -65,26 +68,29 @@ export default function MobilePostTabs({ post: initialPost, className, session,
6568
</div>
6669
<Separator orientation="vertical" />
6770
<div className="flex items-center justify-center flex-1">
68-
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={onClicked}>
69-
<MessageCircle className="w-5 h-5" strokeWidth={1.75} />
71+
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={onClicked}>
72+
<Icons.commentBubble className="w-6 h-6" />
73+
<span className="sr-only">Comment</span>
7074
</Button>
7175
<span className="text-sm">{post?._count.comments}</span>
7276
</div>
7377
<Separator orientation="vertical" />
7478
<div className="flex items-center justify-center flex-1">
75-
{
76-
session ? (
79+
{
80+
session ? (
81+
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={() => save(post.id)} >
82+
<Icons.bookmark className={`w-6 h-6 ${isSaved && 'fill-current'}`} />
83+
<span className="sr-only">Save</span>
84+
</Button>
85+
) : (
86+
<LoginDialog>
7787
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
78-
<Bookmark className={`w-5 h-5 ${isSaved && 'fill-current'}`} strokeWidth={1.75} onClick={() => save(post.id)} />
88+
<Icons.bookmark className="w-6 h-6" />
89+
<span className="sr-only">Save</span>
7990
</Button>
80-
) : (
81-
<LoginDialog>
82-
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
83-
<Bookmark className={`w-5 h-5`} strokeWidth={1.75} />
84-
</Button>
85-
</LoginDialog>
86-
)
87-
}
91+
</LoginDialog>
92+
)
93+
}
8894
</div>
8995
{/* <PostMoreActions post={post} session={session} >
9096
<Button className="h-10 w-10 mr-0.5" size={"icon"} variant={"ghost"} >

‎components/blog/navbar.tsx‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
'use client'
2-
import { Bookmark, Heart, MessageCircle, MoreHorizontal, Pencil, ShareIcon, Trash2 } from "lucide-react";
2+
import { Bookmark, MoreHorizontal, Pencil, ShareIcon, Trash2 } from "lucide-react";
33
import { Button } from "../ui/button";
44
import { cn } from "@/lib/utils";
55
import ShareList from "../share-list";
@@ -13,6 +13,7 @@ import { Separator } from "../ui/separator";
1313
import { Post } from "@prisma/client";
1414
import { revalidatePath } from "next/cache";
1515
import { validate } from "@/lib/revalidate";
16+
import { Icons } from "../icon";
1617

1718
export default function PostTabs({ post: initialPost, className, session, author, onClicked }: { post: any, className?: string, session: any, author: any, onClicked: () => void }) {
1819
const [post, setPost] = useState<any>(initialPost);
@@ -51,13 +52,13 @@ export default function PostTabs({ post: initialPost, className, session, author
5152
{
5253
session ? (
5354
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={() => like(post.id)} disabled={session.id == post.authorId} >
54-
<Heart className={`w-5 h-5 ${isLiked && 'fill-current'}`} strokeWidth={2} />
55+
<Icons.like className={`w-6 h-6 ${isLiked && 'fill-current'}`} />
5556
<span className="sr-only">Like</span>
5657
</Button>
5758
) : (
5859
<LoginDialog>
5960
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
60-
<Heart className={`w-5 h-5`} strokeWidth={2} />
61+
<Icons.like className="w-6 h-6" />
6162
<span className="sr-only">Like</span>
6263
</Button>
6364
</LoginDialog>
@@ -68,7 +69,7 @@ export default function PostTabs({ post: initialPost, className, session, author
6869
<Separator orientation="vertical" />
6970
<div className="flex items-center">
7071
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={onClicked}>
71-
<MessageCircle className="w-5 h-5" strokeWidth={2} />
72+
<Icons.commentBubble className="w-6 h-6" />
7273
<span className="sr-only">Comment</span>
7374
</Button>
7475
<span className="text-sm">{post?._count.comments}</span>
@@ -81,13 +82,13 @@ export default function PostTabs({ post: initialPost, className, session, author
8182
{
8283
session ? (
8384
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} onClick={() => save(post.id)} >
84-
<Bookmark className={`w-5 h-5 ${isSaved && 'fill-current'}`} strokeWidth={2} />
85+
<Icons.bookmark className={`w-6 h-6 ${isSaved && 'fill-current'}`} />
8586
<span className="sr-only">Save</span>
8687
</Button>
8788
) : (
8889
<LoginDialog>
8990
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
90-
<Bookmark className={`w-5 h-5`} strokeWidth={2} />
91+
<Icons.bookmark className="w-6 h-6" />
9192
<span className="sr-only">Save</span>
9293
</Button>
9394
</LoginDialog>
@@ -96,7 +97,7 @@ export default function PostTabs({ post: initialPost, className, session, author
9697
<Separator orientation="vertical" />
9798
<ShareList url={`${process.env.DOMAIN}/@${author?.username}/${post.url}`} text={post.title} >
9899
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
99-
<ShareIcon className="w-5 h-5" strokeWidth={2} />
100+
<Icons.share className="w-6 h-6" />
100101
<span className="sr-only">Share</span>
101102
</Button>
102103
</ShareList>
@@ -107,7 +108,7 @@ export default function PostTabs({ post: initialPost, className, session, author
107108
<DropdownMenu>
108109
<DropdownMenuTrigger asChild>
109110
<Button className="h-10 w-10 mr-0.5 rounded-full hover:bg-primary hover:text-primary-foreground" size={"icon"} variant={"ghost"} >
110-
<MoreHorizontal className="w-5 h-5" strokeWidth={2} />
111+
<Icons.moreHorizontal className="w-6 h-6" />
111112
</Button>
112113
</DropdownMenuTrigger>
113114
<DropdownMenuContent align="end">

‎components/blog/post-more-actions.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ export default function PostMoreActions({ post, session, className, children, ..
6868
}
6969
<DropdownMenuGroup>
7070
<DropdownMenuItem onClick={() => copylink(`${process.env.DOMAIN}/@${post.author.username}/${post.url}`)}>
71-
<Link2 className="mr-2 h-4 w-4" />
71+
<Icons.link className="mr-2 h-4 w-4" />
7272
<span>Copy link</span>
7373
</DropdownMenuItem>
7474
<DropdownMenuItem>

0 commit comments

Comments
 (0)