diff --git a/components/AppBar.js b/components/AppBar.js new file mode 100644 index 0000000..ca669ed --- /dev/null +++ b/components/AppBar.js @@ -0,0 +1,22 @@ +import React from 'react' +import { makeStyles } from '@material-ui/core/styles' +import { AppBar, Toolbar, Typography, IconButton } from '@material-ui/core' +import ProfileIcon from '@material-ui/icons/AccountCircle' + +const useStyles = makeStyles(theme => ({ + title: { + flexGrow: 1 + } +})) + +export default function BoardsAppBar() { + const styles = useStyles() + return ( + + + IPFS Boards + + + + ) +} diff --git a/components/nav.js b/components/nav.js deleted file mode 100644 index 60569fe..0000000 --- a/components/nav.js +++ /dev/null @@ -1,56 +0,0 @@ -import React from 'react' -import Link from 'next/link' - -const links = [ - { href: 'https://zeit.co/now', label: 'ZEIT' }, - { href: 'https://github.com/zeit/next.js', label: 'GitHub' } -].map(link => { - link.key = `nav-link-${link.href}-${link.label}` - return link -}) - -const Nav = () => ( - -) - -export default Nav diff --git a/components/system.js b/components/system.js new file mode 100644 index 0000000..ce10160 --- /dev/null +++ b/components/system.js @@ -0,0 +1,46 @@ +export function getGlobalScope() { + try { + return window + } catch (error) { + return global + } +} + +export function getGlobalData() { + const scope = getGlobalScope() + if (!scope.ipfsBoards) scope.ipfsBoards = {} + return scope.ipfsBoards +} + +export async function getIPFS() { + const data = getGlobalData() + if (data.ipfs) return data.ipfs + const IPFS = await import('ipfs') + data.ipfs = await IPFS.create() + return data.ipfs +} + +export async function getOrbitDB() { + const data = getGlobalData() + if (data.orbitDb) return data.orbitDb + const OrbitDB = await import('orbit-db') + const BoardStore = await import('orbit-db-discussion-board') + OrbitDB.addDatabaseType(BoardStore.type, BoardStore) + data.orbitDb = await OrbitDB.createInstance(await getIPFS()) + data.boards = {} + return data.orbitDb +} + +export async function openBoard(id) { + if (data.boards && data.boards[id]) return data.boards[id] + const BoardStore = await import('orbit-db-discussion-board') + const options = { + type: BoardStore.type, + create: true, + write: ['*'] + } + const orbitDb = await getOrbitDB() + const db = await orbitDb.open(id) + data.boards[id] = db + return db +} diff --git a/components/theme.js b/components/theme.js new file mode 100644 index 0000000..105658b --- /dev/null +++ b/components/theme.js @@ -0,0 +1,21 @@ +import { createMuiTheme } from '@material-ui/core/styles'; +import { red } from '@material-ui/core/colors'; + +const theme = createMuiTheme({ + palette: { + primary: { + main: '#556cd6', + }, + secondary: { + main: '#19857b', + }, + error: { + main: red.A400, + }, + background: { + default: '#fff', + }, + }, +}); + +export default theme; diff --git a/package-lock.json b/package-lock.json index 18702f2..b8f26d7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -885,6 +885,130 @@ "resolved": "https://registry.npmjs.org/@csstools/convert-colors/-/convert-colors-1.4.0.tgz", "integrity": "sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw==" }, + "@emotion/hash": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.7.3.tgz", + "integrity": "sha512-14ZVlsB9akwvydAdaEnVnvqu6J2P6ySv39hYyl/aoB6w/V+bXX0tay8cF6paqbgZsN2n5Xh15uF4pE+GvE+itw==" + }, + "@material-ui/core": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.5.1.tgz", + "integrity": "sha512-6pyk7diT7bflf4qUpqgPCpKYqjhRHPFwsgEV2Gv71lMqwxuRygFGHE2TdZ+l5T249H66Doj2P/j6fW7yzgxTWw==", + "requires": { + "@babel/runtime": "^7.4.4", + "@material-ui/styles": "^4.5.0", + "@material-ui/system": "^4.5.0", + "@material-ui/types": "^4.1.1", + "@material-ui/utils": "^4.4.0", + "@types/react-transition-group": "^4.2.0", + "clsx": "^1.0.2", + "convert-css-length": "^2.0.1", + "deepmerge": "^4.0.0", + "hoist-non-react-statics": "^3.2.1", + "is-plain-object": "^3.0.0", + "normalize-scroll-left": "^0.2.0", + "popper.js": "^1.14.1", + "prop-types": "^15.7.2", + "react-transition-group": "^4.3.0" + }, + "dependencies": { + "is-plain-object": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-3.0.0.tgz", + "integrity": "sha512-tZIpofR+P05k8Aocp7UI/2UTa9lTJSebCXpFFoR9aibpokDj/uXBsJ8luUu0tTVYKkMU6URDUuOfJZ7koewXvg==", + "requires": { + "isobject": "^4.0.0" + } + }, + "isobject": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/isobject/-/isobject-4.0.0.tgz", + "integrity": "sha512-S/2fF5wH8SJA/kmwr6HYhK/RI/OkhD84k8ntalo0iJjZikgq1XFvR5M8NPT1x5F7fBwCG3qHfnzeP/Vh/ZxCUA==" + } + } + }, + "@material-ui/icons": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.5.1.tgz", + "integrity": "sha512-YZ/BgJbXX4a0gOuKWb30mBaHaoXRqPanlePam83JQPZ/y4kl+3aW0Wv9tlR70hB5EGAkEJGW5m4ktJwMgxQAeA==", + "requires": { + "@babel/runtime": "^7.4.4" + } + }, + "@material-ui/styles": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.5.0.tgz", + "integrity": "sha512-O0NSAECHK9f3DZK6wy56PZzp8b/7KSdfpJs8DSC7vnXUAoMPCTtchBKLzMtUsNlijiJFeJjSxNdQfjWXgyur5A==", + "requires": { + "@babel/runtime": "^7.4.4", + "@emotion/hash": "^0.7.1", + "@material-ui/types": "^4.1.1", + "@material-ui/utils": "^4.1.0", + "clsx": "^1.0.2", + "csstype": "^2.5.2", + "deepmerge": "^4.0.0", + "hoist-non-react-statics": "^3.2.1", + "jss": "^10.0.0", + "jss-plugin-camel-case": "^10.0.0", + "jss-plugin-default-unit": "^10.0.0", + "jss-plugin-global": "^10.0.0", + "jss-plugin-nested": "^10.0.0", + "jss-plugin-props-sort": "^10.0.0", + "jss-plugin-rule-value-function": "^10.0.0", + "jss-plugin-vendor-prefixer": "^10.0.0", + "prop-types": "^15.7.2" + } + }, + "@material-ui/system": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.5.1.tgz", + "integrity": "sha512-M72CGz3MYxXTFLet2qWmQDBXZdtF7JKGqYaf7t9MPDYD6WYG6wKM2hUbgUtRKOwls8ZBXQGKsiAX8K4v5pXSPw==", + "requires": { + "@babel/runtime": "^7.4.4", + "deepmerge": "^4.0.0", + "prop-types": "^15.7.2" + } + }, + "@material-ui/types": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-4.1.1.tgz", + "integrity": "sha512-AN+GZNXytX9yxGi0JOfxHrRTbhFybjUJ05rnsBVjcB+16e466Z0Xe5IxawuOayVZgTBNDxmPKo5j4V6OnMtaSQ==", + "requires": { + "@types/react": "*" + } + }, + "@material-ui/utils": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.4.0.tgz", + "integrity": "sha512-UXoQVwArQEQWXxf2FPs0iJGT+MePQpKr0Qh0CPoLc1OdF0GSMTmQczcqCzwZkeHxHAOq/NkIKM1Pb/ih1Avicg==", + "requires": { + "@babel/runtime": "^7.4.4", + "prop-types": "^15.7.2", + "react-is": "^16.8.6" + } + }, + "@types/prop-types": { + "version": "15.7.3", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", + "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==" + }, + "@types/react": { + "version": "16.9.9", + "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.9.tgz", + "integrity": "sha512-L+AudFJkDukk+ukInYvpoAPyJK5q1GanFOINOJnM0w6tUgITuWvJ4jyoBPFL7z4/L8hGLd+K/6xR5uUjXu0vVg==", + "requires": { + "@types/prop-types": "*", + "csstype": "^2.2.0" + } + }, + "@types/react-transition-group": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.2.3.tgz", + "integrity": "sha512-Hk8jiuT7iLOHrcjKP/ZVSyCNXK73wJAUz60xm0mVhiRujrdiI++j4duLiL282VGxwAgxetHQFfqA29LgEeSkFA==", + "requires": { + "@types/react": "*" + } + }, "@webassemblyjs/ast": { "version": "1.8.5", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.8.5.tgz", @@ -1870,6 +1994,11 @@ "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz", "integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=" }, + "clsx": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.0.4.tgz", + "integrity": "sha512-1mQ557MIZTrL/140j+JVdRM6e31/OA4vTYxXgqIIZlndyfjHpyawKZia1Im05Vp9BWmImkcNrNtFYQMyFcgJDg==" + }, "collection-visit": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz", @@ -2015,6 +2144,11 @@ "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz", "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==" }, + "convert-css-length": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/convert-css-length/-/convert-css-length-2.0.1.tgz", + "integrity": "sha512-iGpbcvhLPRKUbBc0Quxx7w/bV14AC3ItuBEGMahA5WTYqB8lq9jH0kTXFheCBASsYnqeMFZhiTruNxr1N59Axg==" + }, "convert-source-map": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.6.0.tgz", @@ -2218,6 +2352,25 @@ "postcss": "^7.0.5" } }, + "css-vendor": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.7.tgz", + "integrity": "sha512-VS9Rjt79+p7M0WkPqcAza4Yq1ZHrsHrwf7hPL/bjQB+c1lwmAI+1FXxYTYt818D/50fFVflw0XKleiBN5RITkg==", + "requires": { + "@babel/runtime": "^7.6.2", + "is-in-browser": "^1.0.2" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.6.3", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.6.3.tgz", + "integrity": "sha512-kq6anf9JGjW8Nt5rYfEuGRaEAaH1mkv3Bbu6rYvLOpPh/RusSJXuKPEAoZ7L7gybZkchE8+NV5g9vKF4AGAtsA==", + "requires": { + "regenerator-runtime": "^0.13.2" + } + } + } + }, "cssdb": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/cssdb/-/cssdb-4.4.0.tgz", @@ -2245,6 +2398,11 @@ "postcss": "^7.0.18" } }, + "csstype": { + "version": "2.6.7", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.7.tgz", + "integrity": "sha512-9Mcn9sFbGBAdmimWb2gLVDtFJzeKtDGIr76TUqmjZrw9LFXBMSU70lcs+C0/7fyCd6iBDqmksUcCOUIkisPHsQ==" + }, "cyclist": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", @@ -2268,6 +2426,11 @@ "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz", "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=" }, + "deepmerge": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.0.tgz", + "integrity": "sha512-/pED+kD8V9n15L1lon8DXEiWLQMW4tTiegn1kIWIQ+DBudOkFitz1cfjWQiSeKMPBQOknT3LpueyAmMVJ1Ho2g==" + }, "defaults": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz", @@ -2368,6 +2531,25 @@ "randombytes": "^2.0.0" } }, + "dom-helpers": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.2.tgz", + "integrity": "sha512-VrfjMjIzNgn2oB49wKl85fgs12ELjK0npu5Oryaiazyc6WuekO1go0E//0RJ8JvsBlfaAwq+IgX9M0XhwlEENA==", + "requires": { + "@babel/runtime": "^7.6.3", + "csstype": "^2.6.7" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.6.3", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.6.3.tgz", + "integrity": "sha512-kq6anf9JGjW8Nt5rYfEuGRaEAaH1mkv3Bbu6rYvLOpPh/RusSJXuKPEAoZ7L7gybZkchE8+NV5g9vKF4AGAtsA==", + "requires": { + "regenerator-runtime": "^0.13.2" + } + } + } + }, "domain-browser": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz", @@ -3471,6 +3653,14 @@ "minimalistic-crypto-utils": "^1.0.1" } }, + "hoist-non-react-statics": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz", + "integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==", + "requires": { + "react-is": "^16.7.0" + } + }, "hosted-git-info": { "version": "2.8.5", "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.5.tgz", @@ -3505,6 +3695,11 @@ "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz", "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=" }, + "hyphenate-style-name": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz", + "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==" + }, "iconv-lite": { "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", @@ -3697,6 +3892,11 @@ "is-extglob": "^2.1.1" } }, + "is-in-browser": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz", + "integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU=" + }, "is-number": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz", @@ -3845,6 +4045,83 @@ "minimist": "^1.2.0" } }, + "jss": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss/-/jss-10.0.0.tgz", + "integrity": "sha512-TPpDFsiBjuERiL+dFDq8QCdiF9oDasPcNqCKLGCo/qED3fNYOQ8PX2lZhknyTiAt3tZrfOFbb0lbQ9lTjPZxsQ==", + "requires": { + "@babel/runtime": "^7.3.1", + "csstype": "^2.6.5", + "is-in-browser": "^1.1.3", + "tiny-warning": "^1.0.2" + } + }, + "jss-plugin-camel-case": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.0.0.tgz", + "integrity": "sha512-yALDL00+pPR4FJh+k07A8FeDvfoPPuXU48HLy63enAubcVd3DnS+2rgqPXglHDGixIDVkCSXecl/l5GAMjzIbA==", + "requires": { + "@babel/runtime": "^7.3.1", + "hyphenate-style-name": "^1.0.3", + "jss": "10.0.0" + } + }, + "jss-plugin-default-unit": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.0.0.tgz", + "integrity": "sha512-sURozIOdCtGg9ap18erQ+ijndAfEGtTaetxfU3H4qwC18Bi+fdvjlY/ahKbuu0ASs7R/+WKCP7UaRZOjUDMcdQ==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.0.0" + } + }, + "jss-plugin-global": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.0.0.tgz", + "integrity": "sha512-80ofWKSQUo62bxLtRoTNe0kFPtHgUbAJeOeR36WEGgWIBEsXLyXOnD5KNnjPqG4heuEkz9eSLccjYST50JnI7Q==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.0.0" + } + }, + "jss-plugin-nested": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.0.0.tgz", + "integrity": "sha512-waxxwl/po1hN3azTyixKnr8ReEqUv5WK7WsO+5AWB0bFndML5Yqnt8ARZ90HEg8/P6WlqE/AB2413TkCRZE8bA==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.0.0", + "tiny-warning": "^1.0.2" + } + }, + "jss-plugin-props-sort": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.0.0.tgz", + "integrity": "sha512-41mf22CImjwNdtOG3r+cdC8+RhwNm616sjHx5YlqTwtSJLyLFinbQC/a4PIFk8xqf1qpFH1kEAIw+yx9HaqZ3g==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.0.0" + } + }, + "jss-plugin-rule-value-function": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.0.0.tgz", + "integrity": "sha512-Jw+BZ8JIw1f12V0SERqGlBT1JEPWax3vuZpMym54NAXpPb7R1LYHiCTIlaJUyqvIfEy3kiHMtgI+r2whGgRIxQ==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.0.0" + } + }, + "jss-plugin-vendor-prefixer": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.0.0.tgz", + "integrity": "sha512-qslqvL0MUbWuzXJWdUxpj6mdNUX8jr4FFTo3aZnAT65nmzWL7g8oTr9ZxmTXXgdp7ANhS1QWE7036/Q2isFBpw==", + "requires": { + "@babel/runtime": "^7.3.1", + "css-vendor": "^2.0.6", + "jss": "10.0.0" + } + }, "kind-of": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz", @@ -4372,6 +4649,11 @@ "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz", "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI=" }, + "normalize-scroll-left": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/normalize-scroll-left/-/normalize-scroll-left-0.2.0.tgz", + "integrity": "sha512-t5oCENZJl8TGusJKoCJm7+asaSsPuNmK6+iEjrZ5TyBj2f02brCRsd4c83hwtu+e5d4LCSBZ0uoDlMjBo+A8yA==" + }, "normalize-url": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz", @@ -4734,6 +5016,11 @@ "ts-pnp": "^1.1.2" } }, + "popper.js": { + "version": "1.16.0", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.0.tgz", + "integrity": "sha512-+G+EkOPoE5S/zChTpmBSSDYmhXJ5PsW8eMhH8cP/CQHMFPBG/kC9Y5IIw6qNYgdJ+/COf0ddY2li28iHaZRSjw==" + }, "posix-character-classes": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz", @@ -5422,6 +5709,27 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", "integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==" }, + "react-transition-group": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.3.0.tgz", + "integrity": "sha512-1qRV1ZuVSdxPlPf4O8t7inxUGpdyO5zG9IoNfJxSO0ImU2A1YWkEQvFPuIPZmMLkg5hYs7vv5mMOyfgSkvAwvw==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.6.3", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.6.3.tgz", + "integrity": "sha512-kq6anf9JGjW8Nt5rYfEuGRaEAaH1mkv3Bbu6rYvLOpPh/RusSJXuKPEAoZ7L7gybZkchE8+NV5g9vKF4AGAtsA==", + "requires": { + "regenerator-runtime": "^0.13.2" + } + } + } + }, "read-pkg": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz", @@ -6250,6 +6558,11 @@ "setimmediate": "^1.0.4" } }, + "tiny-warning": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", + "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" + }, "to-arraybuffer": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz", diff --git a/package.json b/package.json index 6afe400..73df396 100644 --- a/package.json +++ b/package.json @@ -8,8 +8,11 @@ "start": "next start" }, "dependencies": { - "next": "9.1.1", + "@material-ui/core": "^4.5.1", + "@material-ui/icons": "^4.5.1", + "@material-ui/styles": "^4.5.0", "ipfs": "~0.38.0", + "next": "9.1.1", "orbit-db": "~0.22.0", "orbit-db-discussion-board": "https://github.com/fazo96/orbit-db-discussion-board.git", "react": "16.10.2", diff --git a/pages/_app.js b/pages/_app.js new file mode 100644 index 0000000..49b2f3b --- /dev/null +++ b/pages/_app.js @@ -0,0 +1,35 @@ +import React from 'react'; +import App from 'next/app'; +import Head from 'next/head'; +import { ThemeProvider } from '@material-ui/styles'; +import AppBar from '../components/AppBar' +import CssBaseline from '@material-ui/core/CssBaseline'; +import theme from '../components/theme'; + +export default class MyApp extends App { + componentDidMount() { + // Remove the server-side injected CSS. + const jssStyles = document.querySelector('#jss-server-side'); + if (jssStyles) { + jssStyles.parentNode.removeChild(jssStyles); + } + } + + render() { + const { Component, pageProps } = this.props; + + return ( + + + IPFS Boards + + + {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */} + + + + + + ); + } +} diff --git a/pages/_document.js b/pages/_document.js new file mode 100644 index 0000000..2dafbdc --- /dev/null +++ b/pages/_document.js @@ -0,0 +1,79 @@ +import React from 'react'; +import Document, { Head, Main, NextScript } from 'next/document'; +import { ServerStyleSheets } from '@material-ui/styles'; +import theme from '../components/theme'; + +class MyDocument extends Document { + render() { + return ( + + + + + {/* PWA primary color */} + + + + + +
+ + + + ); + } +} + +MyDocument.getInitialProps = async ctx => { + // Resolution order + // + // On the server: + // 1. app.getInitialProps + // 2. page.getInitialProps + // 3. document.getInitialProps + // 4. app.render + // 5. page.render + // 6. document.render + // + // On the server with error: + // 1. document.getInitialProps + // 2. app.render + // 3. page.render + // 4. document.render + // + // On the client + // 1. app.getInitialProps + // 2. page.getInitialProps + // 3. app.render + // 4. page.render + + // Render app and page and get the context of the page with collected side effects. + const sheets = new ServerStyleSheets(); + const originalRenderPage = ctx.renderPage; + + ctx.renderPage = () => + originalRenderPage({ + enhanceApp: App => props => sheets.collect(), + }); + + const initialProps = await Document.getInitialProps(ctx); + + return { + ...initialProps, + // Styles fragment is rendered after the app and page rendering finish. + styles: [ + + {initialProps.styles} + {sheets.getStyleElement()} + , + ], + }; +}; + +export default MyDocument; diff --git a/pages/b/[board]/index.js b/pages/b/[board]/index.js new file mode 100644 index 0000000..724920c --- /dev/null +++ b/pages/b/[board]/index.js @@ -0,0 +1,25 @@ +import React from 'react' +import { Fab, Card, CardActions, CardHeader, Button } from '@material-ui/core' +import AddIcon from '@material-ui/icons/Add' +import ViewIcon from '@material-ui/icons/Visibility' + +const Board = () => { + return ( + + + + + + + + + + ) +} + +export default Board diff --git a/pages/b/[board]/p/[post].js b/pages/b/[board]/p/[post].js new file mode 100644 index 0000000..1a357e0 --- /dev/null +++ b/pages/b/[board]/p/[post].js @@ -0,0 +1,33 @@ + +import React from 'react' +import { Fab, Card, CardContent, CardContentText, CardHeader, List, ListItem, ListItemAvatar, ListItemText } from '@material-ui/core' +import AddIcon from '@material-ui/icons/Add' +import ProfileIcon from '@material-ui/icons/AccountCircle' + +const Post = () => { + return ( + + + + + Lorem Ipsum... + + + + + + + + + + + ) +} + +export default Post diff --git a/pages/index.js b/pages/index.js index 9e8c7d2..4c11cd9 100644 --- a/pages/index.js +++ b/pages/index.js @@ -1,88 +1,29 @@ import React from 'react' -import Head from 'next/head' -import Nav from '../components/nav' +import { Fab, Card, CardActions, CardHeader, Button } from '@material-ui/core' +import AddIcon from '@material-ui/icons/Add' +import ViewIcon from '@material-ui/icons/Visibility' +import DeleteIcon from '@material-ui/icons/Delete' -const Home = () => ( -
- - Home - - - -
-) +const Home = () => { + return ( + + + + + + + + + + + ) +} export default Home