Giter Club home page Giter Club logo

laika-react's People

Contributors

dependabot-preview[bot] avatar dependabot[bot] avatar eggman64 avatar luxalpa avatar peterzernia avatar utsavtiwary04 avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

laika-react's Issues

React hooks support?

Aside from being the new cool kid on the block, there are some scenarios in which having a React hook that returns the status of a feature can be useful. For example, if you want to initialize a different analytics solution for a portion of users (and you don't necessarily want to render a component based on the feature's status) a hook can be a better choice. IMHO, a well-designed hook not only gives the functionality of the current API to developers but also, allows them to have much more flexibility in their workflow.

So may I ask whether you have any plans for adding a hook to the laika-react? And if yes, would you mind If I send a PR for it?


This is a quick and dirty implementation of what I have in mind:

import { useReducer, useEffect } from 'react';
import { getFeatureStatus } from './utils'

const FETCHING_STARTED = 'LAIKA/GET_FEATURE_STATUS/STARTED'
const FETCHING_SUCCEEDED = 'LAIKA/GET_FEATURE_STATUS/SUCCEEDED'
const FETCHING_FAILED = 'LAIKA/GET_FEATURE_STATUS/FAILED'

const initialState = { status: false, loading: false, fetched: false }

function reducer(state, action) {
  switch (action.type) {
    case FETCHING_STARTED:
      return { ...state, loading: true, fetched: false }
    case FETCHING_SUCCEEDED:
      return { status: action.payload.status, loading: false, fetched: true }
    case FETCHING_FAILED:
      return { status: false, loading: false, fetched: true }
    default:
      throw new Error()
  }
}

export function useLaika(uri, env, feature) {
  const [state, dispatch] = useReducer(reducer, initialState)

  useEffect(() => {
    dispatch({ type: FETCHING_STARTED })
    getFeatureStatus(feature, uri, env)
      .then((status) => {
        dispatch({ type: FETCHING_SUCCEEDED, payload: { status } })
      })
      .catch(() => {
        dispatch({ type: FETCHING_FAILED })
      })
  }, [uri, env, feature])

  return state
}

I didn't want to submit a PR because a full PR requires changing demo, writing tests and probably applying some changes to the Webpack config for better tree-shaking which can take a few hours but I wasn't sure that this library is still under active development or not so I decided to ask first and if the answer was yes, come back with a PR.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.