Snippets. #

I setup this """guide""" because I'm prone to forgetting important things. 😛

[https://github.com/PierBover/prosemirror-cookbook](Prosemirror Cookbook)

Use Hono #

Please, import import Hono from '@/lib/hono'; instead of regular Hono! It works the same, but it's configured to work with (e.g) c.get('user') without annoying type checking errors.

Also use zValidator from '@/lib/zod' instead of the usual zValidator, since it does not send the proper custom errors, and they're really ugly.

Bundle typescript code #

Easy! Write code in /src/client/{module-name}/index.ts (index.ts being the entrypoint) and then it'll be available at /bundles/{module-name}/index.js.

Then import with

<script type="module" src="/bundles/{module-name}/index.js"></script>

Goes inside an .eta template.

<% block("header", () => { %>
<script defer src="/static/js/tooltip.js"></script>
<link rel="stylesheet" href="/static/css/tooltip.css">
<% }) %>

<div class="tooltip-container">Hover me<div class="tooltip">I'm a tooltip!</div></div>

Make a button red. #

<button warning>I'm DANGEROUS.</button>

Authentication middleware. #

Add the following import: import { redirect_if_auth } from '@/middleware/redirect';

To keep authenticated users out: redirect_if_auth("(TARGET)", true);
To keep unauthenticated users out: redirect_if_auth("(TARGET)", false);
To request authenticated user data:
- Add the following import: import { session_auth } from '@/middleware/authenticated';
- Use app.use(session_auth);

Errors #

Whenever you want to tell the user something went wrong, redirect to any page and add

return c.redirect(`/?error=${error.name}`);

to render it on their end with a nice message.

Base64 encode and decode inside eta. #

<% utils.btoa(string-here) %> <!-- To Base64 -->
<% utils.atob(base64-here) %> <!-- From Base64 -->