Luke Jones

lukeonline - commit a4555a6

feat: new code container componenta4555a6d548a65eb6cef3cd571baae8565fcde15LukeJ<luke.jones.2567@gmail.com>2026-09-29T21:48:21+01:00
diff --git a/src/components/CodeContainer.astro b/src/components/CodeContainer.astro new file mode 100644 index 0000000..9664580 --- /dev/null +++ b/src/components/CodeContainer.astro @@ -0,0 +1,8 @@ +--- +const { ...props } = Astro.props +--- + +<div + class="flex flex-col rounded-sm p-2 ring inset-shadow-sm ring-gray-600 inset-shadow-gray-400 font-mono text-sm whitespace-pre-line"> + {props.code} +</div> diff --git a/src/lib/repos.ts b/src/lib/repos.ts index 092dd94..acbdd70 100644 --- a/src/lib/repos.ts +++ b/src/lib/repos.ts @@ -54,3 +54,9 @@ export function getFile(name: string, encodedPath: string) { return JSON.parse(fs.readFileSync(file, 'utf-8')) } + +export function getFileByPath(name: string, filePath: string) { + const encodedPath = Buffer.from(filePath, 'utf-8').toString('base64url') + + return getFile(name, encodedPath) +} diff --git a/src/pages/projects/[name].astro b/src/pages/projects/[name].astro index c74f801..ff9ec26 100644 --- a/src/pages/projects/[name].astro +++ b/src/pages/projects/[name].astro @@ -2,8 +2,9 @@ import Base from '../../layouts/Base.astro' import { getCollection } from 'astro:content' -import { getCommits, getTree } from '../../lib/repos' +import { getFileByPath, getTree } from '../../lib/repos' import { BUTTON_STYLING_SHARED } from '../../consts.ts' +import CodeContainer from '../../components/CodeContainer.astro' export async function getStaticPaths() { const repos = await getCollection('repos') @@ -21,22 +22,38 @@ export async function getStaticPaths() { const { repo } = Astro.props const tree = getTree(repo.data.name) + +function getReadMeContent() { + const readme = tree.find( + (file) => file.path.toLowerCase() === 'readme.md', + ) + + if (!readme) { + return '' + } + + const file = getFileByPath( + repo.data.name, + readme.path, + ) + + return file.binary ? '' : file.content +} --- <Base title={repo.data.name}> <div class="flex flex-row items-baseline gap-2"> <code class="text-sm">{repo.data.defaultBranch}</code> - <a class={BUTTON_STYLING_SHARED + ' h-8 p-1 pl-2 items-center gap-3'} href={`/projects/${repo.data.name}/commits`}>{repo.data.commitCount} commits</a> - </div> - <div class="flex flex-col ring ring-gray-600 rounded-sm p-2 inset-shadow-sm inset-shadow-gray-400"> - { - tree.map((file) => ( - <a href={`/projects/${repo.data.name}/files/${file.path}`} - class='p-3px px-1' - > - {file.path} - </a> - )) - } + <a + class={BUTTON_STYLING_SHARED + ' h-8 p-1 pl-2 items-center gap-3'} + href={`/projects/${repo.data.name}/commits`} + >{repo.data.commitCount} commits</a + > + <a + class={BUTTON_STYLING_SHARED + ' h-8 p-1 pl-2 items-center gap-3'} + href={`/projects/${repo.data.name}/files`} + >{tree.length} files</a + > </div> + <CodeContainer code={getReadMeContent()} /> </Base> diff --git a/src/pages/projects/[name]/commits/index.astro b/src/pages/projects/[name]/commits/index.astro index 7608724..10edaa1 100644 --- a/src/pages/projects/[name]/commits/index.astro +++ b/src/pages/projects/[name]/commits/index.astro @@ -18,7 +18,7 @@ const { name } = Astro.params const commits = getCommits(name!) --- -<Base title={`${name} - commits`}> +<Base title={`${name}`}> <table class="w-full"> <tr> <th class="text-left">sha</th>