From d925f510540922c66f4e9dc244c0fbd9b11f7128 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 20:30:49 +0700 Subject: [PATCH 01/14] feat: add share post dropdown --- .../posts/view-post/PostDropDownMenu.tsx | 6 +++-- src/components/posts/view-post/helpers.tsx | 22 ++++++++++++++----- 2 files changed, 21 insertions(+), 7 deletions(-) diff --git a/src/components/posts/view-post/PostDropDownMenu.tsx b/src/components/posts/view-post/PostDropDownMenu.tsx index 500a24bfb..95543f6d0 100644 --- a/src/components/posts/view-post/PostDropDownMenu.tsx +++ b/src/components/posts/view-post/PostDropDownMenu.tsx @@ -18,6 +18,8 @@ type DropdownProps = { post: PostData withEditButton?: boolean onEditComment?: VoidFunction + className?: string + style?: React.CSSProperties } const InnerPostDropDownMenu: FC = props => { @@ -91,7 +93,7 @@ const PostDropDown: FC = props => { } export const PostDropDownMenu: FC = ({ withEditButton, ...props }) => { - const { space, post } = props + const { space, post, className, style } = props const isMy = useIsMyAddress(post.struct.ownerId) const editPostProps = { @@ -100,7 +102,7 @@ export const PostDropDownMenu: FC = ({ withEditButton, ...props } } return ( - + {withEditButton && isMy && ( diff --git a/src/components/posts/view-post/helpers.tsx b/src/components/posts/view-post/helpers.tsx index bfbd7889e..26d03d87c 100644 --- a/src/components/posts/view-post/helpers.tsx +++ b/src/components/posts/view-post/helpers.tsx @@ -38,6 +38,7 @@ import { formatDate, isHidden, toShortUrl, useIsVisible } from '../../utils' import { SummarizeMd } from '../../utils/md/SummarizeMd' import ViewTags from '../../utils/ViewTags' import Embed from '../embed/Embed' +import { ShareDropdown } from '../share/ShareDropdown' import ViewPostLink from '../ViewPostLink' import { PostDropDownMenu } from './PostDropDownMenu' import PostRewardStat from './PostRewardStat' @@ -371,11 +372,22 @@ export const InfoPostPreview: FC = props => {
- +
+ {space && ( + + )} + +
{content.link && } Date: Mon, 15 Jan 2024 20:50:28 +0700 Subject: [PATCH 02/14] feat: add comments in post action --- .../posts/view-post/helpers.module.sass | 8 +++++ src/components/posts/view-post/helpers.tsx | 32 ++++++++++++++++--- 2 files changed, 36 insertions(+), 4 deletions(-) create mode 100644 src/components/posts/view-post/helpers.module.sass diff --git a/src/components/posts/view-post/helpers.module.sass b/src/components/posts/view-post/helpers.module.sass new file mode 100644 index 000000000..d22fe2f76 --- /dev/null +++ b/src/components/posts/view-post/helpers.module.sass @@ -0,0 +1,8 @@ +@import "src/styles/subsocial-vars.scss" + +.PostActions + gap: $space_large + + @media screen and ( max-width: 768px) + gap: $space_normal + \ No newline at end of file diff --git a/src/components/posts/view-post/helpers.tsx b/src/components/posts/view-post/helpers.tsx index 26d03d87c..3e695ea79 100644 --- a/src/components/posts/view-post/helpers.tsx +++ b/src/components/posts/view-post/helpers.tsx @@ -1,11 +1,12 @@ import { BN } from '@polkadot/util' import { PostId } from '@subsocial/api/types/substrate' import { isEmptyObj, isEmptyStr } from '@subsocial/utils' -import { Alert, Image, Tooltip } from 'antd' +import { Alert, Button, Image, Tooltip } from 'antd' import clsx from 'clsx' import isEmpty from 'lodash.isempty' import Error from 'next/error' import React, { FC, useState } from 'react' +import { TbMessageCircle2 } from 'react-icons/tb' import { useIsMobileWidthOrDevice } from 'src/components/responsive' import { useIsMySpace } from 'src/components/spaces/helpers' import { HasDataForSlug } from 'src/components/urls' @@ -20,6 +21,7 @@ import { resolveIpfsUrl } from 'src/ipfs' import messages from 'src/messages' import { isBlockedPost } from 'src/moderation' import { useHasUserASpacePermission } from 'src/permissions/checkPermission' +import { useSetChatEntityConfig, useSetChatOpen } from 'src/rtk/app/hooks' import { PostContent as PostContentType, PostData, @@ -40,6 +42,7 @@ import ViewTags from '../../utils/ViewTags' import Embed from '../embed/Embed' import { ShareDropdown } from '../share/ShareDropdown' import ViewPostLink from '../ViewPostLink' +import styles from './helpers.module.sass' import { PostDropDownMenu } from './PostDropDownMenu' import PostRewardStat from './PostRewardStat' import TwitterPost from './TwitterPost' @@ -294,17 +297,38 @@ export const PostActionsPanel: FC = props => { post: { struct }, } = postDetails - const ReactionsAction = () => - return (
- +
+ + +
{/* */}
) } +function CommentAction({ post }: { post: PostData }) { + const setChatOpen = useSetChatOpen() + const setChatConfig = useSetChatEntityConfig() + + return ( + + ) +} + type PostPreviewProps = { postDetails: PostWithSomeDetails space?: SpaceData From 9d81dd965979fb56496d981ee3bc78e27baf6b23 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 20:51:27 +0700 Subject: [PATCH 03/14] feat: remove reward info before liking state --- .../creators/staker-rewards/StakerRewardInfo.tsx | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/src/components/creators/staker-rewards/StakerRewardInfo.tsx b/src/components/creators/staker-rewards/StakerRewardInfo.tsx index a76aadff0..74a72ed50 100644 --- a/src/components/creators/staker-rewards/StakerRewardInfo.tsx +++ b/src/components/creators/staker-rewards/StakerRewardInfo.tsx @@ -1,6 +1,5 @@ import { Skeleton, Tooltip } from 'antd' import clsx from 'clsx' -import Link from 'next/link' import { ComponentProps, useState } from 'react' import { RiHistoryFill } from 'react-icons/ri' import { SlQuestion } from 'react-icons/sl' @@ -41,18 +40,6 @@ export default function StakerRewardInfo({ size, ...props }: StakerRewardInfoPro const todayReward = data?.currentRewardAmount ?? '0' const weekReward = data?.weeklyReward ?? '0' - if (!(BigInt(todayReward) || BigInt(weekReward))) { - return ( -

- Like the posts on the " - - Posts > Active Staking - - " tab to increase your staking rewards by 50-200%. -

- ) - } - const likeCount = data?.superLikesCount ?? 0 const likesToMaxReward = SUPER_LIKES_FOR_MAX_REWARD - likeCount From 49bc2d08f6cbd559cc9c56beddad35dcaf8f051e Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 21:06:29 +0700 Subject: [PATCH 04/14] feat: add creator reward history --- .../StakerRewardHistoryModal.tsx | 76 ++++++++++++++----- src/components/utils/datahub/super-likes.ts | 10 ++- .../activeStaking/rewardHistorySlice.ts | 1 + 3 files changed, 67 insertions(+), 20 deletions(-) diff --git a/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx b/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx index ba2d574a1..6ab9baf37 100644 --- a/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx +++ b/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx @@ -2,6 +2,7 @@ import { ModalProps, Skeleton } from 'antd' import { FormatBalance } from 'src/components/common/balances' import { formatDate } from 'src/components/utils' import CustomModal from 'src/components/utils/CustomModal' +import { MutedSpan } from 'src/components/utils/MutedText' import { useFetchUserRewardHistory } from 'src/rtk/features/activeStaking/hooks' export type StakerRewardHistoryModalProps = Pick @@ -11,28 +12,65 @@ export default function StakerRewardHistoryModal({ visible, }: StakerRewardHistoryModalProps) { const { data, loading } = useFetchUserRewardHistory(undefined, { enabled: visible }) + + const creatorRewards = data?.rewards.filter(reward => BigInt(reward.creatorReward) > 0) + return ( -
- {(() => { - if (loading) return - if (data?.rewards.length === 0) return No rewards yet - return data?.rewards.map(reward => ( -
- - {formatDate(reward.startDate, 'DD.MM.YY')} -{' '} - {formatDate(reward.endDate, 'DD.MM.YY')} - - - + - -
- )) - })()} +
+ Staker Rewards +
+ {(() => { + if (loading) return + if (data?.rewards.length === 0) + return No rewards yet + + return data?.rewards.map(reward => ( +
+ + {formatDate(reward.startDate, 'DD.MM.YY')} -{' '} + {formatDate(reward.endDate, 'DD.MM.YY')} + + + +{' '} + + +
+ )) + })()} +
+ + {(creatorRewards?.length ?? 0) > 0 && ( +
+ Creator Rewards +
+ {creatorRewards?.map(reward => ( +
+ + {formatDate(reward.startDate, 'DD.MM.YY')} -{' '} + {formatDate(reward.endDate, 'DD.MM.YY')} + + + +{' '} + + +
+ ))} +
+
+ )} ) } diff --git a/src/components/utils/datahub/super-likes.ts b/src/components/utils/datahub/super-likes.ts index 5c2521eac..478b935a8 100644 --- a/src/components/utils/datahub/super-likes.ts +++ b/src/components/utils/datahub/super-likes.ts @@ -231,6 +231,9 @@ const GET_REWARD_HISTORY = gql` activeStakingRewardsByWeek(args: { filter: { account: $address } }) { staker week + creator { + total + } } } ` @@ -240,6 +243,9 @@ export async function getRewardHistory(address: string): Promise activeStakingRewardsByWeek: { staker: string week: number + creator: { + total: string + } }[] }, { address: string } @@ -250,18 +256,20 @@ export async function getRewardHistory(address: string): Promise return { address, - rewards: res.activeStakingRewardsByWeek.map(({ staker, week }) => { + rewards: res.activeStakingRewardsByWeek.map(({ staker, week, creator }) => { const startDate = dayjs .utc() .year(week / 100) .week(week % 100) .startOf('week') const endDate = startDate.add(1, 'week') + return { reward: staker, week, startDate: startDate.toISOString(), endDate: endDate.toISOString(), + creatorReward: creator.total, } }), } diff --git a/src/rtk/features/activeStaking/rewardHistorySlice.ts b/src/rtk/features/activeStaking/rewardHistorySlice.ts index d24a132f2..3e55877a7 100644 --- a/src/rtk/features/activeStaking/rewardHistorySlice.ts +++ b/src/rtk/features/activeStaking/rewardHistorySlice.ts @@ -10,6 +10,7 @@ export type RewardHistory = { startDate: string endDate: string reward: string + creatorReward: string }[] } From 3ad55cc60ba72fd2065f38d6a59c4060f51496bf Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 21:15:26 +0700 Subject: [PATCH 05/14] style: adjust padding --- .../creators/staker-rewards/StakerRewardHistoryModal.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx b/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx index 6ab9baf37..608334843 100644 --- a/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx +++ b/src/components/creators/staker-rewards/StakerRewardHistoryModal.tsx @@ -19,7 +19,7 @@ export default function StakerRewardHistoryModal({
Staker Rewards -
+
{(() => { if (loading) return if (data?.rewards.length === 0) @@ -47,7 +47,7 @@ export default function StakerRewardHistoryModal({ {(creatorRewards?.length ?? 0) > 0 && (
Creator Rewards -
+
{creatorRewards?.map(reward => (
Date: Mon, 15 Jan 2024 21:23:21 +0700 Subject: [PATCH 06/14] feat: remember last selected space id in post editor --- src/components/posts/editor/ModalEditor.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/components/posts/editor/ModalEditor.tsx b/src/components/posts/editor/ModalEditor.tsx index 5d7af7fed..7b09a019c 100644 --- a/src/components/posts/editor/ModalEditor.tsx +++ b/src/components/posts/editor/ModalEditor.tsx @@ -22,6 +22,7 @@ import { getNonEmptyPostContent } from 'src/components/utils/content' import { ButtonLink } from 'src/components/utils/CustomLinks' import SelectSpacePreview from 'src/components/utils/SelectSpacePreview' import TxButton from 'src/components/utils/TxButton' +import useExternalStorage from 'src/hooks/useExternalStorage' import { useSendEvent } from 'src/providers/AnalyticContext' import { useFetchSpaces, @@ -54,8 +55,17 @@ export const PostEditorModalBody = ({ closeModal }: { closeModal: () => void }) const [publishIsDisable, setPublishIsDisable] = useState(true) const sendEvent = useSendEvent() + const { getDataForAddress: getLastUsedSpaceId, setData: setLastUsedSpaceId } = useExternalStorage( + 'last-space-id', + { storageKeyType: 'user' }, + ) + const profile = useSelectProfile(myAddress) const defaultSpace = useMemo(() => { + const lastUsedSpaceId = getLastUsedSpaceId(myAddress ?? '') + if (getLastUsedSpaceId(myAddress ?? '') && allowedSpaceIds.includes(lastUsedSpaceId)) { + return lastUsedSpaceId + } if (profile && allowedSpaceIds.includes(profile?.id ?? '')) { return profile?.id } @@ -148,6 +158,7 @@ export const PostEditorModalBody = ({ closeModal }: { closeModal: () => void }) imageSize={32} onSelect={value => { const newId = (value as LabeledValue).value.toString() + setLastUsedSpaceId(newId, myAddress ?? '') setSpaceId(newId) sendEvent('createpost_space_changed', { from: spaceId, From dd239cf9c938a6feaf0540021d72422ce38196c5 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 21:25:36 +0700 Subject: [PATCH 07/14] feat: update super like to use server time --- src/server/datahub-queue/super-likes.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/server/datahub-queue/super-likes.ts b/src/server/datahub-queue/super-likes.ts index 0cb4ea0ea..fc17b8d56 100644 --- a/src/server/datahub-queue/super-likes.ts +++ b/src/server/datahub-queue/super-likes.ts @@ -22,6 +22,8 @@ export async function createSuperLikeServer(input: SocialEventDataApiInput) { args.blockHash = blockHash.toString() input.callData.args = JSON.stringify(args) + input.callData.timestamp = Date.now() + const signedPayload = await backendSigWrapper(input) const res = await datahubQueueRequest<{ activeStakingCreateSuperLike: { processed: boolean; message: string } From 956e72f979675869034030a31dcdf9469c40385e Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 21:32:09 +0700 Subject: [PATCH 08/14] fix: use isoWeek instead of weekOfYear, and rename file for active staking helpers --- .../utils/datahub/{super-likes.ts => active-staking.ts} | 8 ++++---- src/components/utils/datahub/subscriber.tsx | 2 +- src/components/voting/SuperLike.tsx | 2 +- src/rtk/features/activeStaking/addressLikeCountSlice.ts | 2 +- src/rtk/features/activeStaking/canPostSuperLikedSlice.ts | 2 +- src/rtk/features/activeStaking/postRewardSlice.ts | 2 +- src/rtk/features/activeStaking/rewardHistorySlice.ts | 2 +- src/rtk/features/activeStaking/rewardReportSlice.ts | 2 +- src/rtk/features/activeStaking/superLikeCountsSlice.ts | 2 +- 9 files changed, 12 insertions(+), 12 deletions(-) rename src/components/utils/datahub/{super-likes.ts => active-staking.ts} (98%) diff --git a/src/components/utils/datahub/super-likes.ts b/src/components/utils/datahub/active-staking.ts similarity index 98% rename from src/components/utils/datahub/super-likes.ts rename to src/components/utils/datahub/active-staking.ts index 478b935a8..e6992ebfb 100644 --- a/src/components/utils/datahub/super-likes.ts +++ b/src/components/utils/datahub/active-staking.ts @@ -5,8 +5,8 @@ import { } from '@subsocial/data-hub-sdk' import axios from 'axios' import dayjs from 'dayjs' +import isoWeek from 'dayjs/plugin/isoWeek' import utc from 'dayjs/plugin/utc' -import weekOfYear from 'dayjs/plugin/weekOfYear' import { gql } from 'graphql-request' import { getStoreDispatcher } from 'src/rtk/app/store' import { @@ -29,7 +29,7 @@ import { } from './utils' dayjs.extend(utc) -dayjs.extend(weekOfYear) +dayjs.extend(isoWeek) // QUERIES const GET_SUPER_LIKE_COUNTS = gql` @@ -189,7 +189,7 @@ const GET_REWARD_REPORT = gql` function getDayAndWeekTimestamp(currentDate: Date = new Date()) { let date = dayjs.utc(currentDate) date = date.startOf('day') - const week = date.get('year') * 100 + date.week() + const week = date.get('year') * 100 + date.isoWeek() return { day: date.unix(), week } } export async function getRewardReport(address: string): Promise { @@ -260,7 +260,7 @@ export async function getRewardHistory(address: string): Promise const startDate = dayjs .utc() .year(week / 100) - .week(week % 100) + .isoWeek(week % 100) .startOf('week') const endDate = startDate.add(1, 'week') diff --git a/src/components/utils/datahub/subscriber.tsx b/src/components/utils/datahub/subscriber.tsx index 468e5ff4c..3cb6d3bb5 100644 --- a/src/components/utils/datahub/subscriber.tsx +++ b/src/components/utils/datahub/subscriber.tsx @@ -1,7 +1,7 @@ import { useEffect, useRef } from 'react' import { useMyAddress } from 'src/components/auth/MyAccountsContext' import { datahubSubscriptionUrl } from 'src/config/env' -import { subscribeSuperLike } from './super-likes' +import { subscribeSuperLike } from './active-staking' function useDatahubSubscriber() { const unsubRef = useRef<(() => void) | undefined>() diff --git a/src/components/voting/SuperLike.tsx b/src/components/voting/SuperLike.tsx index 2c7d626f7..9149e96e3 100644 --- a/src/components/voting/SuperLike.tsx +++ b/src/components/voting/SuperLike.tsx @@ -30,7 +30,7 @@ import { useAuth } from '../auth/AuthContext' import { useMyAddress } from '../auth/MyAccountsContext' import { IconWithLabel } from '../utils' import CustomModal from '../utils/CustomModal' -import { createSuperLike } from '../utils/datahub/super-likes' +import { createSuperLike } from '../utils/datahub/active-staking' import { useAmISpaceFollower } from '../utils/FollowSpaceButton' import styles from './SuperLike.module.sass' diff --git a/src/rtk/features/activeStaking/addressLikeCountSlice.ts b/src/rtk/features/activeStaking/addressLikeCountSlice.ts index a378f8eaf..f49090591 100644 --- a/src/rtk/features/activeStaking/addressLikeCountSlice.ts +++ b/src/rtk/features/activeStaking/addressLikeCountSlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice } from '@reduxjs/toolkit' -import { getAddressLikeCountToPosts } from 'src/components/utils/datahub/super-likes' +import { getAddressLikeCountToPosts } from 'src/components/utils/datahub/active-staking' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleManyFetchWrapper } from 'src/rtk/app/wrappers' diff --git a/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts b/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts index 49545536c..e8fbf5f7d 100644 --- a/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts +++ b/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice } from '@reduxjs/toolkit' -import { getCanPostsSuperLiked } from 'src/components/utils/datahub/super-likes' +import { getCanPostsSuperLiked } from 'src/components/utils/datahub/active-staking' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleManyFetchWrapper } from 'src/rtk/app/wrappers' diff --git a/src/rtk/features/activeStaking/postRewardSlice.ts b/src/rtk/features/activeStaking/postRewardSlice.ts index 3d804ea2f..d610cc1d2 100644 --- a/src/rtk/features/activeStaking/postRewardSlice.ts +++ b/src/rtk/features/activeStaking/postRewardSlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice } from '@reduxjs/toolkit' -import { getPostRewards } from 'src/components/utils/datahub/super-likes' +import { getPostRewards } from 'src/components/utils/datahub/active-staking' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleManyFetchWrapper } from 'src/rtk/app/wrappers' diff --git a/src/rtk/features/activeStaking/rewardHistorySlice.ts b/src/rtk/features/activeStaking/rewardHistorySlice.ts index 3e55877a7..f210fff93 100644 --- a/src/rtk/features/activeStaking/rewardHistorySlice.ts +++ b/src/rtk/features/activeStaking/rewardHistorySlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice } from '@reduxjs/toolkit' -import { getRewardHistory } from 'src/components/utils/datahub/super-likes' +import { getRewardHistory } from 'src/components/utils/datahub/active-staking' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers' diff --git a/src/rtk/features/activeStaking/rewardReportSlice.ts b/src/rtk/features/activeStaking/rewardReportSlice.ts index 61af82d0d..593f055dd 100644 --- a/src/rtk/features/activeStaking/rewardReportSlice.ts +++ b/src/rtk/features/activeStaking/rewardReportSlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice, PayloadAction } from '@reduxjs/toolkit' -import { getRewardReport } from 'src/components/utils/datahub/super-likes' +import { getRewardReport } from 'src/components/utils/datahub/active-staking' import { CREATORS_CONSTANTS } from 'src/config/constants' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers' diff --git a/src/rtk/features/activeStaking/superLikeCountsSlice.ts b/src/rtk/features/activeStaking/superLikeCountsSlice.ts index 884b757c6..c0c2d8910 100644 --- a/src/rtk/features/activeStaking/superLikeCountsSlice.ts +++ b/src/rtk/features/activeStaking/superLikeCountsSlice.ts @@ -1,5 +1,5 @@ import { createEntityAdapter, createSlice } from '@reduxjs/toolkit' -import { getSuperLikeCounts } from 'src/components/utils/datahub/super-likes' +import { getSuperLikeCounts } from 'src/components/utils/datahub/active-staking' import { RootState } from 'src/rtk/app/rootReducer' import { createSimpleManyFetchWrapper } from 'src/rtk/app/wrappers' From a86ab84e3207a4171ada9d226c9c3144096389c1 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 21:49:32 +0700 Subject: [PATCH 09/14] feat: render first image in body if no image --- src/components/posts/view-post/helpers.module.sass | 7 ++++++- src/components/posts/view-post/helpers.tsx | 2 +- src/graphql/apis/mappers.ts | 8 +++++++- src/styles/subsocial-mobile.scss | 8 -------- src/styles/subsocial.scss | 2 -- 5 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/components/posts/view-post/helpers.module.sass b/src/components/posts/view-post/helpers.module.sass index d22fe2f76..976b1f285 100644 --- a/src/components/posts/view-post/helpers.module.sass +++ b/src/components/posts/view-post/helpers.module.sass @@ -5,4 +5,9 @@ @media screen and ( max-width: 768px) gap: $space_normal - \ No newline at end of file + +.PostContent + gap: $space_small + + @media screen and ( max-width: 768px) + gap: $space_tiny \ No newline at end of file diff --git a/src/components/posts/view-post/helpers.tsx b/src/components/posts/view-post/helpers.tsx index 3e695ea79..e6a5c74e3 100644 --- a/src/components/posts/view-post/helpers.tsx +++ b/src/components/posts/view-post/helpers.tsx @@ -267,7 +267,7 @@ const PostContentMemoized = React.memo((props: PostContentMemoizedProps) => { post={post} space={space} title={ -
+
{withImage && } diff --git a/src/graphql/apis/mappers.ts b/src/graphql/apis/mappers.ts index f0c88b54f..d0769e5b6 100644 --- a/src/graphql/apis/mappers.ts +++ b/src/graphql/apis/mappers.ts @@ -91,12 +91,18 @@ export const mapSimpleSpaceFragment = (space: SpaceSimpleFragment): SpaceSimpleF } } +function getFirstImageLink(mdText: string) { + const imageRegex = /!\[.*?\]\((.*?)\)/ + const match = mdText.match(imageRegex) + return match ? match[1] : null +} export const mapSimplePostFragment = (post: PostSimpleFragment): PostSimpleFragmentMapped => { const getContent = (): PostContent => { const summary = summarizeMd(post.body ?? '') + const firstImageLink = getFirstImageLink(post.body ?? '') return { summary: summary.summary ?? '', - image: post.image ?? '', + image: post.image || firstImageLink || '', title: post.title ?? '', link: post.link ?? undefined, body: post.body || '', diff --git a/src/styles/subsocial-mobile.scss b/src/styles/subsocial-mobile.scss index 71bad4519..c1e41115d 100644 --- a/src/styles/subsocial-mobile.scss +++ b/src/styles/subsocial-mobile.scss @@ -231,10 +231,6 @@ font-weight: 500; } - .header.DfPostTitle--preview { - margin-bottom: $space_tiny; - } - .DfPostPreview { &h2 { margin-top: 0; @@ -242,10 +238,6 @@ } } - .DfPostImagePreviewWrapper { - margin-bottom: $space_tiny !important; - } - .DfSpaceStats { .DfStatItem { margin-right: $space_tiny; diff --git a/src/styles/subsocial.scss b/src/styles/subsocial.scss index 80d702a5b..5a7fe5b52 100644 --- a/src/styles/subsocial.scss +++ b/src/styles/subsocial.scss @@ -554,7 +554,6 @@ a { .DfPostTitle--preview { @extend .DfBoldBlackLink; @extend .DfUnboundedTitle; - margin-bottom: $space_small; } .DfEntirePost { @@ -978,7 +977,6 @@ hr { .DfPostImagePreviewWrapper { width: 100%; - margin-bottom: $space_normal; border-radius: $border_radius_normal; overflow: hidden; border: 1px solid $color_light_border; From 259b6588a59b42954877aa98092c86bfdfaf5cbc Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 22:11:12 +0700 Subject: [PATCH 10/14] feat: add share post in post page --- src/components/posts/view-post/PostPage.tsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/components/posts/view-post/PostPage.tsx b/src/components/posts/view-post/PostPage.tsx index b97288c0d..179c2973a 100644 --- a/src/components/posts/view-post/PostPage.tsx +++ b/src/components/posts/view-post/PostPage.tsx @@ -26,6 +26,7 @@ import { DfMd } from '../../utils/DfMd' import Section from '../../utils/Section' import ViewTags from '../../utils/ViewTags' import Embed, { getEmbedLinkType, getYoutubeVideoId } from '../embed/Embed' +import { ShareDropdown } from '../share/ShareDropdown' import ViewPostLink from '../ViewPostLink' import { HiddenPostAlert, @@ -177,6 +178,11 @@ const InnerPostPage: NextPage = props => { /> {isNotMobile && (
+ {/* */}
From 6ae8f548e3cba17bc57cca6546d5a3244b219e28 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 22:28:43 +0700 Subject: [PATCH 11/14] feat: change redirect to space profile page if exist --- .../OnBoardingModal/OnBoardingContentContainer.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx b/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx index a9a570b81..90d2eb10e 100644 --- a/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx +++ b/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx @@ -9,6 +9,7 @@ import PrivacyPolicyText from 'src/components/utils/PrivacyPolicyText' import TwitterMock from 'src/components/utils/TwitterMock' import TxButton from 'src/components/utils/TxButton' import config from 'src/config' +import { useSelectProfile } from 'src/rtk/app/hooks' import { useAppDispatch } from 'src/rtk/app/store' import { useCurrentOnBoardingStep, @@ -212,8 +213,11 @@ function ContentWrapper({ function SuccessContent() { const myAddress = useMyAddress() + const profile = useSelectProfile(myAddress) const twitterText = `I just onboarded to ${config.appName}, the premier social platform of the @Polkadot ecosystem, powered by @SubsocialChain!\n\nYou can follow me here:` + const redirectUrl = profile?.id ? `/${profile.id}` : `/accounts/${myAddress}` + return (
- +

I just onboarded to {config.appName}, the premier social platform of the @Polkadot ecosystem, powered by @SubsocialChain! @@ -238,7 +238,7 @@ function SuccessContent() {
You can follow me here:
- {subsocialUrl(`/accounts/${myAddress}`)} + {subsocialUrl(redirectUrl)}

#{config.appName} #Subsocial From f0d6efee0e627ae4053eb73f6684f346a4f2218c Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Mon, 15 Jan 2024 22:44:42 +0700 Subject: [PATCH 12/14] feat: use profile space page redirect instead of account in onboarding success --- .../OnBoardingContentContainer.tsx | 15 ++++++++++++--- src/rtk/app/helpers.ts | 1 + 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx b/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx index 90d2eb10e..1591773cb 100644 --- a/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx +++ b/src/components/onboarding/OnBoardingModal/OnBoardingContentContainer.tsx @@ -1,5 +1,5 @@ import { ArrowLeftOutlined } from '@ant-design/icons' -import { Button } from 'antd' +import { Button, Skeleton } from 'antd' import clsx from 'clsx' import { useMyAddress } from 'src/components/auth/MyAccountsContext' import { subsocialUrl } from 'src/components/urls' @@ -9,7 +9,7 @@ import PrivacyPolicyText from 'src/components/utils/PrivacyPolicyText' import TwitterMock from 'src/components/utils/TwitterMock' import TxButton from 'src/components/utils/TxButton' import config from 'src/config' -import { useSelectProfile } from 'src/rtk/app/hooks' +import { useFetchProfileSpace } from 'src/rtk/app/hooks' import { useAppDispatch } from 'src/rtk/app/store' import { useCurrentOnBoardingStep, @@ -20,6 +20,7 @@ import { markStepAsDraftOnBoardingModal, resetOnBoardingData, } from 'src/rtk/features/onBoarding/onBoardingSlice' +import { DataSourceTypes } from 'src/types' import styles from './OnBoardingModal.module.sass' import CustomFooterAction from './steps/Signer/CustomFooterAction' import { OnBoardingContentContainerProps } from './types' @@ -213,11 +214,19 @@ function ContentWrapper({ function SuccessContent() { const myAddress = useMyAddress() - const profile = useSelectProfile(myAddress) + const { entity: profile, loading } = useFetchProfileSpace({ + id: myAddress ?? '', + dataSource: DataSourceTypes.CHAIN, + reload: true, + }) const twitterText = `I just onboarded to ${config.appName}, the premier social platform of the @Polkadot ecosystem, powered by @SubsocialChain!\n\nYou can follow me here:` const redirectUrl = profile?.id ? `/${profile.id}` : `/accounts/${myAddress}` + if (loading) { + return + } + return (
= CommonFetchPropsAndIds & { export type SelectOneArgs = T & { id: EntityId dataSource?: DataSourceTypes + reload?: boolean } export type SelectManyArgs = T & { From b273c7a751238a405927b7a51190bc4f8ed4bf94 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Tue, 16 Jan 2024 00:00:08 +0700 Subject: [PATCH 13/14] feat: use surplus progress bar --- .../creators/staker-rewards/StakerRewardInfo.tsx | 10 +++++++++- .../staker-rewards/StakerRewardProgressBar.tsx | 8 ++++---- 2 files changed, 13 insertions(+), 5 deletions(-) diff --git a/src/components/creators/staker-rewards/StakerRewardInfo.tsx b/src/components/creators/staker-rewards/StakerRewardInfo.tsx index 74a72ed50..94842f254 100644 --- a/src/components/creators/staker-rewards/StakerRewardInfo.tsx +++ b/src/components/creators/staker-rewards/StakerRewardInfo.tsx @@ -163,10 +163,18 @@ export function StakerSuperLikeCount() { const { data, loading } = useFetchUserRewardReport() const likeCount = data?.superLikesCount ?? 0 + const surplusLikes = likeCount - SUPER_LIKES_FOR_MAX_REWARD return ( - {loading ? : {likeCount}}{' '} + {loading ? ( + + ) : ( + <> + {Math.min(likeCount, SUPER_LIKES_FOR_MAX_REWARD)} + {surplusLikes > 0 && +{surplusLikes}} + + )}{' '} likes ) diff --git a/src/components/creators/staker-rewards/StakerRewardProgressBar.tsx b/src/components/creators/staker-rewards/StakerRewardProgressBar.tsx index 492908b2c..f187a1561 100644 --- a/src/components/creators/staker-rewards/StakerRewardProgressBar.tsx +++ b/src/components/creators/staker-rewards/StakerRewardProgressBar.tsx @@ -31,8 +31,8 @@ export default function StakerRewardProgressBar({ className={clsx(styles.StakerRewardProgressBar, props.className)} style={{ ...props.style, - gridTemplateColumns: '1fr', - // gridTemplateColumns: progress <= 100 ? '1fr' : `1fr ${(progress - 100) / 100}fr`, + // gridTemplateColumns: '1fr', + gridTemplateColumns: progress <= 100 ? '1fr' : `1fr ${(progress - 100) / 100}fr`, }} > - {/* {progress > 100 && ( + {progress > 100 && ( - )} */} + )}
) } From 7c575eb295dfb81c80c4baae0861f844f599e048 Mon Sep 17 00:00:00 2001 From: teodorus-nathaniel Date: Tue, 16 Jan 2024 00:06:48 +0700 Subject: [PATCH 14/14] feat: add rewards history button in creator reward info --- .../creator-rewards/CreatorRewardInfoCard.tsx | 157 ++++++++++-------- 1 file changed, 92 insertions(+), 65 deletions(-) diff --git a/src/components/creators/creator-rewards/CreatorRewardInfoCard.tsx b/src/components/creators/creator-rewards/CreatorRewardInfoCard.tsx index d403ca4b0..13a01709f 100644 --- a/src/components/creators/creator-rewards/CreatorRewardInfoCard.tsx +++ b/src/components/creators/creator-rewards/CreatorRewardInfoCard.tsx @@ -1,6 +1,8 @@ import { Tooltip } from 'antd' import clsx from 'clsx' import Link from 'next/link' +import { useState } from 'react' +import { RiHistoryFill } from 'react-icons/ri' import { SlQuestion } from 'react-icons/sl' import { useMyAddress } from 'src/components/auth/MyAccountsContext' import { FormatBalance } from 'src/components/common/balances' @@ -11,88 +13,113 @@ import Segment from 'src/components/utils/Segment' import { CREATORS_CONSTANTS } from 'src/config/constants' import { useSendEvent } from 'src/providers/AnalyticContext' import { useFetchUserRewardReport } from 'src/rtk/features/activeStaking/hooks' +import { useFetchTotalStake } from 'src/rtk/features/creators/totalStakeHooks' +import { getAmountRange } from 'src/utils/analytics' import { activeStakingLinks } from 'src/utils/links' import NumberSkeleton from '../common/NumberSkeleton' +import StakerRewardHistoryModal from '../staker-rewards/StakerRewardHistoryModal' import styles from './CreatorRewardInfoCard.module.sass' export default function CreatorRewardInfoCard() { const sendEvent = useSendEvent() const myAddress = useMyAddress() ?? '' + const { data: totalStake } = useFetchTotalStake(myAddress) const { data: rewardReport, loading } = useFetchUserRewardReport(myAddress) + const [isOpenRewardHistoryModal, setIsOpenRewardHistoryModal] = useState(false) if (loading || !rewardReport?.receivedLikes) return null return ( - -
- -
-
-
-
- Received likes - - - +
+
+
+
+ Received likes + + + +
+ + {loading ? : {rewardReport.receivedLikes}} +
- - {loading ? : {rewardReport.receivedLikes}} - -
-
-
- Earned from posts - - - +
+
+ Earned from posts + + + +
+ + {loading ? ( + + ) : ( + + ≥{' '} + + + )} +
- - {loading ? ( - - ) : ( - - ≥{' '} - - - )} - -
-
-
- Distribution in - - - +
+
+ Distribution in + + + +
+ + + +
+
{ + sendEvent('astake_reward_history_opened', { + amountRange: getAmountRange(totalStake?.amount), + }) + setIsOpenRewardHistoryModal(true) + }} + style={{ cursor: 'pointer' }} + > + + Rewards History
- - -
-
- + + + setIsOpenRewardHistoryModal(false)} + /> + ) }