history#Path TypeScript Examples

The following examples show how to use history#Path. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: utils.ts    From backstage with Apache License 2.0 7 votes vote down vote up
export function isLocationMatch(currentLocation: Location, toLocation: Path) {
  const toDecodedSearch = new URLSearchParams(toLocation.search).toString();
  const toQueryParameters = qs.parse(toDecodedSearch);

  const currentDecodedSearch = new URLSearchParams(
    currentLocation.search,
  ).toString();
  const currentQueryParameters = qs.parse(currentDecodedSearch);

  const matching =
    isEqual(toLocation.pathname, currentLocation.pathname) &&
    isMatch(currentQueryParameters, toQueryParameters);

  return matching;
}
Example #2
Source File: utils.test.ts    From backstage with Apache License 2.0 6 votes vote down vote up
describe('isLocationMatching', () => {
  let currentLocation: Location;
  let toLocation: Path;

  it('return false when pathname in target and current location differ', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?kind=component',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = {
      pathname: '/catalog-a',
      search: '?kind=component',
      hash: '',
    };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(false);
  });

  it('return true when exact match between current and target location parameters', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?kind=component',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = { pathname: '/catalog', search: '?kind=component', hash: '' };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(true);
  });

  it('return true when target query parameters are subset of current location query parameters', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?x=foo&y=bar',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = { pathname: '/catalog', search: '?x=foo', hash: '' };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(true);
  });

  it('return false when no matching query parameters between target and current location', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?y=bar',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = { pathname: '/catalog', search: '?x=foo', hash: '' };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(false);
  });

  it('return true when query parameters match in different order', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?y=bar&x=foo',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = { pathname: '/catalog', search: '?x=foo&y=bar', hash: '' };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(true);
  });

  it('return true when there is a matching query parameter alongside extra parameters', async () => {
    currentLocation = {
      pathname: '/catalog',
      search: '?y=bar&x=foo',
      state: null,
      hash: '',
      key: '',
    };
    toLocation = { pathname: '/catalog', search: '', hash: '' };
    expect(isLocationMatch(currentLocation, toLocation)).toBe(true);
  });
});
Example #3
Source File: BaseRoute.tsx    From electron with MIT License 6 votes vote down vote up
PackingWithAuth: React.FC<{ onChange?: PackingWithAuthOnChange }> = ({ children, onChange }) => {
  const _onChange = (from: string, to: string, next: (path: Path, state?: LocationState) => void) => {
    /** if ('登录状态失效') { message.success('登录状态失效,请重新登录'); next('/login') } */
  };
  return (
    <BaseRouteChange onChange={onChange || _onChange}>
      <Suspense fallback={<RouterWrapSpin />}>
        <Switch>
          {children}
          <Route path="*" component={RouterWrapNotFound}></Route>
        </Switch>
      </Suspense>
    </BaseRouteChange>
  );
}