1 00:00:01,020 --> 00:00:06,510 So now that we're done with our two components of time to move on to a third component, so let us see 2 00:00:06,510 --> 00:00:10,410 the component that we are expected to build now. 3 00:00:11,160 --> 00:00:13,350 So we have made a balance component. 4 00:00:14,130 --> 00:00:15,990 We have that expense sheet. 5 00:00:16,320 --> 00:00:19,680 Now is the time for a new transaction and the transaction component. 6 00:00:19,680 --> 00:00:22,410 So I'll be just heading the transactions component first. 7 00:00:22,980 --> 00:00:29,810 And the first thing that will do is import the elements that we need from our material core. 8 00:00:30,180 --> 00:00:32,040 So just input typography. 9 00:00:35,640 --> 00:00:38,400 Along the Telegraph, he will be needing a guard component. 10 00:00:39,240 --> 00:00:44,670 And no, we won't be needing guard combat and we were just importing box. 11 00:00:46,180 --> 00:00:49,780 And the list and the wider. 12 00:00:53,460 --> 00:00:58,640 Along the divide also needing McStay's, or perhaps no, because I don't think so, that will be standing 13 00:00:59,900 --> 00:01:00,760 this end. 14 00:01:00,890 --> 00:01:06,260 OK, so this is all that we need and we all need it from three of us could. 15 00:01:17,920 --> 00:01:21,220 So we have just got to from. 16 00:01:24,120 --> 00:01:28,830 So we exporting our importing our typography, we are importing our box list and divide. 17 00:01:29,440 --> 00:01:31,350 Now let's create a component. 18 00:01:33,770 --> 00:01:36,350 And the you of this component is going to be transactions. 19 00:01:38,900 --> 00:01:40,850 And this is going to be a functional component. 20 00:01:42,670 --> 00:01:45,220 And it is going to receive parameters such as. 21 00:01:47,170 --> 00:01:54,130 Transactions, as well as if I may take the liberty to jump into our approaches, so any transactions 22 00:01:54,130 --> 00:01:59,620 on one end we are sending are daily transactions, so this is what will be is even as proof. 23 00:01:59,620 --> 00:02:01,270 So let's just be structuring. 24 00:02:04,200 --> 00:02:05,790 And head back to our transactions. 25 00:02:08,090 --> 00:02:12,760 Along with the transactions, we are also having the delete transactions as a laptop. 26 00:02:14,950 --> 00:02:16,390 Now we need to explore this. 27 00:02:18,160 --> 00:02:19,060 We'll explore the. 28 00:02:21,890 --> 00:02:22,820 Transactions. 29 00:02:24,890 --> 00:02:32,510 OK, so we are done with this now, and it it has to have a return keyword and inside will be having 30 00:02:32,510 --> 00:02:35,060 a box as a parent container. 31 00:02:36,900 --> 00:02:43,350 OK, so now we have imported components and we have created a functional component, and now is the 32 00:02:43,350 --> 00:02:49,370 time to populate the written statement, so inside the box will be having typography and instead of 33 00:02:49,530 --> 00:02:50,900 typography, you'll be having a divider. 34 00:02:50,910 --> 00:02:54,580 So let's just create a typography and close it. 35 00:02:55,260 --> 00:02:56,880 And it should. 36 00:02:58,330 --> 00:03:03,700 Because this is going to show the history of events that we have done and so is having the history, 37 00:03:03,710 --> 00:03:05,090 then you're going to have the divider. 38 00:03:08,980 --> 00:03:11,940 OK, so inside the divider, maybe having military style. 39 00:03:12,850 --> 00:03:18,790 So this is what we are doing, is quoted as in line said you have two sets of curly braces nested inside 40 00:03:18,790 --> 00:03:21,550 each other and will give it the width. 41 00:03:24,960 --> 00:03:25,590 Of about. 42 00:03:27,210 --> 00:03:27,960 And it wasn't. 43 00:03:32,070 --> 00:03:32,340 Now. 44 00:03:34,030 --> 00:03:39,940 So I don't think so that this divide has to there is supposed to be a self-loathing tag. 45 00:03:41,080 --> 00:03:45,550 This is nothing but a horizontal line just below our history. 46 00:03:46,510 --> 00:03:49,000 So now next thing that will be having is the list. 47 00:03:50,260 --> 00:03:57,550 So let's let's just close it and say this list will be mapping out transactions and will mapping them 48 00:03:57,550 --> 00:03:57,820 to. 49 00:03:59,270 --> 00:04:03,560 Transaction components or transactions don't map and. 50 00:04:05,160 --> 00:04:12,960 It will be taking a single transaction and it will be calling about other component of the transaction 51 00:04:12,960 --> 00:04:13,500 component. 52 00:04:14,070 --> 00:04:16,440 So it is supposed to return a keyword. 53 00:04:19,010 --> 00:04:20,240 So instead, this component. 54 00:04:21,360 --> 00:04:25,800 Let's just return and call our transaction component. 55 00:04:31,660 --> 00:04:32,970 Transaction component. 56 00:04:34,120 --> 00:04:35,200 With a cavity. 57 00:04:36,790 --> 00:04:40,300 And give it the proper transaction. 58 00:04:42,990 --> 00:04:44,430 Equals to transaction. 59 00:04:52,380 --> 00:04:58,410 And along the transaction, we will also be passing it to function, so. 60 00:04:59,640 --> 00:05:03,120 So basically putting all that we are getting from abroad, right? 61 00:05:03,480 --> 00:05:06,390 So let's just positive in order to function, delete. 62 00:05:09,580 --> 00:05:11,850 Transactions so I can just paste it. 63 00:05:12,650 --> 00:05:15,540 It was to end and then again, patient, no. 64 00:05:16,000 --> 00:05:18,280 This is supposed to be sort of cutting back now. 65 00:05:18,340 --> 00:05:18,910 It's a. 66 00:05:20,540 --> 00:05:24,990 So we are returning a transaction, but we are not importing it and not absolutely supposed to import 67 00:05:24,990 --> 00:05:25,730 our transaction. 68 00:05:27,670 --> 00:05:34,900 So an import transactions from then you would address our transactions, so it is just incompetent component 69 00:05:35,140 --> 00:05:35,320 the. 70 00:05:37,520 --> 00:05:38,930 So transaction, OK? 71 00:05:40,000 --> 00:05:46,570 So we have completed our transactions, and now it's time to move into a transaction component and we'll 72 00:05:46,570 --> 00:05:47,590 be populating it next.