elal
/
wych.dev
mirror of https://github.com/almqv/wych.dev
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

stuff

Browse Source
pull/2/head
Elias Almqvist 1 month ago
parent 3d470ccf73
commit 8995c63f4c
No known key found for this signature in database
GPG Key ID: E31A99CE3E75A158
4 changed files with 68 additions and 97 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 60
      src/app/essays/page.tsx
  2. 30
      src/app/essays/route.ts
  3. 23
      src/app/page.tsx
  4. 52
      src/components/layout/nav.tsx

60
src/app/essays/page.tsx
Unescape View File

@ -1,60 +0,0 @@
import fs from 'fs/promises';
import path from 'path';
import matter from 'gray-matter';
import Link from 'next/link';
type PostMeta = {
title: string;
createdAt: string;
slug: string;
};
async function getPosts(): Promise<PostMeta[]> {
const postsDirectory = path.join(process.cwd(), 'content/essays');
const files = await fs.readdir(postsDirectory);
const posts = await Promise.all(
files
.filter(file => file.endsWith('.mdx'))
.map(async (file) => {
const fullPath = path.join(postsDirectory, file);
const fileContents = await fs.readFile(fullPath, 'utf8');
const { data } = matter(fileContents);
return {
title: data.title,
createdAt: data.createdAt,
slug: file.replace(/\.mdx$/, ''),
};
})
);
return posts.sort((a, b) =>
new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
);
}
export default async function PostsPage() {
const posts = await getPosts();
return (
<div className="max-w-prose mx-auto py-8">
<h1 className="text-3xl font-bold mb-8">Essays</h1>
<ul className="space-y-4">
{posts.map((post) => (
<li key={post.slug}>
<Link
href={`/essays/${post.slug}`}
className="block hover:bg-gray-50 p-4 rounded-lg transition"
>
<h2 className="text-xl font-semibold">{post.title}</h2>
<time className="text-sm text-gray-500">
{new Date(post.createdAt).toLocaleDateString()}
</time>
</Link>
</li>
))}
</ul>
</div>
);
}

30
src/app/essays/route.ts
Unescape View File

@ -0,0 +1,30 @@
import { NextResponse } from 'next/server';
import fs from 'fs/promises';
import path from 'path';
import matter from 'gray-matter';
export async function GET() {
const postsDirectory = path.join(process.cwd(), 'content/essays');
const files = await fs.readdir(postsDirectory);
const essays = await Promise.all(
files
.filter(file => file.endsWith('.mdx'))
.map(async (file) => {
const fullPath = path.join(postsDirectory, file);
const fileContents = await fs.readFile(fullPath, 'utf8');
const { data } = matter(fileContents);
return {
title: data.title,
createdAt: data.createdAt,
slug: file.replace(/\.mdx$/, ''),
};
})
);
// Sort essays by creation date, newest first
essays.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
return NextResponse.json(essays);
}

23
src/app/page.tsx
Unescape View File

@ -12,7 +12,7 @@ type PostMeta = {
slug: string;
};
async function getRecentPosts(): Promise<PostMeta[]> {
async function getAllPosts(): Promise<PostMeta[]> {
const postsDirectory = path.join(process.cwd(), 'content/essays');
const files = await fs.readdir(postsDirectory);
@ -32,17 +32,15 @@ async function getRecentPosts(): Promise<PostMeta[]> {
})
);
return posts
.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime())
.slice(0, 4); // Get only the 4 most recent posts
return posts.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
}
export default async function Home() {
const recentPosts = await getRecentPosts();
const posts = await getAllPosts();
return (
<main className="w-full flex justify-center px-4 mt-14">
<div className="w-full max-w-screen-lg md:px-4 py-8 space-y-8">
<div className="w-full max-w-screen-lg lg:px-4 py-8 space-y-8">
{/* Intro */}
<section>
<div className="flex space-x-8 items-center mb-4">
@ -59,7 +57,7 @@ export default async function Home() {
. Building energy-efficient chips for AI training & inference.
</p>
<p>
I'm a dropout, autodidactic polymath, and this is my digital notebook. Everything here is written by me, and everything here is my own opinion or philosophical beliefs. They are not intended to be taken at face value, but rather as a medium for me to personally reflect on my own thoughts as a therapeutic exercise, or just for fun.
I'm a dropout, autodidactic polymath, and this is my digital notebook. Everything here is written by me, and everything here is my own opinion, philosophical beliefs, or just random thoughts that have no real-world application. <span className="italic font-semibold">They are not intended to be taken at face value, but rather as a medium for me to personally reflect on my own thoughts as a therapeutic exercise, or just for fun.</span>
</p>
<p>
Based in the <ILink href="https://en.wikipedia.org/wiki/Silicon_Valley" target="_blank" className="font-bold text-md">Silicon Valley</ILink> (<ILink href="https://en.wikipedia.org/wiki/Bay_Area" target="_blank" className="font-bold text-md">San Francisco Bay Area</ILink>), <ILink href="https://en.wikipedia.org/wiki/United_States" target="_blank" className="font-bold text-md">United States</ILink>. Originally from <ILink href="https://en.wikipedia.org/wiki/M%C3%B6lndal" target="_blank" className="font-bold text-md">Mölndal</ILink>/<ILink href="https://en.wikipedia.org/wiki/Gothenburg" target="_blank" className="font-bold text-md">Gothenburg</ILink>, <ILink href="https://en.wikipedia.org/wiki/Sweden" target="_blank" className="font-bold text-md">Sweden</ILink>.
@ -67,16 +65,11 @@ export default async function Home() {
</div>
</section>
{/* Recent Essays */}
{/* Essays */}
<section>
<div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-semibold">Recent Essays</h2>
<Link href="/essays" className="text-sm text-gray-500 hover:text-gray-700">
View all →
</Link>
</div>
<h2 className="text-xl font-semibold mb-4">Essays</h2>
<ul className="space-y-4">
{recentPosts.map((post) => (
{posts.map((post) => (
<li key={post.slug}>
<Link
href={`/essays/${post.slug}`}

52
src/components/layout/nav.tsx
Unescape View File

@ -17,6 +17,13 @@ import { useRouter } from "next/navigation";
import { useActionCommand } from "@/hooks/useActionCommand";
import { useTheme } from "next-themes";
import NavLinks from "../navlinks";
import { useEffect, useState } from "react";
type Essay = {
title: string;
slug: string;
createdAt: string;
};
type NavCommandProps = {
className?: string;
@ -26,6 +33,16 @@ const NavCommand: React.FC<NavCommandProps> = ({ className, ...props }) => {
const router = useRouter();
const { open: actionOpen, setOpen: setActionOpen } = useActionCommand();
const { theme, setTheme } = useTheme();
const [essays, setEssays] = useState<Essay[]>([]);
useEffect(() => {
const fetchEssays = async () => {
const response = await fetch('/essays');
const data = await response.json();
setEssays(data);
};
fetchEssays();
}, []);
const action = (
callback: ((value: string) => Promise<void>) | ((value: string) => void),
@ -67,30 +84,21 @@ const NavCommand: React.FC<NavCommandProps> = ({ className, ...props }) => {
<span>Home</span>
<CommandShortcut>⌘H</CommandShortcut>
</CommandItem>
<CommandItem
onSelect={action(() => {
router.push("/essays");
})}
>
<GalleryHorizontalEnd className="mr-2 w-4 h-4" />
<span>Essays</span>
<CommandShortcut>⌘P</CommandShortcut>
</CommandItem>
</CommandGroup>
<CommandSeparator />
{/* <CommandGroup heading="Appearance">
<CommandItem
onSelect={action(() => {
setTheme(theme === "light" ? "dark" : "light");
})}
>
<SunMoon className="mr-2 w-4 h-4" />
<span>
Switch to {theme === "light" ? "Dark" : "Light"} Theme
</span>
<CommandShortcut>⌘L</CommandShortcut>
</CommandItem>
</CommandGroup> */}
<CommandGroup heading="Essays">
{essays.map((essay) => (
<CommandItem
key={essay.slug}
onSelect={action(() => {
router.push(`/essays/${essay.slug}`);
})}
>
<GalleryHorizontalEnd className="mr-2 w-4 h-4" />
<span>{essay.title}</span>
</CommandItem>
))}
</CommandGroup>
<CommandSeparator />
<CommandGroup heading="External links">
{NavLinks.map((link) => (

Write Preview
Loading…
Cancel
Save