Usage

``
npm install -S iti-react
`

$3

`ts
// React
export const PizzaData = () => {
const kitchenSet = useContainerSet(["oven", "kitchen"])
if (!kitchenSet) return <>Kitchen is loading
let inOven = kitchenSet.oven.pizzasInOven()
return <>Pizzaz In Oven: {inOven}
}
`

API documentation React

$3

Generates a set of app specific container hooks

`ts
// my-app-hooks.ts
import React, { useContext } from "react"
import { getContainerHooks } from "iti-react"
import { getProviders, PizzaAppContainer } from "./_root.store"

export const MyRootCont = React.createContext({})

let mega = getContainerHooks(getProviders, MyRootCont)
export const useContainerSet = mega.useContainerSet
`

`tsx
// PizzaData.tsx
import { useContainerSet } from "./my-app-hooks"
export const PizzaData = () => {
const containerSet = useContainerSet((containers) => [containers.kitchen])
console.log(containerSet)
return 123
}
`

$3

`ts
export const PizzaData = () => {
const [kitchenContainer, err] = useContainer().kitchen
if (!kitchenContainer || err) {
return <>Kitchen is loading
}

return <>{kitchenContainer.oven.pizzasInOven}
}
`

$3

Get multiple containers and autosubscribes to change.

`ts
export const PizzaData = () => {
const containerSet = useContainerSet((containers) => [
containers.kitchen,
containers.auth,
])
if (!containerSet) {
return <>Kitchen is loading
}

return <>{containerSet.kitchen.oven.pizzasInOven}
}
`

###

$3

You can create a simpler API for a portion of your applicatoin to avoid dealing with async in every component. There are some helpfull Context helpers at your service. Also you can use classic props drilling to avoid dealing with async flow in every component

`tsx
import React, { useContext } from "react"
import { useContainerSet } from "../containers/_container.hooks"
import { generateEnsureContainerSet } from "iti-react"

const x = generateEnsureContainerSet(() =>
useContainerSet(["kitchen", "pizzaContainer", "auth"]),
)
export const EnsureNewKitchenContainer = x.EnsureWrapper
export const useNewKitchenContext = x.contextHook
`

`tsx
export const PizzaApp = () => {
return (


Comparison with inversifyjs, tsyringe` and others

Questions and tips