diff --git a/app/javascript/chat/components/ChannelButton.jsx b/app/javascript/chat/components/ChannelButton.jsx index 67d70cae5..f728e49e4 100644 --- a/app/javascript/chat/components/ChannelButton.jsx +++ b/app/javascript/chat/components/ChannelButton.jsx @@ -6,22 +6,24 @@ import { ChannelImage } from './ChannelImage'; import { Button } from '@crayons'; /** - * Render the channel button + * Render a button to switch focus to a channel + * * @param {object} props - * + * * @component - * + * * @example - * - * * */ + export function ChannelButton(props) { const buttonRef = createRef(); const { isActiveChannel = false } = props; diff --git a/app/javascript/chat/components/ChannelFilterButton.jsx b/app/javascript/chat/components/ChannelFilterButton.jsx index 1f566a3b9..ccd483d00 100644 --- a/app/javascript/chat/components/ChannelFilterButton.jsx +++ b/app/javascript/chat/components/ChannelFilterButton.jsx @@ -22,7 +22,7 @@ import { Button } from '@crayons'; * /> */ -export const ChannelFilterButton = ({ type, name, active, onClick }) => { +export function ChannelFilterButton({ type, name, active, onClick }) { return ( ); -}; +} ChannelFilterButton.propTypes = { type: PropTypes.string.isRequired, diff --git a/app/javascript/chat/components/ChannelImage.jsx b/app/javascript/chat/components/ChannelImage.jsx index 81e336177..47aa35cb9 100644 --- a/app/javascript/chat/components/ChannelImage.jsx +++ b/app/javascript/chat/components/ChannelImage.jsx @@ -2,9 +2,32 @@ import { h } from 'preact'; import PropTypes from 'prop-types'; import { defaultChannelPropTypes } from '../../common-prop-types/channel-list-prop-type'; -export function ChannelImage(props) { - const { channel, newMessagesIndicator, discoverableChannel } = props; +/** + * Returns an image to help users identify chat channels + * + * @param {object} channel - Contains information about the channel this image represents + * @param {string} newMessagesIndicator - Used to construct a CSS classname + * @param {boolean} discoverableChannel - Used to determine which CSS class should be applied + * + * @example + * + */ +export function ChannelImage({ + channel, + newMessagesIndicator, + discoverableChannel, +}) { return ( * */