// @flow
import * as React from 'react';
import { inject } from 'mobx-react';
import DataLoader from './components/DataLoader';

class KeyedDocument extends React.Component<*> {
  componentWillUnmount() {
    this.props.ui.clearActiveDocument();
  }

  render() {
    const { documentSlug, revisionId } = this.props.match.params;

    // the urlId portion of the url does not include the slugified title
    // we only want to force a re-mount of the document component when the
    // document changes, not when the title does so only this portion is used
    // for the key.
    const urlParts = documentSlug ? documentSlug.split('-') : [];
    const urlId = urlParts.length ? urlParts[urlParts.length - 1] : undefined;

    return <DataLoader key={[urlId, revisionId].join('/')} {...this.props} />;
  }
}

export default inject('ui')(KeyedDocument);