style.js

/* @flow */
import type { Action, AppState, StyleProp } from '../../Types';
import { append, compose, equals, init, last, lensPath, over, reject, set,
  update, view } from 'ramda';

const UNDO = 'UNDO';
export function undo(): Action {
  return {
    type: UNDO,
    data: true,
  };
}

const ADD_VALUE = 'ADD_VALUE';

export function addValue(key: string, value: StyleProp): Action {
  return {
    type: ADD_VALUE,
    data: {
      key, value,
    },
  };
}

const REPLACE_VALUE = 'REPLACE_VALUE';

export function replaceValue(path: Array<string>, value: Array<StyleProp>): Action {
  return {
    type: REPLACE_VALUE,
    data: {
      path, value,
    },
  };
}

const CHANGE_VALUE = 'CHANGE_VALUE';

export function changeValue(key: string, i: number, value: StyleProp): Action {
  return {
    type: CHANGE_VALUE,
    data: {
      key, i, value,
    },
  };
}

const REMOVE_VALUE = 'REMOVE_VALUE';

export function removeValue(key: string, value: StyleProp): Action {
  return {
    type: REMOVE_VALUE,
    data: {
      key, value,
    },
  };
}

const initialState: AppState = {
  current: {
    display: {
      fontFamily: ['Tiempos Headline'],
      fontWeight: [700],
      color: ['#000'],
      fontSize: [24],
      lineHeight: [1.25],
      marginBottom: [12],
    },
    body: {
      fontFamily: ['SF UI Display'],
      fontWeight: [400],
      color: ['#333'],
      fontSize: [16],
      lineHeight: [1.5],
      marginBottom: [16],
    },
  },
  previous: [],
};

export default function reducer(state: AppState = initialState, action: Action) {
  switch (action.type) {
    case ADD_VALUE: {
      const { key, value } = action.data;
      const l = lensPath(['current', key]);
      return over(l, append(value), state);
    }
    case REPLACE_VALUE: {
      const { path, value } = action.data;
      const l = lensPath(['current', ...path]);
      return set(l, value, state);
    }
    case CHANGE_VALUE: {
      const { key, i, value } = action.data;
      const l = lensPath(['current', key]);
      return over(l, update(i, value), state);
    }
    case REMOVE_VALUE: {
      const { key, value } = action.data;
      const l = lensPath(['current', key]);
      return over(l, reject(equals(value)), state);
    }
    // case SAVE_PERMUTATION: {
    //   const currentL = lensPath(['current']);
    //   const previousL = lensPath(['previous']);
    //
    //   const newCurrent = reduce((mem, key) => {
    //     return assoc(
    //       key,
    //       map(R.of, action.data[key]),
    //       mem
    //     );
    //   }, {}, keys(action.data));
    //
    //   return compose(
    //     set(currentL, newCurrent),
    //     over(previousL, append(view(currentL, state)))
    //   )(state);
    // }
    case UNDO: {
      const currentL = lensPath(['current']);
      const previousL = lensPath(['previous']);
      const l = last(view(previousL, state));
      if (!l) { return state; }
      const newHistory = over(previousL, init, state);
      return compose(
        set(previousL, newHistory),
        set(currentL, l)
      )(state);
    }
    default: {
      return state;
    }
  }
}