iest

// @flow
import * as React from 'react';
import * as R from 'ramda';

const SEPARATOR = '.';
const spaceToHyphen = R.replace(/\s/g, '-');
const delimit = (str, add) =>
    R.compose(
        R.join(SEPARATOR),
        R.map(

iest

Moving from lodash/fp to ramda

How

Good news is we're only using lodash/fp, which makes it easier to match function signatures.

1. Find most-used lodash methods, we'll convert these first maybe?
2. Go through each lodash method, find the ramda equivalent where possible
3. Write a codemod to rewrite those usages
4. Who the fuck thought function aliases were a good idea

iest

We started out with sass files with something like this (obvious brevity is obvious):

// colors.scss
$green: #37ab2e;
$white: #FFFFFF;

// skin.scss
.bg_green { color: $green; }
.fg_white { color: $white; }

iest

// https://gist.github.com/MoOx/1eb30eac43b2114de73a
const generic = {
  title: /<title>.*<\/title>/gi,
  desc: /<desc>.*<\/desc>/gi,
  comment: /<!--.*-->/gi,
  defs: /<defs>.*<\/defs>/gi,
  width: / +width="\d+(\.\d+)?(px)?"/gi,
  height: / +height="\d+(\.\d+)?(px)?"/gi,
  sketchMSShapeGroup: / +sketch:type=\"MSShapeGroup\"/gi,
  sketchMSPage: / +sketch:type=\"MSPage\"/gi,

iest

const path = require('path');
const glob = require('glob');

// Setup babel so all future `require` calls are run through it
require("babel-register")({
    // Override babel's default behaviour of ignoring all `node_modules`
    ignore: false,
    only: [
        // Include all js/jsx files in ./src
        "./src/**/*",

iest

import test from 'tape';

import { mToKm } from '../distance-util';

test('mToKm', (assert) => {
    assert.equal(typeof(mToKm(1000)), 'string', 'outputs a string');
    assert.equal(mToKm(1000), '1.0', 'converts meters to kilometers');
    assert.equal(mToKm(1200), '1.2', 'formatted to 1 decimal place');
    assert.equal(mToKm(1299), '1.3', 'rounded up correctly');
    assert.equal(mToKm(1240), '1.2', 'rounded down correctly');

iest

'use strict';
require('babel/register'); // transform required modules
const fs = require('fs');
const path = require('path');
const jade = require('jade');
const React = require('react');
const debug = require('debug');
const Helmet = require('react-helmet');
const find = require('lodash/collection').find;
const Provider = require('react-redux').Provider;

iest

import {canUseDOM} from 'exenv';

function getWhitelistedVars(global) {
  return Object.keys(global).reduce((obj, key) => {
    if (defaults.hasOwnProperty(key)) {
      obj[key] = global[key];
    }
    return obj;
  }, {});
}

iest

'use strict';
const moment = require('moment')
const jsdom = require('jsdom');
const fs = require('fs');

const FILE_NAME = process.argv[2] || './May-Jun.html';


jsdom.env(
  fs.readFileSync(FILE_NAME).toString(),

iest

render() {
  const isSmallScreen = window.matchMedia('(max-width: 30em)').matches;
  
  return (
    isSmallScreen ?
      <p>This will only render if the window is smaller than 30em</p>
      :
      <p>This will only render if the window is 30em or more<p>
  );
}