random-mirrors
/
gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated classNames constant in components that werent using 

• Updated:
- classNames constant in components that werent using
This commit is contained in:
mgabdev 2020-08-18 19:39:06 -05:00
parent 99982c0391
commit 2f4700e89f
23 changed files with 64 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/javascript/gabsocial/components/button.js
View File

@ -1,12 +1,9 @@
import React from 'react'
import PropTypes from 'prop-types'
import { NavLink } from 'react-router-dom'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import Icon from './icon'
// Bind CSS Modules global variable `_s` to classNames module
const cx = classNames.bind(_s)
// Define colors for enumeration for Button component `color`, `backgroundColor` props
const COLORS = {
primary: 'primary',
@ -108,7 +105,7 @@ class Button extends React.PureComponent {
} = this.props
// Style the component according to props
const classes = noClasses ? className : cx(className, {
const classes = noClasses ? className : CX(className, {
d: 1,
noUnderline: 1,
font: 1,

6
app/javascript/gabsocial/components/composer.js
View File

@ -13,13 +13,11 @@ import {
import draftToMarkdown from '../features/ui/util/draft_to_markdown'
import markdownToDraft from '../features/ui/util/markdown_to_draft'
import { urlRegex } from '../features/ui/util/url_regex'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import RichTextEditorBar from './rich_text_editor_bar'
import '!style-loader!css-loader!draft-js/dist/Draft.css'
const cx = classNames.bind(_s)
const markdownOptions = {
escapeMarkdownCharacters: false,
preserveNewlines: true,
@ -237,7 +235,7 @@ class Composer extends React.PureComponent {
} = this.props
const { editorState } = this.state
const editorContainerClasses = cx({
const editorContainerClasses = CX({
d: 1,
cursorText: 1,
text: 1,

7
app/javascript/gabsocial/components/group_collection_item.js
View File

@ -5,14 +5,11 @@ import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { NavLink } from 'react-router-dom'
import { defineMessages, injectIntl } from 'react-intl'
import classNames from 'classnames/bind'
import { PLACEHOLDER_MISSING_HEADER_SRC } from '../constants'
import { PLACEHOLDER_MISSING_HEADER_SRC, CX } from '../constants'
import { shortNumberFormat } from '../utils/numbers'
import Image from './image'
import Text from './text'
const cx = classNames.bind(_s)
class GroupCollectionItem extends ImmutablePureComponent {
render() {
@ -41,7 +38,7 @@ class GroupCollectionItem extends ImmutablePureComponent {
)
}
const navLinkClasses = cx({
const navLinkClasses = CX({
d: 1,
noUnderline: 1,
overflowHidden: 1,

7
app/javascript/gabsocial/components/heading.js
View File

@ -1,9 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
// Bind CSS Modules global variable `_s` to classNames module
const cx = classNames.bind(_s)
import { CX } from '../constants'
// Define sizes for enumeration for Heading component `size` prop
const SIZES = {
@ -35,7 +32,7 @@ class Heading extends React.PureComponent {
const { children, size, isCentered } = this.props
// Each size has it's own custom style
const classes = cx({
const classes = CX({
d: 1,
text: 1,
textAlignCenter: isCentered,

6
app/javascript/gabsocial/components/image.js
View File

@ -1,8 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
const cx = classNames.bind(_s)
import { CX } from '../constants'
class Image extends React.PureComponent {
@ -27,7 +25,7 @@ class Image extends React.PureComponent {
} = this.props
const { error } = this.state
const classes = cx(className, {
const classes = CX(className, {
d: 1,
objectFitCover: !!src && fit === 'cover',
bgSecondary: !src,

8
app/javascript/gabsocial/components/input.js
View File

@ -1,12 +1,10 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import Button from './button'
import Icon from './icon'
import Text from './text'
const cx = classNames.bind(_s)
class Input extends React.PureComponent {
handleOnChange = (e) => {
@ -33,7 +31,7 @@ class Input extends React.PureComponent {
maxLength,
} = this.props
const inputClasses = cx({
const inputClasses = CX({
d: 1,
text: 1,
outlineNone: 1,
@ -55,7 +53,7 @@ class Input extends React.PureComponent {
pr15: !hasClear,
})
const btnClasses = cx({
const btnClasses = CX({
displayNone: !value || value.length === 0,
px10: 1,
mr5: 1,

10
app/javascript/gabsocial/components/list_item.js
View File

@ -1,13 +1,11 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import Button from './button'
import Icon from './icon'
import Image from './image'
import Text from './text'
const cx = classNames.bind(_s)
class ListItem extends React.PureComponent {
handleOnClick = (e) => {
@ -55,7 +53,7 @@ class ListItem extends React.PureComponent {
const imageSize = large ? '22px' : '18px'
const showActive = isActive !== undefined
const containerClasses = cx({
const containerClasses = CX({
d: 1,
cursorPointer: 1,
noUnderline: 1,
@ -73,14 +71,14 @@ class ListItem extends React.PureComponent {
borderBottom1PX: !isLast,
})
const iconClasses = cx({
const iconClasses = CX({
mr10: !large,
mr15: large,
cPrimary: !!icon,
circle: !icon && !!image,
})
const textContainerClasses = cx({
const textContainerClasses = CX({
d: 1,
pr5: 1,
maxW100PC42PX: !hideArrow || showActive,

8
app/javascript/gabsocial/components/media_gallery.js
View File

@ -4,17 +4,15 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { is } from 'immutable';
import { defineMessages, injectIntl } from 'react-intl';
import classNames from 'classnames/bind'
import { decode } from 'blurhash';
import { autoPlayGif, displayMedia } from '../initial_state';
import { autoPlayGif, displayMedia } from '../initial_state'
import { CX } from '../constants'
import { isIOS } from '../utils/is_mobile';
import { isPanoramic, isPortrait, isNonConformingRatio, minimumAspectRatio, maximumAspectRatio } from '../utils/media_aspect_ratio';
import Button from './button'
import SensitiveMediaItem from './sensitive_media_item'
import Text from './text'
const cx = classNames.bind(_s)
class Item extends ImmutablePureComponent {
state = {
@ -514,7 +512,7 @@ class MediaGallery extends React.PureComponent {
/>
))
const containerClasses = cx({
const containerClasses = CX({
d: 1,
displayBlock: 1,
overflowHidden: 1,

8
app/javascript/gabsocial/components/media_item.js
View File

@ -5,13 +5,11 @@ import ImmutablePureComponent from 'react-immutable-pure-component'
import { NavLink } from 'react-router-dom'
import { decode } from 'blurhash'
import { autoPlayGif, displayMedia } from '../initial_state'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import Icon from './icon'
import Image from './image'
import Text from './text'
const cx = classNames.bind(_s)
class MediaItem extends ImmutablePureComponent {
state = {
@ -76,7 +74,7 @@ class MediaItem extends ImmutablePureComponent {
badge = 'GIF'
}
const containerClasses = cx({
const containerClasses = CX({
d: 1,
posAbs: 1,
top0: 1,
@ -86,7 +84,7 @@ class MediaItem extends ImmutablePureComponent {
px2: !isSmall,
})
const linkClasses = cx({
const linkClasses = CX({
d: 1,
w100PC: 1,
h100PC: 1,

6
app/javascript/gabsocial/components/modal/modal_layout.js
View File

@ -1,13 +1,11 @@
import React from 'react'
import PropTypes from 'prop-types'
import { defineMessages, injectIntl } from 'react-intl'
import classNames from 'classnames/bind'
import { CX } from '../../constants'
import Button from '../button'
import Block from '../block'
import Heading from '../heading'
const cx = classNames.bind(_s)
class ModalLayout extends React.PureComponent {
onHandleCloseModal = () => {
@ -25,7 +23,7 @@ class ModalLayout extends React.PureComponent {
isXS,
} = this.props
const childrenContainerClasses = cx({
const childrenContainerClasses = CX({
d: 1,
maxH80VH: 1,
overflowYScroll: 1,

6
app/javascript/gabsocial/components/modal/status_revisions_modal.js
View File

@ -4,14 +4,12 @@ import { connect } from 'react-redux'
import { defineMessages, injectIntl } from 'react-intl'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import classNames from 'classnames/bind'
import { CX } from '../../constants'
import { loadStatusRevisions } from '../../actions/status_revisions'
import ModalLayout from './modal_layout'
import RelativeTimestamp from '../relative_timestamp'
import Text from '../text'
const cx = classNames.bind(_s)
class StatusRevisionsModal extends ImmutablePureComponent {
componentDidMount() {
@ -38,7 +36,7 @@ class StatusRevisionsModal extends ImmutablePureComponent {
const isFirst = i === 0
const isLast = i === revisions.size - 1
const containerClasses = cx({
const containerClasses = CX({
d: 1,
pt5: 1,
pb10: 1,

14
app/javascript/gabsocial/components/poll.js
View File

@ -4,20 +4,18 @@ import { connect } from 'react-redux'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'
import classNames from 'classnames/bind'
import escapeTextContentForBrowser from 'escape-html'
import spring from 'react-motion/lib/spring'
import { me } from '../initial_state'
import Motion from '../features/ui/util/reduced_motion'
import { vote } from '../actions/polls'
import emojify from 'gabsocial/components/emoji/emoji'
import { CX } from '../constants'
import emojify from './emoji/emoji'
import RelativeTimestamp from './relative_timestamp'
import Button from './button'
import DotTextSeperator from './dot_text_seperator'
import Text from './text'
const cx = classNames.bind(_s)
const makeEmojiMap = record => record.get('emojis').reduce((obj, emoji) => {
obj[`:${emoji.get('shortcode')}:`] = emoji.toJS()
return obj
@ -70,7 +68,7 @@ class Poll extends ImmutablePureComponent {
titleEmojified = emojify(escapeTextContentForBrowser(option.get('title')), emojiMap)
}
const chartClasses = cx({
const chartClasses = CX({
d: 1,
posAbs: 1,
top0: 1,
@ -83,12 +81,12 @@ class Poll extends ImmutablePureComponent {
})
// : todo :
const inputClasses = cx('poll__input', {
const inputClasses = CX('poll__input', {
'poll__input--checkbox': multiple,
'poll__input--active': active,
})
const listItemClasses = cx({
const listItemClasses = CX({
d: 1,
flexRow: 1,
py10: showResults,
@ -101,7 +99,7 @@ class Poll extends ImmutablePureComponent {
bgSubtle: !showResults && active,
})
const textContainerClasses = cx({
const textContainerClasses = CX({
d: 1,
w100PC: 1,
px15: 1,

8
app/javascript/gabsocial/components/popover/status_visibility_popover.js
View File

@ -2,15 +2,13 @@ import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { injectIntl, defineMessages } from 'react-intl'
import classNames from 'classnames/bind'
import { changeComposeVisibility } from '../../actions/compose'
import { closePopover } from '../../actions/popover'
import { CX } from '../../constants'
import PopoverLayout from './popover_layout'
import Icon from '../icon'
import Text from '../text'
const cx = classNames.bind(_s)
class StatusVisibilityDropdown extends React.PureComponent {
handleChange = (value) => {
@ -57,7 +55,7 @@ class StatusVisibilityDropdown extends React.PureComponent {
const isActive = option.value === value
const isLast = i === options.length - 1
const containerClasses = cx({
const containerClasses = CX({
d: 1,
flexRow: 1,
py10: 1,
@ -68,7 +66,7 @@ class StatusVisibilityDropdown extends React.PureComponent {
bgBrand: isActive,
})
const iconClasses = cx({
const iconClasses = CX({
ml10: 1,
mt2: 1,
cPrimary: !isActive,

6
app/javascript/gabsocial/components/rich_text_editor_bar.js
View File

@ -2,13 +2,11 @@ import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { RichUtils } from 'draft-js'
import classNames from 'classnames/bind'
import { me } from '../initial_state'
import { makeGetAccount } from '../selectors'
import { CX } from '../constants'
import Icon from './icon'
const cx = classNames.bind(_s)
const RTE_ITEMS = [
{
label: 'Bold',
@ -143,7 +141,7 @@ class StyleButton extends React.PureComponent {
const active = type === 'block' ? style === blockType : currentStyle.has(style)
const iconColor = active ? 'cWhite' : 'cSecondary'
const btnClasses = cx({
const btnClasses = CX({
d: 1,
noUnderline: 1,
cursorPointer: 1,

16
app/javascript/gabsocial/components/status_content.js
View File

@ -3,16 +3,14 @@ import PropTypes from 'prop-types'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { injectIntl, defineMessages } from 'react-intl'
import classNames from 'classnames/bind'
import { isRtl } from '../utils/rtl'
import { CX } from '../constants'
import Button from './button'
import Icon from './icon'
import Text from './text'
const MAX_HEIGHT = 200
const cx = classNames.bind(_s)
class StatusContent extends ImmutablePureComponent {
static contextTypes = {
@ -191,7 +189,7 @@ class StatusContent extends ImmutablePureComponent {
const toggleText = intl.formatMessage(hidden ? messages.show : messages.hide)
const spoilerContainerClasses = cx({
const spoilerContainerClasses = CX({
d: 1,
py10: 1,
borderBottom1PX: !hidden,
@ -199,13 +197,13 @@ class StatusContent extends ImmutablePureComponent {
mb10: !hidden,
})
const statusContentClasses = cx({
const statusContentClasses = CX({
statusContent: 1,
outlineNone: 1,
displayNone: hidden,
})
const containerClasses = cx({
const containerClasses = CX({
statusContent: 1,
px15: !isComment,
outlineNone: 1,
@ -263,12 +261,12 @@ class StatusContent extends ImmutablePureComponent {
} else if (this.props.onClick) {
const hasMarginBottom = !!status.get('card') || !!status.get('poll') || status.get('media_attachments').size > 0
const containerClasses = cx({
const containerClasses = CX({
px15: !isComment,
mb15: hasMarginBottom,
})
const statusContentClasses = cx({
const statusContentClasses = CX({
statusContent: 1,
outlineNone: 1,
h215PX: collapsed & !isComment,
@ -308,7 +306,7 @@ class StatusContent extends ImmutablePureComponent {
)
}
const containerClasses = cx({
const containerClasses = CX({
statusContent: 1,
outlineNone: 1,
px15: !isComment,

6
app/javascript/gabsocial/components/status_header.js
View File

@ -5,11 +5,11 @@ import { injectIntl, defineMessages } from 'react-intl'
import { NavLink } from 'react-router-dom'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import classNames from 'classnames/bind'
import moment from 'moment-mini'
import { openPopover } from '../actions/popover'
import { openModal } from '../actions/modal'
import { me } from '../initial_state'
import { CX } from '../constants'
import RelativeTimestamp from './relative_timestamp'
import DisplayName from './display_name'
import Text from './text'
@ -18,8 +18,6 @@ import Icon from './icon'
import Button from './button'
import Avatar from './avatar'
const cx = classNames.bind(_s)
class StatusHeader extends ImmutablePureComponent {
handleOpenStatusOptionsPopover = () => {
@ -43,7 +41,7 @@ class StatusHeader extends ImmutablePureComponent {
const statusUrl = `/${status.getIn(['account', 'acct'])}/posts/${status.get('id')}`
const containerClasses = cx({
const containerClasses = CX({
d: 1,
px15: 1,
py10: !reduced,

7
app/javascript/gabsocial/components/text.js
View File

@ -1,9 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
// Bind CSS Modules global variable `_s` to classNames module
const cx = classNames.bind(_s)
import { CX } from '../constants'
// Define colors for enumeration for Text component `color` prop
const COLORS = {
@ -70,7 +67,7 @@ class Text extends React.PureComponent {
} = this.props
// Style the component according to props
const classes = cx(className, {
const classes = CX(className, {
d: 1,
text: 1,

6
app/javascript/gabsocial/components/textarea.js
View File

@ -1,10 +1,8 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
import { CX } from '../constants'
import Text from './text'
const cx = classNames.bind(_s)
class Textarea extends React.PureComponent {
handleOnChange = (e) => {
@ -22,7 +20,7 @@ class Textarea extends React.PureComponent {
title,
} = this.props
const inputClasses = cx({
const inputClasses = CX({
d: 1,
text: 1,
outlineNone: 1,

8
app/javascript/gabsocial/components/timeline_queue_button_header.js
View File

@ -2,14 +2,12 @@ import React from 'react'
import PropTypes from 'prop-types'
import { FormattedMessage } from 'react-intl'
import throttle from 'lodash.throttle'
import classNames from 'classnames/bind'
import { shortNumberFormat } from '../utils/numbers'
import { CX } from '../constants'
import { scrollTo } from '../utils/scroll_to'
import Button from './button'
import Text from './text'
const cx = classNames.bind(_s)
class TimelineQueueButtonHeader extends React.PureComponent {
state = {
@ -78,7 +76,7 @@ class TimelineQueueButtonHeader extends React.PureComponent {
const hasItems = count > 0
const containerClasses = cx({
const containerClasses = CX({
d: 1,
pb5: 1,
posSticky: !hidden,
@ -87,7 +85,7 @@ class TimelineQueueButtonHeader extends React.PureComponent {
z3: 1,
})
const innerContainerClasses = cx({
const innerContainerClasses = CX({
d: 1,
displayNone: !hasItems,
mtNeg26PX: 1,

8
app/javascript/gabsocial/features/compose/components/compose_extra_button.js
View File

@ -1,10 +1,8 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames/bind'
import { CX } from '../../../constants'
import Button from '../../../components/button'
const cx = classNames.bind(_s)
class ComposeExtraButton extends React.PureComponent {
render() {
@ -19,7 +17,7 @@ class ComposeExtraButton extends React.PureComponent {
buttonRef
} = this.props
const btnClasses = cx({
const btnClasses = CX({
d: 1,
circle: 1,
noUnderline: 1,
@ -37,7 +35,7 @@ class ComposeExtraButton extends React.PureComponent {
mr2: !children,
})
const iconClasses = cx({
const iconClasses = CX({
cSecondary: !active,
cWhite: active,
})

8
app/javascript/gabsocial/features/compose/components/media_upload_item.js
View File

@ -4,16 +4,14 @@ import { connect } from 'react-redux'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { defineMessages, injectIntl } from 'react-intl'
import classNames from 'classnames/bind'
import { undoUploadCompose, changeUploadCompose } from '../../../actions/compose'
import { submitCompose } from '../../../actions/compose';
import { submitCompose } from '../../../actions/compose'
import { CX } from '../../../constants'
import Button from '../../../components/button'
import Image from '../../../components/image'
import Input from '../../../components/input'
import Text from '../../../components/text'
const cx = classNames.bind(_s)
class Upload extends ImmutablePureComponent {
static contextTypes = {
@ -80,7 +78,7 @@ class Upload extends ImmutablePureComponent {
const active = this.state.hovered || this.state.focused
const description = this.state.dirtyDescription || (this.state.dirtyDescription !== '' && media.get('description')) || ''
const descriptionContainerClasses = cx({
const descriptionContainerClasses = CX({
d: 1,
posAbs: 1,
right0: 1,

6
app/javascript/gabsocial/features/compose/components/poll_form.js
View File

@ -3,7 +3,6 @@ import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import classNames from 'classnames/bind'
import { defineMessages, injectIntl } from 'react-intl'
import {
addPollOption,
@ -11,13 +10,12 @@ import {
changePollOption,
changePollSettings,
} from '../../../actions/compose'
import { CX } from '../../../constants'
import Button from '../../../components/button'
import Text from '../../../components/text'
import Select from '../../../components/select'
import Input from '../../../components/input'
const cx = classNames.bind(_s)
class PollForm extends ImmutablePureComponent {
handleSelectDuration = (e) => {
@ -136,7 +134,7 @@ class PollFormOption extends ImmutablePureComponent {
render() {
const { isPollMultiple, title, index, intl } = this.props
const toggleClasses = cx({
const toggleClasses = CX({
d: 1,
px10: 1,
py10: 1,

4
app/javascript/gabsocial/features/search.js
View File

@ -30,9 +30,9 @@ class Search extends ImmutablePureComponent {
} = this.props
const { isSmallScreen } = this.state
if (isLoading) {
// if (isLoading) {
return <ColumnIndicator type='loading' />
}
// }
if (isError) {
return (