- {!isMobile && !isInProfileView && !isInPostPageView &&
{pinned ? undefined : rank}
}
+ {!isMobile && !isInProfileView && !isInAuthorView && !isInPostPageView && {pinned ? undefined : rank}
}
diff --git a/src/components/post/thumbnail/thumbnail.tsx b/src/components/post/thumbnail/thumbnail.tsx
index 1d51f87a..50578c09 100644
--- a/src/components/post/thumbnail/thumbnail.tsx
+++ b/src/components/post/thumbnail/thumbnail.tsx
@@ -65,15 +65,18 @@ const Thumbnail = ({
hasLinkDimensions = true;
}
- const style = hasLinkDimensions ? ({ '--width': displayWidth, '--height': displayHeight } as React.CSSProperties) : {};
-
const handleNotFound = () => {
setIsNotFound(true);
};
let mediaComponent = null;
let noMediaLinkIcon = '';
- const gifFrameUrl = useFetchGifFirstFrame(commentMediaInfo?.type === 'gif' ? commentMediaInfo.url : undefined);
+ const { frameUrl: gifFrameUrl, isLoading: gifFrameLoading } = useFetchGifFirstFrame(commentMediaInfo?.type === 'gif' ? commentMediaInfo.url : undefined);
+
+ const isChromium = (() => {
+ const ua = navigator.userAgent;
+ return (ua.includes('Chrome') || ua.includes('Chromium') || ua.includes('Edge')) && !ua.includes('Firefox');
+ })();
const [videoDuration, setVideoDuration] = useState('');
@@ -104,7 +107,24 @@ const Thumbnail = ({
} else if (commentMediaInfo?.type === 'iframe') {
mediaComponent = iframeThumbnail ? 
: ;
} else if (commentMediaInfo?.type === 'gif') {
- mediaComponent = 
;
+ if (gifFrameUrl) {
+ mediaComponent = 
;
+ } else if (gifFrameLoading) {
+ displayWidth = '50px';
+ displayHeight = '50px';
+ hasLinkDimensions = false;
+ mediaComponent = ;
+ } else {
+ // Chrome has strong CORS restrictions that prevent frame extraction, so we show a placeholder
+ if (isChromium) {
+ displayWidth = '50px';
+ displayHeight = '50px';
+ hasLinkDimensions = true;
+ mediaComponent = ;
+ } else {
+ mediaComponent = 
;
+ }
+ }
}
if (isText) {
@@ -137,6 +157,8 @@ const Thumbnail = ({
noMediaLinkIcon = 'notfound';
}
+ const style = hasLinkDimensions ? ({ '--width': displayWidth, '--height': displayHeight } as React.CSSProperties) : {};
+
return (
diff --git a/src/components/sidebar/sidebar.tsx b/src/components/sidebar/sidebar.tsx
index 2011c7c8..541db4bd 100644
--- a/src/components/sidebar/sidebar.tsx
+++ b/src/components/sidebar/sidebar.tsx
@@ -2,7 +2,7 @@ import { useState, useEffect } from 'react';
import { Link, useLocation, useNavigate, useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import Plebbit from '@plebbit/plebbit-js';
-import { Comment, useAccount, useBlock, Role, Subplebbit, useSubplebbitStats, useAccountComment } from '@plebbit/plebbit-react-hooks';
+import { Comment, useAccount, useBlock, Role, Subplebbit, useSubplebbitStats, useAccountComment, usePlebbitRpcSettings } from '@plebbit/plebbit-react-hooks';
import styles from './sidebar.module.css';
import useIsSubplebbitOffline from '../../hooks/use-is-subplebbit-offline';
import useIsMobile from '../../hooks/use-is-mobile';
@@ -250,7 +250,7 @@ const Sidebar = ({ comment, isSubCreatedButNotYetPublished, settings, subplebbit
}
}, []); // Empty dependency array ensures this runs only once on mount
- const isConnectedToRpc = !!account?.plebbitOptions.plebbitRpcClientsOptions;
+ const isConnectedToRpc = usePlebbitRpcSettings()?.state === 'connected';
const navigate = useNavigate();
const handleCreateCommunity = () => {
// creating a community only works if the user is running a full node
diff --git a/src/components/topbar/topbar.tsx b/src/components/topbar/topbar.tsx
index a7d710f0..ec45f22f 100644
--- a/src/components/topbar/topbar.tsx
+++ b/src/components/topbar/topbar.tsx
@@ -5,10 +5,11 @@ import { useAccount, useAccountSubplebbits } from '@plebbit/plebbit-react-hooks'
import Plebbit from '@plebbit/plebbit-js';
import { isAllView, isDomainView, isHomeView, isModView, isSubplebbitView } from '../../lib/utils/view-utils';
import useContentOptionsStore from '../../stores/use-content-options-store';
-import { useDefaultSubplebbitAddresses } from '../../hooks/use-default-subplebbits';
+import { useDefaultSubplebbitAddresses, useDefaultSubplebbits } from '../../hooks/use-default-subplebbits';
import useTimeFilter, { setSessionTimeFilterPreference } from '../../hooks/use-time-filter';
import { sortTypes } from '../../constants/sort-types';
import { sortLabels } from '../../constants/sort-labels';
+import { handleNSFWSubscriptionPrompt } from '../../lib/utils/nsfw-subscription-utils';
import styles from './topbar.module.css';
const CommunitiesDropdown = () => {
@@ -54,6 +55,8 @@ const CommunitiesDropdown = () => {
const TagFilterDropdown = () => {
const { t } = useTranslation();
+ const account = useAccount();
+ const defaultSubplebbits = useDefaultSubplebbits();
const {
hideAdultCommunities,
hideGoreCommunities,
@@ -80,18 +83,38 @@ const TagFilterDropdown = () => {
const allHidden = hideAdultCommunities && hideGoreCommunities && hideAntiCommunities && hideVulgarCommunities;
- const handleToggleAll = (event: React.MouseEvent) => {
+ const handleToggleAll = async (event: React.MouseEvent) => {
event.stopPropagation();
const newState = !allHidden;
+
+ if (!newState) {
+ await handleNSFWSubscriptionPrompt({
+ account,
+ defaultSubplebbits,
+ tagsToShow: ['adult', 'gore', 'anti', 'vulgar'],
+ isShowingAll: true,
+ });
+ }
+
setHideAdultCommunities(newState);
setHideGoreCommunities(newState);
setHideAntiCommunities(newState);
setHideVulgarCommunities(newState);
};
- const handleToggleTag = (event: React.MouseEvent, setter: (hide: boolean) => void, currentState: boolean) => {
+ const handleToggleTag = async (event: React.MouseEvent, setter: (hide: boolean) => void, currentState: boolean, tagName: string) => {
event.stopPropagation();
- setter(!currentState);
+ const newState = !currentState;
+
+ if (!newState) {
+ await handleNSFWSubscriptionPrompt({
+ account,
+ defaultSubplebbits,
+ tagsToShow: [tagName],
+ });
+ }
+
+ setter(newState);
};
useEffect(() => {
@@ -112,12 +135,12 @@ const TagFilterDropdown = () => {
{t('tags')}
- {allHidden ? 'show all nsfw' : 'hide all nsfw'}
+ {allHidden ? t('show_all_nsfw') : t('hide_all_nsfw')}
{tags.map((tag, index) => (
- handleToggleTag(e, tag.setter, tag.isHidden)} style={{ cursor: 'pointer' }}>
+ ([]);
+ const [subplebbits, setSubplebbits] = useState(cacheSubplebbits || []);
useEffect(() => {
+ // If we already have cached data, use it immediately
if (cacheSubplebbits) {
+ setSubplebbits(cacheSubplebbits);
return;
}
- (async () => {
- try {
- const multisub = await fetch(
- 'https://raw.githubusercontent.com/plebbit/temporary-default-subplebbits/master/multisub.json',
- // { cache: 'no-cache' }
- ).then((res) => res.json());
- const filteredSubplebbits = multisub.subplebbits.filter((sub: MultisubSubplebbit) => !sub.lowUptime);
-
- cacheSubplebbits = filteredSubplebbits;
-
- // Cache auto-subscribe addresses when we fetch subplebbits
- cacheAutoSubscribeAddresses = filteredSubplebbits
- .filter((sub: MultisubSubplebbit) => sub.seeditAutoSubscribe && sub.address)
- .map((sub: MultisubSubplebbit) => sub.address);
-
- setSubplebbits(filteredSubplebbits);
- } catch (e) {
- console.warn(e);
+ // Subscribe to cache updates
+ const handleCacheUpdate = () => {
+ if (cacheSubplebbits) {
+ setSubplebbits(cacheSubplebbits);
}
- })();
+ };
+
+ subscribers.add(handleCacheUpdate);
+
+ // Trigger fetch if no cache and not pending
+ if (!pending) {
+ fetchMultisubData();
+ }
+
+ // Cleanup subscription
+ return () => {
+ subscribers.delete(handleCacheUpdate);
+ };
}, []);
- return cacheSubplebbits || subplebbits;
+ return subplebbits;
};
export const getAutoSubscribeAddresses = () => cacheAutoSubscribeAddresses || [];
@@ -76,29 +123,36 @@ export const useDefaultSubplebbitAddresses = () => {
};
export const useMultisubMetadata = () => {
- const [metadata, setMetadata] = useState(null);
+ const [metadata, setMetadata] = useState(cacheMetadata || null);
useEffect(() => {
+ // If we already have cached data, use it immediately
if (cacheMetadata) {
+ setMetadata(cacheMetadata);
return;
}
- (async () => {
- try {
- const multisub = await fetch(
- 'https://raw.githubusercontent.com/plebbit/temporary-default-subplebbits/master/multisub.json',
- // { cache: 'no-cache' }
- ).then((res) => res.json());
- const { title, description, createdAt, updatedAt } = multisub;
- const metadata: MultisubMetadata = { title, description, createdAt, updatedAt };
- cacheMetadata = metadata;
- setMetadata(metadata);
- } catch (e) {
- console.warn(e);
+
+ // Subscribe to cache updates
+ const handleCacheUpdate = () => {
+ if (cacheMetadata) {
+ setMetadata(cacheMetadata);
}
- })();
+ };
+
+ subscribers.add(handleCacheUpdate);
+
+ // Trigger fetch if no cache and not pending
+ if (!pending) {
+ fetchMultisubData();
+ }
+
+ // Cleanup subscription
+ return () => {
+ subscribers.delete(handleCacheUpdate);
+ };
}, []);
- return cacheMetadata || metadata;
+ return metadata;
};
const getUniqueTags = (multisub: any) => {
diff --git a/src/hooks/use-fetch-gif-first-frame.ts b/src/hooks/use-fetch-gif-first-frame.ts
index 08cb91c8..1c1a5a74 100644
--- a/src/hooks/use-fetch-gif-first-frame.ts
+++ b/src/hooks/use-fetch-gif-first-frame.ts
@@ -1,8 +1,14 @@
import { useEffect, useState } from 'react';
+import { decompressFrames, parseGIF } from 'gifuct-js';
import localForageLru from '@plebbit/plebbit-react-hooks/dist/lib/localforage-lru/index.js';
const gifFrameDb = localForageLru.createInstance({ name: 'seeditGifFrames', size: 500 });
+const isChromium = () => {
+ const ua = navigator.userAgent;
+ return (ua.includes('Chrome') || ua.includes('Chromium') || ua.includes('Edge')) && !ua.includes('Firefox');
+};
+
const getCachedGifFrame = async (url: string): Promise => {
return await gifFrameDb.getItem(url);
};
@@ -16,17 +22,76 @@ export const fetchImage = (url: string): Promise => {
const request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'arraybuffer';
+
+ // Add error logging to understand what's happening
request.onloadend = () => {
+ console.log('XMLHttpRequest completed:', {
+ url,
+ status: request.status,
+ statusText: request.statusText,
+ responseType: request.responseType,
+ response: request.response,
+ readyState: request.readyState,
+ });
+
if (request.response !== undefined && (request.status === 200 || request.status === 304)) {
resolve(request.response);
} else {
- reject(new Error(`XMLHttpRequest, ${request.statusText}`));
+ reject(new Error(`XMLHttpRequest failed: ${request.status} ${request.statusText} for URL: ${url}`));
}
};
- request.send();
+
+ request.onerror = () => {
+ console.error('XMLHttpRequest error:', {
+ url,
+ status: request.status,
+ statusText: request.statusText,
+ readyState: request.readyState,
+ });
+ reject(new Error(`XMLHttpRequest network error for URL: ${url}`));
+ };
+
+ request.ontimeout = () => {
+ console.error('XMLHttpRequest timeout:', { url });
+ reject(new Error(`XMLHttpRequest timeout for URL: ${url}`));
+ };
+
+ // Set timeout to prevent hanging
+ request.timeout = 30000; // 30 seconds
+
+ // Try to handle CORS
+ try {
+ request.send();
+ } catch (error) {
+ console.error('XMLHttpRequest send error:', error);
+ reject(new Error(`XMLHttpRequest send failed: ${error}`));
+ }
});
};
+// Fallback fetch method for when XMLHttpRequest fails
+export const fetchImageWithFetch = async (url: string): Promise => {
+ try {
+ console.log('Trying fetch method for:', url);
+ const response = await fetch(url, {
+ method: 'GET',
+ mode: 'cors',
+ cache: 'default',
+ });
+
+ if (!response.ok) {
+ throw new Error(`Fetch failed: ${response.status} ${response.statusText}`);
+ }
+
+ const arrayBuffer = await response.arrayBuffer();
+ console.log('Fetch successful for:', url);
+ return arrayBuffer;
+ } catch (error) {
+ console.error('Fetch error:', error);
+ throw error;
+ }
+};
+
export const readImage = (file: File): Promise => {
return new Promise((resolve) => {
const reader = new FileReader();
@@ -37,62 +102,252 @@ export const readImage = (file: File): Promise => {
});
};
-const parseGif = async (buf: ArrayBuffer): Promise => {
- const image = new Image();
- await new Promise((resolve) => {
- image.src = URL.createObjectURL(new Blob([buf]));
- image.onload = resolve;
- });
- const canvas = document.createElement('canvas');
- canvas.width = image.width;
- canvas.height = image.height;
- const ctx = canvas.getContext('2d');
- if (ctx === null) throw new Error('Canvas Context null');
- ctx.drawImage(image, 0, 0, image.width, image.height);
- return await new Promise((resolve, reject) =>
- canvas.toBlob((blob) => {
- if (blob === null) {
- reject('Canvas Blob null');
- } else {
- resolve(blob);
+const extractFirstFrame = async (buffer: ArrayBuffer): Promise => {
+ try {
+ // Parse the GIF using gifuct-js
+ const gif = parseGIF(buffer);
+ const frames = decompressFrames(gif, true);
+
+ if (frames.length === 0) {
+ throw new Error('No frames found in GIF');
+ }
+
+ // Get the first frame
+ const firstFrame = frames[0];
+ const { width, height } = firstFrame.dims;
+
+ // Create canvas and draw the frame
+ const canvas = document.createElement('canvas');
+ canvas.width = width;
+ canvas.height = height;
+
+ const ctx = canvas.getContext('2d');
+ if (!ctx) {
+ throw new Error('Cannot get canvas context');
+ }
+
+ // Create ImageData from the frame data
+ const imageData = new ImageData(new Uint8ClampedArray(firstFrame.patch), width, height);
+
+ // Clear canvas and put the image data
+ ctx.clearRect(0, 0, width, height);
+ ctx.putImageData(imageData, 0, 0);
+
+ // Convert to blob
+ return new Promise((resolve, reject) => {
+ canvas.toBlob(
+ (blob) => {
+ if (blob) {
+ resolve(blob);
+ } else {
+ reject(new Error('Failed to create blob from canvas'));
+ }
+ },
+ 'image/png',
+ 1.0,
+ );
+ });
+ } catch (error) {
+ throw new Error(`Failed to extract first frame: ${error}`);
+ }
+};
+
+// CORS-bypass method using image element
+export const fetchImageViaCORSProxy = async (url: string): Promise => {
+ return new Promise((resolve, reject) => {
+ const img = new Image();
+ img.crossOrigin = 'anonymous';
+
+ img.onload = () => {
+ try {
+ // Create a canvas to get the image data
+ const canvas = document.createElement('canvas');
+ canvas.width = img.naturalWidth;
+ canvas.height = img.naturalHeight;
+
+ const ctx = canvas.getContext('2d');
+ if (!ctx) {
+ reject(new Error('Cannot get canvas context'));
+ return;
+ }
+
+ ctx.drawImage(img, 0, 0);
+
+ // Convert canvas to blob and then to ArrayBuffer
+ canvas.toBlob(
+ async (blob) => {
+ if (blob) {
+ try {
+ const arrayBuffer = await blob.arrayBuffer();
+ resolve(arrayBuffer);
+ } catch (error) {
+ reject(new Error(`Failed to convert blob to ArrayBuffer: ${error}`));
+ }
+ } else {
+ reject(new Error('Failed to create blob from canvas'));
+ }
+ },
+ 'image/gif',
+ 1.0,
+ );
+ } catch (error) {
+ reject(new Error(`Canvas operation failed: ${error}`));
}
- }),
- );
+ };
+
+ img.onerror = () => {
+ reject(new Error(`Image load failed for URL: ${url}`));
+ };
+
+ // Try different approaches for CORS
+ try {
+ img.src = url;
+ } catch (error) {
+ reject(new Error(`Failed to set image src: ${error}`));
+ }
+ });
+};
+
+// Simple proxy approach - just use the image directly without trying to extract frames
+export const createStaticImageFromGif = async (url: string): Promise => {
+ return new Promise((resolve, reject) => {
+ const img = new Image();
+
+ img.onload = () => {
+ try {
+ const canvas = document.createElement('canvas');
+ canvas.width = img.naturalWidth;
+ canvas.height = img.naturalHeight;
+
+ const ctx = canvas.getContext('2d');
+ if (!ctx) {
+ reject(new Error('Cannot get canvas context'));
+ return;
+ }
+
+ // Clear and draw the image (this should get the first frame in most cases)
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.drawImage(img, 0, 0);
+
+ canvas.toBlob(
+ (blob) => {
+ if (blob) {
+ const objectUrl = URL.createObjectURL(blob);
+ resolve(objectUrl);
+ } else {
+ reject(new Error('Failed to create blob from canvas'));
+ }
+ },
+ 'image/png',
+ 1.0,
+ );
+ } catch (error) {
+ reject(new Error(`Canvas operation failed: ${error}`));
+ }
+ };
+
+ img.onerror = () => {
+ reject(new Error(`Image load failed for URL: ${url}`));
+ };
+
+ // Don't set crossOrigin for this approach to avoid CORS issues
+ img.src = url;
+ });
};
const useFetchGifFirstFrame = (url: string | undefined) => {
const [frameUrl, setFrameUrl] = useState(null);
+ const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
if (!url) {
setFrameUrl(null);
+ setIsLoading(false);
+ return;
+ }
+
+ // Skip frame extraction on Chromium browsers due to strict CORS policies
+ if (isChromium()) {
+ console.log('Skipping GIF frame extraction on Chromium browser due to CORS restrictions');
+ setFrameUrl(null);
+ setIsLoading(false);
return;
}
let isActive = true;
+ setIsLoading(true);
+ setFrameUrl(null);
const fetchFrame = async () => {
try {
+ // Check cache first
const cachedFrame = await getCachedGifFrame(url);
- if (cachedFrame) {
+ if (cachedFrame && isActive) {
try {
const response = await fetch(cachedFrame);
if (response.ok) {
- if (isActive) setFrameUrl(cachedFrame);
+ setFrameUrl(cachedFrame);
+ setIsLoading(false);
return;
}
- } catch {}
+ } catch {
+ // Cache entry is invalid, continue with fresh extraction
+ }
}
- const blob = typeof url === 'string' ? await parseGif(await fetchImage(url)) : await parseGif(await readImage(url as File));
+ // For Chrome CORS compatibility, try the simple image approach first
+ if (typeof url === 'string') {
+ try {
+ console.log('Trying simple image approach first...');
+ const objectUrl = await createStaticImageFromGif(url);
+
+ if (isActive) {
+ setFrameUrl(objectUrl);
+ setIsLoading(false);
+ await setCachedGifFrame(url, objectUrl);
+ }
+ return; // Success with simple approach
+ } catch (simpleError) {
+ console.log('Simple image approach failed, trying advanced extraction:', simpleError);
+ }
+ }
+
+ // Fallback to advanced frame extraction (gifuct-js)
+ const buffer = typeof url === 'string' ? await fetchImage(url) : await readImage(url as File);
+ const blob = await extractFirstFrame(buffer);
const objectUrl = URL.createObjectURL(blob);
+
if (isActive) {
setFrameUrl(objectUrl);
+ setIsLoading(false);
await setCachedGifFrame(url, objectUrl);
}
} catch (error) {
console.error('Failed to load GIF frame:', error);
- if (isActive) setFrameUrl(null);
+
+ // Final fallback attempts (keep the existing fallback logic)
+ if (typeof url === 'string' && error instanceof Error && error.message.includes('XMLHttpRequest')) {
+ try {
+ console.log('Trying fallback fetch method...');
+ const buffer = await fetchImageWithFetch(url);
+ const blob = await extractFirstFrame(buffer);
+ const objectUrl = URL.createObjectURL(blob);
+
+ if (isActive) {
+ setFrameUrl(objectUrl);
+ setIsLoading(false);
+ await setCachedGifFrame(url, objectUrl);
+ }
+ return; // Success with fallback
+ } catch (fallbackError) {
+ console.error('All methods failed:', fallbackError);
+ }
+ }
+
+ if (isActive) {
+ setFrameUrl(null);
+ setIsLoading(false);
+ }
}
};
@@ -103,7 +358,7 @@ const useFetchGifFirstFrame = (url: string | undefined) => {
};
}, [url]);
- return frameUrl;
+ return { frameUrl, isLoading };
};
export default useFetchGifFirstFrame;
diff --git a/src/lib/utils/clipboard-utils.ts b/src/lib/utils/clipboard-utils.ts
new file mode 100644
index 00000000..94a46dda
--- /dev/null
+++ b/src/lib/utils/clipboard-utils.ts
@@ -0,0 +1,30 @@
+/**
+ * Universal clipboard utility that works in both Electron and web environments
+ */
+export const copyToClipboard = async (text: string): Promise => {
+ // Check if we're in Electron and use its clipboard API
+ if (typeof window !== 'undefined' && (window as any).electronApi?.copyToClipboard) {
+ try {
+ const result = await (window as any).electronApi.copyToClipboard(text);
+ if (!result.success) {
+ throw new Error(result.error || 'Failed to copy to clipboard');
+ }
+ return;
+ } catch (error) {
+ console.error('Electron clipboard failed:', error);
+ // Fall back to web clipboard API
+ }
+ }
+
+ // Fallback to web clipboard API
+ if (navigator.clipboard) {
+ try {
+ await navigator.clipboard.writeText(text);
+ } catch (error) {
+ console.error('Web clipboard failed:', error);
+ throw new Error('Failed to copy to clipboard. Your browser may not support this feature.');
+ }
+ } else {
+ throw new Error('Your browser does not support clipboard API');
+ }
+};
diff --git a/src/lib/utils/nsfw-subscription-utils.ts b/src/lib/utils/nsfw-subscription-utils.ts
new file mode 100644
index 00000000..9d1ab533
--- /dev/null
+++ b/src/lib/utils/nsfw-subscription-utils.ts
@@ -0,0 +1,77 @@
+import { setAccount } from '@plebbit/plebbit-react-hooks';
+
+const NSFW_SUBSCRIPTION_PROMPT_KEY_PREFIX = 'seedit-nsfw-subscription-prompt-shown-';
+
+export interface NSFWSubscriptionOptions {
+ account: any;
+ defaultSubplebbits: any[];
+ tagsToShow: string[];
+ isShowingAll?: boolean;
+}
+
+const getPromptKey = (tagsToShow: string[], isShowingAll: boolean): string => {
+ if (isShowingAll) {
+ return `${NSFW_SUBSCRIPTION_PROMPT_KEY_PREFIX}all`;
+ }
+ // Sort tags to ensure consistent key regardless of order
+ const sortedTags = [...tagsToShow].sort();
+ return `${NSFW_SUBSCRIPTION_PROMPT_KEY_PREFIX}${sortedTags.join('-')}`;
+};
+
+export const shouldShowNSFWSubscriptionPrompt = (tagsToShow: string[], isShowingAll: boolean = false): boolean => {
+ const key = getPromptKey(tagsToShow, isShowingAll);
+ return !localStorage.getItem(key);
+};
+
+export const markNSFWSubscriptionPromptShown = (tagsToShow: string[], isShowingAll: boolean = false): void => {
+ const key = getPromptKey(tagsToShow, isShowingAll);
+ localStorage.setItem(key, 'true');
+};
+
+export const getCommunitiesWithTags = (defaultSubplebbits: any[], tags: string[]): string[] => {
+ return defaultSubplebbits
+ .filter((sub) => {
+ const subTags = sub.tags || [];
+ return tags.some((tag) => subTags.includes(tag));
+ })
+ .map((sub) => sub.address);
+};
+
+export const handleNSFWSubscriptionPrompt = async ({ account, defaultSubplebbits, tagsToShow, isShowingAll = false }: NSFWSubscriptionOptions): Promise => {
+ if (!shouldShowNSFWSubscriptionPrompt(tagsToShow, isShowingAll) || !account || !defaultSubplebbits.length) {
+ return;
+ }
+
+ const communitiesToSubscribe = getCommunitiesWithTags(defaultSubplebbits, tagsToShow);
+
+ if (communitiesToSubscribe.length === 0) {
+ return;
+ }
+
+ const tagText = isShowingAll
+ ? 'all NSFW communities'
+ : tagsToShow.length === 1
+ ? `communities tagged as "${tagsToShow[0]}"`
+ : `communities tagged as: ${tagsToShow.join(', ')}`;
+
+ const confirmMessage = `You're now showing ${tagText}. Would you like to subscribe to these communities? This will add them to your subscriptions.`;
+
+ const shouldSubscribe = window.confirm(confirmMessage);
+
+ // Mark as shown regardless of user choice
+ markNSFWSubscriptionPromptShown(tagsToShow, isShowingAll);
+
+ if (shouldSubscribe) {
+ try {
+ const currentSubscriptions = account.subscriptions || [];
+ const newSubscriptions = [...new Set([...currentSubscriptions, ...communitiesToSubscribe])];
+
+ await setAccount({
+ ...account,
+ subscriptions: newSubscriptions,
+ });
+ } catch (error) {
+ console.error('Error subscribing to NSFW communities:', error);
+ }
+ }
+};
diff --git a/src/lib/utils/url-utils.ts b/src/lib/utils/url-utils.ts
index aacfae92..85cc1ffb 100644
--- a/src/lib/utils/url-utils.ts
+++ b/src/lib/utils/url-utils.ts
@@ -1,3 +1,5 @@
+import { copyToClipboard } from './clipboard-utils';
+
export const getHostname = (url: string) => {
try {
return new URL(url).hostname.replace(/^www\./, '');
@@ -15,12 +17,7 @@ export const isValidURL = (url: string) => {
}
};
-export const copyShareLinkToClipboard = (subplebbitAddress: string, cid: string) => {
+export const copyShareLinkToClipboard = async (subplebbitAddress: string, cid: string) => {
const shareLink = `https://pleb.bz/p/${subplebbitAddress}/c/${cid}`;
-
- if (navigator.clipboard) {
- navigator.clipboard.writeText(shareLink);
- } else {
- alert('Your browser does not support clipboard API');
- }
+ await copyToClipboard(shareLink);
};
diff --git a/src/views/author/author.tsx b/src/views/author/author.tsx
index 767fd884..8c660742 100644
--- a/src/views/author/author.tsx
+++ b/src/views/author/author.tsx
@@ -89,10 +89,12 @@ const Author = () => {
// only show backend errors if the user gets no data
const [shouldShowErrorToUser, setShouldShowErrorToUser] = useState(false);
useEffect(() => {
- if (error?.message && virtuosoData?.length === 0 && hasMore) {
+ if (error?.message && virtuosoData?.length === 0) {
setShouldShowErrorToUser(true);
+ } else if (virtuosoData?.length > 0) {
+ setShouldShowErrorToUser(false);
}
- }, [error, virtuosoData, hasMore]);
+ }, [error, virtuosoData]);
return (
{
const { t } = useTranslation();
@@ -25,13 +28,13 @@ const MediaOptions = () => {
-
-
@@ -134,6 +137,8 @@ const MediaOptions = () => { const CommunitiesOptions = () => { const { t } = useTranslation(); + const account = useAccount(); + const defaultSubplebbits = useDefaultSubplebbits(); const { hideAdultCommunities, hideGoreCommunities, @@ -163,8 +168,19 @@ const CommunitiesOptions = () => { el.indeterminate = someHidden && !allHidden; } }} - onChange={(e) => { + onChange={async (e) => { const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['adult', 'gore', 'anti', 'vulgar'], + isShowingAll: true, + }); + } + setHideAdultCommunities(newValue); setHideGoreCommunities(newValue); setHideAntiCommunities(newValue); @@ -178,8 +194,19 @@ const CommunitiesOptions = () => { { - setHideAdultCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['adult'], + }); + } + + setHideAdultCommunities(newValue); }} /> {t('tagged_as_adult')} @@ -190,8 +217,19 @@ const CommunitiesOptions = () => { { - setHideGoreCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['gore'], + }); + } + + setHideGoreCommunities(newValue); }} /> {t('tagged_as_gore')} @@ -202,8 +240,19 @@ const CommunitiesOptions = () => { { - setHideAntiCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['anti'], + }); + } + + setHideAntiCommunities(newValue); }} /> {t('tagged_as_anti')} @@ -214,8 +263,19 @@ const CommunitiesOptions = () => { { - setHideVulgarCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['vulgar'], + }); + } + + setHideVulgarCommunities(newValue); }} /> {t('tagged_as_vulgar')} diff --git a/src/views/settings/notifications-settings/notifications-settings.tsx b/src/views/settings/notifications-settings/notifications-settings.tsx index f6f28a39..ba8abc35 100644 --- a/src/views/settings/notifications-settings/notifications-settings.tsx +++ b/src/views/settings/notifications-settings/notifications-settings.tsx @@ -1,9 +1,11 @@ import { useCallback, useEffect, useState } from 'react'; +import { useTranslation } from 'react-i18next'; import { requestNotificationPermission, showLocalNotification } from '../../../lib/push'; -import styles from './notifications-settings.module.css'; import useContentOptionsStore from '../../../stores/use-content-options-store'; +import styles from './notifications-settings.module.css'; const NotificationsSettings = () => { + const { t } = useTranslation(); const { enableLocalNotifications, setEnableLocalNotifications } = useContentOptionsStore(); const [permissionStatus, setPermissionStatus] = useState(null);
const [platform, setPlatform] = useState(null);
@@ -150,7 +152,7 @@ const NotificationsSettings = () => {
onChange={handleCheckboxChange}
disabled={isLoading || permissionStatus === 'requesting...' || permissionStatus === 'not-supported'}
/>
-
+
{/* Not supported message */}
{permissionStatus === 'not-supported' && (
diff --git a/src/views/settings/plebbit-options/plebbit-options.tsx b/src/views/settings/plebbit-options/plebbit-options.tsx
index ebfc2aa8..6b7737a6 100644
--- a/src/views/settings/plebbit-options/plebbit-options.tsx
+++ b/src/views/settings/plebbit-options/plebbit-options.tsx
@@ -21,8 +21,7 @@ const IPFSGatewaysSettings = ({ ipfsGatewayUrlsRef, mediaIpfsGatewayUrlRef }: Se
const account = useAccount();
const { plebbitOptions, mediaIpfsGatewayUrl } = account || {};
const { ipfsGatewayUrls } = plebbitOptions || {};
- const plebbitRpc = usePlebbitRpcSettings();
- const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
+ const isConnectedToRpc = usePlebbitRpcSettings()?.state === 'connected';
const ipfsGatewayUrlsDefaultValue = ipfsGatewayUrls?.join('\n');
return (
@@ -51,7 +50,7 @@ const PubsubProvidersSettings = ({ pubsubProvidersRef }: SettingsProps) => {
const { plebbitOptions } = account || {};
const { pubsubHttpClientsOptions } = plebbitOptions || {};
const plebbitRpc = usePlebbitRpcSettings();
- const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
+ const isConnectedToRpc = plebbitRpc?.state === 'connected';
const pubsubProvidersDefaultValue = pubsubHttpClientsOptions?.join('\n');
return (
@@ -167,7 +166,7 @@ const PlebbitRPCSettings = ({ plebbitRpcRef }: SettingsProps) => {
const PlebbitDataPathSettings = ({ plebbitDataPathRef }: SettingsProps) => {
const plebbitRpc = usePlebbitRpcSettings();
const { plebbitRpcSettings } = plebbitRpc || {};
- const isConnectedToRpc = plebbitRpc?.state === 'succeeded';
+ const isConnectedToRpc = plebbitRpc?.state === 'connected';
const path = plebbitRpcSettings?.plebbitOptions?.dataPath || '';
return (
diff --git a/src/views/subplebbit-settings/subplebbit-settings.tsx b/src/views/subplebbit-settings/subplebbit-settings.tsx
index 9c22137f..4d2df8fe 100644
--- a/src/views/subplebbit-settings/subplebbit-settings.tsx
+++ b/src/views/subplebbit-settings/subplebbit-settings.tsx
@@ -368,7 +368,11 @@ const SubplebbitSettings = () => {
const params = useParams();
const isInCreateSubplebbitView = isCreateSubplebbitView(location.pathname);
const isInSubplebbitSettingsView = isSubplebbitSettingsView(location.pathname, params);
- const isConnectedToRpc = !!account?.plebbitOptions.plebbitRpcClientsOptions;
+ const isConnectedToRpc = usePlebbitRpcSettings()?.state === 'connected';
+
+ if (isInCreateSubplebbitView && !isConnectedToRpc) {
+ navigate('/', { replace: true });
+ }
const isReadOnly = (!settings && isInSubplebbitSettingsView) || (!isConnectedToRpc && isInCreateSubplebbitView);
diff --git a/src/views/subplebbit/subplebbit.tsx b/src/views/subplebbit/subplebbit.tsx
index ada59f5d..bb832797 100644
--- a/src/views/subplebbit/subplebbit.tsx
+++ b/src/views/subplebbit/subplebbit.tsx
@@ -369,10 +369,12 @@ const Subplebbit = () => {
// probably not necessary to show the error to the user if the feed loaded successfully
const [shouldShowErrorToUser, setShouldShowErrorToUser] = useState(false);
useEffect(() => {
- if (error?.message && feed.length === 0 && hasMore) {
+ if (error?.message && feed.length === 0) {
setShouldShowErrorToUser(true);
+ } else if (feed.length > 0) {
+ setShouldShowErrorToUser(false);
}
- }, [error, feed, hasMore]);
+ }, [error, feed]);
return isBroadlyNsfwSubplebbit && !hasUnhiddenAnyNsfwCommunity ? (
{currentTag && (
handleToggleTag(e, tag.setter, tag.isHidden, tag.name)} style={{ cursor: 'pointer' }}>
- {tag.isHidden ? 'show' : 'hide'} {tag.name}
+ {tag.isHidden ? t('show') : t('hide')} {tag.name}
))}
diff --git a/src/globals.d.ts b/src/globals.d.ts
index 721d3c77..d0d7a7f5 100644
--- a/src/globals.d.ts
+++ b/src/globals.d.ts
@@ -1,6 +1,5 @@
declare global {
interface Window {
- STICKY_MENU_SCROLL_LISTENER: boolean;
isElectron: boolean;
}
}
diff --git a/src/hooks/use-default-subplebbits.ts b/src/hooks/use-default-subplebbits.ts
index 0905b99b..0d9b1702 100644
--- a/src/hooks/use-default-subplebbits.ts
+++ b/src/hooks/use-default-subplebbits.ts
@@ -15,44 +15,91 @@ export interface MultisubSubplebbit {
tags?: string[];
features?: string[];
seeditAutoSubscribe?: boolean;
+ plebchanAutoSubscribe?: boolean;
lowUptime?: boolean;
}
let cacheSubplebbits: MultisubSubplebbit[] | null = null;
let cacheMetadata: MultisubMetadata | null = null;
let cacheAutoSubscribeAddresses: string[] | null = null;
+let pending = false;
+
+// Subscriber pattern for notifying all hook instances
+const subscribers = new Set<() => void>();
+
+const notifySubscribers = () => {
+ subscribers.forEach((callback) => callback());
+};
+
+// Shared fetch function to avoid duplication
+const fetchMultisubData = async () => {
+ if (pending) {
+ return;
+ }
+ pending = true;
+
+ try {
+ const multisub = await fetch(
+ 'https://raw.githubusercontent.com/plebbit/temporary-default-subplebbits/master/multisub.json',
+ // { cache: 'no-cache' }
+ ).then((res) => res.json());
+
+ const filteredSubplebbits = multisub.subplebbits.filter((sub: MultisubSubplebbit) => !sub.lowUptime);
+
+ cacheSubplebbits = filteredSubplebbits;
+
+ // Cache auto-subscribe addresses when we fetch subplebbits
+ cacheAutoSubscribeAddresses = filteredSubplebbits
+ .filter((sub: MultisubSubplebbit) => sub.seeditAutoSubscribe && sub.address)
+ .map((sub: MultisubSubplebbit) => sub.address);
+
+ // Also cache metadata since we have the full response
+ const { title, description, createdAt, updatedAt } = multisub;
+ cacheMetadata = { title, description, createdAt, updatedAt };
+
+ // Notify all subscribers that cache has been updated
+ notifySubscribers();
+
+ return { subplebbits: filteredSubplebbits, metadata: cacheMetadata };
+ } catch (e) {
+ console.warn(e);
+ return null;
+ } finally {
+ pending = false;
+ }
+};
export const useDefaultSubplebbits = () => {
- const [subplebbits, setSubplebbits] = useState
diff --git a/src/views/inbox/inbox.tsx b/src/views/inbox/inbox.tsx
index c645e272..e9ad86fb 100644
--- a/src/views/inbox/inbox.tsx
+++ b/src/views/inbox/inbox.tsx
@@ -102,6 +102,8 @@ const Inbox = () => {
useEffect(() => {
if (error?.message && comments.length === 0) {
setShouldShowErrorToUser(true);
+ } else if (comments.length > 0) {
+ setShouldShowErrorToUser(false);
}
}, [error, comments]);
diff --git a/src/views/post-page/post-page.tsx b/src/views/post-page/post-page.tsx
index cf370da0..e2a2fe1c 100644
--- a/src/views/post-page/post-page.tsx
+++ b/src/views/post-page/post-page.tsx
@@ -302,6 +302,8 @@ const PostPage = () => {
useEffect(() => {
if (post?.error && ((post?.replyCount > 0 && post?.replies?.length === 0) || (post?.state === 'failed' && post?.error))) {
setShouldShowErrorToUser(true);
+ } else if (post?.replyCount > 0 && post?.replies?.length > 0) {
+ setShouldShowErrorToUser(false);
}
}, [post]);
diff --git a/src/views/profile/profile.tsx b/src/views/profile/profile.tsx
index fd3bd704..4f6b8058 100644
--- a/src/views/profile/profile.tsx
+++ b/src/views/profile/profile.tsx
@@ -147,6 +147,8 @@ const Overview = () => {
useEffect(() => {
if (error?.message && sortedComments.length === 0) {
setShouldShowErrorToUserOverview(true);
+ } else if (sortedComments.length > 0) {
+ setShouldShowErrorToUserOverview(false);
}
}, [error, sortedComments]);
@@ -186,6 +188,8 @@ const Comments = () => {
useEffect(() => {
if (error?.message && sortedComments.length === 0) {
setShouldShowErrorToUserComments(true);
+ } else if (sortedComments.length > 0) {
+ setShouldShowErrorToUserComments(false);
}
}, [error, sortedComments]);
@@ -225,6 +229,8 @@ const Submitted = () => {
useEffect(() => {
if (error?.message && sortedComments.length === 0) {
setShouldShowErrorToUserSubmitted(true);
+ } else if (sortedComments.length > 0) {
+ setShouldShowErrorToUserSubmitted(false);
}
}, [error, sortedComments]);
@@ -268,6 +274,8 @@ const VotedComments = ({ voteType }: { voteType: 1 | -1 }) => {
useEffect(() => {
if (error?.message && paginatedCids.length === 0 && hasMore) {
setShouldShowErrorToUserVoted(true);
+ } else if (paginatedCids.length > 0) {
+ setShouldShowErrorToUserVoted(false);
}
}, [error, paginatedCids, hasMore]);
diff --git a/src/views/settings/account-data-editor/account-data-editor.tsx b/src/views/settings/account-data-editor/account-data-editor.tsx
index bc3f365e..4e76af8e 100644
--- a/src/views/settings/account-data-editor/account-data-editor.tsx
+++ b/src/views/settings/account-data-editor/account-data-editor.tsx
@@ -6,6 +6,7 @@ import useTheme from '../../../stores/use-theme-store';
import stringify from 'json-stringify-pretty-compact';
import styles from './account-data-editor.module.css';
import useIsMobile from '../../../hooks/use-is-mobile';
+import LoadingEllipsis from '../../../components/loading-ellipsis';
const LazyAceEditor = lazy(async () => {
const ReactAceModule = await import('react-ace');
@@ -57,11 +58,11 @@ const AccountDataEditor = () => {
@@ -70,7 +71,13 @@ const AccountDataEditor = () => {
return (
+
+ }
+ >
-
Your private key will be displayed
-You're about to view your account data, which includes your private key. You should never share your private key with anyone.
+{t('private_key_warning_title')}
+{t('private_key_warning_description')}
-
+
- Loading editor...
}>
+
@@ -50,11 +53,11 @@ const MediaOptions = () => {
onChange={() => setThumbnailDisplayOption('community')}
disabled
/>
- Show thumbnails based on that community's media preferences
+ {t('show_thumbnails_based_on_community_media_preferences')}
-
media previews
+ {t('media_previews')}
@@ -76,7 +79,7 @@ const MediaOptions = () => {
checked={mediaPreviewOption === 'autoExpandExceptComments'}
onChange={() => setMediaPreviewOption('autoExpandExceptComments')}
/>
- Don't auto-expand media previews on comments pages
+ {t('dont_auto_expand_media_previews_on_comments_pages')}
@@ -95,21 +98,21 @@ const MediaOptions = () => {
onChange={() => setMediaPreviewOption('community')}
disabled
/>
- Expand media previews based on that community's media preferences
+ {t('expand_media_previews_based_on_community_media_preferences')}
-
Video Player
+ {t('video_player')}
@@ -134,6 +137,8 @@ const MediaOptions = () => { const CommunitiesOptions = () => { const { t } = useTranslation(); + const account = useAccount(); + const defaultSubplebbits = useDefaultSubplebbits(); const { hideAdultCommunities, hideGoreCommunities, @@ -163,8 +168,19 @@ const CommunitiesOptions = () => { el.indeterminate = someHidden && !allHidden; } }} - onChange={(e) => { + onChange={async (e) => { const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['adult', 'gore', 'anti', 'vulgar'], + isShowingAll: true, + }); + } + setHideAdultCommunities(newValue); setHideGoreCommunities(newValue); setHideAntiCommunities(newValue); @@ -178,8 +194,19 @@ const CommunitiesOptions = () => { { - setHideAdultCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['adult'], + }); + } + + setHideAdultCommunities(newValue); }} /> {t('tagged_as_adult')} @@ -190,8 +217,19 @@ const CommunitiesOptions = () => { { - setHideGoreCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['gore'], + }); + } + + setHideGoreCommunities(newValue); }} /> {t('tagged_as_gore')} @@ -202,8 +240,19 @@ const CommunitiesOptions = () => { { - setHideAntiCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['anti'], + }); + } + + setHideAntiCommunities(newValue); }} /> {t('tagged_as_anti')} @@ -214,8 +263,19 @@ const CommunitiesOptions = () => { { - setHideVulgarCommunities(e.target.checked); + onChange={async (e) => { + const newValue = e.target.checked; + + // If showing (newValue = false), handle subscription prompt + if (!newValue) { + await handleNSFWSubscriptionPrompt({ + account, + defaultSubplebbits, + tagsToShow: ['vulgar'], + }); + } + + setHideVulgarCommunities(newValue); }} /> {t('tagged_as_vulgar')} diff --git a/src/views/settings/notifications-settings/notifications-settings.tsx b/src/views/settings/notifications-settings/notifications-settings.tsx index f6f28a39..ba8abc35 100644 --- a/src/views/settings/notifications-settings/notifications-settings.tsx +++ b/src/views/settings/notifications-settings/notifications-settings.tsx @@ -1,9 +1,11 @@ import { useCallback, useEffect, useState } from 'react'; +import { useTranslation } from 'react-i18next'; import { requestNotificationPermission, showLocalNotification } from '../../../lib/push'; -import styles from './notifications-settings.module.css'; import useContentOptionsStore from '../../../stores/use-content-options-store'; +import styles from './notifications-settings.module.css'; const NotificationsSettings = () => { + const { t } = useTranslation(); const { enableLocalNotifications, setEnableLocalNotifications } = useContentOptionsStore(); const [permissionStatus, setPermissionStatus] = useState
- {t('filtering_by_tag', { tag: currentTag })} —{' '}
+ {currentTag === 'nsfw' ? t('filtering_by_nsfw') + ' ("adult", "gore", "vulgar", "anti") —' : t('filtering_by_tag', { tag: currentTag }) + ' —'}{' '}
{t('undo')}
@@ -177,6 +175,7 @@ const Subplebbit = ({ subplebbit, tags, index, isUnsubscribed, onUnsubscribe }:
const { address, createdAt, description, roles, shortAddress, settings, suggested, title } = subplebbit || {};
const [avatarLoadFailed, setAvatarLoadFailed] = useState(false);
const showSprout = !suggested?.avatarUrl || avatarLoadFailed;
+ const location = useLocation();
useEffect(() => {
setAvatarLoadFailed(false);
@@ -187,6 +186,11 @@ const Subplebbit = ({ subplebbit, tags, index, isUnsubscribed, onUnsubscribe }:
const account = useAccount();
const userRole = roles?.[account?.author?.address]?.role;
+ const getTagFilterRoute = (tag: string) => {
+ const pathname = location.pathname;
+ return `${pathname}?tag=${encodeURIComponent(tag)}`;
+ };
+
// TODO: make arrows functional when token voting is implemented in the API
const upvoted = false;
const downvoted = false;
@@ -276,13 +280,17 @@ const Subplebbit = ({ subplebbit, tags, index, isUnsubscribed, onUnsubscribe }:
)}
- {isNsfw && }
+ {isNsfw && (
+
+
+
+ )}
{isOffline && !isOnlineStatusLoading && }
{tags && tags.length > 0 && (
{tags.map((tag, index) => (
- {tag}
+ {tag}
))}
@@ -304,18 +312,38 @@ const AccountSubplebbits = ({ viewRole }: { viewRole: string }) => {
const account = useAccount();
const { accountSubplebbits, error: accountSubplebbitsError } = useAccountSubplebbits();
const { setError } = useErrorStore();
+ const location = useLocation();
+ const defaultSubplebbits = useDefaultSubplebbits();
useEffect(() => {
setError('AccountSubplebbits_useAccountSubplebbits', accountSubplebbitsError);
}, [accountSubplebbitsError, setError, viewRole]);
+ const urlParams = new URLSearchParams(location.search);
+ const currentTag = urlParams.get('tag');
+
const subplebbitElements = Object.values(accountSubplebbits)
.filter((subplebbit: any) => {
const isUserOwner = subplebbit.settings !== undefined;
const userRole = (subplebbit as any).roles?.[account?.author?.address]?.role;
return isUserOwner || userRole === viewRole;
})
- .map((subplebbitData, index) =>