Skip to content

Instantly share code, notes, and snippets.

View vhuerta's full-sized avatar
🦖
Working from home

Victor Huerta vhuerta

🦖
Working from home
  • Mexico
View GitHub Profile
@vhuerta
vhuerta / light.itermcolors
Created February 27, 2022 18:38
iTerm Light Color Scheme
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>Ansi 0 Color</key>
<dict>
<key>Alpha Component</key>
<real>1</real>
<key>Blue Component</key>
<real>0.0</real>
@vhuerta
vhuerta / add_message.txt
Last active December 2, 2020 18:55
Manually add a message to RSMQ
MULTI
ZADD rsmq:{queueName} {epoch} {id}
HSET rsmq:{queueName}:Q {id} {message}
HINCRBY rsmq:{queueName}:Q totalsent 1
EXEC
import { useCallback, Reducer, ReducerState, ReducerAction } from "react";
import { useReducer } from "reinspect";
export type StateGetter<A extends Reducer<any, any>> = () => ReducerState<A>;
export type DispatchThunk<A extends Reducer<any, any>> = (
dispatch: (value: ReducerAction<A>) => void,
state: StateGetter<A>
) => void;
export type DispatcherThunk<A extends Reducer<any, any>> = (
action: ReducerAction<A> | DispatchThunk<A>
import * as React from "react";
import { usePokemonReducer, fetchPokemons } from "./pokemon.ducks";
export default function App() {
const [state, dispatch] = usePokemonReducer();
function handleOnClick() {
dispatch(fetchPokemons());
}
// FINALY EXPOSE THE REDUCER
export const usePokemonReducer = () =>
useThunkReducer(reducer, initialState, "pokemons");
// ACTION CREATORS
export const fetchPokemons = () => {
return async (dispatch: Dispatch<PokemonAction>) => {
dispatch({ type: "FETCH_POKEMON_PENDING" });
try {
const result: { results: Pokemon[] } = await (await fetch(
"https://pokeapi.co/api/v2/pokemon"
)).json();
// REDUCER
function reducer(state: PokemonState, action: PokemonAction): PokemonState {
switch (action.type) {
case "FETCH_POKEMON_PENDING":
return { ...state, isLoading: true };
case "FETCH_POKEMON_COMPLETED":
return { ...state, isLoading: false, pokemons: action.pokemons };
case "FETCH_POKEMON_FAILED":
return { ...state, isLoading: false, pokemons: [] };
}
// INITIAL STATE & TYPE DEFINITION
type Pokemon = {
name: string;
url: string;
};
type PokemonState = {
pokemons: Pokemon[];
isLoading: boolean;
};
// ACTIONS
type FetchPokemonPending = {
type: "FETCH_POKEMON_PENDING";
};
type FetchPokemonCompleted = {
type: "FETCH_POKEMON_COMPLETED";
pokemons: Pokemon[];
};
@vhuerta
vhuerta / how-to-use-it.ts
Last active May 7, 2023 01:16
Add thunk capabilities to useReducer and integrates with redux dev-tools
// Actions Type Definition
type AsyncActionPending = {
type: "ASYNC_ACTION_PENDING";
};
type AsyncActionFulfilled = {
type: "ASYNC_ACTION_FULFILLED";
};
type AsyncAction = AsyncActionPending | AsyncActionFulfilled;