mirror of
https://github.com/oceanprotocol/commons.git
synced 2023-03-15 18:03:00 +01:00
code fixes
This commit is contained in:
parent
725215b6ee
commit
8b612ea4a2
@ -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
|
||||
|
@ -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()
|
||||
|
@ -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
|
||||
|
@ -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
|
||||
|
Loading…
Reference in New Issue
Block a user