How to use the @turf/line-slice function in @turf/line-slice

let nStopsRemoved = toStopIndex - fromStopIndex
  if (modification.fromStop && modification.toStop) nStopsRemoved-- // -1 because it's an exclusive interval on both sides, don't include from and to stops

  let nStopsAdded = stops.length

  // the endpoints are included, subtract them off where they overlap with existing stops
  if (modification.fromStop) nStopsAdded--
  if (modification.toStop) nStopsAdded--

  // NB using indices here so we get an object even if fromStop or toStop is null
  // stops in pattern are in fact objects but they only have stop ID.
  const fromStop = feed.stopsById[pattern.stops[fromStopIndex].stop_id]
  const toStop = feed.stopsById[pattern.stops[toStopIndex].stop_id]

  const geometry = lineSlice(
    point([fromStop.stop_lon, fromStop.stop_lat]),
    point([toStop.stop_lon, toStop.stop_lat]),
    {
      type: 'Feature',
      geometry: pattern.geometry,
      properties: {}
    }
  )

  const removedLengthThisPattern = turfLength(geometry)

  return (
    <table></table>

splitLine: function (e) {
    const { draw } = this;
    const ids = draw.getFeatureIdsAt(e.point);
    if (!ids.length) { return; }
    const line = draw.get(ids[0]);
    const cursorAt = point([e.lngLat.lng, e.lngLat.lat]);

    // delete the existing line, and add two additional lines.
    draw.delete(line.id);
    const newIds = [];
    newIds.push(draw.add(lineSlice(point(firstCoord(line)), cursorAt, line)));
    newIds.push(draw.add(lineSlice(cursorAt, point(lastCoord(line)), line)));

    this.splitMode({ featureIds: newIds });
    const newLines = newIds.map(id => draw.get(id));

    // Mark the new lines as edited
    newLines.forEach(this.markAsEdited);
    const actions = newLines.map(createRedo).concat(createUndo(line));
    this.props.dispatch(updateSelection(actions));
  },

const makeGeometryIfNecessary = () => {
          // TODO: SIDE EFFECTS!!
          if (startHopIndex >= 0) {
            // get geometry
            const fromStopId = pattern.stops[startHopIndex].stop_id
            const fromStop = feed.stopsById[fromStopId]
            // get feature at end of hop
            const toStopId = pattern.stops[prevHopIndex + 1].stop_id
            const toStop = feed.stopsById[toStopId]
            const geometry = lineSlice(
              point([fromStop.stop_lon, fromStop.stop_lat]),
              point([toStop.stop_lon, toStop.stop_lat]),
              {
                type: 'Feature',
                properties: {},
                geometry: pattern.geometry
              }
            )

            selectedHopGeometries.push(geometry)
          }
        }

// make sure to find a toStopIndex _after_ the fromStopIndex (helps with loop routes also)
      const toStopIndex = modification.toStop != null
        ? pattern.stops.findIndex(
          (s, i) => i > fromStopIndex && s.stop_id === modification.toStop
        )
        : pattern.stops.length - 1

      const modificationAppliesToThisPattern =
        fromStopIndex !== -1 && toStopIndex !== -1
      if (modificationAppliesToThisPattern) {
        // NB using indices here so we get an object even if fromStop or toStop
        // is null stops in pattern are in fact objects but they only have stop ID.
        const fromStop = feed.stopsById[pattern.stops[fromStopIndex].stop_id]
        const toStop = feed.stopsById[pattern.stops[toStopIndex].stop_id]

        return lineSlice(
          point([fromStop.stop_lon, fromStop.stop_lat]),
          point([toStop.stop_lon, toStop.stop_lat]),
          {
            type: 'Feature',
            geometry: pattern.geometry,
            properties: {}
          }
        )
      }
    })
    .filter(segment => !!segment)

splitLine: function (e) {
    const { draw } = this;
    const ids = draw.getFeatureIdsAt(e.point);
    if (!ids.length) { return; }
    const line = draw.get(ids[0]);
    const cursorAt = point([e.lngLat.lng, e.lngLat.lat]);

    // delete the existing line, and add two additional lines.
    draw.delete(line.id);
    const newIds = [];
    newIds.push(draw.add(lineSlice(point(firstCoord(line)), cursorAt, line)));
    newIds.push(draw.add(lineSlice(cursorAt, point(lastCoord(line)), line)));

    this.splitMode({ featureIds: newIds });
    const newLines = newIds.map(id => draw.get(id));

    // Mark the new lines as edited
    newLines.forEach(this.markAsEdited);
    const actions = newLines.map(createRedo).concat(createUndo(line));
    this.props.dispatch(updateSelection(actions));
  },

computeInfoDistanceKm = (
    infoLat: number,
    infoLon: number,
    geojsonLineString,
  ) => {
    const p1 = point(geojsonLineString.geometry.coordinates[0]);
    const p2 = point([infoLon, infoLat]);
    return turfLength(turfLineSlice(p1, p2, geojsonLineString));
  };