1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

code fixes

This commit is contained in:
Matthias Kretschmann 2019-09-10 12:12:20 +02:00
parent 725215b6ee
commit 8b612ea4a2
Signed by: m
GPG Key ID: 606EEEF3C479A91F
4 changed files with 72 additions and 85 deletions

View File

@ -1,4 +1,4 @@
import React, { PureComponent } from 'react'
import React from 'react'
import { Link } from 'react-router-dom'
import cx from 'classnames'
import styles from './Button.module.scss'
@ -15,39 +15,34 @@ interface ButtonProps {
name?: string
}
export default class Button extends PureComponent<ButtonProps, any> {
public render() {
let classes
const {
primary,
link,
href,
children,
className,
to,
...props
} = this.props
if (primary) {
classes = styles.buttonPrimary
} else if (link) {
classes = styles.link
} else {
classes = styles.button
}
return to ? (
<Link to={to} className={cx(classes, className)} {...props}>
{children}
</Link>
) : href ? (
<a href={href} className={cx(classes, className)} {...props}>
{children}
</a>
) : (
<button className={cx(classes, className)} {...props}>
{children}
</button>
)
}
function getClasses(primary: boolean | undefined, link: boolean | undefined) {
return primary ? styles.buttonPrimary : link ? styles.link : styles.button
}
const Button = ({
primary,
link,
href,
children,
className,
to,
...props
}: ButtonProps) => {
const classes = getClasses(primary, link)
return to ? (
<Link to={to} className={cx(classes, className)} {...props}>
{children}
</Link>
) : href ? (
<a href={href} className={cx(classes, className)} {...props}>
{children}
</a>
) : (
<button className={cx(classes, className)} {...props}>
{children}
</button>
)
}
export default Button

View File

@ -1,5 +1,5 @@
import React from 'react'
import { render, fireEvent, act } from '@testing-library/react'
import { render } from '@testing-library/react'
import Ipfs from '.'
const addFile = jest.fn()

View File

@ -34,35 +34,6 @@ const mockResponse = {
}
}
function flushPromises(ui: any, container: any) {
return new Promise(resolve =>
setImmediate(() => {
render(ui, { container })
resolve(container)
})
)
}
function dispatchEvt(node: any, type: string, data: any) {
const event = new Event(type, { bubbles: true })
Object.assign(event, data)
fireEvent(node, event)
}
function mockData(files: any) {
return {
dataTransfer: {
files,
items: files.map((file: any) => ({
kind: 'file',
type: file.type,
getAsFile: () => file
})),
types: ['Files']
}
}
}
const renderComponent = () =>
render(
<Files

View File

@ -10,6 +10,7 @@ import styles from './index.module.scss'
import { serviceUri } from '../../../config'
import cleanupContentType from '../../../utils/cleanupContentType'
import shortid from 'shortid'
export interface File {
url: string
@ -42,6 +43,19 @@ interface FilesStates {
isIpfsFormShown: boolean
}
const buttons = [
{
id: 'url',
title: '+ From URL',
titleActive: '- Cancel'
},
{
id: 'ipfs',
title: '+ Add to IPFS',
titleActive: '- Cancel'
}
]
export default class Files extends PureComponent<FilesProps, FilesStates> {
public state: FilesStates = {
isFormShown: false,
@ -55,19 +69,13 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
this.signal.cancel()
}
private toggleForm = (e: Event) => {
private toggleForm = (e: Event, form: string) => {
e.preventDefault()
this.setState({
isFormShown: !this.state.isFormShown,
isIpfsFormShown: false
})
}
private toggleIpfsForm = (e: Event) => {
e.preventDefault()
this.setState({
isIpfsFormShown: !this.state.isIpfsFormShown,
isFormShown: false
isFormShown: form === 'url' ? !this.state.isFormShown : false,
isIpfsFormShown:
form === 'ipfs' ? !this.state.isIpfsFormShown : false
})
}
@ -90,9 +98,12 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
const { contentLength, contentType, found } = response.data.result
if (contentLength) file.contentLength = contentLength
if (contentType) file.contentType = contentType
if (contentType) file.compression = cleanupContentType(contentType)
if (found) file.found = found
if (contentType) {
file.contentType = contentType
file.compression = cleanupContentType(contentType)
}
file.found = found
return file
} catch (error) {
@ -174,13 +185,23 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
</ul>
)}
<Button link onClick={this.toggleForm}>
{isFormShown ? '- Cancel' : '+ From URL'}
</Button>
{buttons.map(button => {
const isActive =
(button.id === 'url' && isFormShown) ||
(button.id === 'ipfs' && isIpfsFormShown)
<Button link onClick={this.toggleIpfsForm}>
{isIpfsFormShown ? '- Cancel' : '+ Add to IPFS'}
</Button>
return (
<Button
key={shortid.generate()}
link
onClick={(e: Event) =>
this.toggleForm(e, button.id)
}
>
{isActive ? button.titleActive : button.title}
</Button>
)
})}
{isFormShown && (
<ItemForm