Merge pull request #2 from Seistart/feature/refactor

Refactor: Organize Files and Rename to Kebab-Case
Seistart · Feb 27, 2024 · 6ddcbc1 · 6ddcbc1
2 parents c69f36b + e46cf13
commit 6ddcbc1
Show file tree

Hide file tree

Showing 29 changed files with 156 additions and 160 deletions.
diff --git a/src/app/(routes)/analytics/page.tsx b/src/app/(routes)/analytics/page.tsx
@@ -0,0 +1,11 @@
+import { Analytics } from '@/components/pages'
+import { appMetadata } from '@/configs'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  ...appMetadata.analytics,
+}
+
+export default function AnalyticsPage() {
+  return <Analytics />
+}
diff --git a/src/app/blog/[slug]/page.tsx → src/app/(routes)/blog/[slug]/page.tsx b/src/app/blog/[slug]/page.tsx → src/app/(routes)/blog/[slug]/page.tsx
diff --git a/src/app/(routes)/blog/page.tsx b/src/app/(routes)/blog/page.tsx
@@ -0,0 +1,11 @@
+import { Blogs } from '@/components/pages'
+import { appMetadata } from '@/configs'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  ...appMetadata.blogs,
+}
+
+export default async function BlogsPage() {
+  return <Blogs />
+}
diff --git a/src/app/(routes)/projects/page.tsx b/src/app/(routes)/projects/page.tsx
@@ -0,0 +1,11 @@
+import { Projects } from '@/components/pages'
+import { appMetadata } from '@/configs'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  ...appMetadata.projects,
+}
+
+export default function ProjectsPage() {
+  return <Projects />
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,6 +1,7 @@
-import Footer from '@/components/Footer'
-import { Header } from '@/components/Header'
+import { Footer } from '@/components/footer'
+import { Header } from '@/components/header'
 import { ThemeProvider } from '@/components/theme/theme-provider'
+import { appMetadata } from '@/configs'
 import { cn } from '@/lib/utils'
 import type { Metadata } from 'next'
 import { Space_Grotesk } from 'next/font/google'
@@ -9,8 +10,7 @@ import './globals.css'
 const spaceGrotesk = Space_Grotesk({ subsets: ['latin'] })
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
+  ...appMetadata.home,
 }
 
 export default function RootLayout({
@@ -26,10 +26,10 @@ export default function RootLayout({
           enableSystem={true}
           disableTransitionOnChange
         >
-          <div className='container mx-auto'>
-            <Header></Header>
-            <main>{children}</main>
-            <Footer></Footer>
+          <div className='min-h-100vh container mx-auto flex flex-col supports-[height:100cqh]:min-h-[100cqh] supports-[height:100dvh]:min-h-[100dvh] supports-[height:100svh]:min-h-[100svh]'>
+            <Header />
+            <main className='flex-1'>{children}</main>
+            <Footer />
           </div>
         </ThemeProvider>
       </body>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -1,5 +1,5 @@
-import { Body } from '@/components/Body'
+import { Home } from '@/components/pages'
 
-export default function Home() {
-  return <Body />
+export default function HomePage() {
+  return <Home />
 }
diff --git a/src/app/robots.ts b/src/app/robots.ts
@@ -0,0 +1,12 @@
+import { MetadataRoute } from 'next'
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: {
+      userAgent: '*',
+      allow: '/',
+      disallow: '/private/',
+    },
+    sitemap: 'https://lualabs.xyz/sitemap.xml',
+  }
+}
diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts
@@ -0,0 +1,16 @@
+import { getSortedBlogPosts } from '../lib/blog'
+
+export default async function sitemap() {
+  const blogPosts = await getSortedBlogPosts()
+  const blogPostRoutes = blogPosts.map((blogPost) => ({
+    url: `https://seistart.com//blog/${blogPost.id}`,
+    lastModified: new Date(blogPost.date).toISOString().split('T')[0],
+  }))
+
+  const staticRoutes = ['', '/blog', '/projects', 'analytics'].map((route) => ({
+    url: `https://seistart.com/${route}`,
+    lastModified: new Date().toISOString().split('T')[0],
+  }))
+
+  return [...staticRoutes, ...blogPostRoutes]
+}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -1,29 +1,24 @@
-'use client'
-
-import React from 'react'
-
-const Footer: React.FC = () => {
+export const Footer = () => {
+  const date = new Date().getFullYear()
   return (
-    <footer className='px-4 py-6 text-white'>
-      <div className='container mx-auto grid grid-cols-3 gap-4'>
+    <footer className='py-6'>
+      <div className='grid grid-cols-3 place-items-center gap-4'>
         <div>
-          <h2 className='mb-2 text-base font-bold'>Block 1</h2>
+          <h2 className='mb-2'>Block 1</h2>
           <p className='text-sm'>Content for block 1...</p>
         </div>
         <div>
-          <h2 className='mb-2 text-base font-bold'>Block 2</h2>
+          <h2 className='mb-2'>Block 2</h2>
           <p className='text-sm'>Content for block 2...</p>
         </div>
         <div>
-          <h2 className='mb-2 text-base font-bold'>Block 3</h2>
+          <h2 className='mb-2'>Block 3</h2>
           <p className='text-sm'>Content for block 3...</p>
         </div>
       </div>
       <div className='mt-4 text-center text-xs'>
-        <p>&copy; {new Date().getFullYear()} SeiStart</p>
+        <p>&copy; {date} SeiStart</p>
       </div>
     </footer>
   )
 }
-
-export default Footer
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
@@ -1,15 +1,11 @@
 import Image from 'next/image'
 import Link from 'next/link'
 import { FaBell, FaSearch } from 'react-icons/fa'
-import { MobileNavigation } from './MobileNavigation'
-import { NavigationMenuPage } from './Navigation'
-import { UserNav } from './UserNav'
+import { MobileNavigation } from './navigation/mobile-navigation'
+import { NavigationMenuPage } from './navigation/navigation'
+import { UserNavigation } from './navigation/user-navigation'
 import { Button } from './ui/button'
 
-/**
- * Header component that renders a header with logo, navigation,
- * and action buttons like connect wallet.
- */
 export const Header = () => {
   return (
     <header className='flex items-center justify-between border-b-2 border-primary/10'>
@@ -36,7 +32,7 @@ export const Header = () => {
             <FaBell className='h-4 w-4' />
           </Button>
         </div>
-        <UserNav />
+        <UserNavigation />
       </div>
     </header>
   )

diff --git a/src/components/AnalyticsDashboard.tsx → src/components/analytics-dashboard.tsx b/src/components/AnalyticsDashboard.tsx → src/components/analytics-dashboard.tsx
diff --git a/src/components/Combobox.tsx → src/components/combo-box.tsx b/src/components/Combobox.tsx → src/components/combo-box.tsx
diff --git a/src/components/ImageSlider.tsx → src/components/image-slider.tsx b/src/components/ImageSlider.tsx → src/components/image-slider.tsx
@@ -1,7 +1,5 @@
 'use client'
 
-import React from 'react'
-
 import Image from 'next/image'
 import Link from 'next/link'
 import { Button } from './ui/button'
@@ -58,10 +56,9 @@ const images: ImageData[] = [
     subtitle: 'Subtitle 6',
     tags: ['Tag1', 'Tag2', 'Tag3'],
   },
-  // Add more images as needed
 ]
 
-const ImageSlider: React.FC = () => {
+export const ImageSlider = () => {
   return (
     <div className='relative flex flex-col justify-center overflow-hidden'>
       <div className='mx-auto w-full max-w-full px-4 py-2 md:px-6'>
@@ -134,36 +131,10 @@ const ImageSlider: React.FC = () => {
                   </Link>
                 </li>
               ))}
-              {/* <li>
-                <img src="/svg/facebook.svg" alt="Facebook" />
-              </li>
-              <li>
-                <img src="/svg/disney.svg" alt="Disney" />
-              </li>
-              <li>
-                <img src="/svg/airbnb.svg" alt="Airbnb" />
-              </li>
-              <li>
-                <img src="/svg/apple.svg" alt="Apple" />
-              </li>
-              <li>
-                <img src="/svg/spark.svg" alt="Spark" />
-              </li>
-              <li>
-                <img src="/svg/samsung.svg" alt="Samsung" />
-              </li>
-              <li>
-                <img src="/svg/quora.svg" alt="Quora" />
-              </li>
-              <li>
-                <img src="/svg/sass.svg" alt="Sass" />
-              </li> */}
             </ul>
           </div>
         </div>
       </div>
     </div>
   )
 }
-
-export default ImageSlider
diff --git a/src/components/MobileNavigation.tsx → ...mponents/navigation/mobile-navigation.tsx b/src/components/MobileNavigation.tsx → ...mponents/navigation/mobile-navigation.tsx
@@ -1,36 +1,26 @@
 'use client'
 
-import * as React from 'react'
-
 import { Button } from '@/components/ui/button'
 import {
   Drawer,
   DrawerClose,
   DrawerContent,
   DrawerTrigger,
 } from '@/components/ui/drawer'
-import { Cross1Icon } from '@radix-ui/react-icons'
-import { RxHamburgerMenu } from 'react-icons/rx'
+import { useEffect, useState } from 'react'
+import { RxCross2, RxHamburgerMenu } from 'react-icons/rx'
 
-export function MobileNavigation() {
-  const [isDrawerOpen, setIsDrawerOpen] = React.useState(false)
+export const MobileNavigation = () => {
+  const [isDrawerOpen, setIsDrawerOpen] = useState(false)
 
-  // Listen for viewport changes and close the drawer if the viewport
-  // width exceeds the breakpoint (e.g., 768px).
-  React.useEffect(() => {
+  useEffect(() => {
     function handleResize() {
       if (window.innerWidth > 768) {
-        setIsDrawerOpen(false) // Close the drawer
+        setIsDrawerOpen(false)
       }
     }
-
-    // Add resize event listener
     window.addEventListener('resize', handleResize)
-
-    // Call the resize function initially in case the initial viewport width is above the breakpoint
     handleResize()
-
-    // Remove event listener on cleanup
     return () => window.removeEventListener('resize', handleResize)
   }, [])
 
@@ -53,7 +43,7 @@ export function MobileNavigation() {
               variant='ghost'
               onClick={() => setIsDrawerOpen(false)}
             >
-              <Cross1Icon height='20' width='20'></Cross1Icon>
+              <RxCross2 className='h-6 w-6'></RxCross2>
             </Button>
           </DrawerClose>
         </div>

diff --git a/src/components/Navigation.tsx → src/components/navigation/navigation.tsx b/src/components/Navigation.tsx → src/components/navigation/navigation.tsx
@@ -1,8 +1,5 @@
 'use client'
 
-import Link from 'next/link'
-import * as React from 'react'
-
 import {
   NavigationMenu,
   NavigationMenuContent,
@@ -14,6 +11,8 @@ import {
 } from '@/components/ui/navigation-menu'
 import { cn } from '@/lib/utils'
 import { preventDefaultAction } from '@/utils'
+import Link from 'next/link'
+import { ReactNode } from 'react'
 
 const components: { title: string; href: string; description: string }[] = [
   {
@@ -30,7 +29,7 @@ const components: { title: string; href: string; description: string }[] = [
   },
 ]
 
-export function NavigationMenuPage() {
+export const NavigationMenuPage = () => {
   return (
     <NavigationMenu>
       <NavigationMenuList>
@@ -89,9 +88,9 @@ export function NavigationMenuPage() {
           </NavigationMenuContent>
         </NavigationMenuItem>
         <NavigationMenuItem>
-          <Link href='/' legacyBehavior passHref>
+          <Link href='/analytics' legacyBehavior passHref>
             <NavigationMenuLink className={navigationMenuTriggerStyle()}>
-              Activity
+              Analytics
             </NavigationMenuLink>
           </Link>
         </NavigationMenuItem>
@@ -111,7 +110,7 @@ interface ListItemProps {
   className?: string
   title: string
   href: string
-  children: React.ReactNode
+  children: ReactNode
 }
 
 const ListItem = ({ className, title, children, href }: ListItemProps) => {

diff --git a/src/components/UserNav.tsx → ...components/navigation/user-navigation.tsx b/src/components/UserNav.tsx → ...components/navigation/user-navigation.tsx
@@ -2,8 +2,8 @@
 
 import { Avatar, AvatarFallback, AvatarImage } from '@radix-ui/react-avatar'
 
-import { ThemeRadioGroup } from './theme/theme-radio-group'
-import { Button } from './ui/button'
+import { ThemeRadioGroup } from '../theme/theme-radio-group'
+import { Button } from '../ui/button'
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -16,9 +16,9 @@ import {
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
-} from './ui/dropdown-menu'
+} from '../ui/dropdown-menu'
 
-export function UserNav() {
+export const UserNavigation = () => {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>

diff --git a/src/app/analytics/page.tsx → src/components/pages/analytics.tsx b/src/app/analytics/page.tsx → src/components/pages/analytics.tsx
@@ -1,8 +1,8 @@
-import AnalyticsDashboard from '@/components/AnalyticsDashboard'
+import AnalyticsDashboard from '@/components/analytics-dashboard'
 import { getDate } from '@/utils'
 import { analytics } from '@/utils/analytics'
 
-const Page = async () => {
+export const Analytics = async () => {
   const TRACKING_DAYS = 7
 
   const pageviews = await analytics.retrieveDays('pageview', TRACKING_DAYS)
@@ -74,5 +74,3 @@ const Page = async () => {
     </div>
   )
 }
-
-export default Page
diff --git a/src/app/blog/page.tsx → src/components/pages/blogs.tsx b/src/app/blog/page.tsx → src/components/pages/blogs.tsx
@@ -8,15 +8,7 @@ import {
 import { getSortedBlogPosts } from '@/lib/blog'
 import Link from 'next/link'
 
-export function generateMetadata() {
-  return {
-    title: 'Blog',
-    description: '',
-    keywords: [],
-  }
-}
-
-export default async function Blogs() {
+export const Blogs = async () => {
   const blogPosts = await getSortedBlogPosts()
   return (
     <>