rainbow
rainbow copied to clipboard
rainbow-me
Status Bar
Fixes RNBW-2786, RNBW-2666
What changed (plus any additional context for devs)
Created one place where Status Bar is processed. react-native-bootsplash was breaking the Status Bar behavior for Android. I used react-native-bars from the same author. Now the status bar's behavior on Android is similar to that on iOS. I also fixed the status bar flickering when changing the theme on the settings screen and in some other places. Also removed fromDiscover as it is no longer needed (please correct me if this is wrong)
PoW (screenshots / screen recordings)
Android
- before: https://user-images.githubusercontent.com/48593211/178678218-b8701205-ccde-4c54-9135-d9ecb1f9f50e.mp4
- after: https://user-images.githubusercontent.com/48593211/178685248-18da37d9-d31f-4218-876e-cebec461a883.mp4
iOS
- before: https://user-images.githubusercontent.com/48593211/178679214-9b2198cf-d1e6-4162-baf0-e32a14313341.MP4
- after: https://user-images.githubusercontent.com/48593211/178679814-1e03cd97-b2ba-4613-a7f9-4bca6cd15356.mov
Dev checklist for QA: what to test
Changing color of the Status Bar depending on screen and theme
Final checklist
- [x] Assigned individual reviewers?
- [x] Added labels?
- [ ] Added e2e tests? if not please specify why
- [ ] If you added new files, did you update the CODEOWNERS file?
RNBW-2786 Status Bar is invisible in Light mode on Android
I think this is hi-pri because it breaks core functionality on your phone while using Rainbow.
RNBW-2666 Status bas issues on Android
I don't think anyone took care of this. Here is the example from the main screen but I think the status bar in all places in the app should be fundamentally rethought.
Ideally, this should match the behavior from iOS.
![linear[bot] avatar](https://avatars.githubusercontent.com/in/20150?v=4 "Published by a pub.dev verified publisher"){kind=small}
Also, as a suggestion, we can make the status bar indentation in modal screens more like on iOS
Pumped to see this change! I have a few comments and questions.
This PR adds a new "pattern" to the codebase which includes a /services folder which contains a class to handle the Status Bar. Is there a way we can do this that is more in line with patterns already present in the codebase?
I don't really get the idea of "Services"? That is basically a class that is a singleton, so can it be an object equally fine or even a set of functions? And then this is just a set of helpers or utils we can locate in one existing folder?
I dug a bit more and found that from 0.69 RN and above uses recent StatusBar APIs (https://github.com/facebook/react-native/commit/50c8e973f067d4ef1fc3c2eddd360a0709828968)
as react-native-bootsplash use updated StatusBar APIs, it broke it entirely for React Native < 0.69
as react-native-bootsplash released a new version with a fix, we can remove react-native-bars. But at first, we should bump RN to 69.2
In this case, the need to use the service will disappear, but it is still a promising approach for storing adjacent logic.
Yes, it is unnecessary to use a class as it would be transpiled into an object anyway.
Services will allow you to structure the code and keep similar logic in one file. For example, connecting and processing sockets, or analytics. We create a separate file that will do the dirty work under the hood and give us a friendly interface.
In addition, if you want to change something in these services, you can do it in one place and not look for them scattered throughout the code.
It could make code way cleaner and understandable
with the update of React Native to version 69+, there will be no need to create this service|handler and I will remove it completely. That's why I'm sending it to draft until we have a newer version of the RN
