diff --git a/src/components/reply/reply.tsx b/src/components/reply/reply.tsx
index 1aba91ae..e6015a6e 100644
--- a/src/components/reply/reply.tsx
+++ b/src/components/reply/reply.tsx
@@ -265,7 +265,7 @@ const Reply = ({ cidOfReplyWithContext, depth = 0, isSingleComment, isSingleRepl
const [showSpoiler, setShowSpoiler] = useState(false);
- const { blocked, unblock } = useBlock({ address: cid });
+ const { blocked, unblock } = useBlock({ cid });
const [collapsed, setCollapsed] = useState(blocked);
useEffect(() => {
if (blocked) {
diff --git a/src/components/topbar/topbar.tsx b/src/components/topbar/topbar.tsx
index 56f0df08..6a559eb0 100644
--- a/src/components/topbar/topbar.tsx
+++ b/src/components/topbar/topbar.tsx
@@ -1,7 +1,7 @@
import { useCallback, useEffect, useRef, useState } from 'react';
import { Link, useLocation, useNavigate, useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
-import { useAccount, useAccountSubplebbits } from '@plebbit/plebbit-react-hooks';
+import { useAccount } from '@plebbit/plebbit-react-hooks';
import Plebbit from '@plebbit/plebbit-js/dist/browser/index.js';
import styles from './topbar.module.css';
import { useDefaultSubplebbitAddresses } from '../../hooks/use-default-subplebbits';
@@ -121,8 +121,6 @@ const TopBar = () => {
}
};
- const { accountSubplebbits } = useAccountSubplebbits();
-
return (
@@ -137,11 +135,9 @@ const TopBar = () => {
{t('create_community')}
- {accountSubplebbits && Object.keys(accountSubplebbits).length > 0 && (
-
- {t('own_communities')}
-
- )}
+
+ {t('my_communities')}
+
{t('default_communities')}
diff --git a/src/hooks/use-challenge-settings.ts b/src/hooks/use-challenge-settings.ts
new file mode 100644
index 00000000..921dace2
--- /dev/null
+++ b/src/hooks/use-challenge-settings.ts
@@ -0,0 +1,10 @@
+import { usePlebbitRpcSettings } from '@plebbit/plebbit-react-hooks';
+
+const useChallengeSettings = (challengeName: string) => {
+ const { challenges } = usePlebbitRpcSettings().plebbitRpcSettings || {};
+ if (challenges) {
+ return challenges[challengeName] || {};
+ }
+};
+
+export default useChallengeSettings;
diff --git a/src/hooks/use-challenges-options.ts b/src/hooks/use-challenges-options.ts
new file mode 100644
index 00000000..5362747e
--- /dev/null
+++ b/src/hooks/use-challenges-options.ts
@@ -0,0 +1,21 @@
+import { usePlebbitRpcSettings } from '@plebbit/plebbit-react-hooks';
+
+const useChallengesOptions = () => {
+ const { challenges } = usePlebbitRpcSettings().plebbitRpcSettings || {};
+
+ const options = Object.keys(challenges || {}).reduce(
+ (acc, challengeName) => {
+ const challengeSettings = challenges[challengeName];
+ acc[challengeName] = challengeSettings.optionInputs.reduce((optionsAcc: any, input: any) => {
+ optionsAcc[input.option] = input.default || '';
+ return optionsAcc;
+ }, {});
+ return acc;
+ },
+ {} as Record>,
+ );
+
+ return options;
+};
+
+export default useChallengesOptions;
diff --git a/src/lib/utils/challenge-utils.ts b/src/lib/utils/challenge-utils.ts
index 36f09f82..f0692746 100644
--- a/src/lib/utils/challenge-utils.ts
+++ b/src/lib/utils/challenge-utils.ts
@@ -61,219 +61,3 @@ export const getPublicationPreview = (publication: any) => {
}
return publicationPreview;
};
-
-export const getDefaultChallengeDescription = (challengeType: string) => {
- switch (challengeType) {
- case 'text-math':
- return 'Ask a plain text math question, insecure, use ONLY for testing.';
- case 'captcha-canvas-v3':
- return 'make custom image captcha';
- case 'fail':
- return 'A challenge that automatically fails with a custom error message.';
- case 'blacklist':
- return 'Blacklist author addresses.';
- case 'question':
- return "Ask a question, like 'What is the password?'";
- case 'evm-contract-call':
- return 'The response from an EVM contract call passes a condition, e.g. a token balance challenge.';
- default:
- return '';
- }
-};
-
-export const getDefaultChallengeOptions = (challengeType: string) => {
- switch (challengeType) {
- case 'text-math':
- return {
- difficulty: '',
- };
- case 'captcha-canvas-v3':
- return {
- characters: '',
- height: '',
- width: '',
- color: '',
- };
- case 'fail':
- return {
- error: '',
- };
- case 'blacklist':
- return {
- blacklist: '',
- error: '',
- };
- case 'question':
- return {
- question: '',
- answer: '',
- };
- case 'evm-contract-call':
- return {
- chainTicker: '',
- address: '',
- abi: '',
- condition: '',
- error: '',
- };
- default:
- return {};
- }
-};
-
-export type OptionInput = {
- option: string;
- label: string;
- default?: string;
- description: string;
- placeholder?: string;
- required?: boolean;
-};
-
-export type Exclude = {
- postScore?: number;
- replyScore?: number;
- firstCommentTimestamp?: number;
- challenges?: number[];
- post?: boolean;
- reply?: boolean;
- vote?: boolean;
- role?: string[];
- address?: string[];
- rateLimit?: number;
- rateLimitChallengeSuccess?: boolean;
-};
-
-export const getDefaultChallengeSettings = (challengeType: string) => {
- switch (challengeType) {
- case 'text-math':
- return [
- {
- option: 'difficulty',
- label: 'Difficulty',
- default: '1',
- description: 'The math difficulty of the challenge between 1-3.',
- placeholder: '1',
- },
- ];
- case 'captcha-canvas-v3':
- return [
- {
- option: 'characters',
- label: 'Characters',
- description: 'Amount of characters of the captcha.',
- default: '6',
- placeholder: 'example: 6',
- },
- {
- option: 'height',
- label: 'Height',
- description: 'Height of the captcha.',
- default: '100',
- placeholder: 'example: 100',
- },
- {
- option: 'width',
- label: 'Width',
- description: 'Width of the captcha.',
- default: '300',
- placeholder: 'example: 300',
- },
- {
- option: 'color',
- label: 'Color',
- description: 'Color of the captcha.',
- default: '#32cf7e',
- placeholder: 'example: #ff0000,#00ff00,#0000ff',
- },
- ];
- case 'fail':
- return [
- {
- option: 'error',
- label: 'Error',
- default: "You're not allowed to publish.",
- description: 'The error to display to the author.',
- placeholder: "You're not allowed to publish.",
- },
- ];
- case 'blacklist':
- return [
- {
- option: 'blacklist',
- label: 'Blacklist',
- default: '',
- description: 'Comma separated list of author addresses to be blacklisted.',
- placeholder: 'address1.eth,address2.eth,address3.eth',
- },
- {
- option: 'error',
- label: 'Error',
- default: "You're blacklisted.",
- description: 'The error to display to the author.',
- placeholder: "You're blacklisted.",
- },
- ];
- case 'question':
- return [
- {
- option: 'question',
- label: 'Question',
- default: '',
- description: 'The question to answer.',
- placeholder: '',
- },
- {
- option: 'answer',
- label: 'Answer',
- default: '',
- description: 'The answer to the question.',
- placeholder: '',
- required: true,
- },
- ];
- case 'evm-contract-call':
- return [
- {
- option: 'chainTicker',
- label: 'chainTicker',
- default: 'eth',
- description: 'The chain ticker',
- placeholder: 'eth',
- required: true,
- },
- {
- option: 'address',
- label: 'Address',
- default: '',
- description: 'The contract address.',
- placeholder: '0x...',
- required: true,
- },
- {
- option: 'abi',
- label: 'ABI',
- default: '',
- description: 'The ABI of the contract method.',
- placeholder: '{"constant":true,"inputs":[{"internalType":"address","name":"account...',
- required: true,
- },
- {
- option: 'condition',
- label: 'Condition',
- default: '',
- description: 'The condition the contract call response must pass.',
- placeholder: '>1000',
- required: true,
- },
- {
- option: 'error',
- label: 'Error',
- default: "Contract call response doesn't pass condition.",
- description: 'The error to display to the author.',
- },
- ];
- default:
- return [];
- }
-};
diff --git a/src/lib/utils/view-utils.ts b/src/lib/utils/view-utils.ts
index e31bbb2a..5aeb2efa 100644
--- a/src/lib/utils/view-utils.ts
+++ b/src/lib/utils/view-utils.ts
@@ -122,8 +122,12 @@ export const isProfileUpvotedView = (pathname: string): boolean => {
return pathname === '/profile/upvoted';
};
+export const isProfileHiddenView = (pathname: string): boolean => {
+ return pathname === '/profile/hidden';
+};
+
export const isSettingsView = (pathname: string): boolean => {
- return pathname === '/settings';
+ return pathname === '/settings' || pathname === '/settings/plebbit-options';
};
export const isSettingsPlebbitOptionsView = (pathname: string): boolean => {
diff --git a/src/views/home/home.module.css b/src/views/home/home.module.css
index 5e4b8bff..2a004bca 100644
--- a/src/views/home/home.module.css
+++ b/src/views/home/home.module.css
@@ -6,6 +6,10 @@
text-transform: lowercase;
}
+.feed {
+ position: relative;
+}
+
@media (max-width: 640px) {
.content {
padding: 7px 2px 0px 2px;
diff --git a/src/views/home/home.tsx b/src/views/home/home.tsx
index 038472d0..7f05cc87 100644
--- a/src/views/home/home.tsx
+++ b/src/views/home/home.tsx
@@ -5,6 +5,7 @@ import { useFeed } from '@plebbit/plebbit-react-hooks';
import { useTranslation } from 'react-i18next';
import styles from './home.module.css';
import LoadingEllipsis from '../../components/loading-ellipsis';
+import NewerPostsButton from '../../components/newer-posts-button';
import Post from '../../components/post';
import Sidebar from '../../components/sidebar';
import { useDefaultAndSubscriptionsSubplebbitAddresses } from '../../hooks/use-default-subplebbits';
@@ -21,11 +22,11 @@ const Home = () => {
const timeFilterName = params.timeFilterName as TimeFilterKey;
const { timeFilter } = useTimeFilter(sortType, timeFilterName);
- const { feed, hasMore, loadMore } = useFeed({
- subplebbitAddresses: subplebbitAddresses || [],
- sortType,
- postsPerPage: 10,
+ const { feed, hasMore, loadMore, reset, subplebbitAddressesWithNewerPosts } = useFeed({
filter: timeFilter,
+ postsPerPage: 10,
+ sortType,
+ subplebbitAddresses: subplebbitAddresses || [],
});
let loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading');
@@ -72,6 +73,7 @@ const Home = () => {
+
{
{!isSingleComment && (
- {replyCount !== undefined ? commentCount : t('loading_comments')}
+ {replyCount !== undefined ? commentCount : `${t('loading_comments')}...`}
)}
diff --git a/src/views/profile/profile.tsx b/src/views/profile/profile.tsx
index db04d3c6..fd926274 100644
--- a/src/views/profile/profile.tsx
+++ b/src/views/profile/profile.tsx
@@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next';
import { useLocation, useParams } from 'react-router-dom';
import { StateSnapshot, Virtuoso, VirtuosoHandle } from 'react-virtuoso';
import { useAccount, useAccountComments, useAccountVotes, useComments } from '@plebbit/plebbit-react-hooks';
-import { isProfileDownvotedView, isProfileUpvotedView, isProfileCommentsView, isProfileSubmittedView } from '../../lib/utils/view-utils';
+import { isProfileDownvotedView, isProfileUpvotedView, isProfileCommentsView, isProfileSubmittedView, isProfileHiddenView } from '../../lib/utils/view-utils';
import useWindowWidth from '../../hooks/use-window-width';
import AuthorSidebar from '../../components/author-sidebar';
import Post from '../../components/post';
@@ -17,7 +17,7 @@ type SortDropdownProps = {
onSortChange: (sortType: string) => void;
};
-const SortDropdown: React.FC
= ({ onSortChange }) => {
+const SortDropdown = ({ onSortChange }: SortDropdownProps) => {
const { t } = useTranslation();
const sortLabels: string[] = sortTypes.map((sortType) => t(sortType));
const [selectedSort, setSelectedSort] = useState(sortTypes[0]);
@@ -77,17 +77,21 @@ const Profile = () => {
const { accountVotes } = useAccountVotes();
const isInProfileUpvotedView = isProfileUpvotedView(location.pathname);
const isInProfileDownvotedView = isProfileDownvotedView(location.pathname);
+ const isInProfileHiddenView = isProfileHiddenView(location.pathname);
const isInCommentsView = isProfileCommentsView(location.pathname);
const isInSubmittedView = isProfileSubmittedView(location.pathname);
const isMobile = useWindowWidth() < 640;
// get comments for upvoted/downvoted/comments/submitted pages
+ const postComments = useMemo(() => accountComments?.filter((comment) => !comment.parentCid) || [], [accountComments]);
+ const replyComments = useMemo(() => accountComments?.filter((comment) => comment.parentCid) || [], [accountComments]);
const upvotedCommentCids = useMemo(() => accountVotes?.filter((vote) => vote.vote === 1).map((vote) => vote.commentCid) || [], [accountVotes]);
const downvotedCommentCids = useMemo(() => accountVotes?.filter((vote) => vote.vote === -1).map((vote) => vote.commentCid) || [], [accountVotes]);
- const replyComments = useMemo(() => accountComments?.filter((comment) => comment.parentCid) || [], [accountComments]);
- const postComments = useMemo(() => accountComments?.filter((comment) => !comment.parentCid) || [], [accountComments]);
+ const hiddenCommentCids = useMemo(() => Object.keys(account?.blockedCids ?? {}), [account?.blockedCids]);
+
const { comments: upvotedComments } = useComments({ commentCids: upvotedCommentCids });
const { comments: downvotedComments } = useComments({ commentCids: downvotedCommentCids });
+ const { comments: hiddenComments } = useComments({ commentCids: hiddenCommentCids });
const [sortType, setSortType] = useState('new');
const handleSortChange = (newSortType: string) => {
@@ -103,18 +107,22 @@ const Profile = () => {
return replyComments;
} else if (isInSubmittedView) {
return postComments;
+ } else if (isInProfileHiddenView) {
+ return hiddenComments;
} else {
return accountComments;
}
}, [
isInProfileUpvotedView,
isInProfileDownvotedView,
+ isInProfileHiddenView,
isInCommentsView,
isInSubmittedView,
upvotedComments,
downvotedComments,
replyComments,
postComments,
+ hiddenComments,
accountComments,
]);
diff --git a/src/views/settings/plebbit-options/plebbit-options.module.css b/src/views/settings/plebbit-options/plebbit-options.module.css
index b19aa818..7dc9f937 100644
--- a/src/views/settings/plebbit-options/plebbit-options.module.css
+++ b/src/views/settings/plebbit-options/plebbit-options.module.css
@@ -38,11 +38,22 @@
}
.content textarea {
- height: 80px;
font-size: 13px;
font-family: Arial, Helvetica, sans-serif;
}
+.ipfsGatewaysSettings textarea {
+ height: 80px;
+}
+
+.pubsubProvidersSettings textarea {
+ height: 50px;
+}
+
+.blockchainProvidersSettings textarea {
+ height: 50px;
+}
+
.content button {
vertical-align: top;
margin-left: 5px;
@@ -67,6 +78,11 @@
padding-left: 40px;
}
+.saveOptions {
+ text-transform: lowercase;
+ margin-top: 10px;
+}
+
@media (max-width: 640px) {
.categoryTitle {
flex: 0 0 65px;
diff --git a/src/views/settings/plebbit-options/plebbit-options.tsx b/src/views/settings/plebbit-options/plebbit-options.tsx
index 1625bcfc..c318ae3f 100644
--- a/src/views/settings/plebbit-options/plebbit-options.tsx
+++ b/src/views/settings/plebbit-options/plebbit-options.tsx
@@ -1,75 +1,105 @@
-import { useState } from 'react';
-import { useAccount } from '@plebbit/plebbit-react-hooks';
-import styles from './plebbit-options.module.css';
+import { RefObject, useRef, useState } from 'react';
import { useTranslation } from 'react-i18next';
+import { setAccount, useAccount, usePlebbitRpcSettings } from '@plebbit/plebbit-react-hooks';
+import styles from './plebbit-options.module.css';
-const isElectron = window.isElectron === true;
+interface SettingsProps {
+ ipfsGatewayUrlsRef?: RefObject;
+ mediaIpfsGatewayUrlRef?: RefObject;
+ pubsubProvidersRef?: RefObject;
+ ethRpcRef?: RefObject;
+ solRpcRef?: RefObject;
+ maticRpcRef?: RefObject;
+ avaxRpcRef?: RefObject;
+ plebbitRpcRef?: RefObject;
+ nodeDataPathRef?: RefObject;
+}
-const IPFSGatewaysSettings = ({ ipfsGatewayUrls, mediaIpfsGatewayUrl }: { ipfsGatewayUrls: any; mediaIpfsGatewayUrl: any }) => {
- const { t } = useTranslation();
+const IPFSGatewaysSettings = ({ ipfsGatewayUrlsRef, mediaIpfsGatewayUrlRef }: SettingsProps) => {
+ const account = useAccount();
+ const { plebbitOptions, mediaIpfsGatewayUrl } = account || {};
+ const { ipfsGatewayUrls } = plebbitOptions || {};
+ const plebbitRpc = usePlebbitRpcSettings();
+ const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
const ipfsGatewayUrlsDefaultValue = ipfsGatewayUrls?.join('\n');
return (
);
};
-const PubsubProvidersSettings = ({ pubsubHttpClientsOptions }: { pubsubHttpClientsOptions: any }) => {
- const { t } = useTranslation();
+const PubsubProvidersSettings = ({ pubsubProvidersRef }: SettingsProps) => {
+ const account = useAccount();
+ const { plebbitOptions } = account || {};
+ const { pubsubHttpClientsOptions } = plebbitOptions || {};
+ const plebbitRpc = usePlebbitRpcSettings();
+ const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
const pubsubProvidersDefaultValue = pubsubHttpClientsOptions?.join('\n');
return (
-
-
+
);
};
-const BlockchainProvidersSettings = ({ chainProviders }: { chainProviders: any }) => {
- const { t } = useTranslation();
- const ethRpcDefaultValue = chainProviders?.['eth']?.urls.join(', ');
- const solRpcDefaultValue = chainProviders?.['sol']?.urls.join(', ');
- const maticRpcDefaultValue = chainProviders?.['matic']?.urls.join(', ');
+const BlockchainProvidersSettings = ({ ethRpcRef, solRpcRef, maticRpcRef, avaxRpcRef }: SettingsProps) => {
+ const account = useAccount();
+ const { plebbitOptions } = account || {};
+ const { chainProviders } = plebbitOptions || {};
+ const ethRpcDefaultValue = chainProviders?.['eth']?.urls.join('\n');
+ const solRpcDefaultValue = chainProviders?.['sol']?.urls.join('\n');
+ const maticRpcDefaultValue = chainProviders?.['matic']?.urls.join('\n');
+ const avaxRpcDefaultValue = chainProviders?.['avax']?.urls.join('\n');
return (
);
};
-const PlebbitRPCSettings = ({ isElectron }: { isElectron: boolean }) => {
- const { t } = useTranslation();
+const PlebbitRPCSettings = ({ plebbitRpcRef }: SettingsProps) => {
const [showInfo, setShowInfo] = useState(false);
+ const account = useAccount();
+ const { plebbitOptions } = account || {};
+ const { plebbitRpcClientsOptions } = plebbitOptions || {};
return (
-
+
-
{showInfo && (
@@ -89,57 +119,125 @@ const PlebbitRPCSettings = ({ isElectron }: { isElectron: boolean }) => {
);
};
-const NodeDataPathSettings = ({ isElectron }: { isElectron: boolean }) => {
- const { t } = useTranslation();
- const path = '~/Application Support/seedit';
+const NodeDataPathSettings = ({ nodeDataPathRef }: SettingsProps) => {
+ const plebbitRpc = usePlebbitRpcSettings();
+ const { plebbitRpcSettings } = plebbitRpc || {};
+ const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
+ const path = plebbitRpcSettings?.plebbitOptions?.dataPath || '';
return (
);
};
const PlebbitOptions = () => {
- // const { t } = useTranslation();
- const { plebbitOptions, mediaIpfsGatewayUrl } = useAccount() || {};
- const { ipfsGatewayUrls, pubsubHttpClientsOptions, chainProviders } = plebbitOptions || {};
+ const { t } = useTranslation();
+ const account = useAccount();
+ const { plebbitOptions } = account || {};
+
+ const ipfsGatewayUrlsRef = useRef
(null);
+ const mediaIpfsGatewayUrlRef = useRef(null);
+ const pubsubProvidersRef = useRef(null);
+ const ethRpcRef = useRef(null);
+ const solRpcRef = useRef(null);
+ const maticRpcRef = useRef(null);
+ const avaxRpcRef = useRef(null);
+ const plebbitRpcRef = useRef(null);
+ const nodeDataPathRef = useRef(null);
+
+ const handleSave = async () => {
+ const ipfsGatewayUrls = ipfsGatewayUrlsRef.current?.value.split('\n').map((url) => url.trim());
+ const mediaIpfsGatewayUrl = mediaIpfsGatewayUrlRef.current?.value.trim();
+ const pubsubHttpClientsOptions = pubsubProvidersRef.current?.value.split('\n').map((url) => url.trim());
+ const ethRpcUrls = ethRpcRef.current?.value.split('\n').map((url) => url.trim());
+ const solRpcUrls = solRpcRef.current?.value.split('\n').map((url) => url.trim());
+ const maticRpcUrls = maticRpcRef.current?.value.split('\n').map((url) => url.trim());
+ const avaxRpcUrls = avaxRpcRef.current?.value.split('\n').map((url) => url.trim());
+ const plebbitRpcClientsOptions = plebbitRpcRef.current?.value.trim();
+ const dataPath = nodeDataPathRef.current?.value.trim();
+
+ const chainProviders = {
+ eth: {
+ urls: ethRpcUrls,
+ chainId: 1,
+ },
+ sol: {
+ urls: solRpcUrls,
+ chainId: 1,
+ },
+ matic: {
+ urls: maticRpcUrls,
+ chainId: 137,
+ },
+ avax: {
+ urls: avaxRpcUrls,
+ chainId: 43114,
+ },
+ };
+
+ try {
+ await setAccount({
+ ...account,
+ mediaIpfsGatewayUrl,
+ plebbitOptions: {
+ ...plebbitOptions,
+ ipfsGatewayUrls,
+ pubsubHttpClientsOptions,
+ chainProviders,
+ plebbitRpcClientsOptions,
+ dataPath,
+ },
+ });
+ alert('Options saved.');
+ } catch (e) {
+ if (e instanceof Error) {
+ alert('Error saving options: ' + e.message);
+ console.log(e);
+ } else {
+ alert('Error');
+ }
+ }
+ };
return (
ipfs gateways
-
+
blockchain providers
-
+
node data path
-
+
+
);
};
diff --git a/src/views/submit-page/submit-page.tsx b/src/views/submit-page/submit-page.tsx
index c2c059a6..467202e9 100644
--- a/src/views/submit-page/submit-page.tsx
+++ b/src/views/submit-page/submit-page.tsx
@@ -349,7 +349,7 @@ const Submit = () => {
diff --git a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx
index cfd6beea..8b70a39a 100644
--- a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx
+++ b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx
@@ -14,11 +14,12 @@ import { useTranslation } from 'react-i18next';
import { create } from 'zustand';
import styles from './subplebbit-settings.module.css';
import { isValidURL } from '../../../lib/utils/url-utils';
-import { OptionInput, Exclude, getDefaultChallengeDescription, getDefaultChallengeOptions, getDefaultChallengeSettings } from '../../../lib/utils/challenge-utils';
+import { isCreateSubplebbitView, isSubplebbitSettingsView } from '../../../lib/utils/view-utils';
+import useChallengesOptions from '../../../hooks/use-challenges-options';
+import useChallengeSettings from '../../../hooks/use-challenge-settings';
import LoadingEllipsis from '../../../components/loading-ellipsis';
import Markdown from '../../../components/markdown';
import Sidebar from '../../../components/sidebar';
-import { isCreateSubplebbitView, isSubplebbitSettingsView } from '../../../lib/utils/view-utils';
import _ from 'lodash';
type SubplebbitSettingsState = {
@@ -365,13 +366,36 @@ interface ChallengeSettingsProps {
showSettings: boolean;
}
+type OptionInput = {
+ option: string;
+ label: string;
+ default?: string;
+ description: string;
+ placeholder?: string;
+ required?: boolean;
+};
+
+type Exclude = {
+ postScore?: number;
+ replyScore?: number;
+ firstCommentTimestamp?: number;
+ challenges?: number[];
+ post?: boolean;
+ reply?: boolean;
+ vote?: boolean;
+ role?: string[];
+ address?: string[];
+ rateLimit?: number;
+ rateLimitChallengeSuccess?: boolean;
+};
+
const rolesToExclude = ['moderator', 'admin', 'owner'];
const actionsToExclude: Array<'post' | 'reply' | 'vote'> = ['post', 'reply', 'vote'];
const nonActionsToExclude: Array<'not post' | 'not reply' | 'not vote'> = ['not post', 'not reply', 'not vote'];
const ChallengeSettings = ({ challenge, index, isReadOnly, setSubplebbitSettingsStore, settings, showSettings }: ChallengeSettingsProps) => {
const { name, options } = challenge || {};
- const challengeSettings: OptionInput[] = getDefaultChallengeSettings(name);
+ const challengeSettings: any = useChallengeSettings(name);
const handleOptionChange = (optionName: string, newValue: string) => {
const updatedOptions = { ...options, [optionName]: newValue };
@@ -469,12 +493,12 @@ const ChallengeSettings = ({ challenge, index, isReadOnly, setSubplebbitSettings
{isReadOnly ? (
<>
type: {challenge?.type}
-
{challenge?.description}
+
{challengeSettings?.description}
) : (
-
{getDefaultChallengeDescription(name)}
+
{challengeSettings?.description}
)}
- {challengeSettings.map((setting) => (
+ {challengeSettings?.optionInputs.map((setting: OptionInput) => (
{setting?.label}
@@ -694,6 +718,7 @@ const Challenges = ({ isReadOnly, readOnlyChallenges }: { isReadOnly: boolean; r
const { settings, setSubplebbitSettingsStore } = useSubplebbitSettingsStore();
const challenges = settings?.challenges || readOnlyChallenges || [];
const [showSettings, setShowSettings] = useState
(challenges.map(() => false));
+ const challengeOptions = useChallengesOptions();
const location = useLocation();
const isInCreateSubplebbitView = isCreateSubplebbitView(location.pathname);
@@ -705,11 +730,10 @@ const Challenges = ({ isReadOnly, readOnlyChallenges }: { isReadOnly: boolean; r
};
const handleAddChallenge = () => {
- const defaultChallenge = 'captcha-canvas-v3';
- const options = getDefaultChallengeOptions(defaultChallenge);
+ const defaultOptions = challengeOptions['captcha-canvas-v3'] || {};
const newChallenge = {
- name: defaultChallenge,
- options,
+ name: 'captcha-canvas-v3',
+ defaultOptions,
};
const updatedChallenges = [...(settings?.challenges || []), newChallenge];
setSubplebbitSettingsStore({ settings: { ...settings, challenges: updatedChallenges } });
@@ -723,8 +747,9 @@ const Challenges = ({ isReadOnly, readOnlyChallenges }: { isReadOnly: boolean; r
};
const handleChallengeTypeChange = (index: number, newType: string) => {
+ const options = challengeOptions[newType] || {};
const updatedChallenges = [...challenges];
- updatedChallenges[index] = { ...updatedChallenges[index], name: newType, options: getDefaultChallengeOptions(newType) };
+ updatedChallenges[index] = { ...updatedChallenges[index], name: newType, options };
setSubplebbitSettingsStore({ settings: { ...settings, challenges: updatedChallenges } });
};
@@ -895,11 +920,28 @@ const SubplebbitSettings = () => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [subplebbitAddress, resetSubplebbitSettingsStore]);
+ const defaultChallengeSettings = useChallengeSettings('captcha-canvas-v3');
+
useEffect(() => {
- if (isInCreateSubplebbitView) {
+ if (isInCreateSubplebbitView && defaultChallengeSettings) {
+ const defaultChallenge = {
+ ...(defaultChallengeSettings && typeof defaultChallengeSettings === 'object' ? defaultChallengeSettings : {}),
+ name: 'captcha-canvas-v3',
+ options: {
+ characters: '6',
+ height: '100',
+ width: '300',
+ colors: '#32cf7e',
+ },
+ };
resetSubplebbitSettingsStore();
+ setSubplebbitSettingsStore({
+ settings: {
+ challenges: [defaultChallenge],
+ },
+ });
}
- }, [isInCreateSubplebbitView, resetSubplebbitSettingsStore]);
+ }, [isInCreateSubplebbitView, defaultChallengeSettings, resetSubplebbitSettingsStore, setSubplebbitSettingsStore]);
useEffect(() => {
window.scrollTo(0, 0);
diff --git a/src/views/subplebbit/subplebbit.tsx b/src/views/subplebbit/subplebbit.tsx
index a78d616e..55b7f99c 100644
--- a/src/views/subplebbit/subplebbit.tsx
+++ b/src/views/subplebbit/subplebbit.tsx
@@ -5,6 +5,7 @@ import { Virtuoso, VirtuosoHandle, StateSnapshot } from 'react-virtuoso';
import { useTranslation } from 'react-i18next';
import styles from '../home/home.module.css';
import LoadingEllipsis from '../../components/loading-ellipsis';
+import NewerPostsButton from '../../components/newer-posts-button';
import Post from '../../components/post';
import Sidebar from '../../components/sidebar';
import useFeedStateString from '../../hooks/use-feed-state-string';
@@ -15,17 +16,29 @@ const lastVirtuosoStates: { [key: string]: StateSnapshot } = {};
const Subplebbit = () => {
const { t } = useTranslation();
const params = useParams();
+ const subplebbitAddress = params.subplebbitAddress;
+ const subplebbitAddresses = useMemo(() => [subplebbitAddress], [subplebbitAddress]) as string[];
+
const sortType = params?.sortType || 'hot';
const timeFilterName = (params.timeFilterName as TimeFilterKey) || 'all';
const { timeFilter } = useTimeFilter(sortType, timeFilterName);
- const subplebbitAddress = params.subplebbitAddress;
- const subplebbitAddresses = useMemo(() => [subplebbitAddress], [subplebbitAddress]) as string[];
- const subplebbit = useSubplebbit({ subplebbitAddress });
- const { createdAt, description, roles, rules, shortAddress, started, state, title, updatedAt, settings } = subplebbit || {};
- const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses, sortType, filter: timeFilter });
+ const { feed, hasMore, loadMore, reset, subplebbitAddressesWithNewerPosts } = useFeed({ subplebbitAddresses, sortType, filter: timeFilter });
+
+ const { subplebbit, error } = useSubplebbit({ subplebbitAddress });
+ const { createdAt, description, roles, rules, shortAddress, started, title, updatedAt, settings } = subplebbit || {};
const loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading');
- const loadingString = {state === 'failed' ? state : }
;
+ const loadingString = (
+ <>
+ {loadingStateString === 'Failed' ? 'failed' : }
+ {error && (
+
+
+ {error.message}
+
+ )}
+
+ );
let isOnline = updatedAt && updatedAt > Date.now() / 1000 - 60 * 30;
const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt;
@@ -33,8 +46,8 @@ const Subplebbit = () => {
const { blocked } = useBlock({ address: subplebbitAddress });
useEffect(() => {
- document.title = title ? title : shortAddress;
- }, [title, shortAddress]);
+ document.title = title ? title : shortAddress || subplebbitAddress;
+ }, [title, shortAddress, subplebbitAddress]);
const Footer = () => {
let footerContent;
@@ -88,6 +101,7 @@ const Subplebbit = () => {
/>
+