There were a few places where the compiled down JS to Imba was a bit hard. But when it got tricky I could just compile that single file and see the results. Overall it was pretty straight forward but also my app is pretty simple.

And here is one of the components:

import supabase, { UNIQUE_VIOLATION_CODE } from '../constants' import normalizeUrl from 'normalize-url' import './links-list'

tag pad-page

  loading = false
  links
  err\string
  newUrl\string

  def routed
    fetchLinks!


  def fetchLinks
    loading = true

    let {data, error} = await supabase.rpc('select_links_from_pad', { pad_id_input: route.params.id })
      .order('created_at', {ascending: false})

    loading = false

    if error
      log error.message
      return

    links = data
    imba.commit!

  def addLink
    if newUrl
      const {data, error} = await supabase.rpc('insert_link_into_pad', {
        pad_id_input: route.params.id,
        url_input: normalizeUrl(newUrl, {defaultProtocol: 'https:'})
      })

      if error..code == UNIQUE_VIOLATION_CODE
        err = 'link already added'
        setTimeout(&, 3000) do
          err = ''
          imba.commit!
      elif error
        return

      newUrl = ''
      links.unshift(data)

  <self>
    <div[mt:5]>
      <label[mr:3]> 'add a link'
      <input
        [bg:red4 c:white]=err
        type='url'
        bind=newUrl
        @keydown.enter=addLink
      >
      <button[ml:1] @click=addLink> 'Add'
      if err
        <p[c:red5]> err

    <links-list loading=loading links=links>