tcurdt Posts - Answer Overflow

tcurdt

Explore posts from servers

CDCloudflare Developers HHono DTDrizzle Team

•Created by tcurdt on 5/24/2024 in #help

[solved] HtmlEscapedString not rendering?

When I have this function

import { HtmlEscapedString } from 'hono/utils/html'

async function render (c): Promise<HtmlEscapedString> {
  return c.html(<button>FOO</button>)
}

import { HtmlEscapedString } from 'hono/utils/html'

async function render (c): Promise<HtmlEscapedString> {
  return c.html(<button>FOO</button>)
}

Why would this not render?

.get('/', async (c) => {
  return c.html(
    <BaseLayout>
      button: {await render(c)}
    </BaseLayout>
  )

.get('/', async (c) => {
  return c.html(
    <BaseLayout>
      button: {await render(c)}
    </BaseLayout>
  )

3 replies

HHono

•Created by tcurdt on 5/24/2024 in #help

validating arrays coming from forms

The following code works

<form
  action='?'
  hx-delete='foo'
  hx-target='#list'
>
  <ul>
  {state.foo.map(item => (
      <li
        id={`foo-${item.id}`}
        key={item.id}>

        {item.name} ({item.id})

        <input type='checkbox' name="foo[]" value={item.id} />
      </li>
  ))}
  </ul>

  <button type='submit' name='delete'>Delete Selected</button>
</form>


.delete('/foos', zValidator('form', z.object({
    'foos[]': z.coerce.number().array(),
    delete: z.string().optional()
  })), async (c) => {
    const { 'foos[]': foos } = c.req.valid('form')

<form
  action='?'
  hx-delete='foo'
  hx-target='#list'
>
  <ul>
  {state.foo.map(item => (
      <li
        id={`foo-${item.id}`}
        key={item.id}>

        {item.name} ({item.id})

        <input type='checkbox' name="foo[]" value={item.id} />
      </li>
  ))}
  </ul>

  <button type='submit' name='delete'>Delete Selected</button>
</form>


.delete('/foos', zValidator('form', z.object({
    'foos[]': z.coerce.number().array(),
    delete: z.string().optional()
  })), async (c) => {
    const { 'foos[]': foos } = c.req.valid('form')

But it feels a little clunky. Is there a nicer way of doing this?

1 replies

HHono

•Created by tcurdt on 5/24/2024 in #help

[solved] return type of request handler

Why is 1) is fine and 2) has a type problem? 1)

  .get('/foo', async (c) => {
    return await c.html(<body/>)
  })

  .get('/foo', async (c) => {
    return await c.html(<body/>)
  })

  .get('/bar', async (c) => {
    return await render(c)
  })

  async function render(c) : Promise<HtlEscapedString> {
    return await c.html(<body/>)
  }

  .get('/bar', async (c) => {
    return await render(c)
  })

  async function render(c) : Promise<HtlEscapedString> {
    return await c.html(<body/>)
  }

I don't see it

8 replies

HHono

•Created by tcurdt on 5/24/2024 in #help

[solved] route param validation with zod

  .delete('/foo/:id', zValidator('param', z.object({
      id: z.number()
    })), async (c) => {
    const { id } = c.req.valid('param')

  .delete('/foo/:id', zValidator('param', z.object({
      id: z.number()
    })), async (c) => {
    const { id } = c.req.valid('param')

This is rejecting /foo/1 - shouldn't this work?

8 replies

Gaming

Programming