init blogs

Seistart · Feb 26, 2024 · 67f88cb · 67f88cb
1 parent 35690c6
commit 67f88cb
Show file tree

Hide file tree

Showing 15 changed files with 2,144 additions and 30 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -24,9 +24,11 @@
     "clsx": "^2.1.0",
     "cmdk": "^0.2.1",
     "date-fns": "^3.3.1",
+    "gray-matter": "^4.0.3",
     "gsap": "^3.12.5",
     "lucide-react": "^0.323.0",
     "next": "14.1.0",
+    "next-mdx-remote": "^4.4.1",
     "next-themes": "^0.2.1",
     "react": "^18",
     "react-country-flag": "^3.1.0",

diff --git a/src/app/blog/[slug]/page.tsx b/src/app/blog/[slug]/page.tsx
@@ -0,0 +1,51 @@
+import { MDX } from "@/components/markdown/mdx";
+import { Button } from "@/components/ui/button";
+import { getBlogPostByName, getSortedBlogPosts } from "@/lib/blog";
+import Link from "next/link";
+import { notFound } from "next/navigation";
+
+const getBlogPost = async (slug: string) => {
+  const blogPost = await getBlogPostByName(slug);
+  if (!blogPost) {
+    notFound();
+  }
+  return blogPost;
+};
+
+export async function generateStaticParams() {
+  const blogPosts = await getSortedBlogPosts();
+  return blogPosts.map((post) => ({
+    slug: post.id,
+  }));
+}
+
+export async function generateMetadata({
+  params,
+}: {
+  params: { slug: string };
+}) {
+  const blogPost = await getBlogPost(params.slug);
+  return {
+    title: blogPost.title,
+    description: blogPost.description,
+    keywords: blogPost.keywords,
+  };
+}
+
+export default async function BlogPost({
+  params,
+}: {
+  params: { slug: string };
+}) {
+  const { markdown } = await getBlogPost(params.slug);
+  return (
+    <div className="container">
+      <Link href="/blog">
+        <Button variant="link" className="pl-0 mb-4 justify-start">
+          Back
+        </Button>
+      </Link>
+      <MDX markdown={markdown}></MDX>
+    </div>
+  );
+}
diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
@@ -0,0 +1,40 @@
+import {
+  Card,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import { getSortedBlogPosts } from "@/lib/blog";
+import Link from "next/link";
+
+export function generateMetadata() {
+  return {
+    title: "Blog",
+    description: "",
+    keywords: [],
+  };
+}
+
+export default async function Blogs() {
+  const blogPosts = await getSortedBlogPosts();
+  return (
+    <>
+      <ul>
+        {blogPosts.map((post) => (
+          <Link href={`blog/${post.id}`} key={post.id}>
+            <li className="my-4">
+              <Card>
+                <CardHeader>
+                  <CardTitle>{post.title}</CardTitle>
+                  <CardDescription>{post.description}</CardDescription>
+                </CardHeader>
+                <CardFooter>{post.date}</CardFooter>
+              </Card>
+            </li>
+          </Link>
+        ))}
+      </ul>
+    </>
+  );
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -19,7 +19,7 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="en">
+    <html lang="en" suppressHydrationWarning>
       <body className={cn(spaceGrotesk.className)}>
         <ThemeProvider
           attribute="class"

diff --git a/src/blogs/posts/mock-block-1.md b/src/blogs/posts/mock-block-1.md
@@ -0,0 +1,61 @@
+---
+title: "Mock Blog 1"
+description: "Mock Blog"
+keywords: ["blog"]
+date: "2020-01-01"
+---
+
+# Tibi invictumque plenaque dominam
+
+## Foedus anticipata demptos meorum obtulit per viridi
+
+Lorem markdownum solis socerque secundo, delubraque postquam disiecit. Et perque
+ingens tardus, ignotos inde. Vulnera _pronuba_: ore
+[medii](http://avesregia.com/sanguine.aspx) ait coniuge amantem arduus
+inaequales infelix. Templis **non** habuit illum, ut sanguine **humus laudis
+easdem** genitorem arduus lingua; num subit, magis.
+
+Raptusque ceu ad Tritonidos paulum. Tot [tuis
+rimis](http://www.quas.com/ut-istis).
+
+## In tempus heros Oceano magna
+
+Quam carnes, descendere passim regnaque purpureo de vinoque Pleias, blanditias
+nudos ad nullo. Precantum obstipuit umeros _biformis_: egerit columbas: silva
+potius vertice.
+
+## Generi iactura
+
+Cum vocant illis mea divum caelo aversa, viri creaverat oscula de unus habes,
+edidit expetit dilapsa; in! Nota estis; inducere ab herbas et illos corpore
+everberat sed. Sed est soluti sinuatur Glaucus vibrata nunc patrii? Nec per
+tanti et captantia medicamine illuc tulit stant non deducentia. Chaos bene eheu
+quod reverentia rivus, pudibundaque metuens.
+
+1. Illis et flamma At pendent abstulit attulit
+2. Percussaque seque facere si est ore solidas
+3. Imbrem Hippotades fecisti cunctisque silvas vidit
+4. Esse huic iubet in lacu cum qua
+5. Lassavit caterva virili
+6. Posita votis leones turbamque annos generis nympharum
+
+## Donis et mora dempto hominumque
+
+Olentia litora ad loquendi parvum gelidi tenenti opes pan, _ferre primo_, citius
+obliquos. Neque iam opem nam. Loca quater, demunt mare sua habebat inpius
+discedite pectore tantum naturae invidia conscia: accepere [praedam
+dixit](http://triplicis.net/nymphaesanguis.html) capillis! Plura ornat ut
+insolida fossa vix, non iam ipsisque **agitabitur** cornua et sanguis: petit
+deque, vellem?
+
+- Quo actis sensisse tremescere redit studiisque nardi
+- Saxificos movebo praemiaque parsque
+- Vultus et rediere loqui
+- Oras ponunt
+- Pastoris quot
+- Ora collesque
+
+Tyrioque iam usque bracchia cruentior collocat mentisque praesagaque montes, **a
+Cecropidae**, dare, omne. Putatis timentia et indignamque humus Dauno simulat,
+**in crimen** Triones. Marmoreis hospes saxeus, solidis utinam Phrygiaeque
+temporis; care quoniam.
diff --git a/src/blogs/posts/mock-block-2.md b/src/blogs/posts/mock-block-2.md
@@ -0,0 +1,67 @@
+---
+title: "Mock Blog 2"
+description: "Mock Blog 2"
+keywords: ["blog"]
+date: "2020-01-02"
+---
+
+# Coniuge praesagaque repetit Phrygios missa spes remotam
+
+## Narretque gramine Gorgone figuram
+
+Lorem markdownum: arcuerat, at pectus ex praedae ibi tegit alas. Idque
+immaduisse et fata gelidos voto.
+
+> Vides exul truncos Cepheus; non hoc _Mercurium alipedum defendit_ an illi non
+> tardius quid. Ergo Danaen, et Chaoque illa herbas Lyncestius fortes, hostem
+> dies quo agmen diligitur. Opemque in aethera caesa similem, erat adlevat
+> Phoebus; ne haec amplexas; quoque. Pro Aonidum queri, differt, a tandem
+> Semiramis fugisse! Et nondum secuta, **Et** alta.
+
+Caput manus: plus non, tibi fugat ursos; dis profugam magnique coniunx [Abarin
+ab](http://mergit-auras.io/) veram relinquet mortalia alienaque. Abunde nec,
+Bacchica Indigetes ira vixque bella plurima, crudelis et validisne coegi.
+
+## Seducta pabula calidusque tempto
+
+Substiterat squamis. Quae mundo Epopeus obstat protinus agrestes quicquam
+corpore dixit heu, lateo quoque numina atque saxa poscere hoste, sidera.
+Aeolidae plerumque videt te _per_, deorum reparatque **obituque** Seriphon tamen
+alis nec honores et cum queant? Ferrum Latonia. Ut toris sternit.
+
+```
+var native_website = eps_sram_algorithm + kindle(bookmark_ansi);
+drive_hdd(mirroredIct + cd(90));
+zeroLanguage(pramMultimedia + directx, in(type_barebones, byte));
+if (5 != applicationBus.mountHit(lagTutorial, hashtag_transistor_network)) {
+    googlePhreaking = d(commercialPppFirmware, cdma + contextual,
+            characterDramDisk / mp_copyright_programming);
+} else {
+    led_disk(lcd, textMulticastingDisk, hit);
+    port_plug_software -= compressionOs;
+}
+var ipad_gui_dvd = golden_network_template;
+```
+
+Parvo ictu nacta sagittis Capitolia testor, et celeri matrum, Andron pisce
+Pelias ex per non tot. Turni ponderis subito at pennis cauda foret.
+[Trepidat](http://subita-sed.io/socium) unam quarum resupinus suam incisa radice
+vix thyrsos manum iaculum nostro. Sede fatis semper clade oscula, nec ultor des
+coeperunt coronis volucrum denique aetherias reliquit quoque et est esset.
+
+```
+var donationware_system = third_num + wordart + autoresponderSnow(55,
+        uatAixMarket.rootkitNavigation(5, sdsl), twitterOpticCase);
+serverSystem(lunOcr);
+var metafilePmuActive = peopleware(client_ultra(bittorrent), listserv +
+        wheel_tablet + -4, smishing_cold);
+```
+
+Rapidi quae additis caede aut; postulat domo, **ab inesset freta**, Eryx sub;
+non quae percussus Dianae! Iovis aquarum, _motumque veribus_, pro anus simillima
+secutus? Actis fera omnipotens insequitur amnis felix amoris inpleratque orbem
+differt enim _orbe solvit_ parvus nimiumque velatae fragor? Correptus et victa
+requirit [altissimus atque](http://intus.io/), Elymumque super quisquam velocius
+attonitamque stant insuperabile quid, veteres? Via _passim_ et est amori
+obsessa, cucurri praerupit **flammaeque flamma**, arbitrio altissimus super
+patriumque.
diff --git a/src/components/Body.tsx b/src/components/Body.tsx
@@ -108,9 +108,7 @@ export const Body = () => {
 
       <div className="flex justify-between items-end">
         <h1 className="text-2xl font-bold mb-3">Highlights</h1>
-        <Button variant="white" className="w-14 font-bold">
-          All
-        </Button>
+        <Button className="w-14 font-bold">All</Button>
       </div>
       <CardComponent
         title="Anthropomorphic Cats"
@@ -127,9 +125,7 @@ export const Body = () => {
 
       <div className="flex justify-between items-end">
         <h1 className="text-2xl font-bold mb-3">Discover</h1>
-        <Button variant="white" className="w-14 font-bold">
-          All
-        </Button>
+        <Button className="w-14 font-bold">All</Button>
       </div>
       <ImageSlider />
     </div>

diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx
@@ -100,7 +100,7 @@ export function NavigationMenuPage() {
           </Link>
         </NavigationMenuItem>
         <NavigationMenuItem>
-          <Link href="/" legacyBehavior passHref>
+          <Link href="/blog" legacyBehavior passHref>
             <NavigationMenuLink className={navigationMenuTriggerStyle()}>
               Blog
             </NavigationMenuLink>