prehistoric-systems/removeddit
1
0
Fork 0
mirror of https://github.com/gurnec/removeddit.git synced 2026-03-11 08:54:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added loading / success status for subreddits

Browse source
This commit is contained in:
JubbeArt 2018-07-28 16:36:40 +02:00
parent 43d5a1979c
commit e992dd9425
13 changed files with 199 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.babelrc
View file

@ -1,4 +1,7 @@
{
"presets": ["env", "react"],
"plugins": ["transform-object-rest-spread"]
"plugins": [
"transform-object-rest-spread",
"transform-class-properties"
]
}

7
TODO Normal file
View file

@ -0,0 +1,7 @@
update readme
update header links active (NavLinks)
make sort/filter state local
old.removeddit.com

6
dist/index.html vendored
View file

@ -7,11 +7,11 @@
<meta type="author" content="Jesper Wrang">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="./images/favicon.ico" rel="shotcut icon" type="image/x-icon">
<link href="./main.css" rel="stylesheet" type="text/css">
<link href="/images/favicon.ico" rel="shotcut icon" type="image/x-icon">
<link href="/main.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="app"></div>
<script src="./main.js"></script>
<script src="/main.js"></script>
</body>
</html>

5
package.json
View file

@ -19,6 +19,9 @@
"url": "https://github.com/JubbeArt/removeddit/issues"
},
"homepage": "https://github.com/JubbeArt/removeddit#readme",
"standard": {
"parser": "babel-eslint"
},
"scripts": {
"start": "webpack-dev-server --mode development",
"build-dev": "webpack --mode development",
@ -37,7 +40,9 @@
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.6",
"babel-loader": "^7.1.5",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",

4
src/api/removeddit/index.js
View file

@ -1,6 +1,10 @@
const baseURL = 'https://removeddit.com/api'
export const getRemovedThreadIDs = (subreddit = '', page = 1) => {
if (subreddit.toLowerCase() === 'all') {
subreddit = ''
}
return window.fetch(`${baseURL}/threads?subreddit=${subreddit}&page=${page - 1}`)
.then(response => response.json())
}

13
src/pages/common/Header.js
View file

@ -1,8 +1,8 @@
import React from 'react'
import { Link } from 'react-router-dom'
import StatusBox from './StatusBox'
import { connect } from '../../state'
export default () => (
const Header = props => (
<header>
<div id='header'>
<h1>
@ -13,6 +13,13 @@ export default () => (
<Link to='/about/'>about</Link>
</nav>
</div>
<StatusBox />
<div id='status'>
{props.global.state.statusText &&
<p id='status-text'>{props.global.state.statusText}</p>}
{props.global.state.statusImage &&
<img id='status-image' src={props.global.state.statusImage} alt='status' />}
</div>
</header>
)
export default connect(Header)

13
src/pages/common/StatusBox.js
View file

@ -1,13 +0,0 @@
import React from 'react'
import {connect} from '../../state'
const StatusBox = props => (
<div id='status'>
{props.text &&
<p id='status-text'>{props.gloabl.state.statusText}</p>}
{props.image &&
<img id='status-image' src={props.gloabl.state.statusImage} alt='status' />}
</div>
)
export default connect(StatusBox)

63
src/pages/subreddit/index.js
View file

@ -3,39 +3,35 @@ import { Link } from 'react-router-dom'
import { getRemovedThreadIDs } from '../../api/removeddit'
import { getThreads } from '../../api/reddit'
import Post from '../common/Post'
import {connect} from '../../state'
const getSubredditForAPI = props => {
const { subreddit = 'all' } = props.match.params
if (subreddit.toLowerCase() === 'all') {
return ''
}
return subreddit.toLowerCase()
}
export default class Subreddit extends React.Component {
constructor (props) {
super(props)
this.state = {
threads: [],
subreddit: ''
}
class Subreddit extends React.Component {
state = {
threads: [],
loading: true
}
componentDidMount () {
this.getRemovedThreads(this.props)
const { subreddit = 'all' } = this.props.match.params
this.getRemovedThreads(subreddit)
}
componentWillReceiveProps (nextProps) {
const newSubreddit = getSubredditForAPI(nextProps)
// Check if the subreddit has changed in the url, and fetch threads accordingly
componentDidUpdate (prevProps) {
const { subreddit: newSubreddit = 'all' } = this.props.match.params
const { subreddit = 'all' } = prevProps.match.params
if (this.state.subreddit !== newSubreddit) {
this.getRemovedThreads(nextProps)
if (subreddit !== newSubreddit) {
this.getRemovedThreads(newSubreddit)
}
}
getRemovedThreads (props) {
const subreddit = getSubredditForAPI(props)
// Download thread IDs from removeddit API, then thread info from reddit API
getRemovedThreads (subreddit) {
document.title = `/r/${subreddit}`
this.setState({ threads: [], loading: true })
this.props.global.setLoading('Loading removed threads...')
getRemovedThreadIDs(subreddit)
.then(threadIDs => getThreads(threadIDs))
.then(threads => {
@ -43,29 +39,34 @@ export default class Subreddit extends React.Component {
thread.removed = true
thread.selftext = ''
})
this.setState({ threads, subreddit })
this.setState({ threads, loading: false })
this.props.global.setSuccess()
})
}
render () {
const { subreddit = 'all' } = this.props.match.params
const subredditLink = `/r/${subreddit}`
const noThreadsFound = this.state.threads.length === 0 && !this.state.loading
return (
<React.Fragment>
<div className='subreddit-box'>
<Link to={subredditLink} className='subreddit-title'>{subredditLink}</Link>
<Link to={`/r/${subreddit}`} className='subreddit-title'>/r/{subreddit}</Link>
<span className='space' />
<a href={`https://www.reddit.com${subredditLink}`} className='subreddit-title-link'>reddit</a>
<a href={`https://www.reddit.com/r/${subreddit}`} className='subreddit-title-link'>reddit</a>
<span className='space' />
<a href={`https://snew.github.io${subredditLink}`} className='subreddit-title-link'>ceddit</a>
<a href={`https://snew.github.io/r/${subreddit}`} className='subreddit-title-link'>ceddit</a>
</div>
{
this.state.threads.map(thread => (
<Post key={thread.id} {...thread} />
))
noThreadsFound
? <p>No removed threads found for /r/{subreddit}</p>
: this.state.threads.map(thread => (
<Post key={thread.id} {...thread} />
))
}
</React.Fragment>
)
}
}
export default connect(Subreddit)

1
src/sass/common.sass
View file

@ -6,6 +6,7 @@ html, body
.main
margin: 15px
color: white
.removed
background-color: $removed

2
src/sass/index.sass
View file

@ -1,5 +1,3 @@
@import colors
@import common
@import header

10
src/state/index.js
View file

@ -44,19 +44,19 @@ class GlobalState extends Container {
this.setState({commentFilter: filterType})
}
setErrorText (text) {
setError (text) {
this.setState({statusText: text, statusImage: '/images/error.png'})
}
setSuccessText (text) {
this.setState({statusText: text, statusImage: '/images/done.png'})
setSuccess () {
this.setState({statusText: '', statusImage: '/images/success.png'})
}
setLoadingText (text) {
setLoading (text) {
this.setState({statusText: text, statusImage: '/images/loading.gif'})
}
clearStatusText () {
clearStatus () {
this.setState({statusText: '', statusImage: undefined})
}
}

2
webpack.config.js
View file

@ -1,4 +1,4 @@
const path = require('path');
const path = require('path')
module.exports = {
entry: [

135
yarn.lock
View file

@ -2,6 +2,82 @@
# yarn lockfile v1
"@babel/code-frame@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.0.0-beta.44.tgz#2a02643368de80916162be70865c97774f3adbd9"
dependencies:
"@babel/highlight" "7.0.0-beta.44"
"@babel/generator@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.0.0-beta.44.tgz#c7e67b9b5284afcf69b309b50d7d37f3e5033d42"
dependencies:
"@babel/types" "7.0.0-beta.44"
jsesc "^2.5.1"
lodash "^4.2.0"
source-map "^0.5.0"
trim-right "^1.0.1"
"@babel/helper-function-name@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.0.0-beta.44.tgz#e18552aaae2231100a6e485e03854bc3532d44dd"
dependencies:
"@babel/helper-get-function-arity" "7.0.0-beta.44"
"@babel/template" "7.0.0-beta.44"
"@babel/types" "7.0.0-beta.44"
"@babel/helper-get-function-arity@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.0.0-beta.44.tgz#d03ca6dd2b9f7b0b1e6b32c56c72836140db3a15"
dependencies:
"@babel/types" "7.0.0-beta.44"
"@babel/helper-split-export-declaration@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.0.0-beta.44.tgz#c0b351735e0fbcb3822c8ad8db4e583b05ebd9dc"
dependencies:
"@babel/types" "7.0.0-beta.44"
"@babel/highlight@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.0.0-beta.44.tgz#18c94ce543916a80553edcdcf681890b200747d5"
dependencies:
chalk "^2.0.0"
esutils "^2.0.2"
js-tokens "^3.0.0"
"@babel/template@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.0.0-beta.44.tgz#f8832f4fdcee5d59bf515e595fc5106c529b394f"
dependencies:
"@babel/code-frame" "7.0.0-beta.44"
"@babel/types" "7.0.0-beta.44"
babylon "7.0.0-beta.44"
lodash "^4.2.0"
"@babel/traverse@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.0.0-beta.44.tgz#a970a2c45477ad18017e2e465a0606feee0d2966"
dependencies:
"@babel/code-frame" "7.0.0-beta.44"
"@babel/generator" "7.0.0-beta.44"
"@babel/helper-function-name" "7.0.0-beta.44"
"@babel/helper-split-export-declaration" "7.0.0-beta.44"
"@babel/types" "7.0.0-beta.44"
babylon "7.0.0-beta.44"
debug "^3.1.0"
globals "^11.1.0"
invariant "^2.2.0"
lodash "^4.2.0"
"@babel/types@7.0.0-beta.44":
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.0.0-beta.44.tgz#6b1b164591f77dec0a0342aca995f2d046b3a757"
dependencies:
esutils "^2.0.2"
lodash "^4.2.0"
to-fast-properties "^2.0.0"
"@webassemblyjs/ast@1.5.13":
version "1.5.13"
resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.5.13.tgz#81155a570bd5803a30ec31436bc2c9c0ede38f25"
@ -441,6 +517,17 @@ babel-core@^6.26.0, babel-core@^6.26.3:
slash "^1.0.0"
source-map "^0.5.7"
babel-eslint@^8.2.6:
version "8.2.6"
resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-8.2.6.tgz#6270d0c73205628067c0f7ae1693a9e797acefd9"
dependencies:
"@babel/code-frame" "7.0.0-beta.44"
"@babel/traverse" "7.0.0-beta.44"
"@babel/types" "7.0.0-beta.44"
babylon "7.0.0-beta.44"
eslint-scope "3.7.1"
eslint-visitor-keys "^1.0.0"
babel-generator@^6.26.0:
version "6.26.1"
resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.26.1.tgz#1844408d3b8f0d35a404ea7ac180f087a601bd90"
@ -587,6 +674,10 @@ babel-plugin-syntax-async-functions@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
babel-plugin-syntax-class-properties@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz#d7eb23b79a317f8543962c505b827c7d6cac27de"
babel-plugin-syntax-exponentiation-operator@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de"
@ -615,6 +706,15 @@ babel-plugin-transform-async-to-generator@^6.22.0:
babel-plugin-syntax-async-functions "^6.8.0"
babel-runtime "^6.22.0"
babel-plugin-transform-class-properties@^6.24.1:
version "6.24.1"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz#6a79763ea61d33d36f37b611aa9def81a81b46ac"
dependencies:
babel-helper-function-name "^6.24.1"
babel-plugin-syntax-class-properties "^6.8.0"
babel-runtime "^6.22.0"
babel-template "^6.24.1"
babel-plugin-transform-es2015-arrow-functions@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221"
@ -958,6 +1058,10 @@ babel-types@^6.19.0, babel-types@^6.24.1, babel-types@^6.26.0:
lodash "^4.17.4"
to-fast-properties "^1.0.3"
babylon@7.0.0-beta.44:
version "7.0.0-beta.44"
resolved "https://registry.yarnpkg.com/babylon/-/babylon-7.0.0-beta.44.tgz#89159e15e6e30c5096e22d738d8c0af8a0e8ca1d"
babylon@^6.18.0:
version "6.18.0"
resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.18.0.tgz#af2f3b88fa6f5c1e4c634d1a0f8eac4f55b395e3"
@ -1979,6 +2083,13 @@ eslint-plugin-standard@~3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-3.0.1.tgz#34d0c915b45edc6f010393c7eef3823b08565cf2"
eslint-scope@3.7.1:
version "3.7.1"
resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-3.7.1.tgz#3d63c3edfda02e06e01a452ad88caacc7cdcb6e8"
dependencies:
esrecurse "^4.1.0"
estraverse "^4.1.1"
eslint-scope@^3.7.1:
version "3.7.3"
resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-3.7.3.tgz#bb507200d3d17f60247636160b4826284b108535"
@ -2546,7 +2657,7 @@ global-modules-path@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/global-modules-path/-/global-modules-path-2.1.0.tgz#923ec524e8726bb0c1a4ed4b8e21e1ff80c88bbb"
globals@^11.0.1:
globals@^11.0.1, globals@^11.1.0:
version "11.7.0"
resolved "https://registry.yarnpkg.com/globals/-/globals-11.7.0.tgz#a583faa43055b1aca771914bf68258e2fc125673"
@ -2919,7 +3030,7 @@ interpret@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
invariant@^2.2.1, invariant@^2.2.2, invariant@^2.2.4:
invariant@^2.2.0, invariant@^2.2.1, invariant@^2.2.2, invariant@^2.2.4:
version "2.2.4"
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
dependencies:
@ -3188,14 +3299,14 @@ js-base64@^2.1.8:
version "2.4.6"
resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.6.tgz#1d49f618bef43630cd191f4e122447acfdb947d8"
js-tokens@^3.0.0, js-tokens@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
"js-tokens@^3.0.0 || ^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
js-tokens@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
js-yaml@^3.9.1:
version "3.12.0"
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.0.tgz#eaed656ec8344f10f527c6bfa1b6e2244de167d1"
@ -3211,6 +3322,10 @@ jsesc@^1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-1.3.0.tgz#46c3fec8c1892b12b0833db9bc7622176dbab34b"
jsesc@^2.5.1:
version "2.5.1"
resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.1.tgz#e421a2a8e20d6b0819df28908f782526b96dd1fe"
jsesc@~0.5.0:
version "0.5.0"
resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
@ -3372,7 +3487,7 @@ lodash.mergewith@^4.6.0:
version "4.6.1"
resolved "https://registry.yarnpkg.com/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz#639057e726c3afbdb3e7d42741caa8d6e4335927"
lodash@^4.0.0, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.3.0, lodash@~4.17.10:
lodash@^4.0.0, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.3.0, lodash@~4.17.10:
version "4.17.10"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
@ -4959,7 +5074,7 @@ source-map@^0.4.2:
dependencies:
amdefine ">=0.0.4"
source-map@^0.5.6, source-map@^0.5.7:
source-map@^0.5.0, source-map@^0.5.6, source-map@^0.5.7:
version "0.5.7"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
@ -5260,6 +5375,10 @@ to-fast-properties@^1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
to-fast-properties@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
to-object-path@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/to-object-path/-/to-object-path-0.3.0.tgz#297588b7b0e7e0ac08e04e672f85c1f4999e17af"