From dcd06d3fc1921a523b05c4bd1740456a09b7b97c Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Sat, 4 May 2024 18:03:31 +0200 Subject: [PATCH 1/6] fix(index.html): add no-referrer meta tag to resolve CORP-related media access issues --- public/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/public/index.html b/public/index.html index c278a50c..7bafd59b 100644 --- a/public/index.html +++ b/public/index.html @@ -2,6 +2,7 @@ + From 4d60d9b576a35c5a28960b2afd9c237f6797b97c Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Sun, 5 May 2024 12:36:18 +0200 Subject: [PATCH 2/6] fix(embed): pass origin to youtube because popular videos won't load without it --- src/components/post/embed/embed.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/post/embed/embed.tsx b/src/components/post/embed/embed.tsx index 5f8b8e96..df650624 100644 --- a/src/components/post/embed/embed.tsx +++ b/src/components/post/embed/embed.tsx @@ -61,10 +61,11 @@ const YoutubeEmbed = ({ parsedUrl }: EmbedComponentProps) => { className={styles.videoEmbed} height='100%' width='100%' + referrerPolicy='origin' allow='accelerometer; encrypted-media; gyroscope; picture-in-picture; web-share' allowFullScreen title={parsedUrl.href} - src={`https://www.youtube-nocookie.com/embed/${youtubeId}`} + src={`https://www.youtube.com/embed/${youtubeId}`} /> ); } From 3cb52299410ca8319d974adc3c6a54fd7065b468 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Mon, 6 May 2024 13:01:30 +0200 Subject: [PATCH 3/6] fix(subplebbit settings): edits didn't work --- .../subplebbit/subplebbit-settings/subplebbit-settings.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx index 0c1e4127..cfd6beea 100644 --- a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx +++ b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx @@ -63,6 +63,7 @@ const useSubplebbitSettingsStore = create((set) => ({ if (nextState.rules !== undefined) editOptions.rules = nextState.rules; if (nextState.roles !== undefined) editOptions.roles = nextState.roles; if (nextState.settings !== undefined) editOptions.settings = nextState.settings; + if (nextState.subplebbitAddress !== undefined) editOptions.subplebbitAddress = nextState.subplebbitAddress; nextState.publishSubplebbitEditOptions = editOptions; return nextState; }), @@ -834,7 +835,7 @@ const SubplebbitSettings = () => { setShowSaving(true); await publishSubplebbitEdit(); setShowSaving(false); - alert(t('settings_saved', { subplebbitAddress: shortAddress })); + alert(t('settings_saved', { subplebbitAddress })); } catch (e) { if (e instanceof Error) { console.warn(e); From f184bb67ee80c48811aa049953840a063389947a Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Mon, 6 May 2024 13:15:58 +0200 Subject: [PATCH 4/6] fix(loading ellipsis): was not aligned to text bottom --- src/components/loading-ellipsis/loading-ellipsis.module.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/loading-ellipsis/loading-ellipsis.module.css b/src/components/loading-ellipsis/loading-ellipsis.module.css index d840bd8e..9dfe4e9f 100644 --- a/src/components/loading-ellipsis/loading-ellipsis.module.css +++ b/src/components/loading-ellipsis/loading-ellipsis.module.css @@ -1,8 +1,7 @@ .ellipsis:after { overflow: hidden; display: inline-block; - position: absolute; - vertical-align: bottom; + vertical-align: text-bottom; -webkit-animation: ellipsis steps(4,end) 1500ms infinite; animation: ellipsis steps(4,end) 1500ms infinite; content: "\2026"; /* ascii code for the ellipsis character */ From de5e9997ad649d0c4586510503ba492ba436570c Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Mon, 6 May 2024 13:35:49 +0200 Subject: [PATCH 5/6] feat(subplebbit): show 'no posts' loading state if sub was just created, not yet published and there are no posts yet (owner can already post) --- src/components/sidebar/sidebar.module.css | 1 - src/components/sidebar/sidebar.tsx | 6 +++++- src/views/subplebbit/subplebbit.tsx | 14 +++++++++----- 3 files changed, 14 insertions(+), 7 deletions(-) diff --git a/src/components/sidebar/sidebar.module.css b/src/components/sidebar/sidebar.module.css index 173dfc2b..925f9efe 100644 --- a/src/components/sidebar/sidebar.module.css +++ b/src/components/sidebar/sidebar.module.css @@ -53,7 +53,6 @@ a { } .onlineLine { - text-transform: lowercase; padding-bottom: 5px; } diff --git a/src/components/sidebar/sidebar.tsx b/src/components/sidebar/sidebar.tsx index ddeea531..793caa82 100644 --- a/src/components/sidebar/sidebar.tsx +++ b/src/components/sidebar/sidebar.tsx @@ -10,6 +10,7 @@ import Markdown from '../markdown'; import SearchBar from '../search-bar'; import SubscribeButton from '../subscribe-button'; import packageJson from '../../../package.json'; +import LoadingEllipsis from '../loading-ellipsis'; const { version } = packageJson; const commitRef = process.env.REACT_APP_COMMIT_REF; @@ -131,6 +132,9 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role const offlineNotice = updatedAt && t('posts_last_synced', { dateAgo: getFormattedTimeAgo(updatedAt) }); const onlineStatus = isOnline ? onlineNotice : offlineNotice; + const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt; + const subCreatedButNotYetPublishedStatus = ; + const location = useLocation(); const params = useParams(); const isInAboutView = isAboutView(location.pathname); @@ -208,7 +212,7 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role
- {onlineStatus} + {isSubCreatedButNotYetPublished ? subCreatedButNotYetPublishedStatus : onlineStatus}
{description && (
diff --git a/src/views/subplebbit/subplebbit.tsx b/src/views/subplebbit/subplebbit.tsx index fdd62429..e6005ffe 100644 --- a/src/views/subplebbit/subplebbit.tsx +++ b/src/views/subplebbit/subplebbit.tsx @@ -23,9 +23,11 @@ const Subplebbit = () => { const subplebbit = useSubplebbit({ subplebbitAddress }); const { createdAt, description, roles, rules, shortAddress, state, title, updatedAt, settings } = subplebbit || {}; const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses, sortType, filter: timeFilter }); - const loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading'); + const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt; + const loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading'); const loadingString =
{state === 'failed' ? state : }
; + const isOnline = updatedAt && updatedAt > Date.now() / 1000 - 60 * 30; const { blocked } = useBlock({ address: subplebbitAddress }); @@ -36,16 +38,18 @@ const Subplebbit = () => { const Footer = () => { let footerContent; - if (feed.length === 0) { + if (feed.length === 0 && isOnline) { if (blocked) { footerContent = t('you_blocked_community'); } else { footerContent = t('no_posts'); } - } - - if (hasMore || subplebbitAddresses.length === 0) { + } else if (feed.length === 0 && isSubCreatedButNotYetPublished) { + footerContent = t('no_posts'); + } else if (hasMore) { footerContent = loadingString; + } else { + return; } return
{footerContent}
; From 1bc710271a3d881d7fa1a61280ea28d413a91e2e Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Mon, 6 May 2024 15:36:22 +0200 Subject: [PATCH 6/6] update loading state of newly published sub --- src/components/sidebar/sidebar.tsx | 18 ++++++++++++++++-- src/views/subplebbit/subplebbit.tsx | 10 ++++++---- 2 files changed, 22 insertions(+), 6 deletions(-) diff --git a/src/components/sidebar/sidebar.tsx b/src/components/sidebar/sidebar.tsx index 793caa82..7cce1bf2 100644 --- a/src/components/sidebar/sidebar.tsx +++ b/src/components/sidebar/sidebar.tsx @@ -21,6 +21,7 @@ interface sidebarProps { cid?: string; createdAt?: number; description?: string; + isSubCreatedButNotYetPublished?: boolean; downvoteCount?: number; roles?: Record; rules?: string[]; @@ -124,7 +125,21 @@ const downloadAppLink = (() => { } })(); -const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, roles, rules, timestamp = 0, title, updatedAt, upvoteCount = 0, settings }: sidebarProps) => { +const Sidebar = ({ + address, + cid, + createdAt, + description, + downvoteCount = 0, + isSubCreatedButNotYetPublished, + roles, + rules, + timestamp = 0, + title, + updatedAt, + upvoteCount = 0, + settings, +}: sidebarProps) => { const { t } = useTranslation(); const { allActiveUserCount, hourActiveUserCount } = useSubplebbitStats({ subplebbitAddress: address }); const isOnline = updatedAt && updatedAt > Date.now() / 1000 - 60 * 30; @@ -132,7 +147,6 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role const offlineNotice = updatedAt && t('posts_last_synced', { dateAgo: getFormattedTimeAgo(updatedAt) }); const onlineStatus = isOnline ? onlineNotice : offlineNotice; - const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt; const subCreatedButNotYetPublishedStatus = ; const location = useLocation(); diff --git a/src/views/subplebbit/subplebbit.tsx b/src/views/subplebbit/subplebbit.tsx index e6005ffe..a78d616e 100644 --- a/src/views/subplebbit/subplebbit.tsx +++ b/src/views/subplebbit/subplebbit.tsx @@ -21,13 +21,14 @@ const Subplebbit = () => { const subplebbitAddress = params.subplebbitAddress; const subplebbitAddresses = useMemo(() => [subplebbitAddress], [subplebbitAddress]) as string[]; const subplebbit = useSubplebbit({ subplebbitAddress }); - const { createdAt, description, roles, rules, shortAddress, state, title, updatedAt, settings } = subplebbit || {}; + const { createdAt, description, roles, rules, shortAddress, started, state, title, updatedAt, settings } = subplebbit || {}; const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses, sortType, filter: timeFilter }); - const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt; const loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading'); const loadingString =
{state === 'failed' ? state : }
; - const isOnline = updatedAt && updatedAt > Date.now() / 1000 - 60 * 30; + + let isOnline = updatedAt && updatedAt > Date.now() / 1000 - 60 * 30; + const isSubCreatedButNotYetPublished = typeof createdAt === 'number' && !updatedAt; const { blocked } = useBlock({ address: subplebbitAddress }); @@ -44,7 +45,7 @@ const Subplebbit = () => { } else { footerContent = t('no_posts'); } - } else if (feed.length === 0 && isSubCreatedButNotYetPublished) { + } else if (feed.length === 0 && started && isSubCreatedButNotYetPublished) { footerContent = t('no_posts'); } else if (hasMore) { footerContent = loadingString; @@ -78,6 +79,7 @@ const Subplebbit = () => { address={subplebbitAddress} createdAt={createdAt} description={description} + isSubCreatedButNotYetPublished={started && isSubCreatedButNotYetPublished} roles={roles} rules={rules} title={title}