Elentari Core

Hooks, utilitários e tipagens para centralizar lógicas genéricas

Como Instalar:

yarn add @elentari/core --registry=verdaccio.eurekalabs.com.br

Como Usar:

import { useList } from "@elentari/core";

interface Customer {
  id: number;
  name: string;
  phone: string;
}

const fetcherPessoas = async (
  endpoint: string,
  term: string = "",
  page: number = 0,
  count: number = 10
): Promise<Customer[]> => {
  const response = await fetch(
    `http://localhost:3030/${endpoint}?$term=${term}&$skip=${
      page * count
    }&$limit=${count}`,
    {
      method: "GET",
      headers: {
        Authorization: token,
      },
    }
  );
  return response.json();
};

function AppCustomers() {
  const { data, hasMore, onSearch, onChangeSearch, error, next } =
    useList < Customer > ("customers-search", fetcherPessoas);
  const classes = useStyles();
  const handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => {
    if (event.key === "Enter") {
      onSearch();
    }
  };

  return (
    <div className={classes.app}>
      <Grid container spacing={2} direction="column">
        <Grid item>
          <Typography variant="h2">Clientes</Typography>
        </Grid>
        <Grid item>
          <TextField
            onChange={(e) => onChangeSearch(e.target.value)}
            onKeyPress={handleKeyPress}
            label="Busca"
            variant="outlined"
          />
        </Grid>
        <Grid item>
          <CustomersTable
            hasMore={hasMore}
            next={next}
            rows={data ? data : []}
          />
        </Grid>
      </Grid>
    </div>
  );
}