\n );\n}\n\nCommentsCount.propTypes = {\n commentsCount: PropTypes.number.isRequired,\n};\n\nexport default CommentsCount;\n","export const ROUTER_PATH = '/';\nexport const REACT_ROUTER_PATH = '/react-router';\nexport const NO_ROUTER_PATH = '/no-router';\nexport const RESCRIPT_PATH = '/rescript';\nexport const SIMPLE_REACT_PATH = '/simple';\nexport const STIMULUS_PATH = '/stimulus';\nexport const RAILS_PATH = '/comments';\n","// https://github.com/eslint/eslint/issues/6876\n// eslint-disable new-cap\n\nimport classNames from 'classnames';\nimport _ from 'lodash';\nimport React, { useState } from 'react';\nimport PropTypes from 'prop-types';\n\nimport CommentsCount from './CommentsCount.jsx';\nimport * as paths from '../../constants/paths';\n\nfunction NavigationBar(props) {\n const { commentsCount, pathname } = props;\n\n const [isOpen, setIsOpen] = useState(false);\n\n const menuWrapperClasses = 'flex flex-col lg:flex-row flex-wrap lg:items-center lg:visible';\n\n return (\n \n );\n}\n\nNavigationBar.propTypes = {\n commentsCount: PropTypes.number,\n pathname: PropTypes.string.isRequired,\n};\n\nexport default NavigationBar;\n","import { connect } from 'react-redux';\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport BaseComponent from '../../../libs/components/BaseComponent.jsx';\n\nimport NavigationBar from '../components/NavigationBar/NavigationBar.jsx';\n\nfunction stateToProps(state) {\n // Which part of the Redux global state does our component want to receive as props?\n if (state.$$commentsStore) {\n return {\n commentsCount: state.$$commentsStore.get('$$comments').size,\n pathname: state.railsContext.pathname,\n };\n }\n return {};\n}\n\nclass NavigationBarContainer extends BaseComponent {\n static propTypes = {\n commentsCount: PropTypes.number.isRequired,\n pathname: PropTypes.string.isRequired,\n };\n\n render() {\n const { commentsCount, pathname } = this.props;\n\n return ;\n }\n}\n\n// Don't forget to actually use connect!\nexport default connect(stateToProps)(NavigationBarContainer);\n","// Top level component for client side.\n// Compare this to the ./ServerApp.jsx file which is used for server side rendering.\n\nimport { Provider } from 'react-redux';\nimport React from 'react';\nimport ReactOnRails from 'react-on-rails';\n\nimport NavigationBar from '../components/NavigationBar/NavigationBar.jsx';\nimport NavigationBarContainer from '../containers/NavigationBarContainer.jsx';\nimport * as paths from '../constants/paths';\n\n/*\n * Export a function that returns a ReactComponent, depending on a store named SharedReduxStore.\n * This is used for the client rendering hook after the page html is rendered.\n * React will see that the state is the same and not do anything.\n */\nfunction NavigationBarAppFactory(_props, railsContext) {\n // This is where we get the existing store.\n const { pathname } = railsContext;\n let store;\n if (pathname === paths.ROUTER_PATH) {\n store = ReactOnRails.getStore('routerCommentsStore', false);\n } else if (pathname === paths.NO_ROUTER_PATH) {\n store = ReactOnRails.getStore('commentsStore', false);\n } else {\n return function NavigationBarApp() {\n return ;\n };\n }\n\n // eslint interprets the return as a new component definition, which is not the case\n // eslint-disable-next-line react/display-name, react/no-unstable-nested-components\n return function NavigationBarApp() {\n return (\n \n \n \n );\n };\n}\n\nexport default NavigationBarAppFactory;\n","import { Controller } from '@hotwired/stimulus';\nimport * as ActionCable from '@rails/actioncable';\nimport * as marked from 'marked';\nimport { gfmHeadingId } from 'marked-gfm-heading-id';\nimport { mangle } from 'marked-mangle';\n\nmarked.use(gfmHeadingId());\nmarked.use(mangle());\n\nexport default class extends Controller {\n static targets = ['commentList', 'commentAuthor', 'commentText', 'commentRefresh', 'alertDiv', 'errorList'];\n\n resetText() {\n const inputAuthor = this.commentAuthorTarget;\n const inputText = this.commentTextTarget;\n const alertDiv = this.alertDivTarget;\n const errorList = this.errorListTarget;\n\n const errors = [];\n\n if (!inputAuthor.value || !inputText.value) {\n errorList.innerHTML = '';\n if (!inputAuthor.value) {\n errors.push('Author');\n } else if (!inputText.value) {\n errors.push('Text');\n } else {\n errors.push('Author');\n errors.push('Text');\n }\n errors.forEach((error) => {\n const errorString = `