@ipr/nexus-list-applet v1.0.0

@ipr/nexus-list-applet

Nexus List API between Nexus Bridge and React components w/ state container

Development

yarn
yarn build

Installation

yarn add @ipr/nexus-list-applet

Usage

import * as React from 'react'
import { FormValues } from '@ipr/nexus-form-state'
import { useListApplet } from '@ipr/nexus-list-applet'

interface FormProps {
  appletName: string
}

const ListApplet: React.FunctionComponent<FormProps> = ({ appletName }) => {
  const [
    listApi,
    listState,
    currentPage,
    currentPosition,
    isLoading
  ] = useListApplet(appletName)

  const { gotoPage, setPosition } = listApi

  return React.useMemo(
    () =>
      !isLoading && (
        <table>
          {listState.map((rec: FormValues, idx) => (
            <tr onClick={() => setPosition(idx)}>
              <td>{rec['Id']}</td>
              <td>{rec['Description']}</td>
            </tr>
          ))}
        </table>
      ),
    [currentPage, currentPosition, listState, setPosition]
  )
}

References

• @ipr/nexus-list-applet