Added Frontend Files

build/contracts/Artwork.json

@@ -1993,7 +1993,7 @@
   },
   "networks": {},
   "schemaVersion": "3.4.0",
-  "updatedAt": "2021-06-30T17:55:51.042Z",
+  "updatedAt": "2021-06-30T18:00:29.169Z",
   "devdoc": {
     "methods": {}
   },

build/contracts/Marketplace.json

@@ -2692,7 +2692,7 @@
     }
   },
   "schemaVersion": "3.4.0",
-  "updatedAt": "2021-06-30T17:55:51.052Z",
+  "updatedAt": "2021-06-30T18:00:29.179Z",
   "devdoc": {
     "methods": {}
   },

build/contracts/MarketplaceCreator.json

@@ -1000,9 +1000,17 @@
     "name": "solc",
     "version": "0.5.16+commit.9c3226ce.Emscripten.clang"
   },
-  "networks": {},
+  "networks": {
+    "5777": {
+      "events": {},
+      "links": {},
+      "address": "0xA3b103eE52ADb68BdA12cb7EafFC91daE3b01f5c",
+      "transactionHash": "0x90afb76ec0b2550aaa46a54b8e7e900ba659b85fcab7040037d741a8f27fd0ec"
+    }
+  },
   "schemaVersion": "3.4.0",
-  "updatedAt": "2021-06-30T17:55:51.062Z",
+  "updatedAt": "2021-06-30T18:00:29.935Z",
+  "networkType": "ethereum",
   "devdoc": {
     "methods": {}
   },

build/contracts/Migrations.json

@@ -915,12 +915,12 @@
     "5777": {
       "events": {},
       "links": {},
-      "address": "0xcA5A6eea3Bd26D21585182959759177a8e932601",
-      "transactionHash": "0xd9c0da8a73b82ff95f27c8ec86456c709da4c2a49104340bd328b81b6356b9d8"
+      "address": "0x6D926891fCB4e028A0BF0485B3ABDF361E930a36",
+      "transactionHash": "0x4c8c09b0d77337720ed31dc56d1da2d1f9164881a94aa8e04c0b698efbde1f34"
     }
   },
   "schemaVersion": "3.4.0",
-  "updatedAt": "2021-06-24T19:30:15.392Z",
+  "updatedAt": "2021-06-30T18:00:29.945Z",
   "networkType": "ethereum",
   "devdoc": {
     "methods": {}

build/contracts/Ownable.json

@@ -3836,7 +3836,7 @@
   },
   "networks": {},
   "schemaVersion": "3.4.0",
-  "updatedAt": "2021-06-30T17:55:51.076Z",
+  "updatedAt": "2021-06-30T18:00:29.199Z",
   "devdoc": {
     "methods": {}
   },

components/ContributeForm.js

@@ -0,0 +1,58 @@
+import React, { Component } from 'react';
+import { Form, Input, Message, Button } from 'semantic-ui-react';
+import Campaign from '../ethereum/campaign';
+import web3 from '../ethereum/web3';
+import { Router } from '../routes';
+
+class ContributeForm extends Component {
+  state = {
+    value: '',
+    errorMessage: '',
+    loading: false
+  };
+
+  onSubmit = async event => {
+    event.preventDefault();
+
+    const campaign = Campaign(this.props.address);
+
+    this.setState({ loading: true, errorMessage: '' });
+
+    try {
+      const accounts = await web3.eth.getAccounts();
+      await campaign.methods.contribute().send({
+        from: accounts[0],
+        value: web3.utils.toWei(this.state.value, 'ether')
+      });
+
+      Router.replaceRoute(`/campaigns/${this.props.address}`);
+    } catch (err) {
+      this.setState({ errorMessage: err.message });
+    }
+
+    this.setState({ loading: false, value: '' });
+  };
+
+  render() {
+    return (
+      <Form onSubmit={this.onSubmit} error={!!this.state.errorMessage}>
+        <Form.Field>
+          <label>Amount to Contribute</label>
+          <Input
+            value={this.state.value}
+            onChange={event => this.setState({ value: event.target.value })}
+            label="ether"
+            labelPosition="right"
+          />
+        </Form.Field>
+
+        <Message error header="Oops!" content={this.state.errorMessage} />
+        <Button primary loading={this.state.loading}>
+          Contribute!
+        </Button>
+      </Form>
+    );
+  }
+}
+
+export default ContributeForm;

components/Header.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Menu } from 'semantic-ui-react';
+import { Link } from '../routes';
+
+export default () => {
+  return (
+    <Menu style={{ marginTop: '10px' }}>
+      <Link route="/">
+        <a className="item">This is fuckin awesome!</a>
+      </Link>
+
+      <Menu.Menu position="right">
+        <Link route="/">
+          <a className="item">Artwork</a>
+        </Link>
+
+        <Link route="/campaigns/new">
+          <a className="item">+</a>
+        </Link>
+      </Menu.Menu>
+    </Menu>
+  );
+};

components/Layout.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Container } from 'semantic-ui-react';
+import Head from 'next/head';
+import Header from './Header';
+
+const props = () => {
+  return (
+    <Container>
+      <Head>
+        <link
+          rel="stylesheet"
+          href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.12/semantic.min.css"
+        />
+      </Head>
+
+      <Header />
+      {props.children}
+    </Container>
+  );
+};
+
+export default props;

components/RequestRow.js

@@ -0,0 +1,62 @@
+
+import React, { Component } from 'react';
+import { Table, Button } from 'semantic-ui-react';
+import web3 from '../ethereum/web3';
+import Campaign from '../ethereum/campaign';
+
+class RequestRow extends Component {
+  onApprove = async () => {
+    const campaign = Campaign(this.props.address);
+
+    const accounts = await web3.eth.getAccounts();
+    await campaign.methods.approveRequest(this.props.id).send({
+      from: accounts[0]
+    });
+  };
+
+  onFinalize = async () => {
+    const campaign = Campaign(this.props.address);
+
+    const accounts = await web3.eth.getAccounts();
+    await campaign.methods.finalizeRequest(this.props.id).send({
+      from: accounts[0]
+    });
+  };
+
+  render() {
+    const { Row, Cell } = Table;
+    const { id, request, approversCount } = this.props;
+    const readyToFinalize = request.approvalCount > approversCount / 2;
+
+    return (
+      <Row
+        disabled={request.complete}
+        positive={readyToFinalize && !request.complete}
+      >
+        <Cell>{id}</Cell>
+        <Cell>{request.description}</Cell>
+        <Cell>{web3.utils.fromWei(request.amount, 'ether')}</Cell>
+        <Cell>{request.recipient}</Cell>
+        <Cell>
+          {request.approvalCount}/{approversCount}
+        </Cell>
+        <Cell>
+          {request.complete ? null : (
+            <Button color="green" basic onClick={this.onApprove}>
+              Approve
+            </Button>
+          )}
+        </Cell>
+        <Cell>
+          {request.complete ? null : (
+            <Button color="teal" basic onClick={this.onFinalize}>
+              Finalize
+            </Button>
+          )}
+        </Cell>
+      </Row>
+    );
+  }
+}
+
+export default RequestRow;