diff --git a/web/src/components/contract-container-dummy.js b/web/src/components/contract-container-dummy.js deleted file mode 100644 index 9059f00..0000000 --- a/web/src/components/contract-container-dummy.js +++ /dev/null @@ -1,138 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import Spinner from 'react-spinkit' - -import connect from '~/utils/connect' -import sel from '~/selectors' - -import ContractLayout from './freelancer-layout' -import ContractHeader from './contract-header' -import ContractProgress from './contract-progress' -import ContractFooter from './contract-footer' - -import ContractFeedback from './contract-feedback' - -class ContractContainer extends React.Component { - - static mapStateToProps(state) { - const basicProps = { - role: 'contractor', - state: 1, - name: 'The Greatest Contract in the World', - clientAddress: '0x00b3a4e828d0d8bc873dcd33fdcebb7ed2e6edb6', - contractorAddress: '0xfe2e794e7151690f3809aa76e553ecd581f858a3', - hourlyRate: String(Number(0.25) * Math.pow(10, 18)), - timeCapMinutes: String(Number(10) * 60), - prepayFraction: '300', - minutesReported: String(Number(5.5) * 60), - comment: ` I’ve done with the following tasks: - — Layout without any logic - — Integration API to layout`, - availableForWithdraw: String(Number(7.13455323) * Math.pow(10, 18)), - } - - return { - ...basicProps, - actions2: { - startContract: () => { - console.log('Contract started!') - }, - - setBillableTime: (newMinutesReported, newComment) => { - console.log('Updated with: new minutes ' + newMinutesReported + ', new comment ' + newComment) - }, - - approve: () => { - console.log('Approved!') - }, - - withdraw: () => { - console.log('Withdraw!') - }, - - cancel: () => { - console.log('Cancel!') - }, - - leaveFeedback: (isGood, comment) => { - console.log('Feedback: ' + isGood + ' Comment:' + comment) - } - } - } - } - - render () { - const { role, state } = this.props - - if (state === -3) { - return ( - - - 😢 - Contract Not Found - - - ) - } - - if (state === -2 || state === -1) { - return ( - - - - - - ) - } - - if (state === 2) { - return ( - - - - ) - } - - return ( - - - { - state !== 0 && - - } - - - ) - } -} - -export default connect(ContractContainer) - -const SpinnerWrapper = styled.div` - height: 700px; - width: 100%; - - display: flex; - align-items: center; - justify-content: center; -` - -const ErrorMessage = styled.div` - height: 700px; - font-family: 'Muller'; - font-weight: 500; - font-size: 26px; - color: #242737; - letter-spacing: -0.79px; - - display: flex; - flex-flow: column nowrap; - justify-content: center; - align-items: center; - - span { - font-family: 'Apple Color Emoji'; - font-size: 64px; - margin-bottom: 24px; - } -` \ No newline at end of file diff --git a/web/src/components/contract-list.js b/web/src/components/contract-list.js deleted file mode 100644 index 9ef7501..0000000 --- a/web/src/components/contract-list.js +++ /dev/null @@ -1,66 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { Link } from 'react-router-dom' - -import connect from '~/utils/connect' -import sel from '~/selectors' - -import plus_circle from '../../assets/plus_circle.svg' -import empty_list from '../../assets/empty_list.svg' - -import ContractLayout from './freelancer-layout' -import ContractItem from './contract-item' - -const Header = styled.div` - display: flex; - justify-content: space-between; - align-items: center; - margin: 60px 30px 50px 30px; -` -const FormTitle = styled.h2` - color: #242737; - font-size: 36px; -` -const NewContract = styled.a` - text-decoration: none; - color: black; - cursor: pointer; - - &:before { - content: url(${plus_circle}); - vertical-align: -25%; - padding-right: 5px; - } -` - -const ItemWrapper = styled.div` - display: flex; - flex-flow: column nowrap; -` - -export class ContractList extends React.Component { - render() { - return ( - -
- Contract List - New Contract -
- - - - - - - - - - - - - ) - } -} - - -export default connect(ContractList) diff --git a/web/src/components/feedback.js b/web/src/components/feedback.js deleted file mode 100644 index fafaaba..0000000 --- a/web/src/components/feedback.js +++ /dev/null @@ -1,171 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import {Link} from 'react-router-dom' - -import connect from '~/utils/connect' -import sel from '~/selectors' - -import good_feedback from '../../assets/good_feedback.png' -import bad_feedback from '../../assets/bad_feedback.png' - -import ContractLayout from './freelancer-layout' - -const FormTitle = styled.h2` - color: #242737; - font-size: 36px; - align-self: center; -` - -const FormBtn = styled.a` - display: block; - width: 100%; - align-self: flex-end; - padding: 16px; - margin-top: 20px; - border: 1px solid; - cursor: pointer; - box-sizing: border-box; - text-align: center; - background-color: #5E69D7; - color: white; - text-transform: uppercase; - border-radius: 3px; - transition: background 0.2s; - &:hover { - background-color: #5964CC; - } - &:active { - background-color: #5660C4; - } -` - -const Separator = styled.div` - content: ''; - display: block; - width: 70px; - height: 2px; - border-radius: 3px; - background: #5E69D7; - margin-top: 24px; - margin-bottom: 32px; - align-self: center; - letter-spacing: 0.76px; -` - -const FormDescription = styled.div` - text-align: center; - vertical-align: middle; - margin-bottom: 6px; - font-size: 18px; -` - -const MessageLabel = styled.label` - text-transform: uppercase; - font-size: 14px; -` -const MessageTextArea = styled.textarea` - height: 130px; - margin: 10px 0; - padding: 12px; - width: 100%; - box-sizing: border-box; - font-size: 14px; - border-radius: 3px; - border: 1px solid #cccccc; - resize: none; - &:focus { - outline: none; - border-color: #5E69D7; - } -` - -const FeedbackOptions = styled.div` - display: flex; - align-items: center; - align-self: center; - margin: 50px 0; -` -const GoodEmojiContainer = styled.div` - width: 64px; - height: 64px; - background: url(${good_feedback}) no-repeat center / contain; - margin-right: 20px; - opacity: 0.6; - &:hover { - opacity: 1; - } - cursor: pointer; - opacity: ${props => props.chosen ? '1' : '0.6'}; - transition: opacity 0.2s; -` -const BadEmojiContainer = styled.div` - width: 64px; - height: 64px; - background: url(${bad_feedback}) no-repeat center / contain; - margin-left: 20px; - opacity: 0.6; - &:hover { - opacity: 1; - } - cursor: pointer; - opacity: ${props => props.chosen ? '1' : '0.6'}; - transition: opacity 0.2s; -` - -export class Feedback extends React.Component { - constructor(props) { - super(props); - - this.state = { - bad: false, - good: false - }; - } - - render() { - return ( - - The greatest contract in the World - - -

Please, give a feedback for freelancer.

- - - this.chooseFeedbackType(e))} chosen={this.state.good}/> - or - this.chooseFeedbackType(e))} chosen={this.state.bad}/> - - message - this.messageText = node}/> - Send a Feedback - - ) - } - - chooseFeedbackType = (e) => { - const data = e.target.getAttribute('data'); - if (data === 'good') { - this.setState({ - bad: false, - good: true - }) - } else if (data === 'bad') { - this.setState({ - bad: true, - good: false - }) - } - } - - sendFeedback = () => { - const type = this.state.bad ? 'bad' : 'good'; - const requestObj = { - messageText: this.messageText.value, - type: type - }; - - console.log(requestObj); - } -} - -export default connect(Feedback) diff --git a/web/src/components/welcome-screen.js b/web/src/components/welcome-screen.js deleted file mode 100644 index 113ccb1..0000000 --- a/web/src/components/welcome-screen.js +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import {Link} from 'react-router-dom' - -const WelcomeScreenContainer = styled.div` - margin-top: 10px; - line-height: 25px; - text-align: center; -` - -const NewContractLink = styled(Link)` - display: block; - color: #666; -` - -const ParticipateLink = styled(Link)` - display: block; - color: #666; -` - -export default function WelcomeScreen() { - return ( - - New contract - Participate in a contract - Contract - Feedback - Contract List - Tigran - - ) -}