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.

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

fix: custom bridge and exchange select indicator #130

Merged
merged 16 commits into from
Sep 21, 2023

Conversation

Abhikumar98
Copy link
Contributor

CleanShot.2023-09-15.at.14.53.58.mp4

Comment on lines 19 to 24
const { enabledBridges, enabledExchanges } = useSettingsStore((state) => {
return {
enabledBridges: state.enabledBridges,
enabledExchanges: state.enabledExchanges,
};
});
Copy link
Member

Choose a reason for hiding this comment

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

Please use an array and shallow equality function, see other usages of zustand in the app.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

okay, checking it out

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I've pushed the changes, I get the importance of shallow but a personal opinion, I prefer Object > Array for de-structuring because with objects there isn't any positional values involved, meaning it's differentiated by the unique keys.

But with arrays, wrong positions could lead to incorrect values.

Is there any particular reason to prefer array in a case where we are just reading the values from zustand store?

Copy link
Member

Choose a reason for hiding this comment

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

It is the way it works with some other stuff in react like const [state, setState] = useState() and also just less code with no need for mapping, etc. Maybe it is also more performant than the object, but I didn't check that.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Correct, but ideally in react the pattern follow something like the first element is state and the second element is the handler to update the state.

But in this case we are only reading the states from Settings store. Particularly in this scenario, I wanted to know if having it in array helps.

@Abhikumar98
Copy link
Contributor Author

CleanShot.2023-09-18.at.19.03.08.mp4

Hey @chybisov,
I've pushed the changes and here's the current working video of the widget.

Although, for gasPrice I didn't really find a type in WidgetConfig hence commented out the code for it but the rest of the settings are working as discussed above

@chybisov
Copy link
Member

I don't see any changes to the code 👀

@Abhikumar98
Copy link
Contributor Author

I don't see any changes to the code 👀

Hey, forgot to push changes, haha.
Pushed now

packages/widget-playground/src/App.tsx Outdated Show resolved Hide resolved
packages/widget/src/stores/settings/useSettingsStore.ts Outdated Show resolved Hide resolved
packages/widget/src/stores/settings/useSettingsStore.ts Outdated Show resolved Hide resolved
@chybisov
Copy link
Member

Also, I hope you've tested light theme 😄

@Abhikumar98
Copy link
Contributor Author

Also, I hope you've tested light theme 😄

We need to reset this as well?
I mean, for this we'll hide the message and only show the button right?

@Abhikumar98
Copy link
Contributor Author

Also, I hope you've tested light theme 😄

CleanShot.2023-09-18.at.23.28.27.mp4

@chybisov
Copy link
Member

Also, I hope you've tested light theme 😄

We need to reset this as well? I mean, for this we'll hide the message and only show the button right?

I'm not sure that we need to reset the theme settings - for some users dark theme can be considered as default. 🤔 Let's leave this button only for route stuff for now.

@Abhikumar98
Copy link
Contributor Author

Abhikumar98 commented Sep 20, 2023

Also, I hope you've tested light theme 😄

We need to reset this as well? I mean, for this we'll hide the message and only show the button right?

I'm not sure that we need to reset the theme settings - for some users dark theme can be considered as default. 🤔 Let's leave this button only for route stuff for now.

Alright, removing the reset functionality from theme

CleanShot.2023-09-20.at.13.22.30.mp4

@@ -98,10 +99,11 @@ export const useSettingsStore = createWithEqualityFn<SettingsState>(
),
})),
reset: (config, bridges, exchanges) => {
const { appearance, ...restDefaultsettings } = defaultSettings;
Copy link
Member

Choose a reason for hiding this comment

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

Please restDefaultsettings -> restDefaultSettings

.eslintrc Show resolved Hide resolved
@Abhikumar98
Copy link
Contributor Author

pushed all the review changes @chybisov

@Abhikumar98 Abhikumar98 merged commit 05fb020 into main Sep 21, 2023
1 check passed
@Abhikumar98 Abhikumar98 deleted the lf-1639-custom-settings-indicator branch September 21, 2023 13:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants