Navigation Bar Pull Request#112
Conversation
| const text = universalLayout ? universalText : desktopText | ||
|
|
||
| if (useLogo) { | ||
| return ( |
There was a problem hiding this comment.
Just a comment for the future
Is there a way we can get these if content into their own components or in a way where this section is not that long, the useLogo logic seems repetitive as well
| } | ||
| if (Platform.OS === 'ios') { | ||
| return { | ||
| shadowColor: '#000', |
There was a problem hiding this comment.
Maybe this shadow can become a constant
const ANDROID_SHADOW_STYLE
as to reduce the amount of code and not duplicate it?
| let variant = | ||
| _width > DeviceBreakpoint.TABLET_BREAKPOINT ? 'desktop' : 'mobile' | ||
|
|
||
| let containerStyles = { |
There was a problem hiding this comment.
There are lots of styles related code in here, we should look into a cleaner organization.
There was a problem hiding this comment.
Also using Stylesheet.create() gives performance benefits,
so non changing styles should be moved to one when possible
There was a problem hiding this comment.
You can also use StyleSheet.flatten or Stylesheet.compose
to combine dynamic styles with precreated ones
I would suggest reading a bit around that before moving everything, might be worth the read
| <Title variant={variant} titleOptions={title} /> | ||
| </View> | ||
| <View | ||
| style={{ marginLeft: mobileAlignment !== 'right' ? 'auto' : '' }} |
There was a problem hiding this comment.
Keeping conditionals outside of jsx allows to separate the presentation and logic layer
usually a
const marginLeft = mobileAlignment !== 'right' ? 'auto' : ''
before the jsx might do the trick
|
|
||
| if (variant === 'desktop') { | ||
| // render the title on the left, the menu items in the middle, and the profile image on the right | ||
| return ( |
There was a problem hiding this comment.
Getting these two jsx into separate components will make the logic/code here more readable
It's me again! Hi hello!
I'm going to keep this open so that y'all can keep track of my code changes and such as I work on the navigation bar project.