My FeedDiscussionsHeadless CMS
New
Sign in
Log inSign up
Learn more about Hashnode Headless CMSHashnode Headless CMS
Collaborate seamlessly with Hashnode Headless CMS for Enterprise.
Upgrade ✨Learn more
Announcement about @laststance/use-app-state

Announcement about @laststance/use-app-state

Laststance's photo
Laststance
·Sep 16, 2020·

2 min read

republished original from dev.to/malloc007/announcement-about-laststa..

Brief

  • After renaming package, react-appstate is no maintaining anymore.
  • Please use @laststance/use-app-state instead.
  • 99% User already migrated to @laststance/use-app-state even though I want to arrive this information a few user who start from my old react-appstate post.

That's it! and about this React library

This is 808b ultra light weight package for useAppState hook.
Freely pass and receive values between separated components.

codesandbox

Install

npm install @laststance/use-app-state
# or
yarn add @laststance/use-app-state

TypeScript Example

// index.tsx
import React, { ReactElement } from 'react'
import ReactDOM from 'react-dom'
import Provider, { useAppState } from '@laststance/use-app-state'

interface Food {
  id: string
  name: string
}

type FoodList = Food[]

interface AppState {
  FoodList: FoodList
}

let initialAppState: AppState = {
  foodList: []
}

const App = () => {
const [appState, setAppState] = useAppState<AppState>() // pass appState object type as a generics
const item1: Food = {id: 'j4i3t280u', name: 'Hamburger'}
const item2: Food = {id: 'f83ja0j2t', name: 'Fried chicken'}
setAppState({foodList: [item1, item2]})

const foodListView: ReactElement[] = appState.foodList.map((f: Food) => <p key={f.id}>{f}</p>)

return (<div>{foodListView}</div>)
}

ReactDOM.render(
    <Provider initialState={initialAppState}>
      <App>
    </Provider>,
  document.getElementById('root')
)

Edit @laststance/use-app-state Example

Conclusion

You can use it immediately without leaning if you have a common experience as a React developer.

I'm glad to hitting demand this post like who excited prototyping frequency and wanted **setState that regardless component boundary.

Thank you for reading the article, Follow Me! 🐦 and feel free to unsubscribe! 🤗