timhwang21

Handling conditional field visibility in dynamic forms

This post explores several common ways of handling visibility of conditional fields. Our sample form will have the following schema:

• foo: always present
• bar: dependent on form state (value of foo)
• baz: dependent on other application state (e.g. user permissions)

Below is our form, prior to implementing visibility logic:

timhwang21

#!/usr/bin/env bash

brew install cabextract
cd ~/Downloads
mkdir consolas
cd consolas
curl -O http://download.microsoft.com/download/f/5/a/f5a3df76-d856-4a61-a6bd-722f52a5be26/PowerPointViewer.exe
cabextract PowerPointViewer.exe
cabextract ppviewer.cab
open CONSOLA*.TTF

timhwang21

import React from "react";
import { isEqual } from "underscore";

/**
 * HOC for diagnosing unnecessary renders and identifying faulty selectors
 *
 * Adds a logger function to a component that lists all changed props
 * Also checks if changed props are deeply equal
 *
 * Usage: Decorate the component you are investigating with renderDoctor: