From 19c1c39334f46149e1a14ed4b27ef437b78a969c Mon Sep 17 00:00:00 2001
From: Dan Finlay <dan@danfinlay.com>
Date: Wed, 2 Mar 2016 12:14:23 -0800
Subject: [PATCH] Watch metamask-ui for changes during grunt dev

---
 Gruntfile.js |  8 ++++++--
 README.md    | 10 ++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/Gruntfile.js b/Gruntfile.js
index 5ac52f74e..f04fcac3a 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -18,7 +18,8 @@ module.exports = function (grunt) {
   // Configurable paths
   var config = {
     app: 'app',
-    dist: 'dist'
+    dist: 'dist',
+    ui: 'node_modules/metamask-ui'
   };
 
   grunt.initConfig({
@@ -29,7 +30,10 @@ module.exports = function (grunt) {
     // Watches files for changes and runs tasks based on the changed files
     watch: {
       js: {
-        files: ['<%= config.app %>/scripts/{,*/}*.js'],
+        files: [
+          '<%= config.app %>/scripts/{,*/}*.js',
+          '<%= config.ui %>/{,*/}*.js',
+        ],
         options: {
           livereload: '<%= connect.options.livereload %>'
         },
diff --git a/README.md b/README.md
index a02ab6961..ca41ed6e3 100644
--- a/README.md
+++ b/README.md
@@ -21,3 +21,13 @@ Navigate to your `metamask-plugin/dist` folder.
 Click `Select`.
 
 You now have the plugin, and can click 'inspect views: background plugin' to view its dev console.
+
+### Developing the UI
+
+To enjoy the live-reloading that `grunt dev` offers while working on the `metamask-ui` dependency:
+
+ 1. Clone the `metamask-ui` dependency locally.
+ 2. `npm install` in its folder.
+ 3. Run `npm link` in its folder.
+ 4. Run `npm link metamask-ui` in this project folder.
+ 5. Next time you `grunt dev` it will watch the metamask-ui for changes as well!