summaryrefslogtreecommitdiff
path: root/frontend/views/upload/components
diff options
context:
space:
mode:
authorJules Laplace <julescarbon@gmail.com>2020-09-26 14:56:02 +0200
committerJules Laplace <julescarbon@gmail.com>2020-09-26 14:56:02 +0200
commita17b76ac75f506f5da6fe8adf9c36632b60d4226 (patch)
treeabb0af0c4409b830dea2ef808c146223ee973933 /frontend/views/upload/components
parent2231a6e1c05b07bb7ec5906716aedec93d02429c (diff)
refactor to use app-rooted js imports
Diffstat (limited to 'frontend/views/upload/components')
-rw-r--r--frontend/views/upload/components/upload.form.js16
-rw-r--r--frontend/views/upload/components/upload.index.js104
-rw-r--r--frontend/views/upload/components/upload.indexOptions.js62
-rw-r--r--frontend/views/upload/components/upload.menu.js18
-rw-r--r--frontend/views/upload/components/upload.show.js70
5 files changed, 0 insertions, 270 deletions
diff --git a/frontend/views/upload/components/upload.form.js b/frontend/views/upload/components/upload.form.js
deleted file mode 100644
index 2010088..0000000
--- a/frontend/views/upload/components/upload.form.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
-
-import { MenuButton, FileInput } from '../../../common'
-
-export default class UploadForm extends Component {
- render() {
- return (
- <div className='uploadForm'>
- <MenuButton name="upload" label={false}>
- <FileInput onChange={this.props.uploadActions.upload} />
- </MenuButton>
- </div>
- )
- }
-}
diff --git a/frontend/views/upload/components/upload.index.js b/frontend/views/upload/components/upload.index.js
deleted file mode 100644
index 6123001..0000000
--- a/frontend/views/upload/components/upload.index.js
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
-
-import { uploadUri, formatDateTime } from '../../../util'
-import { MenuButton, SmallMenuButton, Loader } from '../../../common'
-import actions from '../../../actions'
-
-import UploadIndexOptions from './upload.indexOptions'
-import UploadMenu from './upload.menu'
-
-// const { result, collectionLookup } = this.props
-
-export default class UploadIndex extends Component {
- componentDidMount() {
- this.fetch(false)
- }
-
- componentDidUpdate(prevProps) {
- if (this.props.upload.options.sort !== prevProps.upload.options.sort) {
- this.fetch(false)
- }
- }
-
- fetch(load_more) {
- const { options, index } = this.props.upload
- const { order: index_order } = index
- const [ sort, order ] = options.sort.split('-')
- actions.upload.index({
- sort, order, limit: 50, offset: load_more ? index_order.length : 0,
- }, load_more)
- }
-
- render() {
- const { searchOptions, uploadActions } = this.props
- const { options } = this.props.upload
- const { loading, lookup, order } = this.props.upload.index
- if (loading) {
- return (
- <section>
- <UploadIndexOptions />
- <div className="row">
- {order && !!order.length &&
- <div className={'results ' + searchOptions.thumbnailSize}>
- {order.map(id => <UploadItem key={id} data={lookup[id]} />)}
- </div>
- }
- </div>
- <Loader />
- </section>
- )
- }
- if (!lookup || !order.length) {
- return (
- <section>
- <UploadIndexOptions />
- <div className="row">
- <UploadMenu uploadActions={uploadActions} />
- <p className='gray'>
- {"No uploads"}
- </p>
- </div>
- </section>
- )
- }
- return (
- <section>
- <UploadIndexOptions />
- <div className="row">
- <UploadMenu uploadActions={uploadActions} />
- <div className={'results ' + searchOptions.thumbnailSize}>
- {order.map(id => <UploadItem key={id} data={lookup[id]} />)}
- </div>
- </div>
- {order.length >= 50 && <button className='loadMore' onClick={() => this.fetch(true)}>Load More</button>}
- </section>
- )
- }
-}
-
-const UploadItem = ({ data }) => {
- // console.log(data)
- const imageUri = uploadUri(data)
- return (
- <div className='cell'>
- <div className='img'>
- <Link to={"/upload/" + data.id + "/show/"}>
- <img src={imageUri} alt={"Uploaded image"} />
- </Link>
- </div>
- <div className='meta center'>
- <div className='row'>
- <SmallMenuButton name="search" href={"/search/upload/" + data.id + "/"} />
- </div>
- <div>
- {data.username}
- </div>
- <div>
- {formatDateTime(data.created_at)}
- </div>
- </div>
- </div>
- )
-}
-
diff --git a/frontend/views/upload/components/upload.indexOptions.js b/frontend/views/upload/components/upload.indexOptions.js
deleted file mode 100644
index 22d3fdc..0000000
--- a/frontend/views/upload/components/upload.indexOptions.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
-
-import actions from '../../../actions'
-
-import { Select, Checkbox } from '../../../common'
-
-const thumbnailOptions = [
- { name: 'th', label: 'Thumbnails', },
- { name: 'sm', label: 'Small', },
- { name: 'md', label: 'Medium', },
- { name: 'lg', label: 'Large', },
- { name: 'orig', label: 'Original', },
-]
-
-const sortOptions = [
- { name: 'id-asc', label: 'Most recent' },
- { name: 'id-desc', label: 'Oldest first' },
- { name: 'username-asc', label: 'Username (A-Z)' },
- { name: 'username-desc', label: 'Username (Z-A)' },
- // { name: '-asc', label: '' },
- // { name: '-desc', label: '' },
- // { name: '-asc', label: '' },
- // { name: '-desc', label: '' },
- // { name: '-asc', label: '' },
- // { name: '-desc', label: '' },
-]
-
-class IndexOptions extends Component {
- render() {
- const { options, searchOptions } = this.props
- return (
- <div className='row menubar'>
- <div />
- <Select
- name={'sort'}
- options={sortOptions}
- selected={options.sort}
- onChange={actions.upload.updateOption}
- />
- <Select
- name={'thumbnailSize'}
- options={thumbnailOptions}
- selected={searchOptions.thumbnailSize}
- onChange={actions.search.updateOption}
- />
- </div>
- )
- }
-}
-
-const mapStateToProps = state => ({
- options: state.upload.options,
- searchOptions: state.search.options,
-})
-
-const mapDispatchToProps = dispatch => ({
-})
-
-export default connect(mapStateToProps, mapDispatchToProps)(IndexOptions)
diff --git a/frontend/views/upload/components/upload.menu.js b/frontend/views/upload/components/upload.menu.js
deleted file mode 100644
index 37c7f0b..0000000
--- a/frontend/views/upload/components/upload.menu.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
-
-import { MenuButton, FileInput } from '../../../common'
-
-import actions from '../../../actions'
-
-export default class UploadMenu extends Component {
- render() {
- return (
- <div className='menuButtons'>
- <MenuButton name="upload">
- <FileInput onChange={this.props.uploadActions.upload} />
- </MenuButton>
- </div>
- )
- }
-}
diff --git a/frontend/views/upload/components/upload.show.js b/frontend/views/upload/components/upload.show.js
deleted file mode 100644
index 6b36269..0000000
--- a/frontend/views/upload/components/upload.show.js
+++ /dev/null
@@ -1,70 +0,0 @@
-import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
-import { connect } from 'react-redux'
-
-import actions from '../../../actions'
-import { formatDate, formatTime, formatAge, uploadUri } from '../../../util'
-import { history } from '../../../store'
-import { Loader, MenuButton } from '../../../common'
-
-class UploadShow extends Component {
- componentDidMount() {
- actions.upload.show(this.props.match.params.id)
- }
-
- componentDidUpdate(prevProps) {
- if (prevProps.match.params.id !== this.props.match.params.id) {
- actions.upload.show(this.props.match.params.id)
- }
- }
-
- handleDestroy() {
- const { res: data } = this.props.upload.show
- if (confirm("Really delete this upload?")) {
- actions.upload.destroy(data).then(() => {
- history.push('/upload/')
- })
- }
- }
-
- render() {
- const { show, destroy } = this.props.upload
- if (show.loading || destroy.loading) {
- return <Loader />
- }
- if (!show.loading && !show.res || show.not_found) {
- return <div className='gray'>Upload {this.props.match.params.id} not found</div>
- }
- const { res: data } = show
- return (
- <section className="row uploadShow">
- <div className="menuButtons">
- <MenuButton name="delete" onClick={this.handleDestroy.bind(this)} />
- <MenuButton name="search" href={'/search/upload/' + data.id + '/'} />
- </div>
- <div>
- <img src={uploadUri(data)} />
- <div className='byline'>
- {'Uploaded by '}
- {data.username}
- {' on '}
- {formatDate(data.created_at)}
- {' at '}
- {formatTime(data.created_at)}
- {'. '}
- </div>
- </div>
- </section>
- )
- }
-}
-
-const mapStateToProps = state => ({
- upload: state.upload,
-})
-
-const mapDispatchToProps = dispatch => ({
- // searchActions: bindActionCreators({ ...searchActions }, dispatch),
-})
-
-export default connect(mapStateToProps, mapDispatchToProps)(UploadShow)