>

mokhtar

Test post

.tsx code block

import { type ActionArgs, json } from "@remix-run/node";
import { useActionData, useTransition, Form } from "@remix-run/react";
import LabeledTextField from "~/components/labeled-text-field";

export async function action({ request, params }: ActionArgs) {
    return json(null);
};

export default function InviteTeamMember() {
    const errors = useActionData<typeof action>();
    const isSubmitting = useTransition().state === "submitting";

    return (
        <Form method="post">
            <LabeledTextField
                name="email"
                type="text"
                label="Email address"
                error={errors?.email}
                disabled={isSubmitting}
            />
            <Button type="submit" disabled={isSubmitting}>
                Invite team member
            </Button>
        </Form>
    );
}

.ts code block with line highlighting

Not working yet, syntax does not error

import fs from "node:fs";
import fm from "front-matter";

type FrontMatterAttributes = {
    slug: string;
    title: string;
    description: string;
    date: Date;
    published: boolean;
};

export async function getPost(slug: string) {
    if (!fs.existsSync(`./content/${slug}.md`)) {
        return;
    }

    const file = fs.readFileSync(`./content/${slug}.md`, "utf-8");
    const content = fm<FrontMatterAttributes>(file);
    return {
        slug,
        title: content.attributes.title,
        description: content.attributes.description,
        published: content.attributes.published,
        date: content.attributes.date,
        markdown: content.body,
    };
}

.yaml code block with file name

Not working yet, syntax makes the parser throw