1 00:00:00,650 --> 00:00:04,620 In the last section we got our sign up at least kind of doing something right. 2 00:00:04,620 --> 00:00:10,110 You know we can send your message on here but if I enter an incorrect password I see authentication 3 00:00:10,110 --> 00:00:11,300 failed pop up. 4 00:00:11,490 --> 00:00:16,290 If I then replace it with the correct password I can attempt to sign it again but the message does not 5 00:00:16,290 --> 00:00:17,260 go away. 6 00:00:17,280 --> 00:00:21,260 So definitely we need to make sure that we clear out this error message. 7 00:00:21,630 --> 00:00:24,750 Luckily it's really straightforward to do with redux. 8 00:00:24,750 --> 00:00:29,100 Right here we've got a case in our inducer of log in user success. 9 00:00:29,340 --> 00:00:30,790 So if a user just logged in. 10 00:00:30,840 --> 00:00:36,020 Chances are there is no error message to show them right like we don't need to show an error message. 11 00:00:36,090 --> 00:00:40,850 Surely they just logged in successfully so the authentication did not fail. 12 00:00:40,860 --> 00:00:43,510 You don't tell me it failed when it clearly just succeeded. 13 00:00:43,800 --> 00:00:49,280 So to get the message to go away we can just zero out the message like so. 14 00:00:49,320 --> 00:00:53,570 So just an empty string on there and the error message should be should go away. 15 00:00:53,850 --> 00:00:55,390 Is all refreshed now. 16 00:00:55,590 --> 00:00:57,870 And also attempt to sign in. 17 00:00:58,010 --> 00:01:06,210 You get the error message and I'll put in correct credentials and it goes away. 18 00:01:06,210 --> 00:01:07,950 Fantastic just what we expected. 19 00:01:07,950 --> 00:01:11,890 Now I want to show you something like real very small oddity. 20 00:01:11,890 --> 00:01:14,380 OK and this is an oddity of firebase. 21 00:01:14,430 --> 00:01:16,540 I'm just going to point out to you. 22 00:01:17,040 --> 00:01:20,510 It is something that bit me just a little bit while developing this application. 23 00:01:20,520 --> 00:01:24,740 I imagine some number of people out there are going to run into this and so I want to point this out. 24 00:01:24,810 --> 00:01:30,550 Tell you what the behavior is right now so you can expect it while you're debugging your application. 25 00:01:30,600 --> 00:01:32,340 I'm going to do a little interesting something here. 26 00:01:32,480 --> 00:01:40,560 I want to put a new line about that logging user's success and I'm just going to say B C G. 27 00:01:42,750 --> 00:01:47,230 What do you think is going to happen when our app runs this line of code right here. 28 00:01:47,370 --> 00:01:51,110 Well we haven't declared a variable called ABC TFG. 29 00:01:51,130 --> 00:01:53,270 Let's use something more reasonable like hello banana. 30 00:01:53,280 --> 00:01:55,070 There you go. 31 00:01:55,290 --> 00:01:59,030 So when this line of code is executed I'm going to expect an error message to occur. 32 00:01:59,050 --> 00:01:59,260 Right. 33 00:01:59,280 --> 00:02:05,370 I don't expect to see a big red error message on the screen in my simulator and say I have no idea what 34 00:02:05,370 --> 00:02:06,890 variable you're talking about here. 35 00:02:06,960 --> 00:02:09,600 OK that's what we expect that's what we want to have happen. 36 00:02:09,820 --> 00:02:12,740 It's not going to refresh the simulator input. 37 00:02:12,770 --> 00:02:14,580 Test test dot com. 38 00:02:14,590 --> 00:02:16,500 I'm going to put it in my correct password. 39 00:02:16,500 --> 00:02:24,150 So now I will expect this line of code to execute right here so I'm going to log in and I get. 40 00:02:24,160 --> 00:02:25,750 Authentication failed. 41 00:02:25,760 --> 00:02:27,750 How interesting right. 42 00:02:27,770 --> 00:02:29,300 How interesting. 43 00:02:29,300 --> 00:02:35,300 Surely this line of exit line of code is executed right like surely ASCII we just saw the error message 44 00:02:35,300 --> 00:02:40,610 go away a second ago so I know it's hitting that line of code and I know I just put in the correct password. 45 00:02:40,610 --> 00:02:46,220 But for some reason rather than throwing an error on this message right here I get authentication failed. 46 00:02:46,370 --> 00:02:51,380 So this is again a little bit of an oddity of firebase something that can be a little bit frustrating 47 00:02:51,380 --> 00:02:54,130 if you don't expect it so I'm going to tell you what it is right now. 48 00:02:54,380 --> 00:02:58,000 You'll probably go like oh that's rule not helpful. 49 00:02:58,490 --> 00:03:02,390 But you know hopefully they'll help you debug stuff in the future. 50 00:03:02,390 --> 00:03:09,710 So I want you to remember that whenever we call or X whenever we press that loggin button right here 51 00:03:09,920 --> 00:03:12,850 we are calling log in user right we call logging user. 52 00:03:12,920 --> 00:03:15,330 We attempt to sign him with an email and password. 53 00:03:15,690 --> 00:03:23,600 OK if we didn't not have that banana variable in there I would expect to hit Daut then call logging 54 00:03:23,620 --> 00:03:25,780 user success. 55 00:03:25,820 --> 00:03:30,620 We dispatch a log in the user success action and then it flows over. 56 00:03:30,650 --> 00:03:34,730 So eventually we end up over here and the producer and I hit this line of code right here right. 57 00:03:34,760 --> 00:03:36,740 That is my expected flow. 58 00:03:36,740 --> 00:03:39,760 That is what I expect to have happen and I'm going to tell ya. 59 00:03:39,800 --> 00:03:42,950 That is exactly what is happening. 60 00:03:43,010 --> 00:03:44,740 We are hitting this line of code right here. 61 00:03:44,750 --> 00:03:48,400 We are executing banana and an error is being thrown. 62 00:03:48,590 --> 00:03:50,010 Here's the problem. 63 00:03:50,670 --> 00:03:55,190 I want you to think for a second about our call stack right like the order in which we're calling all 64 00:03:55,190 --> 00:03:56,530 these different functions. 65 00:03:56,900 --> 00:03:59,360 So we hit sign in with email and password. 66 00:03:59,390 --> 00:04:02,440 When that resolves we run this function right here. 67 00:04:02,450 --> 00:04:05,810 So logging user success in dispatching that action. 68 00:04:05,810 --> 00:04:10,430 We are still kind of like in the context of this it then. 69 00:04:10,460 --> 00:04:13,060 Or like in the context of this promise. 70 00:04:13,070 --> 00:04:18,430 So here's what's really going on behind the scenes logging user success runs. 71 00:04:18,440 --> 00:04:25,820 We dispatched the action we hit that line of code and the reducer in areas thrown and firebase sees 72 00:04:25,820 --> 00:04:30,500 the error in assumes that something went wrong with the request. 73 00:04:30,530 --> 00:04:36,680 It assumes that the request failed catastrophically and so it goes over to this catch statement right 74 00:04:36,680 --> 00:04:39,650 here and it executes the catch statement. 75 00:04:39,740 --> 00:04:44,180 So that is what is really going on behind the scenes and I can prove it to you. 76 00:04:44,180 --> 00:04:45,610 I'm going to put in here. 77 00:04:45,670 --> 00:04:50,610 Err so I'm going to receive whatever argument this function is being called with and I'm going to count 78 00:04:50,610 --> 00:04:51,260 the log. 79 00:04:51,380 --> 00:04:52,510 Err like so. 80 00:04:52,550 --> 00:04:57,030 All right so now I need to flip back over to the simulator. 81 00:04:57,030 --> 00:04:59,040 I'm going to pull open my chrome Council. 82 00:04:59,040 --> 00:05:00,470 Here it is. 83 00:05:01,080 --> 00:05:04,360 And now I'm going to put in my correct credentials. 84 00:05:04,440 --> 00:05:07,040 So I'm going to expect this to hit that banana line. 85 00:05:07,050 --> 00:05:15,630 It's all logging now and boom I get authentication fails and at the con. I see banana is not defined. 86 00:05:15,840 --> 00:05:20,010 Which is clearly not what I expect as not one and what I have happen. 87 00:05:20,220 --> 00:05:27,170 But if you look at the call stack your you can see that yes we were inside of user log in success. 88 00:05:27,270 --> 00:05:33,260 We attempt to dispatch an action and you know something else happening here basically we got hung up 89 00:05:33,270 --> 00:05:39,810 back in the promise it hit the catch case because it assumes something went wrong with the request and 90 00:05:39,810 --> 00:05:41,370 we ended up in the catch case. 91 00:05:41,520 --> 00:05:45,830 Definitely not what we really expected as far as catching an air goes. 92 00:05:45,900 --> 00:05:46,420 OK. 93 00:05:46,650 --> 00:05:48,320 So again this is a real gotcha. 94 00:05:48,330 --> 00:05:53,880 While using firebase not a great way to catch this one I'm going to recommend you do it for the rest 95 00:05:53,880 --> 00:05:57,680 of the Course just keep this log in this log message right here. 96 00:05:57,720 --> 00:06:03,180 And if you ever just ever so happen to make a mistake while using firebase especially as we're working 97 00:06:03,180 --> 00:06:08,270 through its authentication stuff you will see the error message pop up on the screen along with that 98 00:06:08,280 --> 00:06:10,880 like you know authentication failed message as well. 99 00:06:11,130 --> 00:06:12,980 So a little bit of a gotcha. 100 00:06:13,140 --> 00:06:16,080 This is a work around that we're going to use right now. 101 00:06:16,080 --> 00:06:16,920 All right. 102 00:06:17,430 --> 00:06:23,960 So we do have to fix up our douceur of course you know flip back over and remove that banana term. 103 00:06:24,480 --> 00:06:30,030 And now I should be able to refresh get my error message 104 00:06:32,980 --> 00:06:34,600 and then sign in successfully. 105 00:06:35,560 --> 00:06:36,990 And see the error message go away. 106 00:06:37,010 --> 00:06:37,470 Cool. 107 00:06:37,520 --> 00:06:37,790 OK. 108 00:06:37,800 --> 00:06:38,780 So looks good. 109 00:06:39,110 --> 00:06:42,310 Let's take a quick break and then come back and finish up with all that. 110 00:06:42,320 --> 00:06:45,300 You know making sure we show some spinners and all that coming good stuff.