Updated placeholder component structures

• Updated:
- placeholder component structures

app/javascript/gabsocial/components/placeholder/account_placeholder.js

@@ -2,12 +2,7 @@ import { CX } from '../../constants'
 import { getRandomInt } from '../../utils/numbers'
 import PlaceholderLayout from './placeholder_layout'
 
-export default class AccountPlaceholder extends PureComponent {
+class AccountPlaceholder extends PureComponent {
-  
-  static propTypes = {
-    isLast: PropTypes.bool,
-    isSmall: PropTypes.bool,
-  }
 
   render() {
     const { isLast, isSmall } = this.props
@@ -46,3 +41,10 @@ export default class AccountPlaceholder extends PureComponent {
   }
 
 }
+
+AccountPlaceholder.propTypes = {
+  isLast: PropTypes.bool,
+  isSmall: PropTypes.bool,
+}
+
+export default AccountPlaceholder

app/javascript/gabsocial/components/placeholder/comment_placeholder.js

@@ -4,10 +4,6 @@ import PlaceholderLayout from './placeholder_layout'
 
 export default class CommentPlaceholder extends PureComponent {
   
-  static propTypes = {
-    isLast: PropTypes.bool,
-  }
-
   render() {
     const classes = CX({
       default: 1,

app/javascript/gabsocial/components/placeholder/group_list_item_placeholder.js

@@ -2,11 +2,7 @@ import { CX } from '../../constants'
 import { getRandomInt } from '../../utils/numbers'
 import PlaceholderLayout from './placeholder_layout'
 
-export default class GroupListItemPlaceholder extends PureComponent {
+class GroupListItemPlaceholder extends PureComponent {
-  
-  static propTypes = {
-    isLast: PropTypes.bool,
-  }
   
   render() {
     const { isLast } = this.props
@@ -33,3 +29,9 @@ export default class GroupListItemPlaceholder extends PureComponent {
   }
 
 }
+
+GroupListItemPlaceholder.propTypes = {
+  isLast: PropTypes.bool,
+}
+
+export default GroupListItemPlaceholder

app/javascript/gabsocial/components/placeholder/list_item_placeholder.js

@@ -3,11 +3,7 @@ import { getRandomInt } from '../../utils/numbers'
 import PlaceholderLayout from './placeholder_layout'
 import ResponsiveClassesComponent from '../../features/ui/util/responsive_classes_component'
 
-export default class ListItemPlaceholder extends PureComponent {
+class ListItemPlaceholder extends PureComponent {
-  
-  static propTypes = {
-    isLast: PropTypes.bool,
-  }
 
   render() {
     const { isLast } = this.props
@@ -44,3 +40,9 @@ export default class ListItemPlaceholder extends PureComponent {
   }
 
 }
+
+ListItemPlaceholder.propTypes = {
+  isLast: PropTypes.bool,
+}
+
+export default ListItemPlaceholder

app/javascript/gabsocial/components/placeholder/media_gallery_placeholder.js

@@ -2,13 +2,7 @@ import PlaceholderLayout from './placeholder_layout'
 
 export default class MediaGalleryPlaceholder extends PureComponent {
 
-  static propTypes = {
-    type: PropTypes.string,
-  }
-
   render() {
-    const { type } = this.props
-
     return (
       <div className={[_s.default, _s.px5, _s.py5].join(' ')}>
         <PlaceholderLayout viewBox='0 0 400 196'>

app/javascript/gabsocial/components/placeholder/notification_placeholder.js

@@ -7,11 +7,7 @@ import { getRandomInt } from '../../utils/numbers'
 import ResponsiveComponent from '../../features/ui/util/responsive_component'
 import PlaceholderLayout from './placeholder_layout'
 
-export default class NotificationPlaceholder extends PureComponent {
+class NotificationPlaceholder extends PureComponent {
-  
-  static propTypes = {
-    isLast: PropTypes.bool,
-  }
 
   render() {
     const { isLast } = this.props
@@ -86,3 +82,9 @@ export default class NotificationPlaceholder extends PureComponent {
   }
 
 }
+
+NotificationPlaceholder.propTypes = {
+  isLast: PropTypes.bool,
+}
+
+export default NotificationPlaceholder

app/javascript/gabsocial/components/placeholder/placeholder_layout.js

@@ -2,26 +2,8 @@ import { defineMessages, injectIntl } from 'react-intl'
 import ContentLoader from 'react-content-loader'
 import { DEFAULT_THEME } from '../../constants'
 
-const messages = defineMessages({
-  loading: { id: 'loading_indicator.label', defaultMessage: 'Loading..' },
-})
-
-const mapStateToProps = (state) => ({
-  theme: state.getIn(['settings', 'displayOptions', 'theme'], DEFAULT_THEME),
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps)
 class PlaceholderLayout extends PureComponent {
   
-  static propTypes = {
-    children: PropTypes.node,
-    intl: PropTypes.object.isRequired,
-    theme: PropTypes.string.isRequired,
-    viewBox: PropTypes.object.isRequired,
-  }
-
   render() {
     const {
       intl,
@@ -47,3 +29,20 @@ class PlaceholderLayout extends PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  loading: { id: 'loading_indicator.label', defaultMessage: 'Loading...' },
+})
+
+const mapStateToProps = (state) => ({
+  theme: state.getIn(['settings', 'displayOptions', 'theme'], DEFAULT_THEME),
+})
+
+PlaceholderLayout.propTypes = {
+  children: PropTypes.node,
+  intl: PropTypes.object.isRequired,
+  theme: PropTypes.string.isRequired,
+  viewBox: PropTypes.object.isRequired,
+}
+
+export default injectIntl(connect(mapStateToProps)(PlaceholderLayout))

app/javascript/gabsocial/components/placeholder/profile_info_panel_placeholder.js

@@ -4,7 +4,7 @@ export default class ProfileInfoPanelPlaceholder extends PureComponent {
   
   render() {
     return (
-      <div className={[_s.default]}>
+      <div className={_s.default}>
         <PlaceholderLayout viewBox='0 0 340 108'>
           <rect x='0' y='0' rx='4' ry='4' width='330' height='8' /> 
           <rect x='0' y='18' rx='4' ry='4' width='314' height='8' />