index.js

'use strict';

const DEFAULT_TITLE = 'Hyper';
const LOCK_PREFIX = '__MULTICLI_TITLE_LOCK__:';
const UNLOCK_TITLE = '__MULTICLI_TITLE_UNLOCK__';

exports.decorateConfig = (config) => ({
  ...config,
  env: {...config.env, NINI_AGENTS_HYPER_TITLE_LOCK: '1'}
});

exports.decorateTerm = (Term, {React}) =>
  class ProfileTitleTerm extends React.PureComponent {
    constructor(props) {
      super(props);
      this.profileTitle = null;
      this.onTitle = (title) => {
        if (title.startsWith(LOCK_PREFIX)) {
          this.profileTitle = title.slice(LOCK_PREFIX.length).trim() || null;
          this.props.onTitle(this.profileTitle || DEFAULT_TITLE);
        } else if (title === UNLOCK_TITLE) {
          this.profileTitle = null;
          this.props.onTitle(DEFAULT_TITLE);
        } else if (this.profileTitle === null) {
          this.props.onTitle(title);
        }
      };
    }

    render() {
      return React.createElement(Term, {...this.props, onTitle: this.onTitle});
    }
  };

function getActiveTabTitle(tabs) {
  if (!Array.isArray(tabs)) {
    return DEFAULT_TITLE;
  }

  const activeTab = tabs.find((tab) => tab.isActive);
  const title = activeTab && typeof activeTab.title === 'string' ? activeTab.title.trim() : '';
  return title || DEFAULT_TITLE;
}

exports.decorateHeader = (Header, {React}) =>
  class ActiveTabWindowTitle extends React.PureComponent {
    componentDidMount() {
      this.syncWindowTitle();
    }

    componentDidUpdate() {
      this.syncWindowTitle();
    }

    componentWillUnmount() {
      document.title = DEFAULT_TITLE;
    }

    syncWindowTitle() {
      const title = getActiveTabTitle(this.props.tabs);
      if (document.title !== title) {
        document.title = title;
      }
    }

    render() {
      return React.createElement(Header, this.props);
    }
  };