Merge pull request #59 from patelvivekdev/development

Development
patelvivekdev · May 7, 2024 · 6989034 · 6989034 · vercel · May 7, 2024
2 parents 078171b + 3fb22a8
commit 6989034
Show file tree

Hide file tree

Showing 17 changed files with 175 additions and 15 deletions.
diff --git a/app/blog/[slug]/page.tsx b/app/blog/[slug]/page.tsx
@@ -129,10 +129,10 @@ export default function Blog({ params }: { params: any }) {
           </div>
           <div className='flex flex-row flex-wrap gap-4 mb-5'>
             {blog.metadata.tags?.map((tag) => (
-              <Link key={tag} href={`/tag/${tag}`}>
+              <Link key={tag} href={`/tag/${tag.toLowerCase()}`}>
                 <Button
                   variant='outline'
-                  className='cursor-pointer text-lg font-semibold border border-2 border-indigo-500 hover:underline'
+                  className='cursor-pointer text-lg font-semibold border-2 border-indigo-500 hover:underline'
                 >
                   {tag}
                 </Button>

diff --git a/app/layout.tsx b/app/layout.tsx
@@ -65,7 +65,9 @@ export default function RootLayout({
   return (
     <html lang='en' suppressHydrationWarning>
       <head>
-        <Script defer src='https://us.umami.is/script.js' data-website-id='aa7603cb-3e5d-474c-b1a5-f92e18751e5c' />
+        {process.env.APP_ENV !== 'development' && (
+          <Script defer src='https://us.umami.is/script.js' data-website-id='aa7603cb-3e5d-474c-b1a5-f92e18751e5c' />
+        )}
       </head>
       <body className={cn('mx-auto font-sans antialiased bg-neutral-100 dark:bg-neutral-900 ', fontSans.variable)}>
         <ThemeProvider attribute='class' defaultTheme='system' enableSystem={true} disableTransitionOnChange>
@@ -75,8 +77,12 @@ export default function RootLayout({
           <ThemeToggle />
           <Toaster position='top-right' />
           <Footer />
-          <Analytics />
-          <SpeedInsights />
+          {process.env.APP_ENV !== 'development' && (
+            <>
+              <Analytics />
+              <SpeedInsights />
+            </>
+          )}
         </ThemeProvider>
       </body>
     </html>

diff --git a/app/projects/[slug]/page.tsx b/app/projects/[slug]/page.tsx
@@ -115,10 +115,10 @@ export default function Project({ params }: { params: any }) {
         </div>
         <div className='flex flex-row flex-wrap gap-4 mb-5'>
           {project.metadata.tags?.map((tag) => (
-            <Link key={tag} href={`/tag/${tag}`}>
+            <Link key={tag} href={`/tag/${tag.toLowerCase()}`}>
               <Button
                 variant='outline'
-                className='cursor-pointer text-lg font-semibold border border-2 border-indigo-500 hover:underline'
+                className='cursor-pointer text-lg font-semibold border-2 border-indigo-500 hover:underline'
               >
                 {tag}
               </Button>

diff --git a/app/snippet/[slug]/page.tsx b/app/snippet/[slug]/page.tsx
@@ -124,10 +124,10 @@ export default function Blog({ params }: { params: any }) {
           </div>
           <div className='flex flex-row flex-wrap gap-4 mb-5'>
             {snippet.metadata.tags?.map((tag) => (
-              <Link key={tag} href={`/tag/${tag}`}>
+              <Link key={tag} href={`/tag/${tag.toLowerCase()}`}>
                 <Button
                   variant='outline'
-                  className='cursor-pointer text-lg font-semibold border border-2 border-indigo-500 hover:underline'
+                  className='cursor-pointer text-lg font-semibold border-2 border-indigo-500 hover:underline'
                 >
                   {tag}
                 </Button>

diff --git a/app/tag/[slug]/page.tsx b/app/tag/[slug]/page.tsx
@@ -0,0 +1,75 @@
+import { getBlogByTag } from '@/lib/get-blogs';
+import { getProjectsByTag, getAllProjectsTags } from '@/lib/get-projects';
+import { getSnippetsByTag } from '@/lib/get-snippets';
+import Link from 'next/link';
+import { notFound } from 'next/navigation';
+
+export function generateStaticParams() {
+  const projectTags = getAllProjectsTags();
+
+  const tags = Object.keys(projectTags);
+  return tags.map((tag) => ({ slug: tag }));
+}
+
+export default function TagPage({ params }: { params: any }) {
+  const blogs = getBlogByTag(params.slug);
+
+  const projects = getProjectsByTag(params.slug);
+
+  const snippets = getSnippetsByTag(params.slug);
+
+  if (blogs.length === 0 && projects.length === 0 && snippets.length === 0) return notFound();
+
+  return (
+    <section className='min-h-screen mt-16 sm:mt-40 w-11/12 sm:w-3/4 mx-auto gap-4 mb-5'>
+      <h1 className='text-3xl font-bold text-center border-b-4 pb-4 mb-5'>
+        Found {blogs.length} blogs, {projects.length} projects, and {snippets.length} snippets with tag{' '}
+        <span className='text-indigo-500'>{params.slug}</span>
+      </h1>
+
+      <div className='flex flex-col gap-4'>
+        {blogs.length > 0 && (
+          <>
+            <h2 className='text-2xl font-bold'>Blogs</h2>
+            {blogs.map((blog) => (
+              <div key={blog.slug} className='flex flex-col gap-2 border rounded-md p-4'>
+                <Link href={`/blog/${blog.slug}`}>
+                  <h3 className='text-xl font-bold'>{blog.metadata.title}</h3>
+                </Link>
+                <p>{blog.metadata.summary}</p>
+              </div>
+            ))}
+          </>
+        )}
+
+        {projects.length > 0 && (
+          <>
+            <h2 className='text-2xl font-bold'>Projects</h2>
+            {projects.map((project) => (
+              <div key={project.slug} className='flex flex-col gap-2 border rounded-md p-4'>
+                <Link href={`/projects/${project.slug}`}>
+                  <h3 className='text-xl font-bold'>{project.metadata.title}</h3>
+                </Link>
+                <p>{project.metadata.description}</p>
+              </div>
+            ))}
+          </>
+        )}
+
+        {snippets.length > 0 && (
+          <>
+            <h2 className='text-2xl font-bold'>Snippets</h2>
+            {snippets.map((snippet) => (
+              <div key={snippet.slug} className='flex flex-col gap-2 border rounded-md p-4'>
+                <Link href={`/snippet/${snippet.slug}`}>
+                  <h3 className='text-xl font-bold'>{snippet.metadata.title}</h3>
+                </Link>
+                <p>{snippet.metadata.description}</p>
+              </div>
+            ))}
+          </>
+        )}
+      </div>
+    </section>
+  );
+}
diff --git a/app/tag/page.tsx b/app/tag/page.tsx
@@ -0,0 +1,27 @@
+import { Button } from '@/components/ui/button';
+import { getAllProjectsTags } from '@/lib/get-projects';
+import Link from 'next/link';
+
+export default function TagsPage() {
+  const projectTags = getAllProjectsTags();
+  // console.log(projectTags.)
+  // get all keys
+
+  const tags = Object.keys(projectTags);
+
+  tags.sort((a, b) => projectTags[b].count - projectTags[a].count);
+
+  return (
+    <section className='h-screen mt-16 sm:mt-40 w-11/12 sm:w-3/4 mx-auto'>
+      <div className='flex flex-row flex-wrap gap-4 mb-5'>
+        {tags.map((tag) => (
+          <Link key={tag} href={`/tag/${tag.toLowerCase()}`}>
+            <Button variant='outline' className='cursor-pointer text-lg font-semibold border-2 border-indigo-500 hover:underline'>
+              {tag} ({projectTags[tag].count})
+            </Button>
+          </Link>
+        ))}
+      </div>
+    </section>
+  );
+}
diff --git a/bun.lockb b/bun.lockb
diff --git a/components/navbar/Navbar.tsx b/components/navbar/Navbar.tsx
@@ -5,6 +5,7 @@ const links = [
   { link: '/', name: 'Home' },
   { link: '/projects', name: 'Projects' },
   { link: '/blog', name: 'Blogs' },
+  { link: '/tag', name: 'Tags' },
   { link: '/snippet', name: 'Snippets' },
   { link: '/contact', name: 'Contact' },
 ];

diff --git a/content/blogs/server-actions.mdx b/content/blogs/server-actions.mdx
@@ -3,7 +3,7 @@ title: 'A Deep Dive To Next.js 14 Server Actions'
 summary: 'Harness the power of Next.js 14 Server Actions for streamlined data fetching and mutations in your Nextjs applications.'
 slug: 'server-actions'
 publishedAt: 'April 13, 2024'
-tags: [NextJs, React, Server Actions, Data Fetching, Mutations, Server Components, JavaScript, TypeScript]
+tags: [NextJs, React, Server-Actions, Data-Fetching, Mutations, Server-Components, JavaScript, TypeScript]
 published: true
 ---
 

diff --git a/content/projects/acme-auth.mdx b/content/projects/acme-auth.mdx
@@ -4,6 +4,7 @@ description: 'Discover how Acme Auth, a robust full-stack authentication system
 slug: 'acme-auth'
 publishedAt: 'April 03, 2024'
 tags: [NextJs, React, Express, MongoDB, JWT, TypeScript, Zod, ShadcnUI, AcertinityUI]
+published: true
 ---
 
 ## Acme Auth

diff --git a/content/projects/market-hub.mdx b/content/projects/market-hub.mdx
@@ -4,6 +4,7 @@ description: 'Market-hub is a MERN-powered platform for buying and selling compu
 publishedAt: 'April 01, 2024'
 slug: 'market-hub'
 tags: [MERN, React, Redux, Nodejs, Express, MongoDB, FullStack]
+published: true
 ---
 
 ## Market hub

diff --git a/content/projects/nextjs-blog.mdx b/content/projects/nextjs-blog.mdx
@@ -3,7 +3,7 @@ title: 'Next.js 14 Blog with App Router and MDX'
 description: 'Explore a Next.js 14 project demonstrating the new App Router, server actions, and MDX integration for streamlined blog creation.'
 slug: 'nextjs-blog'
 publishedAt: 'April 12, 2024'
-tags: [NextJs, React, MDX, App Router, Server Components, Server Actions, Blog]
+tags: [NextJs, React, MDX, App-Router, Server-Components, Server-Actions, Blog]
 published: true
 ---
 

diff --git a/content/projects/true-feedback.mdx b/content/projects/true-feedback.mdx
@@ -3,7 +3,7 @@ title: 'True Feedback - Where your identity remains a secret'
 description: 'Explore a Next.js 14 project that dive into the World of Anonymous Feedback.'
 slug: 'true-feedback'
 publishedAt: 'May 04, 2024'
-tags: [NextJs, Server Actions, Supabase, Next-Auth]
+tags: [NextJs, Server-Actions, Supabase, Next-Auth]
 published: true
 ---
 

diff --git a/lib/get-blogs.ts b/lib/get-blogs.ts
@@ -67,3 +67,12 @@ export function getLatestBlogs() {
 }
 
 export default getBlogs;
+
+export function getBlogByTag(tag: string) {
+  let blogs = getBlogs();
+  blogs = blogs.filter((blog) => blog.metadata && blog.metadata.published === true);
+  const filteredBlogs = blogs.filter(
+    (blog) => blog.metadata.tags!.filter((t) => t.toLowerCase() === tag.toLowerCase()).length > 0,
+  );
+  return filteredBlogs;
+}
diff --git a/lib/get-projects.ts b/lib/get-projects.ts
@@ -56,3 +56,34 @@ export function getLatestProjects() {
   });
   return sortedProjects.slice(0, 4);
 }
+
+export function getAllProjectsTags() {
+  const projects = getProjects();
+
+  const tags: Record<string, { projects: string[]; count: number }> = {};
+  projects.forEach((project) => {
+    project.metadata.tags!.forEach((tag) => {
+      tag = tag.trim();
+      tag = tag.toLowerCase();
+      if (!tags[tag]) {
+        tags[tag] = {
+          projects: [],
+          count: 0,
+        };
+      }
+      tags[tag].projects.push(project.slug);
+      tags[tag].count++;
+    });
+  });
+
+  return tags;
+}
+
+export function getProjectsByTag(tag: string) {
+  let projects = getProjects();
+  projects = projects.filter((project) => project.metadata && project.metadata.published === true);
+  const filteredProjects = projects.filter(
+    (project) => project.metadata.tags!.filter((t) => t.toLowerCase() === tag.toLowerCase()).length > 0,
+  );
+  return filteredProjects;
+}
diff --git a/lib/get-snippets.ts b/lib/get-snippets.ts
@@ -46,3 +46,12 @@ export function getSnippet(slug: string) {
 }
 
 export default getSnippets;
+
+export function getSnippetsByTag(tag: string) {
+  let snippets = getSnippets();
+  snippets = snippets.filter((snippet) => snippet.metadata && snippet.metadata.published === true);
+  const filteredSnippets = snippets.filter(
+    (snippet) => snippet.metadata.tags!.filter((t) => t.toLowerCase() === tag.toLowerCase()).length > 0,
+  );
+  return filteredSnippets;
+}
diff --git a/package.json b/package.json
@@ -13,8 +13,8 @@
   },
   "dependencies": {
     "@fec/remark-a11y-emoji": "^4.0.2",
-    "@next/bundle-analyzer": "14.3.0-canary.39",
-    "@next/eslint-plugin-next": "14.3.0-canary.39",
+    "@next/bundle-analyzer": "14.3.0-canary.44",
+    "@next/eslint-plugin-next": "14.3.0-canary.44",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-slot": "^1.0.2",
@@ -25,7 +25,7 @@
     "clsx": "^2.1.0",
     "gray-matter": "^4.0.3",
     "lucide-react": "^0.373.0",
-    "next": "14.3.0-canary.39",
+    "next": "14.3.0-canary.44",
     "next-mdx-remote": "^4.4.1",
     "next-themes": "^0.3.0",
     "react": "18.2.0",