diff --git a/packages/concordia-app/package.json b/packages/concordia-app/package.json
index 5931f0f..ec3fa75 100644
--- a/packages/concordia-app/package.json
+++ b/packages/concordia-app/package.json
@@ -24,11 +24,11 @@
]
},
"dependencies": {
- "@ezerous/breeze": "~0.4.0",
- "@ezerous/drizzle": "~0.4.1",
+ "@ezerous/breeze": "~0.7.0",
+ "@ezerous/drizzle": "~0.4.2",
"@ezerous/eth-identity-provider": "~0.1.2",
"@reduxjs/toolkit": "~1.4.0",
- "@welldone-software/why-did-you-render": "^6.0.0-rc.1",
+ "@welldone-software/why-did-you-render": "~6.0.5",
"concordia-contracts": "~0.1.0",
"concordia-shared": "~0.1.0",
"i18next": "^19.8.3",
@@ -38,6 +38,7 @@
"prop-types": "~15.7.2",
"react": "~16.13.1",
"react-avatar": "~3.9.7",
+ "react-copy-to-clipboard": "^5.0.3",
"react-dom": "~16.13.1",
"react-i18next": "^11.7.3",
"react-markdown": "^5.0.3",
diff --git a/packages/concordia-app/public/locales/en/translation.json b/packages/concordia-app/public/locales/en/translation.json
index d37376c..d4661ce 100644
--- a/packages/concordia-app/public/locales/en/translation.json
+++ b/packages/concordia-app/public/locales/en/translation.json
@@ -7,8 +7,9 @@
"clear.databases.modal.clearing.progress.message": "This might take a minute...",
"clear.databases.modal.clearing.progress.title": "Clearing all Concordia databases",
"clear.databases.modal.description.body.user": "Although this action is generally recoverable some of your topics and posts may be permanently lost.",
- "clear.databases.modal.description.pre": "You are about to clear the Concordia databases stored locally in your browser.",
- "clear.databases.modal.form.username.label.guest": "Please type concordia to confirm.",
+ "clear.databases.modal.description.pre.guest": "You are about to clear the Concordia databases stored locally in your browser.",
+ "clear.databases.modal.description.pre.user": "Be careful, {{username}}! You are about to clear the Concordia databases stored locally in your browser.",
+ "clear.databases.modal.form.username.label.guest": "Please type Concordia to confirm.",
"clear.databases.modal.form.username.label.user": "Please type your username to confirm.",
"clear.databases.modal.title": "Clear all Concordia databases. Are you sure?",
"custom.loading.tab.pane.default.generic.message": "Magic in the background",
diff --git a/packages/concordia-app/src/assets/css/index.css b/packages/concordia-app/src/assets/css/index.css
index cd7fb04..8e38ba2 100644
--- a/packages/concordia-app/src/assets/css/index.css
+++ b/packages/concordia-app/src/assets/css/index.css
@@ -5,12 +5,10 @@
--secondary-color-highlighted: #061A30;
}
-body.app {
- height: auto;
- padding-bottom: 4rem;
+body {
overflow: auto;
margin: 0;
- background: #E6E6E6;
+ background: white;
}
div {
diff --git a/packages/concordia-app/src/components/ClearDatabasesModal/index.jsx b/packages/concordia-app/src/components/ClearDatabasesModal/index.jsx
index db2aa72..922dc54 100644
--- a/packages/concordia-app/src/components/ClearDatabasesModal/index.jsx
+++ b/packages/concordia-app/src/components/ClearDatabasesModal/index.jsx
@@ -23,7 +23,7 @@ const ClearDatabasesModal = (props) => {
useEffect(() => {
if (user.hasSignedUp && confirmationInput === user.username) {
setUserConfirmed(true);
- } else if (!user.hasSignedUp && confirmationInput === 'concordia') {
+ } else if (!user.hasSignedUp && confirmationInput === 'Concordia') {
setUserConfirmed(true);
} else {
setUserConfirmed(false);
@@ -63,7 +63,7 @@ const ClearDatabasesModal = (props) => {
return (
<>
- {t('clear.databases.modal.description.pre')}
+ {t('clear.databases.modal.description.pre.user', { username: user.username })}
{t('clear.databases.modal.description.body.user')}
@@ -88,7 +88,7 @@ const ClearDatabasesModal = (props) => {
return (
<>
- {t('clear.databases.modal.description.pre')}
+ {t('clear.databases.modal.description.pre.guest')}
@@ -105,7 +105,7 @@ const ClearDatabasesModal = (props) => {
>
);
- }, [confirmationInput, isClearing, t, user.hasSignedUp]);
+ }, [confirmationInput, isClearing, t, user.hasSignedUp, user.username]);
return useMemo(() => (
{
- useEffect(() => function cleanup() {
- document.body.classList.add('app');
- }, []);
+import './style.css';
+const LoadingComponent = (props) => {
const {
imageType, messageList, progressType, title, message, progress,
} = props;
@@ -48,14 +46,20 @@ const LoadingComponent = (props) => {
const list = messageList ? : '';
return (
-
-
-
+
+
+
{title}
{message}
{list}
-
+
);
};
diff --git a/packages/concordia-app/src/assets/css/loading-component.css b/packages/concordia-app/src/components/InitializationScreen/CustomLoader/style.css
similarity index 61%
rename from packages/concordia-app/src/assets/css/loading-component.css
rename to packages/concordia-app/src/components/InitializationScreen/CustomLoader/style.css
index 5ed41f8..6ea1586 100644
--- a/packages/concordia-app/src/assets/css/loading-component.css
+++ b/packages/concordia-app/src/components/InitializationScreen/CustomLoader/style.css
@@ -1,27 +1,24 @@
-body {
- overflow: hidden;
-}
-
-.loading-screen {
- margin-top: 12em;
+#loading-screen {
+ padding-top: 12em;
text-align: center;
font-size: large;
+ height: 100%;
}
-.loading-screen ul {
+#loading-screen ul {
list-style-position: inside;
}
-.loading-img {
+#loading-img {
margin-bottom: 3em;
height: 12em;
}
-.ui.container {
+#loading-screen-container {
height: 26em;
}
-.ui.progress {
+#loading-screen-progress {
width: 40vw;
margin-left: auto !important;
margin-right: auto !important;
diff --git a/packages/concordia-app/src/components/InitializationScreen/index.jsx b/packages/concordia-app/src/components/InitializationScreen/index.jsx
index 6ada2b8..21cbf11 100644
--- a/packages/concordia-app/src/components/InitializationScreen/index.jsx
+++ b/packages/concordia-app/src/components/InitializationScreen/index.jsx
@@ -4,9 +4,6 @@ import { useSelector } from 'react-redux';
import { FORUM_CONTRACT } from 'concordia-shared/src/constants/contracts/ContractNames';
import CustomLoader from './CustomLoader';
-// CSS
-import '../../assets/css/loading-component.css';
-
const InitializationLoader = ({ children }) => {
const initializing = useSelector((state) => state.drizzleStatus.initializing);
const failed = useSelector((state) => state.drizzleStatus.failed);
@@ -94,7 +91,7 @@ const InitializationLoader = ({ children }) => {
);
}
- if (ipfsStatus === breezeConstants.STATUS_INITIALIZING) {
+ if (ipfsStatus === breezeConstants.STATUS_UNINITIALIZED || ipfsStatus === breezeConstants.STATUS_INITIALIZING) {
return (
{
);
}
- if (orbitStatus === breezeConstants.STATUS_INITIALIZING) {
+ if (orbitStatus === breezeConstants.STATUS_UNINITIALIZED || orbitStatus === breezeConstants.STATUS_INITIALIZING) {
const message = process.env.NODE_ENV === 'development'
? 'If needed, please sign the transaction in MetaMask to create the databases.'
: 'Please sign the transaction in MetaMask to create the databases.';
diff --git a/packages/concordia-app/src/components/PostCreate/index.jsx b/packages/concordia-app/src/components/PostCreate/index.jsx
index 32d2915..6dd5180 100644
--- a/packages/concordia-app/src/components/PostCreate/index.jsx
+++ b/packages/concordia-app/src/components/PostCreate/index.jsx
@@ -87,7 +87,7 @@ const PostCreate = (props) => {
postsDb
.put(contractPostId, {
[POST_CONTENT]: postContent,
- }, { pin: true })
+ })
.then(() => {
setPostContent('');
setPosting(false);
diff --git a/packages/concordia-app/src/components/TopicList/TopicListRow/styles.css b/packages/concordia-app/src/components/TopicList/TopicListRow/styles.css
index 2a7dda0..6b19c2a 100644
--- a/packages/concordia-app/src/components/TopicList/TopicListRow/styles.css
+++ b/packages/concordia-app/src/components/TopicList/TopicListRow/styles.css
@@ -26,7 +26,7 @@
.topic-row-avatar {
margin: auto;
- padding-left: 1rem !important;
+ padding-left: 1.4rem !important;
padding-right: 0 !important;
font-size: 2rem;
color: red;
@@ -37,7 +37,7 @@
}
.topic-row-content {
- padding-left: 2rem !important;
+ padding-left: 3rem !important;
}
.topic-row-subject {
diff --git a/packages/concordia-app/src/components/TopicList/styles.css b/packages/concordia-app/src/components/TopicList/styles.css
index 5fae8a7..6bbac7b 100644
--- a/packages/concordia-app/src/components/TopicList/styles.css
+++ b/packages/concordia-app/src/components/TopicList/styles.css
@@ -1,6 +1,4 @@
#topic-list{
- height: 100%;
- margin-bottom: 4em;
+ height: auto;
clear: both;
}
-
diff --git a/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/index.jsx b/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/index.jsx
new file mode 100644
index 0000000..44f460e
--- /dev/null
+++ b/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/index.jsx
@@ -0,0 +1,85 @@
+import React, { useMemo } from 'react';
+import { useSelector } from 'react-redux';
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import {
+ Header, Image, Segment, Table,
+} from 'semantic-ui-react';
+
+import ipfsLogo from '../../../assets/images/ipfs_logo.svg';
+import './styles.css';
+
+const MainLayoutIPFSStatus = () => {
+ const ipfsId = useSelector((state) => state.ipfs.id);
+ const peerIds = useSelector((state) => state.ipfs.peers);
+ const bootstrapPeerIds = useSelector((state) => state.ipfs.bootstrapPeers);
+ const peers = useMemo(() => peerIds
+ .map((peerId) => (
+
+
+
+ {peerId}
+
+
+
+
+ )), [peerIds]);
+
+ const bootstrapPeers = useMemo(() => bootstrapPeerIds
+ .map((bootstrapPeerId) => (
+
+
+
+ {bootstrapPeerId}
+
+
+
+
+ )), [bootstrapPeerIds]);
+
+ return (
+
+
+
+
+
+ Peer ID
+
+
+
+
+ {ipfsId}
+
+
+
+
+ Peers
+
+ {peers.length === 0
+ ? (
+
+ -
+
+ ) : null}
+ {peers}
+
+ Bootstrap Peers
+
+ {bootstrapPeers.length === 0
+ ? (
+
+ -
+
+ ) : null}
+ {bootstrapPeers}
+
+
+
+ );
+};
+
+export default MainLayoutIPFSStatus;
diff --git a/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/styles.css b/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/styles.css
new file mode 100644
index 0000000..abfeccd
--- /dev/null
+++ b/packages/concordia-app/src/layouts/MainLayout/MainLayoutIPFSStatus/styles.css
@@ -0,0 +1,18 @@
+.status-table {
+ border: 1px solid var(--secondary-color) !important;
+}
+
+.status-key {
+ background-color: var(--secondary-color);
+ color: white;
+ font-weight: 700;
+}
+
+.status-value {
+ font-size: 0.95rem;
+ cursor: pointer;
+}
+
+.status-value:hover {
+ color: grey;
+}
diff --git a/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx b/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx
index 012fad6..1f0c0f7 100644
--- a/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx
+++ b/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx
@@ -31,7 +31,7 @@ const MainLayoutMenu = () => {
return (
{() => (
-