Skip to content

Commit 612b249

Browse files
Copilotrezwana-karim
Copilot
and
rezwana-karim
committed
Replace all emojis with Radix UI icons across the Next.js project
Co-authored-by: rezwana-karim <126201034+rezwana-karim@users.noreply.github.com>
1 parent 2387751 commit 612b249

3 files changed

Lines changed: 40 additions & 24 deletions

File tree

‎src/app/projects/[slug]/page.tsx‎

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/com
44
import { Button } from "@/components/ui/button"
55
import { Badge } from "@/components/ui/badge"
66
import { Separator } from "@/components/ui/separator"
7-
import { GitHubLogoIcon, ExternalLinkIcon, StarIcon, CopyIcon, CalendarIcon, PersonIcon } from "@radix-ui/react-icons"
7+
import { GitHubLogoIcon, ExternalLinkIcon, StarIcon, CopyIcon, CalendarIcon, PersonIcon, CheckCircledIcon, ArchiveIcon, UpdateIcon, ReloadIcon, ComponentInstanceIcon, GlobeIcon, LockClosedIcon, StarFilledIcon } from "@radix-ui/react-icons"
88
import { getAllProjects, getProjectBySlug } from "@/lib/project-data"
99
import { notFound } from "next/navigation"
1010
import ReactMarkdown from "react-markdown"
@@ -51,16 +51,17 @@ export default function ProjectPage({ params }: ProjectPageProps) {
5151

5252
const getStatusBadge = (status: string | undefined) => {
5353
const statusConfig = {
54-
'Active': { emoji: '✅', color: 'bg-green-100 text-green-800 border-green-200' },
55-
'Archived': { emoji: '📦', color: 'bg-gray-100 text-gray-800 border-gray-200' },
56-
'Maintenance': { emoji: '🚧', color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
57-
'In Development': { emoji: '🔄', color: 'bg-blue-100 text-blue-800 border-blue-200' },
58-
'Under Construction': { emoji: '🏗️', color: 'bg-orange-100 text-orange-800 border-orange-200' },
54+
'Active': { icon: CheckCircledIcon, color: 'bg-green-100 text-green-800 border-green-200' },
55+
'Archived': { icon: ArchiveIcon, color: 'bg-gray-100 text-gray-800 border-gray-200' },
56+
'Maintenance': { icon: UpdateIcon, color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
57+
'In Development': { icon: ReloadIcon, color: 'bg-blue-100 text-blue-800 border-blue-200' },
58+
'Under Construction': { icon: ComponentInstanceIcon, color: 'bg-orange-100 text-orange-800 border-orange-200' },
5959
}
6060
const config = statusConfig[status as keyof typeof statusConfig] || statusConfig['Active']
61+
const Icon = config.icon
6162
return (
6263
<Badge variant="outline" className={`${config.color} text-sm font-medium`}>
63-
<span className="mr-2">{config.emoji}</span>
64+
<Icon className="mr-2 h-4 w-4" />
6465
{status}
6566
</Badge>
6667
)
@@ -119,7 +120,12 @@ export default function ProjectPage({ params }: ProjectPageProps) {
119120
? 'bg-green-50 text-green-700 border-green-200'
120121
: 'bg-gray-50 text-gray-700 border-gray-200'
121122
}`}>
122-
{project.visibility === 'Public' ? '🌐' : '🔐'} {project.visibility}
123+
{project.visibility === 'Public' ? (
124+
<GlobeIcon className="mr-2 h-4 w-4" />
125+
) : (
126+
<LockClosedIcon className="mr-2 h-4 w-4" />
127+
)}
128+
{project.visibility}
123129
</Badge>
124130
)}
125131
</div>
@@ -186,7 +192,10 @@ export default function ProjectPage({ params }: ProjectPageProps) {
186192
{project.keyFeatures && project.keyFeatures.length > 0 && (
187193
<Card>
188194
<CardHeader>
189-
<CardTitle className="text-xl">✨ Key Features</CardTitle>
195+
<CardTitle className="text-xl flex items-center gap-2">
196+
<StarFilledIcon className="h-5 w-5 text-yellow-500" />
197+
Key Features
198+
</CardTitle>
190199
</CardHeader>
191200
<CardContent>
192201
<ul className="space-y-3">

‎src/app/projects/page.tsx‎

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle, CardFooter }
44
import { Button } from "@/components/ui/button"
55
import { Badge } from "@/components/ui/badge"
66
import { Separator } from "@/components/ui/separator"
7-
import { GitHubLogoIcon, ExternalLinkIcon, StarIcon, CopyIcon, CalendarIcon } from "@radix-ui/react-icons"
7+
import { GitHubLogoIcon, ExternalLinkIcon, StarIcon, CopyIcon, CalendarIcon, CheckCircledIcon, ArchiveIcon, UpdateIcon, ReloadIcon, ComponentInstanceIcon, GlobeIcon, LockClosedIcon } from "@radix-ui/react-icons"
88
import { getAllProjects, getFeaturedProjects, getAllCategories } from "@/lib/project-data"
99

1010
export const metadata = {
@@ -20,16 +20,17 @@ export default function ProjectsPage() {
2020

2121
const getStatusBadge = (status: string | undefined) => {
2222
const statusConfig = {
23-
'Active': { emoji: '✅', color: 'bg-green-100 text-green-800 border-green-200' },
24-
'Archived': { emoji: '📦', color: 'bg-gray-100 text-gray-800 border-gray-200' },
25-
'Maintenance': { emoji: '🚧', color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
26-
'In Development': { emoji: '🔄', color: 'bg-blue-100 text-blue-800 border-blue-200' },
27-
'Under Construction': { emoji: '🏗️', color: 'bg-orange-100 text-orange-800 border-orange-200' },
23+
'Active': { icon: CheckCircledIcon, color: 'bg-green-100 text-green-800 border-green-200' },
24+
'Archived': { icon: ArchiveIcon, color: 'bg-gray-100 text-gray-800 border-gray-200' },
25+
'Maintenance': { icon: UpdateIcon, color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
26+
'In Development': { icon: ReloadIcon, color: 'bg-blue-100 text-blue-800 border-blue-200' },
27+
'Under Construction': { icon: ComponentInstanceIcon, color: 'bg-orange-100 text-orange-800 border-orange-200' },
2828
}
2929
const config = statusConfig[status as keyof typeof statusConfig] || statusConfig['Active']
30+
const Icon = config.icon
3031
return (
3132
<Badge variant="outline" className={`${config.color} text-xs font-medium`}>
32-
<span className="mr-1">{config.emoji}</span>
33+
<Icon className="mr-1 h-3 w-3" />
3334
{status}
3435
</Badge>
3536
)
@@ -237,7 +238,12 @@ export default function ProjectsPage() {
237238
? 'bg-green-50 text-green-700 border-green-200'
238239
: 'bg-gray-50 text-gray-700 border-gray-200'
239240
}`}>
240-
{project.visibility === 'Public' ? '🌐' : '🔐'} {project.visibility}
241+
{project.visibility === 'Public' ? (
242+
<GlobeIcon className="mr-1 h-3 w-3" />
243+
) : (
244+
<LockClosedIcon className="mr-1 h-3 w-3" />
245+
)}
246+
{project.visibility}
241247
</Badge>
242248
)}
243249
</div>

‎src/components/home/projects-section.tsx‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { Grid } from "@/components/ui/grid"
66
import { Stack } from "@/components/ui/stack"
77
import { Button } from "@/components/ui/button"
88
import { Badge } from "@/components/ui/badge"
9-
import { GitHubLogoIcon, StarIcon, PersonIcon, ExternalLinkIcon } from "@radix-ui/react-icons"
9+
import { GitHubLogoIcon, StarIcon, PersonIcon, ExternalLinkIcon, CheckCircledIcon, ArchiveIcon, UpdateIcon, ReloadIcon, ComponentInstanceIcon } from "@radix-ui/react-icons"
1010
import { getFeaturedProjects } from "@/lib/project-data"
1111

1212
interface ProjectsSectionProps {
@@ -18,16 +18,17 @@ export default function ProjectsSection({ className }: ProjectsSectionProps) {
1818

1919
const getStatusBadge = (status: string | undefined) => {
2020
const statusConfig = {
21-
'Active': { emoji: '✅', color: 'bg-green-100 text-green-800 border-green-200' },
22-
'Archived': { emoji: '📦', color: 'bg-gray-100 text-gray-800 border-gray-200' },
23-
'Maintenance': { emoji: '🚧', color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
24-
'In Development': { emoji: '🔄', color: 'bg-blue-100 text-blue-800 border-blue-200' },
25-
'Under Construction': { emoji: '🏗️', color: 'bg-orange-100 text-orange-800 border-orange-200' },
21+
'Active': { icon: CheckCircledIcon, color: 'bg-green-100 text-green-800 border-green-200' },
22+
'Archived': { icon: ArchiveIcon, color: 'bg-gray-100 text-gray-800 border-gray-200' },
23+
'Maintenance': { icon: UpdateIcon, color: 'bg-yellow-100 text-yellow-800 border-yellow-200' },
24+
'In Development': { icon: ReloadIcon, color: 'bg-blue-100 text-blue-800 border-blue-200' },
25+
'Under Construction': { icon: ComponentInstanceIcon, color: 'bg-orange-100 text-orange-800 border-orange-200' },
2626
}
2727
const config = statusConfig[status as keyof typeof statusConfig] || statusConfig['Active']
28+
const Icon = config.icon
2829
return (
2930
<Badge variant="outline" className={`${config.color} text-xs font-medium`}>
30-
<span className="mr-1">{config.emoji}</span>
31+
<Icon className="mr-1 h-3 w-3" />
3132
{status}
3233
</Badge>
3334
)

0 commit comments

Comments
 (0)