Rename to twoFACode

microsoft · Dec 27, 2019 · 5f91fd9 · 5f91fd9
1 parent 9c04c97
commit 5f91fd9
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 22 deletions.
diff --git a/samples/10.b.customization-password-input/README.md b/samples/10.b.customization-password-input/README.md
@@ -122,33 +122,33 @@ The `sendPostBack` function will be retrieved from Web Chat hooks via `useSendPo
 +  const { useCallback, useState } = window.React;
 
    const PasswordInputActivity = () => {
-+     const [code, setCode] = useState('');
++     const [twoFACode, setTwoFACode] = useState('');
 +     const [submitted, setSubmitted] = useState(false);
 +     const sendPostBack = useSendPostBack();
 +
 +     const handleCodeChange = useCallback(({ target: { value } }) => {
-+        setCode(value);
-+     }, [setCode]);
++        setTwoFACode(value);
++     }, [setTwoFACode]);
 +
 +     const handleSubmit = useCallback(event => {
 +        event.preventDefault();
 +
-+        sendPostBack({ code });
++        sendPostBack({ code: twoFACode });
 +        setSubmitted(true);
-+     }, [sendPostBack, setSubmitted]);
++     }, [sendPostBack, setSubmitted, twoFACode]);
 
       return (
 -        <form className="passwordInput">
 +        <form className="passwordInput" onSubmit={handleSubmit}>
             <label className="passwordInput__box">
-               <span className="passwordInput__label">Please input your 2FA code</   span>
+               <span className="passwordInput__label">Please input your 2FA code</span>
                <input
                   autoFocus={true}
                   className="passwordInput__input"
 +                 disabled={submitted}
 +                 onChange={handleCodeChange}
                   type="password"
-+                 value={code}
++                 value={twoFACode}
                />
             </label>
          </form>
@@ -265,39 +265,39 @@ When the bot send an event activity with the name `passwordInput`, show the `<Pa
 +           const { useCallback, useState } = window.React;
 
 +           const PasswordInputActivity = () => {
-+              const [code, setCode] = useState('');
++              const [twoFACode, setTwoFACode] = useState('');
 +              const [submitted, setSubmitted] = useState(false);
 +              const sendPostBack = useSendPostBack();
 +
 +              const handleCodeChange = useCallback(({ target: { value } }) => {
-+                 setCode(value);
-+              }, [setCode]);
++                 setTwoFACode(value);
++              }, [setTwoFACode]);
 +
 +              const handleSubmit = useCallback(event => {
 +                 event.preventDefault();
 +
-+                 sendPostBack({ code });
++                 sendPostBack({ code: twoFACode });
 +                 setSubmitted(true);
-+              }, [sendPostBack, setSubmitted]);
++              }, [sendPostBack, setSubmitted, twoFACode]);
 +
 +              return (
 +                 <form className="passwordInput" onSubmit={handleSubmit}>
 +                    <label className="passwordInput__box">
-+                       <span className="passwordInput__label">Please input your 2FA    code</span>
++                       <span className="passwordInput__label">Please input your 2FA code</span>
 +                       <input
 +                          autoFocus={true}
 +                          className="passwordInput__input"
 +                          disabled={submitted}
 +                          onChange={handleCodeChange}
-+                          type="password"
++                          type="twoFACode"
 +                          value={code}
 +                       />
 +                    </label>
 +                 </form>
 +              );
 +           };
 
-            const res = await fetch('https://webchat-mockbot.azurewebsites.net/   directline/token', { method: 'POST' });
+            const res = await fetch('https://webchat-mockbot.azurewebsites.net/directline/token', { method: 'POST' });
             const { token } = await res.json();
 +           const store = createStore();
 +           const activityMiddleware = () => next => card => {

diff --git a/samples/10.b.customization-password-input/index.html b/samples/10.b.customization-password-input/index.html
@@ -16,7 +16,7 @@
     This CDN points to the latest official release of Web Chat. If you need to test against Web Chat's latest bits, please refer to pointing to Web Chat's MyGet feed:
     https://github.com/microsoft/BotFramework-WebChat#how-to-test-with-web-chats-latest-bits
   -->
-  <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
+  <script src="https://cdn.botframework.com/botframework-webchat/4.7.1/webchat.js"></script>
   <style>
     html,
     body {
@@ -77,20 +77,20 @@
       const { useCallback, useState } = window.React;
 
       const PasswordInputActivity = () => {
-        const [code, setCode] = useState('');
+        const [twoFACode, setTwoFACode] = useState('');
         const [submitted, setSubmitted] = useState(false);
         const sendPostBack = useSendPostBack();
 
         const handleCodeChange = useCallback(({ target: { value } }) => {
-          setCode(value);
-        }, [setCode]);
+          setTwoFACode(value);
+        }, [setTwoFACode]);
 
         const handleSubmit = useCallback(event => {
           event.preventDefault();
 
-          sendPostBack({ code });
+          sendPostBack({ code: twoFACode });
           setSubmitted(true);
-        }, [sendPostBack, setSubmitted]);
+        }, [sendPostBack, setSubmitted, twoFACode]);
 
         return (
           <form className="passwordInput" onSubmit={handleSubmit}>
@@ -102,7 +102,7 @@
                 disabled={submitted}
                 onChange={handleCodeChange}
                 type="password"
-                value={code}
+                value={twoFACode}
               />
             </label>
           </form>