<commit_before>// @flow
import * as ICONS from 'constants/icons';
import * as SETTINGS from 'constants/settings';
import * as PAGES from 'constants/pages';
import React, { Fragment } from 'react';
import { withRouter } from 'react-router';
import classnames from 'classnames';
import Button from 'component/button';
import LbcSymbol from 'component/common/lbc-symbol';
import WunderBar from 'component/wunderbar';
import Icon from 'component/common/icon';
import { Menu, MenuList, MenuButton, MenuItem } from '@reach/menu-button';
import Tooltip from 'component/common/tooltip';
import NavigationButton from 'component/navigationButton';
// @if TARGET='app'
import { IS_MAC } from 'component/app/view';
// @endif

type Props = {
  balance: string,
  roundedBalance: number,
  history: {
    entities: {}[],
    goBack: () => void,
    goForward: () => void,
    index: number,
    length: number,
    location: { pathname: string },
    push: string => void,
  },
  currentTheme: string,
  automaticDarkModeEnabled: boolean,
  setClientSetting: (string, boolean | string) => void,
  hideBalance: boolean,
  email: ?string,
  authenticated: boolean,
  authHeader: boolean,
  syncError: ?string,
  emailToVerify?: string,
  signOut: () => void,
  openMobileNavigation: () => void,
  openChannelCreate: () => void,
  openSignOutModal: () => void,
  clearEmailEntry: () => void,
  clearPasswordEntry: () => void,
};

const Header = (props: Props) => {
  const {
    roundedBalance,
    history,
    setClientSetting,
    currentTheme,
    automaticDarkModeEnabled,
    hideBalance,
    email,
    authenticated,
    authHeader,
    signOut,
    syncError,
    openMobileNavigation,
    openChannelCreate,
    openSignOutModal,
    clearEmailEntry,
    clearPasswordEntry,
    emailToVerify,
  } = props;

  // on the verify page don't let anyone escape other than by closing the tab to keep session data consistent
  const isVerifyPage = history.location.pathname.includes(PAGES.AUTH_VERIFY);
  const isSignUpPage = history.location.pathname.includes(PAGES.AUTH);
  const isSignInPage = history.location.pathname.includes(PAGES.AUTH_SIGNIN);

  // Sign out if they click the "x" when they are on the password prompt
  const authHeaderAction = syncError ? { onClick: signOut } : { navigate: '/' };
  const homeButtonNavigationProps = isVerifyPage ? {} : authHeader ? authHeaderAction : { navigate: '/' };
  const closeButtonNavigationProps = {
    onClick: () => {
      clearEmailEntry();
      clearPasswordEntry();

      if (isSignInPage && !emailToVerify) {
        history.goBack();
      }

      if (isSignUpPage) {
        history.goBack();
      }

      if (syncError) {
        signOut();
      }
    },
  };

  function handleThemeToggle() {
    if (automaticDarkModeEnabled) {
      setClientSetting(SETTINGS.AUTOMATIC_DARK_MODE_ENABLED, false);
    }

    if (currentTheme === 'dark') {
      setClientSetting(SETTINGS.THEME, 'light');
    } else {
      setClientSetting(SETTINGS.THEME, 'dark');
    }
  }

  function getWalletTitle() {
    return hideBalance ? (
      __('Wallet')
    ) : (
      <React.Fragment>
        {roundedBalance} <LbcSymbol />
      </React.Fragment>
    );
  }

  return (
    <header
      className={classnames('header', {
        'header--minimal': authHeader,
        // @if TARGET='web'
        'header--noauth-web': !authenticated,
        // @endif
        // @if TARGET='app'
        'header--mac': IS_MAC,
        // @endif
      })}
    >
      <div className="header__contents">
        <div className="header__navigation">
          <Button
            className="header__navigation-item header__navigation-item--lbry header__navigation-item--button-mobile"
            label={__('LBRY')}
            icon={ICONS.LBRY}
            onClick={() => window.scrollTo(0, 0)}
            {...homeButtonNavigationProps}
          />

          {/* @if TARGET='app' */}
          {!authHeader && (
            <div className="header__navigation-arrows">
              <NavigationButton isBackward history={history} />
              <NavigationButton isBackward={false} history={history} />
            </div>
          )}
          {/* @endif */}

          {!authHeader && <WunderBar />}
        </div>

        {!authHeader ? (
          <div className={classnames('header__menu', { 'header__menu--with-balance': !IS_WEB || authenticated })}>
            {(!IS_WEB || authenticated) && (
              <Fragment>
                <Button
                  aria-label={__('Your wallet')}
                  navigate={`/$/${PAGES.WALLET}`}
                  className="header__navigation-item menu__title header__navigation-item--balance"
                  label={getWalletTitle()}
                />
                <Menu><commit_msg>feat: header logo reloads at "/"<commit_after>// @flow
import * as ICONS from 'constants/icons';
import * as SETTINGS from 'constants/settings';
import * as PAGES from 'constants/pages';
import React, { Fragment } from 'react';
import { withRouter } from 'react-router';
import classnames from 'classnames';
import Button from 'component/button';
import LbcSymbol from 'component/common/lbc-symbol';
import WunderBar from 'component/wunderbar';
import Icon from 'component/common/icon';
import { Menu, MenuList, MenuButton, MenuItem } from '@reach/menu-button';
import Tooltip from 'component/common/tooltip';
import NavigationButton from 'component/navigationButton';
// @if TARGET='app'
import { IS_MAC } from 'component/app/view';
// @endif

type Props = {
  balance: string,
  roundedBalance: number,
  history: {
    entities: {}[],
    goBack: () => void,
    goForward: () => void,
    index: number,
    length: number,
    location: { pathname: string },
    push: string => void,
  },
  currentTheme: string,
  automaticDarkModeEnabled: boolean,
  setClientSetting: (string, boolean | string) => void,
  hideBalance: boolean,
  email: ?string,
  authenticated: boolean,
  authHeader: boolean,
  syncError: ?string,
  emailToVerify?: string,
  signOut: () => void,
  openMobileNavigation: () => void,
  openChannelCreate: () => void,
  openSignOutModal: () => void,
  clearEmailEntry: () => void,
  clearPasswordEntry: () => void,
};

const Header = (props: Props) => {
  const {
    roundedBalance,
    history,
    setClientSetting,
    currentTheme,
    automaticDarkModeEnabled,
    hideBalance,
    email,
    authenticated,
    authHeader,
    signOut,
    syncError,
    openMobileNavigation,
    openChannelCreate,
    openSignOutModal,
    clearEmailEntry,
    clearPasswordEntry,
    emailToVerify,
  } = props;

  // on the verify page don't let anyone escape other than by closing the tab to keep session data consistent
  const isVerifyPage = history.location.pathname.includes(PAGES.AUTH_VERIFY);
  const isSignUpPage = history.location.pathname.includes(PAGES.AUTH);
  const isSignInPage = history.location.pathname.includes(PAGES.AUTH_SIGNIN);

  // Sign out if they click the "x" when they are on the password prompt
  const authHeaderAction = syncError ? { onClick: signOut } : { navigate: '/' };
  const homeButtonNavigationProps = isVerifyPage ? {} : authHeader ? authHeaderAction : { navigate: '/' };
  const closeButtonNavigationProps = {
    onClick: () => {
      clearEmailEntry();
      clearPasswordEntry();

      if (isSignInPage && !emailToVerify) {
        history.goBack();
      }

      if (isSignUpPage) {
        history.goBack();
      }

      if (syncError) {
        signOut();
      }
    },
  };

  function handleThemeToggle() {
    if (automaticDarkModeEnabled) {
      setClientSetting(SETTINGS.AUTOMATIC_DARK_MODE_ENABLED, false);
    }

    if (currentTheme === 'dark') {
      setClientSetting(SETTINGS.THEME, 'light');
    } else {
      setClientSetting(SETTINGS.THEME, 'dark');
    }
  }

  function getWalletTitle() {
    return hideBalance ? (
      __('Wallet')
    ) : (
      <React.Fragment>
        {roundedBalance} <LbcSymbol />
      </React.Fragment>
    );
  }

  return (
    <header
      className={classnames('header', {
        'header--minimal': authHeader,
        // @if TARGET='web'
        'header--noauth-web': !authenticated,
        // @endif
        // @if TARGET='app'
        'header--mac': IS_MAC,
        // @endif
      })}
    >
      <div className="header__contents">
        <div className="header__navigation">
          <Button
            className="header__navigation-item header__navigation-item--lbry header__navigation-item--button-mobile"
            label={__('LBRY')}
            icon={ICONS.LBRY}
            onClick={() => {
              if (history.location.pathname === '/') window.location.reload();
            }}
            {...homeButtonNavigationProps}
          />

          {/* @if TARGET='app' */}
          {!authHeader && (
            <div className="header__navigation-arrows">
              <NavigationButton isBackward history={history} />
              <NavigationButton isBackward={false} history={history} />
            </div>
          )}
          {/* @endif */}

          {!authHeader && <WunderBar />}
        </div>

        {!authHeader ? (
          <div className={classnames('header__menu', { 'header__menu--with-balance': !IS_WEB || authenticated })}>
            {(!IS_WEB || authenticated) && (
              <Fragment>
                <Button
                  aria-label={__('Your wallet')}
                  navigate={`/$/${PAGES.WALLET}`}
                  className="header__navigation-item menu__title header__navigation-item--balance"
                  label={getWalletTitle()}
                />
                <Menu>
{'fraction_non_alphanumeric': 0.1315844048112816, 'fraction_numerical': 0.00020738282870178348, 'mean_word_length': 2.6177794448612155, 'pattern_counts': {'":': 0, '<': 37, '<?xml version=': 0, '>': 63, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2734833', 'n_tokens_mistral': 2825, 'n_tokens_neox': 2813, 'n_words': 607}