Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

CHORE: Prepare native base to remove #34

Merged
merged 17 commits into from
Sep 6, 2023
Merged

CHORE: Prepare native base to remove #34

merged 17 commits into from
Sep 6, 2023

Conversation

MateuszRostkowski
Copy link
Collaborator

@MateuszRostkowski MateuszRostkowski commented Aug 23, 2023 •
edited by MSzalowski
Loading

Description

The first stage of migrating the native-base to another library OR custom solution (we haven't decided yet).
It provides updates on imports to make the migration as painless as possible.

Fixes # (issue-33)

Type of change

Please delete options that are not relevant.

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

How Has This Been Tested?

  • Verify if UI looks similar to the previous on updated custom components.
  • Verify if App don't crash on imports update.

Screenshot(s)

Android

Screenshot_1693914926
Screenshot_1693914948
Screenshot_1693914965
Screenshot_1693914971

iOS

Simulator Screenshot - iPhone 14 Pro - 2023-09-05 at 13 50 05
Simulator Screenshot - iPhone 14 Pro - 2023-09-05 at 13 50 15
Simulator Screenshot - iPhone 14 Pro - 2023-09-05 at 13 50 28
Simulator Screenshot - iPhone 14 Pro - 2023-09-05 at 13 50 38

Test Configuration:

  • Firmware version:
  • Hardware:
  • Toolchain:
  • SDK:

Checklist:

  • Add correct label to your pull request
  • My code follows the style guidelines of this project
  • I have performed a self-review of my code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • New and existing unit tests pass locally with my changes
  • Any dependent changes have been merged and published in downstream modules

@MSzalowski MSzalowski linked an issue Aug 23, 2023 that may be closed by this pull request
Remove native-base #33
Open
MateuszRostkowski
MateuszRostkowski commented Aug 28, 2023
View reviewed changes
.eslintrc.js Outdated
@@ -35,6 +35,7 @@ module.exports = {
'react/prop-types': 'off',

'react-native/no-single-element-style-arrays': 'off',
'react-native/no-color-literals': 'off',
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can't add it here, we can't have free colors inside files where react native views are, like View or Text

src/components/atoms/Checkbox.tsx Outdated
return 'white'
}
if (disabled) {
return '#EBEBE4'
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This color should come from theme, like gray100 or something.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Use values from useTheme.

src/components/atoms/Checkbox.tsx Outdated
@@ -0,0 +1,109 @@
import { forwardRef, useCallback, useMemo } from 'react'
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@vercia
Did you check how this component look on both themes (light/dark)?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dark theme

image

Light theme

image

src/components/atoms/Checkbox.tsx Outdated
}, [disabled, value])

const borderColor = useMemo(
() => (isError ? 'red' : disabled ? 'grey' : 'black'),
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Colors from useTheme

src/components/atoms/FormErrorMessage.tsx Outdated

const styles = StyleSheet.create({
text: {
color: 'red',
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should come from useTheme

src/components/atoms/Select.tsx Outdated

const styles = StyleSheet.create({
errorBorder: {
borderColor: 'red',
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useTheme

src/components/atoms/Select.tsx Outdated
justifyContent: 'center',
},
normalBorder: {
borderColor: 'gray',
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useTheme

src/components/atoms/Select.tsx Outdated
},
textInput: {
alignItems: 'center',
backgroundColor: 'white',
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useTheme

src/components/molecules/Field/Radio.tsx Outdated
ref
) => {
const borderColor = useMemo(() => (isError ? 'red' : 'black'), [isError])
const bgColor = useCallback((item: string) => (item === value ? 'blue' : 'gray'), [value])
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useTheme

src/components/molecules/Field/Radio.tsx Outdated
ref
) => {
const borderColor = useMemo(() => (isError ? 'red' : 'black'), [isError])
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useTheme

@MSzalowski MSzalowski force-pushed the chore/prepare_native_base_to_remove branch from b2b3405 to 3e5380d Compare September 5, 2023 10:18
MSzalowski
MSzalowski reviewed Sep 5, 2023
View reviewed changes
src/components/atoms/FormLabel.tsx Outdated Show resolved Hide resolved
src/components/atoms/Select.tsx Outdated Show resolved Hide resolved
@MSzalowski MSzalowski added the chore Code change that does not impact UI label Sep 5, 2023
@MSzalowski MSzalowski mentioned this pull request Sep 5, 2023
Open
@MSzalowski
Copy link

@vercia Could you have a look in your spare time? Cause I have made changes to your changes (e.g. I removed hitslop on Checkbox as Touchables were overflowing each other)

vercia
vercia approved these changes Sep 5, 2023
View reviewed changes
Copy link

@vercia vercia left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for your fixes, I checked this and it looks ok 👍

@MateuszRostkowski MateuszRostkowski merged commit b622f2f into main Sep 6, 2023
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@MSzalowski MSzalowski MSzalowski approved these changes

@vercia vercia vercia approved these changes

Assignees

@MateuszRostkowski MateuszRostkowski

Labels
chore Code change that does not impact UI
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Remove native-base
3 participants
@MateuszRostkowski @MSzalowski @vercia