🎨 refactor(pages): rearrange imports and formatting for Blog, BlogArticle, ProjectDetails, and Projects

This commit organizes import statements and standardizes code formatting across the Blog, BlogArticle, ProjectDetails, and Projects pages. Improvements include consistent spacing, use of double quotes, and more readable conditional rendering, contributing to better maintainability and readability of the codebase.

src/pages/Projects.tsx

@@ -1,21 +1,27 @@
-import { useState } from 'react';
-import { motion, AnimatePresence, calcLength } from 'framer-motion';
-import { ArrowLeft, Globe, Smartphone, Brain, Cloud, ExternalLink, Workflow, Github } from 'lucide-react';
-import { Link } from 'react-router-dom';
-import { Button } from '@/components/ui/button';
-import Navbar from '@/components/Navbar';
-import Footer from '@/components/Footer';
-import PageTransition from '@/components/PageTransition';
-import { useProjects } from '@/hooks/queires/useProjects';
-import { projects } from '@/data/projectData';
+import PageTransition from "@/components/PageTransition";
+import { Button } from "@/components/ui/button";
+import { useProjects } from "@/hooks/queires/useProjects";
+import { AnimatePresence, motion } from "framer-motion";
+import {
+  ArrowLeft,
+  Brain,
+  Cloud,
+  ExternalLink,
+  Github,
+  Globe,
+  Smartphone,
+  Workflow,
+} from "lucide-react";
+import { useState } from "react";
+import { Link } from "react-router-dom";
 
 const categories = [
-  { id: 'all', name: 'All Projects', icon: null },
-  { id: 'web', name: 'Web', icon: Globe },
-  { id: 'mobile', name: 'Mobile', icon: Smartphone },
-  { id: 'ai', name: 'AI', icon: Brain },
-  { id: 'cloud', name: 'Cloud', icon: Cloud },
-  { id: 'devops', name: 'DEVOPS', icon: Workflow },
+  { id: "all", name: "All Projects", icon: null },
+  { id: "web", name: "Web", icon: Globe },
+  { id: "mobile", name: "Mobile", icon: Smartphone },
+  { id: "ai", name: "AI", icon: Brain },
+  { id: "cloud", name: "Cloud", icon: Cloud },
+  { id: "devops", name: "DEVOPS", icon: Workflow },
 ];
 
 const containerVariants = {
@@ -33,26 +39,24 @@ const itemVariants = {
   visible: {
     opacity: 1,
     y: 0,
-    transition: { duration: 0.5, ease: 'easeOut' as const },
+    transition: { duration: 0.5, ease: "easeOut" as const },
   },
 };
 
 export default function Projects() {
-
-  const {data: projectsData} = useProjects();
+  const { data: projectsData } = useProjects();
   const projects = projectsData?.data.data.result;
 
-  const [activeCategory, setActiveCategory] = useState('all');
+  const [activeCategory, setActiveCategory] = useState("all");
 
-  const filteredProjects = activeCategory === 'all'
-    ? projects
-    : projects?.filter(project => project.category === activeCategory);
+  const filteredProjects =
+    activeCategory === "all"
+      ? projects
+      : projects?.filter((project) => project.category === activeCategory);
 
   return (
     <PageTransition>
       <div className="min-h-screen bg-background overflow-x-hidden">
-        <Navbar />
-
         {/* Hero Section */}
         <section className="pt-32 pb-16 relative overflow-hidden">
           <div className="absolute inset-0">
@@ -83,10 +87,12 @@ export default function Projects() {
               className="text-center mb-12"
             >
               <h1 className="text-5xl md:text-6xl font-bold mb-6">
-                Our <span className="text-primary neon-text-glow">Projects</span>
+                Our{" "}
+                <span className="text-primary neon-text-glow">Projects</span>
               </h1>
               <p className="text-muted-foreground max-w-2xl mx-auto text-lg">
-                Explore our portfolio of innovative solutions that have transformed businesses across industries.
+                Explore our portfolio of innovative solutions that have
+                transformed businesses across industries.
               </p>
             </motion.div>
 
@@ -102,12 +108,15 @@ export default function Projects() {
                 return (
                   <Button
                     key={category.id}
-                    variant={activeCategory === category.id ? 'default' : 'outline'}
+                    variant={
+                      activeCategory === category.id ? "default" : "outline"
+                    }
                     onClick={() => setActiveCategory(category.id)}
-                    className={`rounded-full px-6 transition-all duration-300 ${activeCategory === category.id
-                      ? 'neon-glow bg-primary text-primary-foreground'
-                      : 'glass border-primary/30 hover:border-primary'
-                      }`}
+                    className={`rounded-full px-6 transition-all duration-300 ${
+                      activeCategory === category.id
+                        ? "neon-glow bg-primary text-primary-foreground"
+                        : "glass border-primary/30 hover:border-primary"
+                    }`}
                   >
                     {Icon && <Icon className="w-4 h-4 mr-2" />}
                     {category.name}
@@ -149,7 +158,10 @@ export default function Projects() {
                       {/* Category Badge */}
                       <div className="absolute top-4 left-4">
                         <span className="px-3 py-1 rounded-full bg-primary/20 text-primary text-sm font-medium backdrop-blur-sm border border-primary/30">
-                          {categories.find(c => c.id === project.category)?.name}
+                          {
+                            categories.find((c) => c.id === project.category)
+                              ?.name
+                          }
                         </span>
                       </div>
 
@@ -222,8 +234,6 @@ export default function Projects() {
             )}
           </div>
         </section>
-
-        <Footer />
       </div>
     </PageTransition>
   );