Sha256: 415256a8070fb37d055c670d73500737e3daca057951aa2698d4731954b92c11

Contents?: true

Size: 1.7 KB

Versions: 1

Compression:

Stored size: 1.7 KB

Contents

import { Head, Link } from '@inertiajs/react'
import { Fragment } from 'react'
import <%= inertia_component_name %> from './<%= inertia_component_name %>'
import { <%= inertia_model_type %> } from './types'

interface IndexProps {
  <%= plural_table_name %>: <%= inertia_model_type %>[]
  flash: { notice?: string }
}

export default function Index({ <%= plural_table_name %>, flash }: IndexProps) {
  return (
    <>
      <Head title="<%= human_name.pluralize %>" />
      <div className="mx-auto md:w-2/3 w-full px-8 pt-8">
        {flash.notice && (
          <p className="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block">
            {flash.notice}
          </p>
        )}
        <div className="flex justify-between items-center">
          <h1 className="font-bold text-4xl"><%= human_name.pluralize %></h1>
          <Link
            href="<%= js_new_resource_path %>"
            className="rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium"
          >
            New <%= human_name.downcase %>
          </Link>
        </div>

        <div className="min-w-full">
          {<%= plural_table_name %>.map((<%= singular_table_name %>) => (
            <Fragment key={<%= singular_table_name %>.id}>
              <<%= inertia_component_name %> <%= singular_table_name %>={<%= singular_table_name %>} />
              <p>
                <Link
                  href={`<%= js_resource_path %>`}
                  className="ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium"
                >
                  Show this <%= human_name.downcase %>
                </Link>
              </p>
            </Fragment>
          ))}
        </div>
      </div>
    </>
  )
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
inertia_rails-3.5.0 lib/generators/inertia_tw_templates/scaffold/templates/react/Index.tsx.tt