Apply javascript formatting
This commit is contained in:
parent
fbb6405da9
commit
99c232fea2
8 changed files with 51 additions and 44 deletions
|
|
@ -11,7 +11,9 @@ class NavList extends React.Component {
|
|||
);
|
||||
});
|
||||
|
||||
const className = this.props.includeBorder ? "nav-list nav-list--bordered": "nav-list";
|
||||
const className = this.props.includeBorder
|
||||
? 'nav-list nav-list--bordered'
|
||||
: 'nav-list';
|
||||
|
||||
return <ol className={className}>{links}</ol>;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,8 +8,10 @@ class Sidebar extends React.Component {
|
|||
return (
|
||||
<div className="sidebar">
|
||||
<div className="sidebar__nav">
|
||||
|
||||
<NavList navLinks={this.props.navLinks} includeBorder={this.props.includeBorder} />
|
||||
<NavList
|
||||
navLinks={this.props.navLinks}
|
||||
includeBorder={this.props.includeBorder}
|
||||
/>
|
||||
|
||||
{this.props.children}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import ReactDOM from "react-dom";
|
||||
import ReactDOM from 'react-dom';
|
||||
|
||||
import Sidebar from "../../components/Sidebar";
|
||||
import Sidebar from '../../components/Sidebar';
|
||||
|
||||
const mainElements = [...document.getElementsByClassName('main')];
|
||||
const mainElement = mainElements.find(element => element.dataset.renderSidebar);
|
||||
|
|
@ -11,10 +11,7 @@ if (mainElement) {
|
|||
let navLinks = JSON.parse(linkScript.textContent);
|
||||
|
||||
ReactDOM.render(
|
||||
ReactDOM.createPortal(
|
||||
<Sidebar navLinks={navLinks} />,
|
||||
mainElement
|
||||
),
|
||||
ReactDOM.createPortal(<Sidebar navLinks={navLinks} />, mainElement),
|
||||
document.createElement('div')
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import PostModal from './components/PostModal.js';
|
|||
import Messages from '../../components/Messages.js';
|
||||
|
||||
class App extends React.Component {
|
||||
state = { postListNode: null }
|
||||
state = { postListNode: null };
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
|
@ -65,7 +65,7 @@ class App extends React.Component {
|
|||
|
||||
const mapStateToProps = state => {
|
||||
const { error } = state.error;
|
||||
const postsByType = filterPosts(state)
|
||||
const postsByType = filterPosts(state);
|
||||
|
||||
if (!isEqual(state.selected.post, {})) {
|
||||
const ruleId = state.selected.post.rule.id;
|
||||
|
|
@ -83,7 +83,7 @@ const mapStateToProps = state => {
|
|||
};
|
||||
}
|
||||
|
||||
return { error, post: state.selected.post, postsByType: postsByType, };
|
||||
return { error, post: state.selected.post, postsByType: postsByType };
|
||||
};
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
|
|
|
|||
|
|
@ -47,7 +47,9 @@ class PostModal extends React.Component {
|
|||
const titleClassName = post.read ? 'post__title post__title--read' : 'post__title';
|
||||
const readButtonDisabled =
|
||||
post.read || this.props.isUpdating || this.props.selectedType === SAVED_TYPE;
|
||||
const savedIconClass = post.saved ? 'post__save post__save--saved saved-icon saved-icon--saved' : 'post__save saved-icon';
|
||||
const savedIconClass = post.saved
|
||||
? 'post__save post__save--saved saved-icon saved-icon--saved'
|
||||
: 'post__save saved-icon';
|
||||
|
||||
let ruleUrl = '';
|
||||
|
||||
|
|
@ -68,7 +70,7 @@ class PostModal extends React.Component {
|
|||
<div className="post__actions">
|
||||
<button
|
||||
className={`button read-button ${readButtonDisabled &&
|
||||
'button--disabled'}`}
|
||||
'button--disabled'}`}
|
||||
onClick={() =>
|
||||
!readButtonDisabled && this.props.markPostRead(post, token)
|
||||
}
|
||||
|
|
@ -92,7 +94,10 @@ class PostModal extends React.Component {
|
|||
|
||||
<div className="post__buttons">
|
||||
{this.props.category && (
|
||||
<span className="badge post__category" title={this.props.category.name}>
|
||||
<span
|
||||
className="badge post__category"
|
||||
title={this.props.category.name}
|
||||
>
|
||||
<a
|
||||
href={`${this.props.categoriesUrl}/${this.props.category.id}/`}
|
||||
target="_blank"
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ export default class ScrollTop extends React.Component {
|
|||
state = {
|
||||
listenerAttached: false,
|
||||
showTop: false,
|
||||
showBottom: false
|
||||
showBottom: false,
|
||||
};
|
||||
|
||||
componentDidUpdate() {
|
||||
|
|
@ -19,9 +19,8 @@ export default class ScrollTop extends React.Component {
|
|||
|
||||
scrollListener() {
|
||||
const postList = this.props.postListNode;
|
||||
const elementEnd = (
|
||||
postList.scrollTop + postList.offsetHeight>= postList.scrollHeight
|
||||
);
|
||||
const elementEnd =
|
||||
postList.scrollTop + postList.offsetHeight >= postList.scrollHeight;
|
||||
|
||||
this.setState({
|
||||
showTop: postList.scrollTop > window.innerHeight,
|
||||
|
|
@ -32,7 +31,8 @@ export default class ScrollTop extends React.Component {
|
|||
render() {
|
||||
const postList = this.props.postListNode;
|
||||
|
||||
return postList && (
|
||||
return (
|
||||
postList && (
|
||||
<div className="scroll-to-top">
|
||||
{this.state.showTop && (
|
||||
<i
|
||||
|
|
@ -48,6 +48,7 @@ export default class ScrollTop extends React.Component {
|
|||
/>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -116,4 +116,6 @@ const mapDispatchToProps = dispatch => ({
|
|||
fetchSavedPosts: (next = false) => dispatch(fetchSavedPosts(next)),
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })(PostList);
|
||||
export default connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })(
|
||||
PostList
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import Sidebar from "../../../../components/Sidebar.js";
|
||||
import Sidebar from '../../../../components/Sidebar.js';
|
||||
import LoadingIndicator from '../../../../components/LoadingIndicator.js';
|
||||
import { CATEGORY_TYPE, RULE_TYPE } from '../../constants.js';
|
||||
|
||||
|
|
@ -11,10 +11,10 @@ import ReadButton from './ReadButton.js';
|
|||
|
||||
import { filterCategories, filterRules } from './filters.js';
|
||||
|
||||
|
||||
class HomepageSidebar extends React.Component {
|
||||
render() {
|
||||
const categoryItems = this.props.categories.items.map(category => { const rules = this.props.rules.items.filter(rule => {
|
||||
const categoryItems = this.props.categories.items.map(category => {
|
||||
const rules = this.props.rules.items.filter(rule => {
|
||||
return rule.category === category.id;
|
||||
});
|
||||
|
||||
|
|
@ -32,9 +32,8 @@ class HomepageSidebar extends React.Component {
|
|||
this.props.selected.item &&
|
||||
[CATEGORY_TYPE, RULE_TYPE].includes(this.props.selected.item.type);
|
||||
|
||||
|
||||
return (
|
||||
<Sidebar navLinks={this.props.navLinks} includeBorder={true} >
|
||||
<Sidebar navLinks={this.props.navLinks} includeBorder={true}>
|
||||
{(this.props.categories.isFetching || this.props.rules.isFetching) && (
|
||||
<LoadingIndicator />
|
||||
)}
|
||||
|
|
@ -48,8 +47,7 @@ class HomepageSidebar extends React.Component {
|
|||
</Sidebar>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
categories: { ...state.categories, items: filterCategories(state.categories.items) },
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue