Building out a Support Request Reducer
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

[00:00:01] Back to the fact that we're building this gap we are going to sit on our redux I'm going to connect our colleagues and then we are going to set up the reducers and set the selected infobahn. So first things first of all it's important to connect from reac redux and then down here to say connect and then no from our state process. Don't doing that and then in actions which we will import and then we need to save in any of the components for box and then import actions so import actions that import star as actions from US Losh actions. So what we just did here is we connected our company to us and then we import the actions. And now what we do is basically call those actions. So we need to spacing and handles like this crop start and then we call that selects a PO box and then we want to pass in the types of this process. So make sure that this is the correct let's make sure that this is the correct method indeed. And you call so we can do this by heading over into index types and saying okay so like that. And then he dies it's falling to the bottom and it's like requesting. So let's turn back. So like in falafels make sure it's select request time we're passing in the type and it takes time. And then that's the payload and then we're dispatching select request type. So that overall reduce or and make the case for this so let's go to let's go to our users here and we have discovered Deezer but we want to implement another user. [00:01:57][115.9]
[00:01:58] So creating a new file and let's call it request calls support requests producer Tajai. Now say import React or not. We need to basically copy this so let's call your newsletter or throw our support request and get rid of all these cases except for one so fetch news that are archived and won't fall. We want to state but we don't want to import these types let's import this one right here so I a quest type. So import select request type from actions takes action sunshades after the initial stage when we want to put it here for the first one at least is selected so we can keep track of which one selected by default. We want pending to always be selected so this will be our initial state and the reason we want to do that is cosily first load requests. We wanted to show any so upset any and then that's what we need for initial state from now. Now instead of fetches our to the select request type. And here we will set selected basically to what we wanted so we'll say all will we'll above the return will just say constant Leicht is equal to action now. And then we'll pass it in and then using me and because of ESX we don't have the code so it's going to give us everything interstate. We don't have anything new yet but if we were to give us everything and then it would replace or selected. So basically a new copy. All right so now we got that set up with save it and let's make a call to this. It's actually like click it and see what we get. [00:03:48][109.8]
[00:03:48] So let's go to info box and somehow get this we need a button. So say in our info box and say this is for boxes. Let's just replace this with the tag and then let's say on Clake is equal to an error function and it's Errol function. And let's just say this panel selected. OK let's go ahead and check our app here and see if it's operational. OK so messed up are things. Let's go ahead and change it back to it and let's take up this quick method and let's just put it here. They say I'll say one click is equal to our function. Let's close off that and we'll do is we will basically just put this time in between. So what we can do is close off them unless we get it. Let's go back out and rewrote it and we have her boxes back now. Just make sure you click on the text of these so we can actually get the function around slots for console could use. And it doesn't hurt to see what's happening. So for some reason it's not working. OK. Maybe it's not like it's a console log. Trying to handle selected locks go back real patients one of the tags that handle selected different ones. Now we're blind as to what our state is right now and it is getting kind of tedious to log in now. So let me introduce to you a cool tool that the next guy which is called it's called redux dev tools. And we're going to have to you it's a middleware. [00:06:02][133.6]
[00:06:02] We're going to have to apply it into our bootstrap. J.S. some ahead here and then we will see what we will do this together in the next GATT's the computer code now to save the commit message. What did we use and we are already in combat. So we developed our Burish support request for sure and our and our what we call Kendall or to click and dispatch it anyway. A pretty bad content message but it's not too big of a deal right now. We need to learn and react so getting to that next guy to where we will or won't reduce that goals and then actually connect our producer to the store so we can actually do something. So we'll see that. [00:06:02][0.0]
[359.3]