@infini-soft/usecrudfactory v0.1.43

🏭 README useCrudFactory

Idiomatic React Hook CRUD SDK Factory.

✨ Features

• Generate CRUD Sdk
• React hook
• Execute multiple stateful operation simultaneously
• Typescript / Javascript
• Very tiny (11k)

📚 Documentation

Get all documentations, examples and execute it directly from our website, the ☕ kitchen! Come cook software :) https://www.kitchen.infini-soft.com/hooks/crudfactory

Getting started

📦 Install

$ npm install @infini-soft/usecrudfactory --save
# or
$ yarn add @infini-soft/usecrudfactory

🕳️ Mock Services

We will use these fake services for the example.

// example.implementation.tsx
import { useCrudFactory } from '@infini-soft/usecrudfactory'
import { Operation } from '@infini-soft/useoperationfactory';

export const createService: Operation<
 [string, { name: string }],
 Promise<{ success: boolean; message: string }>
> = (...arg) =>
 new Promise((res, rej) => {
   res({ success: true, message: 'Success' });
 });

export const readService: Operation<[string], Promise<string>> = (a) =>
 new Promise((res, rej) => {
   res(`Item was read`);
 });

export const updateService: Operation<[string], Promise<string>> = (a) =>
 new Promise((res, rej) => {
   res(`Item was updated`);
 });

export const deleteService: Operation<[string], Promise<boolean>> = (a) =>
 new Promise((res, rej) => {
   res(true);
 });

export const listService: Operation<[string], Promise<string[]>> = (a) =>
 new Promise<string[]>((res, rej) => {
   res(['item1', 'item2']);
 });

💎 Implementation

// useMySdk.tsx
import React from 'react';
import { useCrudFactory } from '@infini-soft/useCrudFactory';
import * as services from './example.implementation.tsx';

export const useMyCrudSdk = () => {
  const sdk = useCrudFactory(services);

  // Your implementation

  return sdk;
};

🎁 My Sdk

// example.tsx
import React from 'react';
import { useMySdk } from './useMySdk';

export default () => {
 const { create, read, list } = useMySdk();

 const handleRunAll = () => {
   create.run();
   read.run();
   list.run();
 };

 return (
   <>
     <div className="container-vertical">
       <h1>Hello useCrudFactory</h1>
       <button onClick={handleRunAll}>Run all</button>
     </div>
     <div className="container">
       <div className="tests">
         <h2>Create</h2>
         <ul>
           <li>Status = {String(create.status)}</li>
           <li>Data = {JSON.stringify(create.data)}</li>
         </ul>
         <button onClick={create.run}>Create Test</button>
       </div>

       <div className="tests">
         <h2>Read</h2>
         <ul>
           <li>Status = {String(read.status)}</li>
           <li>Data = {String(read.data)}</li>
         </ul>
         <button onClick={read.run}>Read Test</button>
       </div>

       <div className="tests">
         <h2>List</h2>
         <ul>
           <li>Status = {String(list.status)}</li>
           <li>Data = {String(list.data)}</li>
         </ul>
         <button onClick={list.run}>List Test</button>
       </div>
     </div>
   </>
 );
};

Powered 🚀 by Infinisoft Inc. Wanna cook the future? Come in the kitchen https://www.kitchen.infini-soft.com