From 9772e61e57beb2e30cf2c1486acfe7b88e321b4b Mon Sep 17 00:00:00 2001
From: Raymond Camden <raymondcamden@gmail.com>
Date: Thu, 5 Dec 2019 09:33:49 -0600
Subject: [PATCH 1/7] Update form-validation.md

Updates the server side code. Fixes #2391
---
 src/v2/cookbook/form-validation.md | 35 ++++++++++++++++++++----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index 6fd34c1263..bb5965e239 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -333,21 +333,34 @@ We set up the total value as a computed value, and outside of that bug I ran int
 
 ## Server-side Validation
 
-In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [OpenWhisk](http://openwhisk.apache.org/) serverless action to do the validation. While it isn't terribly important, here is the logic:
+In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [Netlify](https://netlify.com/) serverless action to do the validation. While it isn't terribly important, here is the logic:
 
 ``` js
-function main(args) {
-    return new Promise((resolve, reject) => {
-        // bad product names: vista, empire, mbp
-        const badNames = ['vista', 'empire', 'mbp'];
-
-        if (badNames.includes(args.name)) {
-          reject({error: 'Existing product'});
-        }
+exports.handler = async (event, context) => {
+  
+    const badNames = ['vista', 'empire', 'mbp'];
+    let name = event.queryStringParameters.name;
+
+    if (badNames.includes(name)) {
+      return { 
+        statusCode: 200,         
+        headers:{
+          'Access-Control-Allow-Origin':'*'
+        },
+        body: JSON.stringify({error:'Invalid name passed.'}) 
+      }
+    } else {
+      return {
+        statusCode: 200,
+        headers:{
+          'Access-Control-Allow-Origin':'*'
+        },
+        body: JSON.stringify({ status: 'ok' })
+      }
+    }
 
-        resolve({status: 'ok'});
-    });
 }
+
 ```
 
 Basically any name but "vista", "empire", and "mbp" are acceptable. Ok, so let's look at the form.

From 833c1a6406d4b13c7192db96f317a24e73e270db Mon Sep 17 00:00:00 2001
From: Raymond Camden <raymondcamden@gmail.com>
Date: Sun, 15 Dec 2019 09:08:46 -0600
Subject: [PATCH 2/7] Update form-validation.md

I removed the server side code and updated the form code to use the right URL.
---
 src/v2/cookbook/form-validation.md | 34 ++----------------------------
 1 file changed, 2 insertions(+), 32 deletions(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index bb5965e239..1b16dac957 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -333,37 +333,7 @@ We set up the total value as a computed value, and outside of that bug I ran int
 
 ## Server-side Validation
 
-In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [Netlify](https://netlify.com/) serverless action to do the validation. While it isn't terribly important, here is the logic:
-
-``` js
-exports.handler = async (event, context) => {
-  
-    const badNames = ['vista', 'empire', 'mbp'];
-    let name = event.queryStringParameters.name;
-
-    if (badNames.includes(name)) {
-      return { 
-        statusCode: 200,         
-        headers:{
-          'Access-Control-Allow-Origin':'*'
-        },
-        body: JSON.stringify({error:'Invalid name passed.'}) 
-      }
-    } else {
-      return {
-        statusCode: 200,
-        headers:{
-          'Access-Control-Allow-Origin':'*'
-        },
-        body: JSON.stringify({ status: 'ok' })
-      }
-    }
-
-}
-
-```
-
-Basically any name but "vista", "empire", and "mbp" are acceptable. Ok, so let's look at the form.
+In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [Netlify](https://netlify.com/) serverless action to do the validation. That exact code of the serverless action isn't relevant, but will return an error if the name is `vista`, `empire`, or `mbp`. Here's our form.
 
 ``` html
 <form
@@ -402,7 +372,7 @@ Basically any name but "vista", "empire", and "mbp" are acceptable. Ok, so let's
 There isn't anything special here. So let's go on to the JavaScript.
 
 ``` js
-const apiUrl = 'https://openwhisk.ng.bluemix.net/api/v1/web/rcamden%40us.ibm.com_My%20Space/safeToDelete/productName.json?name=';
+const apiUrl = 'https://vuecookbook.netlify.com/.netlify/functions/product-name?name=';
 
 const app = new Vue({
   el: '#app',

From bddc23c301e6bc51e0829c8ea3108ecdeba9917e Mon Sep 17 00:00:00 2001
From: Raymond Camden <raymondcamden@gmail.com>
Date: Wed, 18 Dec 2019 09:37:10 -0600
Subject: [PATCH 3/7] Update form-validation.md

Update related to comments.
---
 src/v2/cookbook/form-validation.md | 42 +++++++++++++++++++++++-------
 1 file changed, 32 insertions(+), 10 deletions(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index 1b16dac957..fb09a78af7 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -333,7 +333,30 @@ We set up the total value as a computed value, and outside of that bug I ran int
 
 ## Server-side Validation
 
-In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [Netlify](https://netlify.com/) serverless action to do the validation. That exact code of the serverless action isn't relevant, but will return an error if the name is `vista`, `empire`, or `mbp`. Here's our form.
+In my final example, we built something that makes use of Ajax to validate at the server. The form will ask you to name a new product and will then check to ensure that the name is unique. We wrote a quick [Netlify](https://netlify.com/) serverless action to do the validation. While it isn't terribly important, here is the logic:
+
+``` js
+exports.handler = async (event, context) => {
+  
+    const badNames = ['vista', 'empire', 'mbp'];
+    const name = event.queryStringParameters.name;
+
+    if (badNames.includes(name)) {
+      return { 
+        statusCode: 400,         
+        body: JSON.stringify({error:'Invalid name passed.'}) 
+      }
+    } else {
+      return {
+        statusCode: 204
+      }
+    }
+
+}
+
+```
+
+Basically any name but "vista", "empire", and "mbp" are acceptable. Ok, so let's look at the form.
 
 ``` html
 <form
@@ -389,16 +412,15 @@ const app = new Vue({
       if (this.name === '') {
         this.errors.push('Product name is required.');
       } else {
-        fetch(apiUrl + encodeURIComponent(this.name))
-        .then(res => res.json())
-        .then(res => {
-          if (res.error) {
-            this.errors.push(res.error);
-          } else {
-            // redirect to a new URL, or do something on success
-            alert('ok!');
+        fetch(apiUrl+encodeURIComponent(this.name))
+        .then(async res => {
+          if(res.status === 204) {
+            alert('Ok!')
+          } else if(res.status === 400) {
+            let errorResponse = await res.json();
+            this.errors.push(errorResponse.error);
           }
-        });
+        });      
       }
     }
   }

From e4894050b455aecb1cf64211fea2600a7cf3873a Mon Sep 17 00:00:00 2001
From: Phan An <me@phanan.net>
Date: Wed, 4 Mar 2020 16:47:30 +0100
Subject: [PATCH 4/7] Update src/v2/cookbook/form-validation.md

---
 src/v2/cookbook/form-validation.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index fb09a78af7..b20c19866c 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -412,11 +412,11 @@ const app = new Vue({
       if (this.name === '') {
         this.errors.push('Product name is required.');
       } else {
-        fetch(apiUrl+encodeURIComponent(this.name))
+        fetch(apiUrl + encodeURIComponent(this.name))
         .then(async res => {
-          if(res.status === 204) {
-            alert('Ok!')
-          } else if(res.status === 400) {
+          if (res.status === 204) {
+            alert('OK')
+          } else if (res.status === 400) {
             let errorResponse = await res.json();
             this.errors.push(errorResponse.error);
           }

From b967f48b27f149ec695a0ab9ecd8cdecd4669e50 Mon Sep 17 00:00:00 2001
From: Phan An <me@phanan.net>
Date: Wed, 4 Mar 2020 16:48:03 +0100
Subject: [PATCH 5/7] Update src/v2/cookbook/form-validation.md

---
 src/v2/cookbook/form-validation.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index b20c19866c..53a3c709e3 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -420,7 +420,7 @@ const app = new Vue({
             let errorResponse = await res.json();
             this.errors.push(errorResponse.error);
           }
-        });      
+        });
       }
     }
   }

From 6f075ebf93a952e27ae753104cfc5521c9df4a6e Mon Sep 17 00:00:00 2001
From: Phan An <me@phanan.net>
Date: Wed, 4 Mar 2020 16:48:19 +0100
Subject: [PATCH 6/7] Update src/v2/cookbook/form-validation.md

---
 src/v2/cookbook/form-validation.md | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index 53a3c709e3..0ed062154f 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -344,14 +344,14 @@ exports.handler = async (event, context) => {
     if (badNames.includes(name)) {
       return { 
         statusCode: 400,         
-        body: JSON.stringify({error:'Invalid name passed.'}) 
-      }
-    } else {
-      return {
-        statusCode: 204
+        body: JSON.stringify({error: 'Invalid name passed.'}) 
       }
     }
 
+    return {
+      statusCode: 204
+    }
+
 }
 
 ```

From 460b30138d946bdb12810835bcc45461ee6bf2de Mon Sep 17 00:00:00 2001
From: Phan An <me@phanan.net>
Date: Wed, 4 Mar 2020 16:49:46 +0100
Subject: [PATCH 7/7] Update src/v2/cookbook/form-validation.md

---
 src/v2/cookbook/form-validation.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/v2/cookbook/form-validation.md b/src/v2/cookbook/form-validation.md
index 0ed062154f..80e65bfda0 100644
--- a/src/v2/cookbook/form-validation.md
+++ b/src/v2/cookbook/form-validation.md
@@ -415,7 +415,7 @@ const app = new Vue({
         fetch(apiUrl + encodeURIComponent(this.name))
         .then(async res => {
           if (res.status === 204) {
-            alert('OK')
+            alert('OK');
           } else if (res.status === 400) {
             let errorResponse = await res.json();
             this.errors.push(errorResponse.error);