How to use the history.createLocation function in history

useEffect(() => {
    if (prevToRef == null || !locationsAreEqual(createLocation(prevToRef), createLocation(props.to))) {
      perform(props, router);
    }
  });

import { MemoryRouter } from "@pixeloven-react/routing";
import { storiesOf } from "@storybook/react";
import { createLocation, createMemoryHistory } from "history";
import React from "react";

import Default from "./Default";
import Readme from "./README.md";

const history = createMemoryHistory();
const location = createLocation("/testing");
const match = {
    isExact: false,
    params: {},
    path: "/",
    url: "testing",
};

storiesOf("Components/Templates/Default", module).add(
    "default",
    () => (
        
            
        
    ),
    {
        notes: { markdown: Readme },

function mergeLocations (target, current) {
  let location
  if (typeof target === 'string') {
    location = parsePath(target)
  } else {
    location = { ...target }
  }
  location.search = stringifyQs({
    ...parseQs(current.search),
    ...parseQs(location.search)
  })
  return createLocation(location, null, null, current)
}

render() {
    const sysex = encodeSysexData(encodeProgram(this.props.program));
    const data = pako.deflate(sysex);
    const encodedProgram = base32Encode(data, 'Crockford');
    const location = createLocation(`/?sysex=${encodedProgram}`, null, null, history.location);
    const href = history.createHref(location);
    const current = window.location;
    const url = urljoin(`${current.protocol}//${current.host}`, href);
    return (
      <div style="{{">
        <p>Use this link to share your program</p>
        <input value="{url}" readonly="{true}" style="{{" type="text"> { this.el = el; }}
        /&gt;
        <button title="Copy Link to Clipboard"></button></div>

_proto.navigateTo = function navigateTo(location, action) {
    var _this$props = this.props,
        _this$props$basename = _this$props.basename,
        basename = _this$props$basename === void 0 ? "" : _this$props$basename,
        _this$props$context = _this$props.context,
        context = _this$props$context === void 0 ? {} : _this$props$context;
    context.action = action;
    context.location = addBasename(basename, history.createLocation(location));
    context.url = createURL(context.location);
  };

var normalizeToLocation = function normalizeToLocation(to, currentLocation) {
  return typeof to === "string" ? createLocation(to, null, null, currentLocation) : to;
};

function createHiddenLocation(state) {
  if (!state) return null
  const location = createLocation(state[1], state[2])
  location.hidden = true
  return location
}

_proto.render = function render() {
    var _this$props2 = this.props,
        _this$props2$basename = _this$props2.basename,
        basename = _this$props2$basename === void 0 ? "" : _this$props2$basename,
        _this$props2$context = _this$props2.context,
        context = _this$props2$context === void 0 ? {} : _this$props2$context,
        _this$props2$location = _this$props2.location,
        location = _this$props2$location === void 0 ? "/" : _this$props2$location,
        rest = _objectWithoutPropertiesLoose(_this$props2, ["basename", "context", "location"]);

    var history$1 = {
      createHref: function createHref(path) {
        return addLeadingSlash(basename + createURL(path));
      },
      action: "POP",
      location: stripBasename(basename, history.createLocation(location)),
      push: this.handlePush,
      replace: this.handleReplace,
      go: staticHandler("go"),
      goBack: staticHandler("goBack"),
      goForward: staticHandler("goForward"),
      listen: this.handleListen,
      block: this.handleBlock
    };
    return React.createElement(Router, _extends({}, rest, {
      history: history$1,
      staticContext: context
    }));
  };

export function Link(props: ILinkProps) {
  const context = useRouter();

  const { replace, to, ...rest } = props;

  const location = typeof to === "string" ? createLocation(to, null, undefined, context.location) : to;

  const href = location ? context.history.createHref(location) : "";

  return (
    <a href="{href}"> {
        if (props.onClick) {
          props.onClick(event);
        }
        handleClick(event, () =&gt; {
          (replace ? context.history.replace : context.history.push)(location);
        });
      }}
    /&gt;</a>

public replace(location: RootLocationDescriptorObject): void {
    this.location = history.createLocation(location);
  }