Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://visgl.github.io/react-google-maps/docs/guides/migrating-from-react-wrapper below:

Migrating from @googlemaps/react-wrapper | React Google Maps

import React, {
  FunctionComponent,
  PropsWithChildren,
  ReactNode,
  useEffect
} from 'react';

import {
  APILoadingStatus,
  APIProvider,
  APIProviderProps,
  useApiLoadingStatus
} from '@vis.gl/react-google-maps';

const STATUS_MAP = {
  [APILoadingStatus.LOADING]: 'LOADING',
  [APILoadingStatus.LOADED]: 'SUCCESS',
  [APILoadingStatus.FAILED]: 'FAILURE'
} as const;

type WrapperProps = PropsWithChildren<
  {
    apiKey: string;
    callback?: (status: string) => void;
    render?: (status: string) => ReactNode;
  } & APIProviderProps
>;

export const Wrapper: FunctionComponent<WrapperProps> = ({
  apiKey,
  children,
  render,
  callback,
  ...apiProps
}) => {
  return (
    <APIProvider apiKey={apiKey} {...apiProps}>
      <InnerWrapper render={render}>{children}</InnerWrapper>
    </APIProvider>
  );
};

const InnerWrapper = ({
  callback,
  render,
  children
}: PropsWithChildren<Omit<WrapperProps, 'apiKey'>>) => {
  const status = useApiLoadingStatus();
  const mappedStatus = STATUS_MAP[status] ?? 'LOADING';

  useEffect(() => {
    if (callback) callback(mappedStatus);
  }, [callback, mappedStatus]);

  if (status === APILoadingStatus.LOADED) return children;
  if (render) return render(mappedStatus);

  return <></>;
};

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4