1
00:00:00,870 --> 00:00:03,410
All right so let's figure out how we can disable location tracking.

2
00:00:03,430 --> 00:00:07,220
Anytime a user navigates away from track create Believe it or not.

3
00:00:07,230 --> 00:00:10,710
This is actually going to be kind of surprisingly challenging.

4
00:00:10,770 --> 00:00:15,000
I know that might sound surprising but it really is can be kind of difficult.

5
00:00:15,000 --> 00:00:19,740
Now the first thing I want to do is just give you a quick reminder on how we can detect whenever a user

6
00:00:19,740 --> 00:00:22,110
navigates between different screens.

7
00:00:22,260 --> 00:00:27,780
So as a quick reminder inside of a track create screen one way that we can detect navigation changes

8
00:00:27,900 --> 00:00:35,060
from react navigation right here we can import navigation events.

9
00:00:35,300 --> 00:00:41,400
Then inside of our ASX we can put something inside of here called like navigation events and we can

10
00:00:41,400 --> 00:00:44,340
throw in on will blur.

11
00:00:44,370 --> 00:00:51,080
Remember that's a prop that receives a callback and this callback right here here will be invoked anytime

12
00:00:51,090 --> 00:00:53,820
a user starts to navigate away from the screen.

13
00:00:53,880 --> 00:01:00,560
So inside of here I could put like a console log of leaving and if I save this I can go to track create

14
00:01:01,040 --> 00:01:06,170
go back to track list and then I'll see a console log inside my terminal.

15
00:01:06,170 --> 00:01:07,740
Right there.

16
00:01:07,960 --> 00:01:12,590
We also saw that we can attach an event listener directly to navigation events.

17
00:01:12,610 --> 00:01:16,810
Now I want to show you one third way in which we can detect whenever a user navigates away.

18
00:01:16,810 --> 00:01:21,010
And this third way even though it might seem like really over the top to have three different ways of

19
00:01:21,010 --> 00:01:22,210
detecting navigation.

20
00:01:22,210 --> 00:01:26,710
This third way is actually going to be very helpful for what we're going to eventually have to do.

21
00:01:26,740 --> 00:01:32,410
So I'm going to remove the navigation events component right there and from react navigation I'm going

22
00:01:32,410 --> 00:01:38,260
to update that import from navigation events too with navigation focus.

23
00:01:39,010 --> 00:01:41,130
So this is a higher order component.

24
00:01:41,140 --> 00:01:46,720
It's essentially a function that we pass a component into like a track create screen right here when

25
00:01:46,720 --> 00:01:53,380
we add in with navigation focus our component is going to receive a new prop in this new prop is going

26
00:01:53,380 --> 00:01:57,520
to tell us whether or not this particular component is currently focused or actually visible on the

27
00:01:57,520 --> 00:01:58,760
screen.

28
00:01:58,770 --> 00:02:03,730
The prop that we're going to receive in here is called is focused so going to d structure that out of

29
00:02:03,730 --> 00:02:09,760
my props object like so I'm also gonna make sure that I use the with navigation focused function so

30
00:02:09,760 --> 00:02:10,660
down the very bottom.

31
00:02:10,750 --> 00:02:17,800
I'm going to find where I export track create screen and I'll call with navigation focus and pass in

32
00:02:17,800 --> 00:02:19,700
my component.

33
00:02:19,750 --> 00:02:26,190
Now if I save this actually really quickly it's do a console log of is focused inside here so we actually

34
00:02:26,190 --> 00:02:27,310
know what we're doing.

35
00:02:27,360 --> 00:02:28,110
There's a council log.

36
00:02:28,110 --> 00:02:34,440
Now we can save this and I'll navigate to try to create once I navigate there I should be able to check

37
00:02:34,440 --> 00:02:41,490
my journal and I'll see true which means yes this screen is focused if I can navigate away by going

38
00:02:41,490 --> 00:02:46,800
back to my track list it will update and say false instead.

39
00:02:46,840 --> 00:02:52,100
So we've now got a very easy way to detect whether or not we should be doing some location tracking.

40
00:02:52,240 --> 00:02:52,740
We've got the.

41
00:02:52,740 --> 00:02:54,290
Is focused flag.

42
00:02:54,420 --> 00:02:56,610
So that's kind of part one here.

43
00:02:56,620 --> 00:03:00,800
Now it might seem like that's kind of all we need to start up location tracking you might think.

44
00:03:00,860 --> 00:03:01,600
OK that's great.

45
00:03:01,600 --> 00:03:07,050
Now we can just like wrap our hook right here with is focused or something like that.

46
00:03:07,090 --> 00:03:09,470
Well unfortunately that's not going to be quite enough.

47
00:03:09,490 --> 00:03:10,670
That's not going to work.

48
00:03:10,700 --> 00:03:15,310
And the reason for it is that when we start up our location tracking inside of our hook so going to

49
00:03:15,310 --> 00:03:22,350
go to use location really quickly here is use location when we start up this tracking with watch position

50
00:03:22,380 --> 00:03:25,850
async that's essentially a background process of sorts.

51
00:03:25,890 --> 00:03:30,150
As soon as we call that that's pretty much it we're now going to start tracking the user's location

52
00:03:30,780 --> 00:03:37,470
and there's a very singular and very specific way that we can turn off that tracking the way in which

53
00:03:37,470 --> 00:03:42,170
we disable tracking whenever we call watch position a sink.

54
00:03:42,270 --> 00:03:48,820
This is going to eventually give us back a value called subscriber and on this value right here is a

55
00:03:48,820 --> 00:03:54,790
function called remove remove or the remove function on there is what is going to actually make sure

56
00:03:54,790 --> 00:03:58,000
that we stop tracking the user's location.

57
00:03:58,000 --> 00:04:02,470
So while that's pretty much it we need to kind of combine these two ideas into one.

58
00:04:02,470 --> 00:04:07,930
So take the fact of whether or not a screen is focused get that information into our hook and then use

59
00:04:07,930 --> 00:04:13,090
that to decide whether or not to turn off our location tracking through that subscriber thing right

60
00:04:13,090 --> 00:04:13,910
there.

61
00:04:13,940 --> 00:04:17,230
Let's take a quick pause right here and figure out how to handle that in the next video.