<commit_before>import React, { Fragment } from 'react';
import { PropTypes } from 'prop-types';

import ResizeDetector from 'react-resize-detector';

import { Route, Location } from '../../router';
import SettingsPages from '../../settings';

import * as S from './container';

const Desktop = ({ Panel, Nav, Preview, options }) => (
  <S.Root>
    <Location>
      {({ location }) => (
        <ResizeDetector handleWidth handleHeight>
          {(width, height) =>
            width && height ? (
              <S.Layout location={location} options={options} bounds={{ width, height }}>
                {({ navProps, mainProps, panelProps, previewProps }) => (
                  <Fragment>
                    <S.Nav {...navProps}>
                      <Nav debug={navProps} />
                    </S.Nav>
                    <S.Main {...mainProps}>
                      <S.Preview
                        {...previewProps}
                        hidden={!location.match(/^\/(components|info)\//)}
                      >
                        <Preview
                          toolbar
                          isFullscreen={previewProps.isFullscreen}
                          id="iframe"
                          location={location}
                          debug={previewProps}
                        />
                      </S.Preview>

                      <S.Panel
                        {...panelProps}
                        hidden={location.match(/\/settings\/(about|shortcuts)/)}
                      >
                        <Panel
                          debug={panelProps}
                          hidden={location.match(/\/settings\/(about|shortcuts)/)}
                        />
                      </S.Panel>

                      <Route path="/settings" startsWith>
                        <SettingsPages />
                      </Route>
                    </S.Main>
                  </Fragment>
                )}
              </S.Layout>
            ) : (
              <div>blaaat</div>
            )
          }
        </ResizeDetector>
      )}
    </Location>
  </S.Root>
);

Desktop.propTypes = {
  Nav: PropTypes.func.isRequired,
  Preview: PropTypes.func.isRequired,
  Panel: PropTypes.func.isRequired,
  options: PropTypes.shape({
    isFullscreen: PropTypes.bool.isRequired,<commit_msg>FIX panel being visible on non component pages<commit_after>import React, { Fragment } from 'react';
import { PropTypes } from 'prop-types';

import ResizeDetector from 'react-resize-detector';

import { Route, Location } from '../../router';
import SettingsPages from '../../settings';

import * as S from './container';

const Desktop = ({ Panel, Nav, Preview, options }) => (
  <S.Root>
    <Location>
      {({ location }) => (
        <ResizeDetector handleWidth handleHeight>
          {(width, height) =>
            width && height ? (
              <S.Layout location={location} options={options} bounds={{ width, height }}>
                {({ navProps, mainProps, panelProps, previewProps }) => (
                  <Fragment>
                    <S.Nav {...navProps}>
                      <Nav debug={navProps} />
                    </S.Nav>
                    <S.Main {...mainProps}>
                      <S.Preview
                        {...previewProps}
                        hidden={!location.match(/^\/(components|info)\//)}
                      >
                        <Preview
                          toolbar
                          isFullscreen={previewProps.isFullscreen}
                          id="iframe"
                          location={location}
                          debug={previewProps}
                        />
                      </S.Preview>

                      <S.Panel {...panelProps} hidden={!location.match(/\/components/)}>
                        <Panel debug={panelProps} />
                      </S.Panel>

                      <Route path="/settings" startsWith>
                        <SettingsPages />
                      </Route>
                    </S.Main>
                  </Fragment>
                )}
              </S.Layout>
            ) : (
              <div>blaaat</div>
            )
          }
        </ResizeDetector>
      )}
    </Location>
  </S.Root>
);

Desktop.propTypes = {
  Nav: PropTypes.func.isRequired,
  Preview: PropTypes.func.isRequired,
  Panel: PropTypes.func.isRequired,
  options: PropTypes.shape({
    isFullscreen: PropTypes.bool.isRequired,
{'fraction_non_alphanumeric': 0.12985571587125416, 'fraction_numerical': 0.0, 'mean_word_length': 1.1325130146710838, 'pattern_counts': {'":': 0, '<': 55, '<?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': '7472945', 'n_tokens_mistral': 1118, 'n_tokens_neox': 1067, 'n_words': 207}