+ {error && (
+
+
+
+ )}
{paginatedCids.length === 0 ?
{t('nothing_found')}
: paginatedCids.map((cid) =>
)}
diff --git a/src/views/subplebbit/subplebbit.tsx b/src/views/subplebbit/subplebbit.tsx
index 93925ef6..54fe2ca6 100644
--- a/src/views/subplebbit/subplebbit.tsx
+++ b/src/views/subplebbit/subplebbit.tsx
@@ -12,6 +12,7 @@ import useFeedResetStore from '../../stores/use-feed-reset-store';
import { usePinnedPostsStore } from '../../stores/use-pinned-posts-store';
import { useIsBroadlyNsfwSubplebbit } from '../../hooks/use-is-broadly-nsfw-subplebbit';
import useTimeFilter, { isValidTimeFilterName } from '../../hooks/use-time-filter';
+import ErrorDisplay from '../../components/error-display';
import LoadingEllipsis from '../../components/loading-ellipsis';
import Over18Warning from '../../components/over-18-warning';
import Post from '../../components/post';
@@ -27,7 +28,6 @@ interface FooterProps {
isOnline: boolean;
started: boolean;
isSubCreatedButNotYetPublished: boolean;
- error: Error | null;
hasMore: boolean;
timeFilterName: string;
reset: () => void;
@@ -43,7 +43,6 @@ const Footer = ({
isOnline,
started,
isSubCreatedButNotYetPublished,
- error,
hasMore,
timeFilterName,
reset,
@@ -85,12 +84,6 @@ const Footer = ({
const loadingString = (
<>
{loadingStateString === 'Failed' ? 'failed' : }
- {error && (
-
-
- {t('error')}: {error.message}
-
- )}
);
@@ -332,7 +325,6 @@ const Subplebbit = () => {
isOnline,
started,
isSubCreatedButNotYetPublished,
- error: error || null,
hasMore,
timeFilterName: searchQuery ? 'all' : timeFilterName || '',
reset,
@@ -361,6 +353,12 @@ const Subplebbit = () => {
const hasUnhiddenAnyNsfwCommunity = !hideAdultCommunities || !hideGoreCommunities || !hideAntiCommunities || !hideVulgarCommunities;
const isBroadlyNsfwSubplebbit = useIsBroadlyNsfwSubplebbit(subplebbitAddress || '');
+ useEffect(() => {
+ if (error) {
+ console.log(error);
+ }
+ }, [error]);
+
// page title
useEffect(() => {
document.title = title ? title : shortAddress || subplebbitAddress;
@@ -373,6 +371,11 @@ const Subplebbit = () => {
+ {error && (
+
+
+
+ )}
{
const Infobar = () => {
const account = useAccount();
- const { accountSubplebbits } = useAccountSubplebbits();
+ const { accountSubplebbits, error: accountSubplebbitsError } = useAccountSubplebbits();
+ const { setError } = useErrorStore();
+
+ useEffect(() => {
+ setError('Infobar_useAccountSubplebbits', accountSubplebbitsError);
+ }, [accountSubplebbitsError, setError]);
+
const subscriptions = account?.subscriptions || [];
const { t } = useTranslation();
const location = useLocation();
@@ -285,7 +293,12 @@ const Subplebbit = ({ subplebbit, tags, index }: SubplebbitProps) => {
const AccountSubplebbits = ({ viewRole }: { viewRole: string }) => {
const account = useAccount();
- const { accountSubplebbits } = useAccountSubplebbits();
+ const { accountSubplebbits, error: accountSubplebbitsError } = useAccountSubplebbits();
+ const { setError } = useErrorStore();
+
+ useEffect(() => {
+ setError('AccountSubplebbits_useAccountSubplebbits', accountSubplebbitsError);
+ }, [accountSubplebbitsError, setError, viewRole]);
const filteredSubplebbitsArray = useMemo(() => {
return Object.values(accountSubplebbits).filter((subplebbit: any) => {
@@ -300,7 +313,13 @@ const AccountSubplebbits = ({ viewRole }: { viewRole: string }) => {
const SubscriberSubplebbits = () => {
const account = useAccount();
- const { subplebbits } = useSubplebbits({ subplebbitAddresses: account?.subscriptions });
+ const { subplebbits, error: subplebbitsError } = useSubplebbits({ subplebbitAddresses: account?.subscriptions });
+ const { setError } = useErrorStore();
+
+ useEffect(() => {
+ setError('SubscriberSubplebbits_useSubplebbits', subplebbitsError);
+ }, [subplebbitsError, setError]);
+
const subplebbitsArray = useMemo(() => Object.values(subplebbits), [subplebbits]);
return subplebbitsArray?.map((subplebbit, index) => subplebbit && ).filter(Boolean);
};
@@ -314,7 +333,13 @@ const AllDefaultSubplebbits = () => {
const urlTag = pathname.includes('/tag/') ? pathname.split('/').pop() : undefined;
const currentTag = urlTag && validTags.includes(urlTag) ? urlTag : undefined;
- const { subplebbits } = useSubplebbits({ subplebbitAddresses });
+ const { subplebbits, error: subplebbitsError } = useSubplebbits({ subplebbitAddresses });
+ const { setError } = useErrorStore();
+
+ useEffect(() => {
+ setError('AllDefaultSubplebbits_useSubplebbits', subplebbitsError);
+ }, [subplebbitsError, setError]);
+
const subplebbitsArray = useMemo(() => Object.values(subplebbits), [subplebbits]);
return subplebbitsArray
@@ -329,11 +354,21 @@ const AllDefaultSubplebbits = () => {
const AllAccountSubplebbits = () => {
const account = useAccount();
- const { accountSubplebbits } = useAccountSubplebbits();
+ const { accountSubplebbits, error: accountSubplebbitsError } = useAccountSubplebbits();
+ const { setError } = useErrorStore();
+
+ useEffect(() => {
+ setError('AllAccountSubplebbits_useAccountSubplebbits', accountSubplebbitsError);
+ }, [accountSubplebbitsError, setError]);
+
const accountSubplebbitAddresses = Object.keys(accountSubplebbits);
const subscriptionsArray = account?.subscriptions ?? [];
const uniqueAddresses = Array.from(new Set([...accountSubplebbitAddresses, ...subscriptionsArray]));
- const { subplebbits } = useSubplebbits({ subplebbitAddresses: uniqueAddresses });
+ const { subplebbits, error: subplebbitsError } = useSubplebbits({ subplebbitAddresses: uniqueAddresses });
+
+ useEffect(() => {
+ setError('AllAccountSubplebbits_useSubplebbits', subplebbitsError);
+ }, [subplebbitsError, setError]);
const subplebbitsArray = useMemo(() => Object.values(subplebbits ?? {}), [subplebbits]);
return subplebbitsArray?.map((subplebbit, index) => subplebbit && ).filter(Boolean);
};
@@ -341,6 +376,24 @@ const AllAccountSubplebbits = () => {
const Subplebbits = () => {
const { t } = useTranslation();
const location = useLocation();
+ const { errors, clearAllErrors } = useErrorStore();
+
+ // Clear errors on component unmount or location change
+ useEffect(() => {
+ return () => {
+ clearAllErrors();
+ };
+ }, [location, clearAllErrors]);
+
+ // Console log errors
+ useEffect(() => {
+ Object.entries(errors).forEach(([source, errorObj]) => {
+ if (errorObj) {
+ console.error(`Error from ${source}:`, errorObj.message, errorObj.stack);
+ }
+ });
+ }, [errors]);
+
const isInSubplebbitsSubscriberView = isSubplebbitsSubscriberView(location.pathname);
const isInSubplebbitsModeratorView = isSubplebbitsModeratorView(location.pathname);
const isInSubplebbitsAdminView = isSubplebbitsAdminView(location.pathname);
@@ -385,6 +438,32 @@ const Subplebbits = () => {
document.title = documentTitle;
}, [documentTitle]);
+ const renderErrors = () => {
+ const errorsToDisplay: JSX.Element[] = [];
+ Object.entries(errors).forEach(([source, errorObj]) => {
+ if (!errorObj) return;
+
+ if (
+ source === 'Infobar_useAccountSubplebbits' &&
+ (isInSubplebbitsView || isInSubplebbitsSubscriberView || isInSubplebbitsModeratorView || isInSubplebbitsAdminView || isInSubplebbitsOwnerView)
+ ) {
+ errorsToDisplay.push();
+ } else if (source === 'AccountSubplebbits_useAccountSubplebbits' && (isInSubplebbitsModeratorView || isInSubplebbitsAdminView || isInSubplebbitsOwnerView)) {
+ errorsToDisplay.push();
+ } else if (source === 'SubscriberSubplebbits_useSubplebbits' && isInSubplebbitsSubscriberView) {
+ errorsToDisplay.push();
+ } else if (source === 'AllDefaultSubplebbits_useSubplebbits' && isInSubplebbitsVoteView) {
+ errorsToDisplay.push();
+ } else if (source === 'AllAccountSubplebbits_useAccountSubplebbits' && isInSubplebbitsView) {
+ errorsToDisplay.push();
+ } else if (source === 'AllAccountSubplebbits_useSubplebbits' && isInSubplebbitsView) {
+ // Avoid duplicate key if both errors from AllAccountSubplebbits are present
+ errorsToDisplay.push();
+ }
+ });
+ return errorsToDisplay;
+ };
+
return (
@@ -396,6 +475,7 @@ const Subplebbits = () => {
)}
+
{renderErrors()}
{isInSubplebbitsVoteView &&
}
{(isInSubplebbitsModeratorView || isInSubplebbitsAdminView || isInSubplebbitsOwnerView) &&
}
{isInSubplebbitsSubscriberView &&
}