[Functional Programming] Transition State based on Existing State using the State ADT (liftState, composeK)

const {prop, State, omit, converge,map, composeK, liftA2, equals, constant,option, chain, mapProps, find, propEq, isNumber, compose, safe} = require(‘crocks‘);
const  {get, modify, of} = State; 

// getState :: String -> State Object (Maybe a)
const getState = key => get(prop(key));

// liftState :: ( a -> b) -> a -> State s b
const liftState = fn => compose(
    of,
    fn // getfn return value and pass into State.of
);

// getHint :: () -> State AppState Hint 
const getHint = () => getState(‘hint‘)
    .map(option({color: ‘yay‘, shape: ‘uwu‘}));

// getCard :: String -> State AppState Card
const getCard = (id) => getState(‘cards‘)
    .map(chain(find(propEq(‘id‘, id)))) // find() return a Maybe, so need to use chain to unfold the value
    .map(option({id: null, color: ‘unk‘, shape: ‘unk‘}));

// cardToHint :: State AppState Hint     
const cardToHint = composeK(
    liftState(omit([‘id‘])),
    getCard
)

// setIsCorrect :: Boolean -> State AppState ()    
const setIsCorrect = (b) => modify(mapProps({‘isCorrect‘: constant(b)}));

const validateAnswer = converge(
    liftA2(equals),
    cardToHint,
    getHint
)

const feedback = composeK(
    setIsCorrect,
    validateAnswer
)


/////////////////////////////////////////////////////

const state = {
    cards: [
        {id: ‘green-square‘, color: ‘green‘, shape: ‘square‘},
        {id: ‘orange-square‘, color: ‘orange‘, shape: ‘square‘},
        {id: ‘blue-triangle‘, color: ‘blue‘, shape: ‘triangle‘}
    ],
    hint: {
        color: ‘green‘,
        shape: ‘square‘
    },
    isCorrect: null
}

console.log(
    feedback(‘green-square‘)
        .execWith(state)
)