Skip to content

[autocomplete][docs] Improve Google Maps search example#44708

Merged
oliviertassinari merged 3 commits intomui:masterfrom
oliviertassinari:new-google-maps-api
Feb 4, 2025
Merged

[autocomplete][docs] Improve Google Maps search example#44708
oliviertassinari merged 3 commits intomui:masterfrom
oliviertassinari:new-google-maps-api

Conversation

@oliviertassinari
Copy link
Member

@oliviertassinari oliviertassinari commented Dec 9, 2024

Preview: https://deploy-preview-44708--material-ui.netlify.app/material-ui/react-autocomplete/#google-maps-place

Initially, I thought I could quickly handle https://developers.google.com/maps/documentation/javascript/places-migration-autocomplete. It was much harder than expected 😅

I have tried to make the demo crash, like in #35391 but couldn't find a way.

We can use https://console.cloud.google.com/google/maps-apis/metrics?hl=en&inv=1&invt=Abjs3A&project=material-ui-docs to keep track of the API usage, make sure it's still OK.


As for why work on this, see https://github.com/NiazMorshed2007/shadcn-address-autocomplete/, unless the community builds this, we need to stay up to date to stay relevant.


Side note, we are supposed to give logo attribution: https://developers.google.com/maps/documentation/javascript/policies#logo

If your application uses search fields with or without autocomplete, the logo must be displayed inline.

e.g. https://developers.google.com/maps/documentation/javascript/place-autocomplete-new

SCR-20241215-tpel

@oliviertassinari oliviertassinari added docs Improvements or additions to the documentation. scope: autocomplete Changes related to the autocomplete. This includes ComboBox. labels Dec 9, 2024
@mui-bot
Copy link

mui-bot commented Dec 9, 2024

Netlify deploy preview

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against e40322d

@@ -1,10 +1,7 @@
export default function loadScript(src: string, position: HTMLElement | null) {
export default function loadScript(src: string, position: HTMLElement) {
Copy link
Member Author

Choose a reason for hiding this comment

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

Code style, no defensive logic in places where it's not their business logic to have.

);
return (
<li key={key} {...optionProps}>
<Grid container sx={{ alignItems: 'center' }}>
Copy link
Member Author

Choose a reason for hiding this comment

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

Migrate to Grid2, one more. We should really migrate the whole codebase.

Comment on lines -159 to +246
sx={{ fontWeight: part.highlight ? 'bold' : 'regular' }}
sx={{
fontWeight: part.highlight
? 'fontWeightBold'
: 'fontWeightRegular',
}}
Copy link
Member Author

Choose a reason for hiding this comment

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

Rely on the design token, not hard-coded values.

import Typography from '@mui/material/Typography';
import parse from 'autosuggest-highlight/parse';
import { debounce } from '@mui/material/utils';
import throttle from 'lodash/throttle';
Copy link
Member Author

Choose a reason for hiding this comment

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

Trying to go back to a better UX after #35545.

@oliviertassinari oliviertassinari added type: bug It doesn't behave as expected. type: regression A bug, but worse, it used to behave as expected. labels Dec 28, 2024
@oliviertassinari oliviertassinari merged commit a85cd3e into mui:master Feb 4, 2025
9 checks passed
@oliviertassinari oliviertassinari deleted the new-google-maps-api branch February 4, 2025 22:35
@oliviertassinari oliviertassinari removed the type: bug It doesn't behave as expected. label Apr 30, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

docs Improvements or additions to the documentation. scope: autocomplete Changes related to the autocomplete. This includes ComboBox. type: regression A bug, but worse, it used to behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants