diff --git a/package.json b/package.json
index db683da4..bdf831bf 100644
--- a/package.json
+++ b/package.json
@@ -3,14 +3,22 @@
"version": "0.1.0",
"private": true,
"dependencies": {
+ "@babel/core": "^7.20.12",
+ "@babel/plugin-syntax-flow": "^7.18.6",
+ "@babel/plugin-transform-react-jsx": "^7.20.13",
"@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks",
+ "@testing-library/dom": "^8.20.0",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^13.2.1",
+ "@types/node": "^18.13.0",
"babel-plugin-styled-components": "^2.0.7",
+ "postcss": "^8.4.21",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-helmet-async": "^1.3.0",
+ "react-infinite-scroller": "^1.2.6",
+ "react-is": "^18.2.0",
"react-router-dom": "^6.8.0",
"react-scripts": "5.0.1",
"styled-components": "^5.3.6",
diff --git a/public/banner-10.jpg b/public/banner-10.jpg
new file mode 100644
index 00000000..8ee36370
Binary files /dev/null and b/public/banner-10.jpg differ
diff --git a/public/banner-11.jpg b/public/banner-11.jpg
new file mode 100644
index 00000000..61e5635f
Binary files /dev/null and b/public/banner-11.jpg differ
diff --git a/public/banner-12.jpg b/public/banner-12.jpg
new file mode 100644
index 00000000..9ff83891
Binary files /dev/null and b/public/banner-12.jpg differ
diff --git a/public/banner-6.jpg b/public/banner-6.jpg
new file mode 100644
index 00000000..f6fee680
Binary files /dev/null and b/public/banner-6.jpg differ
diff --git a/public/banner-7.jpg b/public/banner-7.jpg
new file mode 100644
index 00000000..59014f2d
Binary files /dev/null and b/public/banner-7.jpg differ
diff --git a/public/banner-8.jpg b/public/banner-8.jpg
new file mode 100644
index 00000000..1dd43bc5
Binary files /dev/null and b/public/banner-8.jpg differ
diff --git a/public/banner-9.jpg b/public/banner-9.jpg
new file mode 100644
index 00000000..7cc21528
Binary files /dev/null and b/public/banner-9.jpg differ
diff --git a/src/components/Board.jsx b/src/components/Board.jsx
index 5d02a4b1..f6c2f322 100644
--- a/src/components/Board.jsx
+++ b/src/components/Board.jsx
@@ -1,13 +1,13 @@
import React, { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
-import { Container, NavBar, Header, Break, PostForm, TopBar, BoardForm } from './styled/Board.styled';
+import { Container, NavBar, Header, Break, PostForm, TopBar, BoardForm } from './styles/Board.styled';
import { useFeed } from '@plebbit/plebbit-react-hooks';
const ImageBanner = () => {
const [currentImage, setCurrentImage] = useState(1);
useEffect(() => {
- setCurrentImage(Math.floor(Math.random() * 5) + 1);
+ setCurrentImage(Math.floor(Math.random() * 12) + 1);
}, []);
return (
@@ -16,9 +16,10 @@ const ImageBanner = () => {
};
const Board = () => {
- // eslint-disable-next-line
- const { feed, hasMore, loadMore } = useFeed(['news.eth'], 'new');
const [defaultSubplebbits, setDefaultSubplebbits] = useState([]);
+ const {feed, hasMore, loadMore} = useFeed(['memes.eth'], 'new');
+
+ console.log({feed});
useEffect(() => {
let didCancel = false;
@@ -57,8 +58,10 @@ const Board = () => {
- Plebs Helping Plebs
- p/plebshelpingplebs.eth
+ <>
+ Crypto
+ p/QmPjewdKya8iVkuQiiXQ5qRBsgVUAZg2LQ2m8v3LNJ7Ht8
+
@@ -72,10 +75,18 @@ const Board = () => {
-
- [
- Catalog
- ]
+
+ Style:
+
+
+
@@ -87,7 +98,6 @@ const Board = () => {
-
Tom
@@ -117,41 +127,51 @@ const Board = () => {
- {'>'}imagine being a pleb
+ {'>'}wen mvp
+
+ two more weeks
-
-
{'>>'}
-
-
-
-
-
- Anonymous
+ {feed.map(post => (
+
+
{'>>'}
+
+
-
- (User: Qma319kE7rrHNce8vH9fAjPjihUF4EZCaKSK8dBaFtxsVn)
+
+ Anonymous
+
+
+ (User: {post.author.address})
+
-
-
-
2 weeks ago
-
-
- No.
- 00000002
-
-
▶
+
+
2 weeks ago
+
+
+ No.
+ 00000002
+
+
▶
+
+
+
+ {'>'}{post.title}
+
+
+ {post.content}
+
-
- I can imagine being a pleb
-
+ ))}
+
+
)
diff --git a/src/components/Home.jsx b/src/components/Home.jsx
index 6410e19c..2b2aab55 100644
--- a/src/components/Home.jsx
+++ b/src/components/Home.jsx
@@ -1,6 +1,6 @@
import React, { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
-import {Container, Header, Logo, Page, Search, About, AboutTitle, AboutContent, Boards, BoardsTitle, BoardsContent, Footer } from './styled/Home.styled';
+import {Container, Header, Logo, Page, Search, About, AboutTitle, AboutContent, Boards, BoardsTitle, BoardsContent, Footer } from './styles/Home.styled';
const Home = () => {
const [defaultSubplebbits, setDefaultSubplebbits] = useState([]);
diff --git a/src/components/styled/Board.styled.jsx b/src/components/styles/Board.styled.jsx
similarity index 88%
rename from src/components/styled/Board.styled.jsx
rename to src/components/styles/Board.styled.jsx
index 52d472a6..8015e493 100644
--- a/src/components/styled/Board.styled.jsx
+++ b/src/components/styles/Board.styled.jsx
@@ -95,31 +95,10 @@ export const TopBar = styled.div`
height: 0;
}
- #search-box {
- height: 16px;
- line-height: 16px;
- margin-top: 0;
- margin-right: 2px;
- margin-bottom: 0;
- margin-left: 2px;
- padding: 0 2px;
- width: 120px;
- -webkit-appearance: none;
- appearance: none;
- border: 1px solid #aaa;
- outline: none;
- font-family: Arial, Helvetica, sans-serif;
+ .style-changer {
+ margin-left: 5px;
font-size: 10pt;
}
-
- a {
- color: #00e;
- text-decoration: none;
- }
-
- a:hover {
- color: red;
- }
`;
export const BoardForm = styled.form`
@@ -244,5 +223,9 @@ export const BoardForm = styled.form`
border-top: none;
display: table;
padding: 2px;
+ overflow-wrap: break-word;
+ word-wrap: break-word;
+ word-break: break-word;
+ max-width: 100%;
}
`;
\ No newline at end of file
diff --git a/src/components/styled/Home.styled.jsx b/src/components/styles/Home.styled.jsx
similarity index 100%
rename from src/components/styled/Home.styled.jsx
rename to src/components/styles/Home.styled.jsx
diff --git a/src/components/styled/Thread.styled.jsx b/src/components/styles/Thread.styled.jsx
similarity index 100%
rename from src/components/styled/Thread.styled.jsx
rename to src/components/styles/Thread.styled.jsx
diff --git a/yarn.lock b/yarn.lock
index 9aeb6d32..5c13deca 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -41,7 +41,7 @@
resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.20.14.tgz#4106fc8b755f3e3ee0a0a7c27dde5de1d2b2baf8"
integrity sha512-0YpKHD6ImkWMEINCyDAD0HLLUH/lPCefG8ld9it8DJB2wnApraKuhgYTvTY1z7UFIfBTGy5LwncZ+5HWWGbhFw==
-"@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.3", "@babel/core@^7.16.0", "@babel/core@^7.7.2", "@babel/core@^7.8.0":
+"@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.3", "@babel/core@^7.16.0", "@babel/core@^7.20.12", "@babel/core@^7.7.2", "@babel/core@^7.8.0":
version "7.20.12"
resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.20.12.tgz#7930db57443c6714ad216953d1356dac0eb8496d"
integrity sha512-XsMfHovsUYHFMdrIHkZphTN/2Hzzi78R08NuHfDBehym2VsPDL6Zn/JAD/JQdnRvbSsbQc4mVaU1m6JgtTEElg==
@@ -815,7 +815,7 @@
dependencies:
"@babel/plugin-transform-react-jsx" "^7.18.6"
-"@babel/plugin-transform-react-jsx@^7.18.6":
+"@babel/plugin-transform-react-jsx@^7.18.6", "@babel/plugin-transform-react-jsx@^7.20.13":
version "7.20.13"
resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.20.13.tgz#f950f0b0c36377503d29a712f16287cedf886cbb"
integrity sha512-MmTZx/bkUrfJhhYAYt3Urjm+h8DQGrPrnKQ94jLo7NLuOU+T89a7IByhKmrb8SKhrIYIQ0FN0CHMbnFRen4qNw==
@@ -2693,7 +2693,7 @@
"@svgr/plugin-svgo" "^5.5.0"
loader-utils "^2.0.0"
-"@testing-library/dom@^8.5.0":
+"@testing-library/dom@^8.20.0", "@testing-library/dom@^8.5.0":
version "8.20.0"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.20.0.tgz#914aa862cef0f5e89b98cc48e3445c4c921010f6"
integrity sha512-d9ULIT+a4EXLX3UU8FBjauG9NnsZHkHztXoIcTsOKoOw030fyjheN9svkTULjJxtYag9DZz5Jz5qkWZDPxTFwA==
@@ -2980,6 +2980,11 @@
resolved "https://registry.yarnpkg.com/@types/node/-/node-18.11.18.tgz#8dfb97f0da23c2293e554c5a50d61ef134d7697f"
integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
+"@types/node@^18.13.0":
+ version "18.13.0"
+ resolved "https://registry.yarnpkg.com/@types/node/-/node-18.13.0.tgz#0400d1e6ce87e9d3032c19eb6c58205b0d3f7850"
+ integrity sha512-gC3TazRzGoOnoKAhUx+Q0t8S9Tzs74z7m0ipwGpSqQrleP14hKxP4/JUeEQcD3W1/aIpnWl8pHowI7WokuZpXg==
+
"@types/normalize-package-data@^2.4.0":
version "2.4.1"
resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz#d3357479a0fdfdd5907fe67e17e0a85c906e1301"
@@ -9662,7 +9667,7 @@ postcss@^7.0.35:
picocolors "^0.2.1"
source-map "^0.6.1"
-postcss@^8.3.5, postcss@^8.4.18, postcss@^8.4.19, postcss@^8.4.4:
+postcss@^8.3.5, postcss@^8.4.18, postcss@^8.4.19, postcss@^8.4.21, postcss@^8.4.4:
version "8.4.21"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
@@ -9755,7 +9760,7 @@ prompts@^2.0.1, prompts@^2.4.2:
kleur "^3.0.3"
sisteransi "^1.0.5"
-prop-types@^15.7.2, prop-types@^15.8.1:
+prop-types@^15.5.8, prop-types@^15.7.2, prop-types@^15.8.1:
version "15.8.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -9953,6 +9958,13 @@ react-helmet-async@^1.3.0:
react-fast-compare "^3.2.0"
shallowequal "^1.1.0"
+react-infinite-scroller@^1.2.6:
+ version "1.2.6"
+ resolved "https://registry.yarnpkg.com/react-infinite-scroller/-/react-infinite-scroller-1.2.6.tgz#8b80233226dc753a597a0eb52621247f49b15f18"
+ integrity sha512-mGdMyOD00YArJ1S1F3TVU9y4fGSfVVl6p5gh/Vt4u99CJOptfVu/q5V/Wlle72TMgYlBwIhbxK5wF0C/R33PXQ==
+ dependencies:
+ prop-types "^15.5.8"
+
react-is@^16.13.1, react-is@^16.7.0:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -9963,7 +9975,7 @@ react-is@^17.0.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
-react-is@^18.0.0:
+react-is@^18.0.0, react-is@^18.2.0:
version "18.2.0"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==