diff --git a/src/components/spaces/helpers/SpaceDropdownMenu.tsx b/src/components/spaces/helpers/SpaceDropdownMenu.tsx
index 5120a0b15..5e578ce85 100644
--- a/src/components/spaces/helpers/SpaceDropdownMenu.tsx
+++ b/src/components/spaces/helpers/SpaceDropdownMenu.tsx
@@ -64,6 +64,7 @@ export const SpaceDropdownMenu = (props: SpaceDropDownProps) => {
withFloatingButton: false,
})
setChatOpen(true)
+ sendEvent('creator_chat_opened', { spaceId: id })
}}
>
diff --git a/src/components/utils/CustomModal/index.module.sass b/src/components/utils/CustomModal/index.module.sass
index df3676b35..dae05204e 100644
--- a/src/components/utils/CustomModal/index.module.sass
+++ b/src/components/utils/CustomModal/index.module.sass
@@ -14,13 +14,14 @@
height: 100%
display: flex
flex-direction: column
- padding: 1.5rem 1rem
+ padding: $space_normal $space_small
+ padding-bottom: $space_large
overflow: hidden
> *
- padding-left: 0.75rem
- padding-right: 0.75rem
-
+ padding-left: $space_small
+ padding-right: $space_small
+
.CustomModalContent
display: flex
flex-direction: column
diff --git a/src/components/utils/CustomModal/index.tsx b/src/components/utils/CustomModal/index.tsx
index e7f24a30c..b1bc6bcf2 100644
--- a/src/components/utils/CustomModal/index.tsx
+++ b/src/components/utils/CustomModal/index.tsx
@@ -40,7 +40,7 @@ export default function CustomModal({
{...props}
>
{(title || subtitle) && (
-
+
{title}
{subtitle && {subtitle}}
diff --git a/src/components/utils/DfImage.tsx b/src/components/utils/DfImage.tsx
index 216eecd15..c26177123 100644
--- a/src/components/utils/DfImage.tsx
+++ b/src/components/utils/DfImage.tsx
@@ -6,11 +6,12 @@ type Props = {
size?: string | number
rounded?: boolean
className?: string
+ preview?: boolean
}
// TODO: create props onError
export const DfImage = (props: Props) => {
- const { src, size, rounded, className } = props
+ const { src, size, rounded, className, preview = true } = props
const style: React.CSSProperties = {
width: size,
height: size,
@@ -18,12 +19,12 @@ export const DfImage = (props: Props) => {
minHeight: size,
overflow: 'hidden',
borderRadius: rounded ? '50%' : undefined,
- cursor: 'pointer',
+ cursor: preview ? 'pointer' : undefined,
}
return (
-
+
)
}
diff --git a/src/components/utils/IconWithLabel.tsx b/src/components/utils/IconWithLabel.tsx
index 906f9cc5f..d40a76f9d 100644
--- a/src/components/utils/IconWithLabel.tsx
+++ b/src/components/utils/IconWithLabel.tsx
@@ -1,22 +1,27 @@
+import clsx from 'clsx'
import React from 'react'
type IconWithTitleProps = {
icon: JSX.Element
count?: number
label?: string
+ renderZeroCount?: boolean
+ renderTextIfEmpty?: boolean
}
export const IconWithLabel = React.memo((props: IconWithTitleProps) => {
- const { icon, label, count = 0 } = props
+ const { icon, label, count = 0, renderZeroCount, renderTextIfEmpty } = props
- const countStr = count > 0 ? count.toString() : undefined
+ const countStr = renderZeroCount || count > 0 ? count.toString() : undefined
const text = label ? label + (countStr ? ` (${countStr})` : '') : countStr
return (
<>
{icon}
- {text &&
{text}}
+ {(text || renderTextIfEmpty) && (
+
{text || }
+ )}
)
})
diff --git a/src/components/utils/datahub/subscriber.tsx b/src/components/utils/datahub/subscriber.tsx
new file mode 100644
index 000000000..468e5ff4c
--- /dev/null
+++ b/src/components/utils/datahub/subscriber.tsx
@@ -0,0 +1,23 @@
+import { useEffect, useRef } from 'react'
+import { useMyAddress } from 'src/components/auth/MyAccountsContext'
+import { datahubSubscriptionUrl } from 'src/config/env'
+import { subscribeSuperLike } from './super-likes'
+
+function useDatahubSubscriber() {
+ const unsubRef = useRef<(() => void) | undefined>()
+ const myAddress = useMyAddress()
+
+ useEffect(() => {
+ if (!datahubSubscriptionUrl) return
+
+ unsubRef.current = subscribeSuperLike(myAddress)
+ return () => {
+ unsubRef.current?.()
+ }
+ }, [myAddress])
+}
+
+export function DatahubSubscriber() {
+ useDatahubSubscriber()
+ return null
+}
diff --git a/src/components/utils/datahub/super-likes.ts b/src/components/utils/datahub/super-likes.ts
new file mode 100644
index 000000000..36297733a
--- /dev/null
+++ b/src/components/utils/datahub/super-likes.ts
@@ -0,0 +1,323 @@
+import {
+ DataHubSubscriptionEventEnum,
+ SocialCallDataArgs,
+ socialCallName,
+} from '@subsocial/data-hub-sdk'
+import axios from 'axios'
+import dayjs from 'dayjs'
+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 {
+ AddressLikeCount,
+ fetchAddressLikeCounts,
+} from 'src/rtk/features/activeStaking/addressLikeCountSlice'
+import { CanPostSuperLiked } from 'src/rtk/features/activeStaking/canPostSuperLikedSlice'
+import { RewardHistory } from 'src/rtk/features/activeStaking/rewardHistorySlice'
+import { fetchRewardReport, RewardReport } from 'src/rtk/features/activeStaking/rewardReportSlice'
+import {
+ fetchSuperLikeCounts,
+ SuperLikeCount,
+} from 'src/rtk/features/activeStaking/superLikeCountsSlice'
+import {
+ createSocialDataEventPayload,
+ DatahubParams,
+ datahubQueryRequest,
+ datahubSubscription,
+} from './utils'
+
+dayjs.extend(utc)
+dayjs.extend(weekOfYear)
+
+// QUERIES
+const GET_SUPER_LIKE_COUNTS = gql`
+ query GetSuperLikeCounts($postIds: [String!]!) {
+ activeStakingSuperLikeCountsByPost(args: { postPersistentIds: $postIds }) {
+ persistentPostId
+ count
+ }
+ }
+`
+export async function getSuperLikeCounts(postIds: string[]): Promise
{
+ const res = await datahubQueryRequest<
+ {
+ activeStakingSuperLikeCountsByPost: {
+ persistentPostId: string
+ count: number
+ }[]
+ },
+ { postIds: string[] }
+ >({
+ document: GET_SUPER_LIKE_COUNTS,
+ variables: { postIds },
+ })
+
+ const resultMap = new Map()
+ res.activeStakingSuperLikeCountsByPost.forEach(item =>
+ resultMap.set(item.persistentPostId, {
+ postId: item.persistentPostId,
+ count: item.count,
+ }),
+ )
+
+ return postIds.map(postId => resultMap.get(postId) ?? { postId, count: 0 })
+}
+
+const GET_ADDRESS_LIKE_COUNT_TO_POSTS = gql`
+ query GetAddressLikeCountToPosts($address: String!, $postIds: [String!]!) {
+ activeStakingSuperLikeCountsByStaker(args: { postPersistentIds: $postIds, address: $address }) {
+ persistentPostId
+ count
+ }
+ }
+`
+export async function getAddressLikeCountToPosts(
+ address: string,
+ postIds: string[],
+): Promise {
+ const res = await datahubQueryRequest<
+ {
+ activeStakingSuperLikeCountsByStaker: {
+ persistentPostId: string
+ count: number
+ }[]
+ },
+ { postIds: string[]; address: string }
+ >({
+ document: GET_ADDRESS_LIKE_COUNT_TO_POSTS,
+ variables: { postIds, address },
+ })
+
+ const resultMap = new Map()
+ res.activeStakingSuperLikeCountsByStaker.forEach(item =>
+ resultMap.set(item.persistentPostId, {
+ address,
+ postId: item.persistentPostId,
+ count: item.count,
+ }),
+ )
+
+ return postIds.map(postId => resultMap.get(postId) ?? { address, postId, count: 0 })
+}
+
+const GET_CAN_POSTS_SUPER_LIKED = gql`
+ query GetCanPostsSuperLiked($postIds: [String!]!) {
+ activeStakingCanDoSuperLikeByPost(args: { postPersistentIds: $postIds }) {
+ persistentPostId
+ possible
+ }
+ }
+`
+export async function getCanPostsSuperLiked(postIds: string[]): Promise {
+ const res = await datahubQueryRequest<
+ {
+ activeStakingCanDoSuperLikeByPost: {
+ persistentPostId: string
+ possible: boolean
+ }[]
+ },
+ { postIds: string[] }
+ >({
+ document: GET_CAN_POSTS_SUPER_LIKED,
+ variables: { postIds },
+ })
+
+ const resultMap = new Map()
+ res.activeStakingCanDoSuperLikeByPost.forEach(item =>
+ resultMap.set(item.persistentPostId, {
+ postId: item.persistentPostId,
+ canPostSuperLiked: item.possible,
+ }),
+ )
+
+ return postIds.map(postId => resultMap.get(postId) ?? { postId, canPostSuperLiked: false })
+}
+
+const GET_REWARD_REPORT = gql`
+ query GetRewardReport($address: String!, $day: Int!, $week: Int!) {
+ activeStakingDailyStatsByStaker(args: { address: $address, dayTimestamp: $day }) {
+ superLikesCount
+ currentRewardAmount
+ }
+ activeStakingRewardsByWeek(args: { weeks: [$week], filter: { account: $address } }) {
+ staker
+ creator {
+ total
+ posts {
+ superLikesCount
+ }
+ }
+ }
+ }
+`
+function getDayAndWeekTimestamp(currentDate: Date = new Date()) {
+ let date = dayjs.utc(currentDate)
+ date = date.startOf('day')
+ const week = date.get('year') * 100 + date.week()
+ return { day: date.unix(), week }
+}
+export async function getRewardReport(address: string): Promise {
+ const res = await datahubQueryRequest<
+ {
+ activeStakingDailyStatsByStaker: {
+ superLikesCount: number
+ currentRewardAmount: string
+ }
+ activeStakingRewardsByWeek: {
+ staker: string
+ creator: {
+ total: string
+ posts: {
+ superLikesCount: number
+ }[]
+ }
+ }[]
+ },
+ { address: string; day: number; week: number }
+ >({
+ document: GET_REWARD_REPORT,
+ variables: { address, ...getDayAndWeekTimestamp() },
+ })
+ const weekReward = res.activeStakingRewardsByWeek?.[0]
+
+ return {
+ ...res.activeStakingDailyStatsByStaker,
+ weeklyReward: weekReward?.staker ?? '0',
+ creatorReward: weekReward?.creator.total ?? '0',
+ receivedLikes:
+ weekReward?.creator.posts.reduce((acc, post) => acc + post.superLikesCount, 0) ?? 0,
+ address,
+ }
+}
+
+const GET_REWARD_HISTORY = gql`
+ query GetRewardHistory($address: String!) {
+ activeStakingRewardsByWeek(args: { filter: { account: $address } }) {
+ staker
+ week
+ }
+ }
+`
+export async function getRewardHistory(address: string): Promise {
+ const res = await datahubQueryRequest<
+ {
+ activeStakingRewardsByWeek: {
+ staker: string
+ week: number
+ }[]
+ },
+ { address: string }
+ >({
+ document: GET_REWARD_HISTORY,
+ variables: { address },
+ })
+
+ return {
+ address,
+ rewards: res.activeStakingRewardsByWeek.map(({ staker, week }) => {
+ 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(),
+ }
+ }),
+ }
+}
+
+// MUTATIONS
+export async function createSuperLike(
+ params: DatahubParams>,
+) {
+ const input = createSocialDataEventPayload(
+ socialCallName.synth_active_staking_create_super_like,
+ params,
+ )
+
+ const res = await axios.post('/api/datahub/super-likes', input)
+ return res.data
+}
+
+// SUBSCRIPTION
+const SUBSCRIBE_SUPER_LIKE = gql`
+ subscription SubscribeSuperLike {
+ activeStakingSuperLike {
+ event
+ entity {
+ staker {
+ id
+ }
+ post {
+ persistentId
+ }
+ }
+ }
+ }
+`
+
+let isSubscribed = false
+export function subscribeSuperLike(myAddress: string | undefined) {
+ if (isSubscribed) return
+ isSubscribed = true
+
+ const client = datahubSubscription()
+ let unsub = client.subscribe(
+ {
+ query: SUBSCRIBE_SUPER_LIKE,
+ },
+ {
+ complete: () => undefined,
+ next: async data => {
+ const eventData = data.data?.activeStakingSuperLike
+ if (!eventData) return
+
+ await processSubscriptionEvent(eventData as any, myAddress)
+ },
+ error: () => {
+ console.log('error subscription')
+ },
+ },
+ )
+
+ return () => {
+ unsub()
+ isSubscribed = false
+ }
+}
+
+async function processSubscriptionEvent(
+ eventData: {
+ event: DataHubSubscriptionEventEnum
+ entity: { staker: { id: string }; post: { persistentId: string } }
+ },
+ myAddress: string | undefined,
+) {
+ if (
+ eventData.event !== DataHubSubscriptionEventEnum.ACTIVE_STAKING_SUPER_LIKE_CREATED &&
+ eventData.event !== DataHubSubscriptionEventEnum.ACTIVE_STAKING_SUPER_LIKE_STATE_UPDATED
+ )
+ return
+
+ const { post, staker } = eventData.entity
+ const dispatch = getStoreDispatcher()
+ if (!dispatch) throw new Error('Dispatcher not exist')
+
+ dispatch(fetchSuperLikeCounts({ postIds: [post.persistentId], reload: true }))
+ if (staker.id === myAddress) {
+ dispatch(fetchRewardReport({ address: myAddress, reload: true }))
+ dispatch(
+ fetchAddressLikeCounts({
+ address: myAddress,
+ postIds: [post.persistentId],
+ reload: true,
+ }),
+ )
+ }
+}
diff --git a/src/components/utils/datahub/utils.ts b/src/components/utils/datahub/utils.ts
new file mode 100644
index 000000000..9ed6cf8ac
--- /dev/null
+++ b/src/components/utils/datahub/utils.ts
@@ -0,0 +1,77 @@
+import {
+ SocialCallDataArgs,
+ socialCallName,
+ SocialEventDataApiInput,
+ SocialEventDataType,
+ socialEventProtVersion,
+} from '@subsocial/data-hub-sdk'
+import { GraphQLClient, RequestOptions, Variables } from 'graphql-request'
+import { Client, createClient } from 'graphql-ws'
+import ws from 'isomorphic-ws'
+import { datahubQueryUrl, datahubSubscriptionUrl } from 'src/config/env'
+import { wait } from 'src/utils/promise'
+
+// QUERIES
+export function datahubQueryRequest(
+ config: RequestOptions,
+) {
+ if (!datahubQueryUrl) throw new Error('Datahub (Query) config is not set')
+
+ const TIMEOUT = 10 * 1000 // 10 seconds
+ const client = new GraphQLClient(datahubQueryUrl, {
+ timeout: TIMEOUT,
+ ...config,
+ })
+
+ return client.request({ url: datahubQueryUrl, ...config })
+}
+
+// MUTATIONS
+export type DatahubParams = {
+ address: string
+
+ uuid?: string
+ timestamp?: number
+
+ args: T
+}
+
+export function createSocialDataEventPayload(
+ callName: T,
+ { timestamp, address, uuid, args }: DatahubParams>,
+) {
+ const payload: SocialEventDataApiInput = {
+ protVersion: socialEventProtVersion['0.1'],
+ dataType: SocialEventDataType.offChain,
+ callData: {
+ name: callName,
+ signer: address || '',
+ args: JSON.stringify(args),
+ timestamp: timestamp || Date.now(),
+ uuid: uuid || crypto.randomUUID(),
+ },
+ providerAddr: address,
+ sig: '',
+ }
+ return payload
+}
+
+// SUBSCRIPTION
+let client: Client | null = null
+function getClient() {
+ if (!datahubSubscriptionUrl) throw new Error('Datahub (Subscription) config is not set')
+ if (!client) {
+ client = createClient({
+ webSocketImpl: ws,
+ url: datahubSubscriptionUrl,
+ shouldRetry: () => true,
+ retryWait: async attempt => {
+ await wait(2 ** attempt * 1000)
+ },
+ })
+ }
+ return client
+}
+export function datahubSubscription() {
+ return getClient()
+}
diff --git a/src/components/voting/SuperLike.module.sass b/src/components/voting/SuperLike.module.sass
new file mode 100644
index 000000000..58169da43
--- /dev/null
+++ b/src/components/voting/SuperLike.module.sass
@@ -0,0 +1,25 @@
+@import "src/styles/subsocial-vars.scss"
+
+.SuperLike
+ background: #F8FAFC
+ color: #7779F3
+ padding: 0.2em $space_small
+ display: flex
+ align-items: center
+ border: none
+
+ &:focus
+ color: #7779F3
+ background: #F8FAFC
+
+ &:focus-visible, &:hover
+ color: #7779F3
+ box-shadow: 0 0 0 1px rgba(119, 121, 243, 0.5)
+
+ &:disabled
+ color: $color_muted
+
+ &.SuperLikeActive
+ background: linear-gradient(97deg, #8B55FD 8.3%, #7493FC 91.24%)
+ color: white
+
diff --git a/src/components/voting/SuperLike.tsx b/src/components/voting/SuperLike.tsx
new file mode 100644
index 000000000..fa085a9e9
--- /dev/null
+++ b/src/components/voting/SuperLike.tsx
@@ -0,0 +1,264 @@
+import { PostStruct } from '@subsocial/api/types'
+import { Button, ButtonProps, Image, Tooltip } from 'antd'
+import clsx from 'clsx'
+import dayjs from 'dayjs'
+import { ComponentProps, useEffect, useState } from 'react'
+import { useSendEvent } from 'src/providers/AnalyticContext'
+import { useAppDispatch } from 'src/rtk/app/store'
+import {
+ fetchAddressLikeCounts,
+ setAddressLikeCount,
+} from 'src/rtk/features/activeStaking/addressLikeCountSlice'
+import {
+ useCanPostSuperLiked,
+ useFetchUserRewardReport,
+ useHasISuperLikedPost,
+ useSuperLikeCount,
+} from 'src/rtk/features/activeStaking/hooks'
+import {
+ fetchRewardReport,
+ setOptimisticRewardReportChange,
+} from 'src/rtk/features/activeStaking/rewardReportSlice'
+import {
+ fetchSuperLikeCounts,
+ setSuperLikeCount,
+} from 'src/rtk/features/activeStaking/superLikeCountsSlice'
+import { useFetchTotalStake } from 'src/rtk/features/creators/totalStakeHooks'
+import { getAmountRange } from 'src/utils/analytics'
+import { getSubIdCreatorsLink } from 'src/utils/links'
+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 { useAmISpaceFollower } from '../utils/FollowSpaceButton'
+import styles from './SuperLike.module.sass'
+
+export type SuperLikeProps = ButtonProps & {
+ post: PostStruct
+}
+
+const FIRST_TIME_SUPERLIKE = 'df.first-time-superlike'
+
+export default function SuperLike({ post, ...props }: SuperLikeProps) {
+ const dispatch = useAppDispatch()
+ const myAddress = useMyAddress()
+ const sendEvent = useSendEvent()
+
+ const clientCanPostSuperLiked = useClientValidationOfPostSuperLike(post.createdAtTime)
+ const spaceId = post.spaceId
+ const amIFollower = useAmISpaceFollower(spaceId)
+
+ const canPostSuperLiked = useCanPostSuperLiked(post.id)
+
+ const [isOpenShouldStakeModal, setIsOpenShouldStakeModal] = useState(false)
+ const [isOpenActiveStakingModal, setIsOpenActiveStakingModal] = useState(false)
+
+ const { data: totalStake, loading: loadingTotalStake } = useFetchTotalStake(myAddress ?? '')
+ const { data: userReport } = useFetchUserRewardReport()
+ const count = useSuperLikeCount(post.id)
+ const hasILiked = useHasISuperLikedPost(post.id)
+
+ const isMyPost = post.ownerId === myAddress
+
+ const isActive = hasILiked
+ const isPostCreatedMoreThan1Week = !clientCanPostSuperLiked || !canPostSuperLiked
+ const isDisabled = isPostCreatedMoreThan1Week || isMyPost || loadingTotalStake
+
+ const { openSignInModal } = useAuth()
+
+ const onClick = async () => {
+ if (isActive || isDisabled) return
+
+ if (!myAddress) {
+ openSignInModal()
+ return
+ }
+ if (!totalStake?.hasStaked) {
+ setIsOpenShouldStakeModal(true)
+ return
+ }
+
+ sendEvent('like', {
+ postId: post.id,
+ value: (userReport?.superLikesCount ?? 0) + 1,
+ spaceId,
+ isFollower: amIFollower,
+ amountRange: getAmountRange(totalStake.amount),
+ })
+
+ try {
+ // set optimistic changes
+ dispatch(setSuperLikeCount({ postId: post.id, count: count + 1 }))
+ dispatch(setAddressLikeCount({ address: myAddress, postId: post.id, count: count + 1 }))
+ dispatch(setOptimisticRewardReportChange({ address: myAddress, superLikeCountChange: 1 }))
+
+ await createSuperLike({ address: myAddress, args: { postId: post.id } })
+ } catch (error) {
+ // undo the optimistic changes
+ dispatch(setSuperLikeCount({ postId: post.id, count: count - 1 }))
+ dispatch(setAddressLikeCount({ address: myAddress, postId: post.id, count: count - 1 }))
+ dispatch(setOptimisticRewardReportChange({ address: myAddress, superLikeCountChange: -1 }))
+
+ // refetch the real data
+ dispatch(fetchSuperLikeCounts({ postIds: [post.id], reload: true }))
+ dispatch(fetchAddressLikeCounts({ address: myAddress, postIds: [post.id], reload: true }))
+ dispatch(fetchRewardReport({ address: myAddress }))
+ }
+
+ if (localStorage.getItem(FIRST_TIME_SUPERLIKE) !== 'false') {
+ setIsOpenActiveStakingModal(true)
+ }
+ localStorage.setItem(FIRST_TIME_SUPERLIKE, 'false')
+ }
+
+ const icon = (
+
+ )
+
+ let tooltipTitle = ''
+ if (isPostCreatedMoreThan1Week)
+ tooltipTitle = 'You cannot super like posts that are older than 7 days'
+ else if (isMyPost) tooltipTitle = 'You cannot like your own post'
+
+ const button = (
+
+
+
+ )
+
+ return (
+ <>
+ {tooltipTitle ? {button} : button}
+ setIsOpenShouldStakeModal(false)}
+ />
+ setIsOpenActiveStakingModal(false)}
+ title='Join the Active Staking Program!'
+ subtitle='By confirming, you agree to participate in the Active Staking Program, where you may get SUB tokens, NFTs, or other tokens, based on your active engagement.'
+ >
+
+
+
+
+
+
+ )
+}
+
+function Diamond({ isFilled, ...props }: ComponentProps<'svg'> & { isFilled?: boolean }) {
+ return (
+
+ )
+}
+
+function ShouldStakeModal({ onCancel, visible }: { visible: boolean; onCancel: () => void }) {
+ return (
+
+
+
+
+
+
+ )
+}
+
+function useClientValidationOfPostSuperLike(createdAtTime: number) {
+ const [, setState] = useState({})
+
+ useEffect(() => {
+ const interval = setInterval(() => setState({}), 5 * 1000 * 60) // refresh every 5 minutes
+ return () => clearInterval(interval)
+ }, [])
+
+ const isPostMadeMoreThan1WeekAgo = dayjs().diff(dayjs(createdAtTime), 'day') > 7
+ return !isPostMadeMoreThan1WeekAgo
+}
diff --git a/src/components/wallets/wallet-list/WalletList.module.sass b/src/components/wallets/wallet-list/WalletList.module.sass
index b05eb313a..ddf4ebe31 100644
--- a/src/components/wallets/wallet-list/WalletList.module.sass
+++ b/src/components/wallets/wallet-list/WalletList.module.sass
@@ -11,6 +11,11 @@
&:hover
background-color: #ffedf6
+
+ &.Disabled
+ color: $color_muted
+ background: transparent !important
+
.InstallButton
padding: 0 $space_tiny
diff --git a/src/components/wallets/wallet-list/WalletsList.tsx b/src/components/wallets/wallet-list/WalletsList.tsx
index 40b9ff7c5..233b927fe 100644
--- a/src/components/wallets/wallet-list/WalletsList.tsx
+++ b/src/components/wallets/wallet-list/WalletsList.tsx
@@ -1,6 +1,7 @@
import { DownloadOutlined } from '@ant-design/icons'
import { Tooltip } from 'antd'
-import { useEffect, useState } from 'react'
+import clsx from 'clsx'
+import { useEffect, useMemo, useState } from 'react'
import { StepsEnum } from 'src/components/auth/AuthContext'
import { setCurrentWallet } from 'src/components/auth/utils'
import config from 'src/config'
@@ -57,7 +58,17 @@ const WalletList = ({ setCurrentStep }: GetWalletPorps) => {
}
}
- const wallets = supportedWallets.map(wallet => {
+ const sortedSupportedWallets = useMemo(() => {
+ let installedWallet: (typeof supportedWallets)[number][] = []
+ let notInstalledWallet: (typeof supportedWallets)[number][] = []
+ supportedWallets.forEach(wallet => {
+ if (wallet.installed) installedWallet.push(wallet)
+ else notInstalledWallet.push(wallet)
+ })
+ return [...installedWallet, ...notInstalledWallet]
+ }, [supportedWallets])
+
+ const wallets = sortedSupportedWallets.map(wallet => {
const { title, logo, installed, installUrls } = wallet
const onInstallButtonClick = (e: React.MouseEvent) => {
@@ -65,7 +76,11 @@ const WalletList = ({ setCurrentStep }: GetWalletPorps) => {
}
return (
- onClick(wallet)}>
+
installed && onClick(wallet)}
+ >
= {
appBaseUrl: process.env['NEXT_PUBLIC_APP_BASE_URL'],
}
-export const ampId = process.env['AMP_ID'] || ''
+export const ampId = process.env['NEXT_PUBLIC_AMP_ID'] || ''
+
+export const serverMnemonic = process.env['SERVER_MNEMONIC']
+export const datahubQueueConfig = {
+ url: process.env['DATAHUB_QUEUE_URL'],
+ token: process.env['DATAHUB_QUEUE_TOKEN'],
+}
+
+export const datahubQueryUrl = process.env['NEXT_PUBLIC_DATAHUB_QUERY_URL']
+export const datahubSubscriptionUrl = process.env['NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL']
/**
* Enable or disable the available features of this web app by overriding them in the .env file.
diff --git a/src/pages/_app.js b/src/pages/_app.js
index 113dae203..9c004a2bb 100644
--- a/src/pages/_app.js
+++ b/src/pages/_app.js
@@ -33,8 +33,9 @@ import config from 'src/config'
import '@subsocial/definitions/interfaces/types-lookup'
import '@subsocial/definitions/interfaces/augment-types'
import '@subsocial/definitions/interfaces/augment-api'
-import AnalyticProvider from 'src/providers/AnalyticContext'
+import AnalyticProvider, { AppLaunchedEventSender } from 'src/providers/AnalyticContext'
import { GoogleAnalytics } from 'nextjs-google-analytics'
+import { DatahubSubscriber } from 'src/components/utils/datahub/subscriber'
dayjs.extend(relativeTime)
dayjs.extend(localizedFormat)
@@ -73,10 +74,12 @@ function MyApp(props) {
{/* */}
+
+
diff --git a/src/pages/api/datahub/super-likes.ts b/src/pages/api/datahub/super-likes.ts
new file mode 100644
index 000000000..6408b6353
--- /dev/null
+++ b/src/pages/api/datahub/super-likes.ts
@@ -0,0 +1,31 @@
+import { SocialEventDataApiInput } from '@subsocial/data-hub-sdk'
+import { NextApiRequest, NextApiResponse } from 'next'
+import { ApiResponse, handlerWrapper } from 'src/server/common'
+import { createSuperLikeServer } from 'src/server/datahub-queue/super-likes'
+import { z } from 'zod'
+
+export default function handler(req: NextApiRequest, res: NextApiResponse) {
+ if (req.method === 'POST') {
+ return POST_handler(req, res)
+ }
+
+ return res.status(405).send('Method Not Allowed')
+}
+
+export type ApiDatahubModerationBody = SocialEventDataApiInput
+export type ApiDatahubModerationResponse = ApiResponse
+const POST_handler = handlerWrapper({
+ inputSchema: z.any(),
+ dataGetter: req => req.body,
+})({
+ allowedMethods: ['POST'],
+ errorLabel: 'super-likes',
+ handler: async (data: ApiDatahubModerationBody, _req, res) => {
+ await createSuperLikeServer(data)
+
+ res.json({
+ message: 'OK',
+ success: true,
+ })
+ },
+})
diff --git a/src/providers/AnalyticContext.tsx b/src/providers/AnalyticContext.tsx
index f1f2dda8e..8c0161713 100644
--- a/src/providers/AnalyticContext.tsx
+++ b/src/providers/AnalyticContext.tsx
@@ -9,7 +9,12 @@ import React, {
useRef,
useState,
} from 'react'
+import { useMyAddress } from 'src/components/auth/MyAccountsContext'
import { ampId } from 'src/config/env'
+import { useFetchProfileSpace } from 'src/rtk/app/hooks'
+import { useFetchUserRewardReport } from 'src/rtk/features/activeStaking/hooks'
+import { useFetchTotalStake } from 'src/rtk/features/creators/totalStakeHooks'
+import { getAmountRange } from 'src/utils/analytics'
type AnalyticContextState = {
amp: BrowserClient | null
@@ -22,10 +27,15 @@ const initialState: AnalyticContextState = {
}
export type AnalyticContextProps = {
- sendEvent: (name: string, properties?: Record) => void
+ amp: BrowserClient | null
+ sendEvent: (
+ name: string,
+ properties?: Record,
+ userProperties?: Record,
+ ) => void
}
-const propsStub = { sendEvent: () => undefined }
+const propsStub = { sendEvent: () => undefined, amp: null }
export const AnalyticContext = createContext(propsStub)
export async function createAmplitudeInstance() {
@@ -72,11 +82,17 @@ export function AnalyticProvider(props: React.PropsWithChildren<{}>) {
const contextValue: AnalyticContextProps = useMemo(() => {
return {
- sendEvent: (name: string, properties?: Record) => {
+ amp: state.amp,
+ sendEvent: (
+ name: string,
+ properties?: Record,
+ userProperties?: Record,
+ ) => {
const eventProps = {
event_type: name,
device_id: state.deviceId,
event_properties: properties,
+ user_properties: userProperties,
}
if (!state.amp) {
setQueuedEvents(prev => [...prev, eventProps])
@@ -106,3 +122,34 @@ export function useBuildSendEvent(eventName: string) {
}
export default AnalyticProvider
+
+export function AppLaunchedEventSender() {
+ const state = useContext(AnalyticContext)
+
+ const myAddress = useMyAddress() ?? ''
+ const { entity, loading: loadingProfile } = useFetchProfileSpace({ id: myAddress })
+ const { data: totalStake, loading: loadingTotalStake } = useFetchTotalStake(myAddress)
+ const { data: rewardReport, loading: loadingRewardReport } = useFetchUserRewardReport(myAddress)
+
+ const amp = state.amp
+ const hasProfile = !!entity
+ const hasCreatorRewards = BigInt(rewardReport?.creatorReward ?? '0') > 0
+ const sentInitRef = useRef(false)
+ const isLoading = loadingProfile || loadingTotalStake || loadingRewardReport
+ useEffect(() => {
+ if (isLoading || sentInitRef.current) return
+ sentInitRef.current = true
+ if (!myAddress) {
+ state.sendEvent('app_launched')
+ return
+ }
+ state.sendEvent('app_launched', undefined, {
+ hasProfile,
+ stakeAmountRange: getAmountRange(totalStake?.amount),
+ device_id: amp?.getDeviceId(),
+ hasCreatorRewards,
+ })
+ }, [hasProfile, isLoading, hasCreatorRewards, amp])
+
+ return null
+}
diff --git a/src/rtk/app/hooksCommon.ts b/src/rtk/app/hooksCommon.ts
index 246ba1f46..d0255c063 100644
--- a/src/rtk/app/hooksCommon.ts
+++ b/src/rtk/app/hooksCommon.ts
@@ -58,11 +58,15 @@ export function useFetchWithoutApi(
const isEnabled = !!enabled
useEffect(() => {
- if (!isEnabled) return
+ if (!isEnabled) {
+ setLoading(false)
+ return
+ }
let isMounted = true
setError(undefined)
+ setLoading(true)
dispatch(fetch(args))
.catch(err => {
if (isMounted) {
diff --git a/src/rtk/app/rootReducer.ts b/src/rtk/app/rootReducer.ts
index a9d1d2ab3..369db87e5 100644
--- a/src/rtk/app/rootReducer.ts
+++ b/src/rtk/app/rootReducer.ts
@@ -1,6 +1,11 @@
import { combineReducers } from '@reduxjs/toolkit'
import myAccount from '../features/accounts/myAccountSlice'
import spaceEditors from '../features/accounts/spaceEditorsSlice'
+import addressLikeCount from '../features/activeStaking/addressLikeCountSlice'
+import canPostSuperLiked from '../features/activeStaking/canPostSuperLikedSlice'
+import rewardHistory from '../features/activeStaking/rewardHistorySlice'
+import rewardReport from '../features/activeStaking/rewardReportSlice'
+import superLikeCounts from '../features/activeStaking/superLikeCountsSlice'
import chainsInfo from '../features/chainsInfo/chainsInfoSlice'
import chat from '../features/chat/chatSlice'
import enableConfirmation from '../features/confirmationPopup/enableConfirmationSlice'
@@ -55,6 +60,11 @@ const rootReducer = combineReducers({
stakes,
totalStake,
creatorsList,
+ superLikeCounts,
+ addressLikeCount,
+ rewardReport,
+ rewardHistory,
+ canPostSuperLiked,
})
export type RootState = ReturnType
diff --git a/src/rtk/app/wrappers.ts b/src/rtk/app/wrappers.ts
index 6fcb76ec8..32cd049fa 100644
--- a/src/rtk/app/wrappers.ts
+++ b/src/rtk/app/wrappers.ts
@@ -198,7 +198,7 @@ export function createSimpleFetchWrapper({
sliceName: string
getCachedData: (state: RootState, args: Args) => ReturnValue | undefined
saveToCacheAction: (data: ReturnValue) => any
- fetchData: (args: Args) => Promise
+ fetchData: (args: Args, state: RootState) => Promise
shouldFetchCondition?: (cachedData: ReturnValue | undefined) => boolean
}) {
const currentlyFetchingMap = new Map>()
@@ -207,19 +207,21 @@ export function createSimpleFetchWrapper({
async (allArgs, { getState, dispatch }): Promise => {
const { reload, ...args } = allArgs
const id = JSON.stringify(sortKeysRecursive(args))
+
+ const alreadyFetchedPromise = currentlyFetchingMap.get(id)
+ if (alreadyFetchedPromise && !reload) return alreadyFetchedPromise
+
if (!reload) {
const fetchedData = getCachedData(getState(), allArgs)
if (fetchedData && !shouldFetchCondition?.(fetchedData)) return fetchedData
}
- const alreadyFetchedPromise = currentlyFetchingMap.get(id)
- if (alreadyFetchedPromise) return alreadyFetchedPromise
- const promise = fetchData(allArgs)
+ const promise = fetchData(allArgs, getState())
currentlyFetchingMap.set(id, promise)
const res = await promise
- currentlyFetchingMap.delete(id)
await dispatch(saveToCacheAction(res))
+ currentlyFetchingMap.delete(id)
return promise
},
diff --git a/src/rtk/features/activeStaking/addressLikeCountSlice.ts b/src/rtk/features/activeStaking/addressLikeCountSlice.ts
new file mode 100644
index 000000000..c610ccc40
--- /dev/null
+++ b/src/rtk/features/activeStaking/addressLikeCountSlice.ts
@@ -0,0 +1,86 @@
+import { createEntityAdapter, createSlice } from '@reduxjs/toolkit'
+import { getAddressLikeCountToPosts } from 'src/components/utils/datahub/super-likes'
+import { RootState } from 'src/rtk/app/rootReducer'
+import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers'
+
+export type AddressLikeCount = {
+ address: string
+ postId: string
+ count: number
+}
+
+const sliceName = 'addressLikeCount'
+
+export function getAddressLikeCountId({
+ address,
+ postId,
+}: Pick) {
+ return `${address}-${postId}`
+}
+const adapter = createEntityAdapter({
+ selectId: data => getAddressLikeCountId(data),
+})
+const selectors = adapter.getSelectors(state => state.addressLikeCount)
+
+export const selectAddressLikeCount = selectors.selectById
+export const selectAllAddressLikeCounts = selectors.selectEntities
+
+function getAllPostIdsFromStore(state: RootState) {
+ return state.posts.ids as string[]
+}
+export const fetchAddressLikeCounts = createSimpleFetchWrapper<
+ { postIds: string[] | null; address: string },
+ AddressLikeCount[]
+>({
+ fetchData: async function ({ postIds, address }, state) {
+ if (postIds === null) {
+ postIds = getAllPostIdsFromStore(state)
+ }
+ const entities = selectAllAddressLikeCounts(state)
+ const newIds = postIds.filter(postId => {
+ const id = getAddressLikeCountId({ address, postId })
+ return !entities[id]
+ })
+ if (!newIds.length) return []
+ return await getAddressLikeCountToPosts(address, postIds)
+ },
+ saveToCacheAction: data => slice.actions.setAddressLikeCounts(data),
+ getCachedData: (state, { postIds, address }) => {
+ if (postIds === null) {
+ postIds = getAllPostIdsFromStore(state)
+ }
+
+ const entities = selectAllAddressLikeCounts(state)
+ let isEveryDataCached = true
+
+ const postEntities: AddressLikeCount[] = []
+ for (let i = 0; i < postIds.length; i++) {
+ const id = getAddressLikeCountId({ address, postId: postIds[i] })
+ if (!entities[id]) {
+ isEveryDataCached = false
+ break
+ } else {
+ postEntities.push(entities[id]!)
+ }
+ }
+
+ if (isEveryDataCached) {
+ return postEntities
+ }
+ return undefined
+ },
+ sliceName,
+})
+
+const slice = createSlice({
+ name: sliceName,
+ initialState: adapter.getInitialState(),
+ reducers: {
+ setAddressLikeCount: adapter.upsertOne,
+ setAddressLikeCounts: adapter.upsertMany,
+ },
+})
+
+export const { setAddressLikeCount } = slice.actions
+
+export default slice.reducer
diff --git a/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts b/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts
new file mode 100644
index 000000000..9d3ef8562
--- /dev/null
+++ b/src/rtk/features/activeStaking/canPostSuperLikedSlice.ts
@@ -0,0 +1,60 @@
+import { createEntityAdapter, createSlice } from '@reduxjs/toolkit'
+import { getCanPostsSuperLiked } from 'src/components/utils/datahub/super-likes'
+import { RootState } from 'src/rtk/app/rootReducer'
+import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers'
+
+export type CanPostSuperLiked = {
+ postId: string
+ canPostSuperLiked: boolean
+}
+
+const sliceName = 'canPostSuperLiked'
+
+const adapter = createEntityAdapter({
+ selectId: data => data.postId,
+})
+const selectors = adapter.getSelectors(state => state.canPostSuperLiked)
+
+export const selectCanPostSuperLiked = selectors.selectById
+export const selectAllCanPostSuperLiked = selectors.selectEntities
+
+export const fetchCanPostsSuperLiked = createSimpleFetchWrapper<
+ { postIds: string[] },
+ CanPostSuperLiked[]
+>({
+ fetchData: async function ({ postIds }) {
+ return await getCanPostsSuperLiked(postIds)
+ },
+ saveToCacheAction: data => slice.actions.setCanPostsSuperLiked(data),
+ getCachedData: (state, { postIds }) => {
+ const entities = selectAllCanPostSuperLiked(state)
+ let isEveryDataCached = true
+
+ const queriedEntities: CanPostSuperLiked[] = []
+ for (let i = 0; i < postIds.length; i++) {
+ const postId = postIds[i]
+ if (!entities[postId]) {
+ isEveryDataCached = false
+ break
+ } else {
+ queriedEntities.push(entities[postId]!)
+ }
+ }
+
+ if (isEveryDataCached) {
+ return queriedEntities
+ }
+ return undefined
+ },
+ sliceName,
+})
+
+const slice = createSlice({
+ name: sliceName,
+ initialState: adapter.getInitialState(),
+ reducers: {
+ setCanPostsSuperLiked: adapter.upsertMany,
+ },
+})
+
+export default slice.reducer
diff --git a/src/rtk/features/activeStaking/hooks.ts b/src/rtk/features/activeStaking/hooks.ts
new file mode 100644
index 000000000..1f2a8c4a4
--- /dev/null
+++ b/src/rtk/features/activeStaking/hooks.ts
@@ -0,0 +1,77 @@
+import { useMyAddress } from 'src/components/auth/MyAccountsContext'
+import { useFetchWithoutApi } from 'src/rtk/app/hooksCommon'
+import { useAppSelector } from 'src/rtk/app/store'
+import {
+ fetchAddressLikeCounts,
+ getAddressLikeCountId,
+ selectAddressLikeCount,
+} from './addressLikeCountSlice'
+import { selectCanPostSuperLiked } from './canPostSuperLikedSlice'
+import { fetchRewardHistory, selectUserRewardHistory } from './rewardHistorySlice'
+import { fetchRewardReport, selectUserRewardReport } from './rewardReportSlice'
+import { selectPostSuperLikeCount } from './superLikeCountsSlice'
+
+export function useSuperLikeCount(postId: string) {
+ return useAppSelector(state => selectPostSuperLikeCount(state, postId)?.count ?? 0)
+}
+
+export const useFetchMySuperLikesByPostIds = (postIds: string[]) => {
+ const myAddress = useMyAddress()
+ return useFetchWithoutApi(
+ fetchAddressLikeCounts,
+ { postIds, address: myAddress ?? '' },
+ { enabled: !!myAddress && postIds.length > 0 },
+ )
+}
+
+export function useHasISuperLikedPost(postId: string) {
+ const myAddress = useMyAddress() ?? ''
+ return useAppSelector(state => {
+ const entity = selectAddressLikeCount(
+ state,
+ getAddressLikeCountId({ address: myAddress, postId }),
+ )
+ return (entity?.count ?? 0) > 0
+ })
+}
+
+export function useCanPostSuperLiked(postId: string) {
+ return useAppSelector(state => {
+ return selectCanPostSuperLiked(state, postId)?.canPostSuperLiked ?? false
+ })
+}
+
+export function useFetchUserRewardReport(address?: string) {
+ const myAddress = useMyAddress()
+ const usedAddress = address || myAddress || ''
+
+ const data = useAppSelector(state => selectUserRewardReport(state, usedAddress))
+ const fetchData = useFetchWithoutApi(
+ fetchRewardReport,
+ { address: usedAddress },
+ { enabled: !!usedAddress },
+ )
+
+ return {
+ ...fetchData,
+ data,
+ }
+}
+
+export function useFetchUserRewardHistory(address?: string, config?: { enabled?: boolean }) {
+ const { enabled } = config || {}
+ const myAddress = useMyAddress()
+ const usedAddress = address || myAddress || ''
+
+ const data = useAppSelector(state => selectUserRewardHistory(state, usedAddress))
+ const fetchData = useFetchWithoutApi(
+ fetchRewardHistory,
+ { address: usedAddress },
+ { enabled: !!usedAddress && enabled !== false },
+ )
+
+ return {
+ ...fetchData,
+ data,
+ }
+}
diff --git a/src/rtk/features/activeStaking/rewardHistorySlice.ts b/src/rtk/features/activeStaking/rewardHistorySlice.ts
new file mode 100644
index 000000000..d24a132f2
--- /dev/null
+++ b/src/rtk/features/activeStaking/rewardHistorySlice.ts
@@ -0,0 +1,42 @@
+import { createEntityAdapter, createSlice } from '@reduxjs/toolkit'
+import { getRewardHistory } from 'src/components/utils/datahub/super-likes'
+import { RootState } from 'src/rtk/app/rootReducer'
+import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers'
+
+export type RewardHistory = {
+ address: string
+ rewards: {
+ week: number
+ startDate: string
+ endDate: string
+ reward: string
+ }[]
+}
+
+const sliceName = 'rewardHistory'
+
+const adapter = createEntityAdapter({
+ selectId: data => data.address,
+})
+const selectors = adapter.getSelectors(state => state.rewardHistory)
+
+export const selectUserRewardHistory = selectors.selectById
+
+export const fetchRewardHistory = createSimpleFetchWrapper<{ address: string }, RewardHistory>({
+ fetchData: async function ({ address }) {
+ return await getRewardHistory(address)
+ },
+ saveToCacheAction: data => slice.actions.setRewardHistory(data),
+ getCachedData: (state, { address }) => selectUserRewardHistory(state, address),
+ sliceName,
+})
+
+const slice = createSlice({
+ name: sliceName,
+ initialState: adapter.getInitialState(),
+ reducers: {
+ setRewardHistory: adapter.upsertOne,
+ },
+})
+
+export default slice.reducer
diff --git a/src/rtk/features/activeStaking/rewardReportSlice.ts b/src/rtk/features/activeStaking/rewardReportSlice.ts
new file mode 100644
index 000000000..5a6b775a6
--- /dev/null
+++ b/src/rtk/features/activeStaking/rewardReportSlice.ts
@@ -0,0 +1,71 @@
+import { createEntityAdapter, createSlice, PayloadAction } from '@reduxjs/toolkit'
+import { getRewardReport } from 'src/components/utils/datahub/super-likes'
+import { CREATORS_CONSTANTS } from 'src/config/constants'
+import { RootState } from 'src/rtk/app/rootReducer'
+import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers'
+
+export type RewardReport = {
+ superLikesCount: number
+ currentRewardAmount: string
+ weeklyReward: string
+
+ creatorReward: string
+ receivedLikes: number
+
+ address: string
+}
+
+const sliceName = 'rewardReport'
+
+const adapter = createEntityAdapter({
+ selectId: data => data.address,
+})
+const selectors = adapter.getSelectors(state => state.rewardReport)
+
+export const selectUserRewardReport = selectors.selectById
+
+export const fetchRewardReport = createSimpleFetchWrapper<{ address: string }, RewardReport>({
+ fetchData: async function ({ address }) {
+ return await getRewardReport(address)
+ },
+ saveToCacheAction: data => slice.actions.setRewardReport(data),
+ getCachedData: (state, { address }) => selectUserRewardReport(state, address),
+ sliceName,
+})
+
+const slice = createSlice({
+ name: sliceName,
+ initialState: adapter.getInitialState(),
+ reducers: {
+ setOptimisticRewardReportChange: (
+ state,
+ { payload }: PayloadAction<{ address: string; superLikeCountChange: 1 | -1 }>,
+ ) => {
+ const { address, superLikeCountChange } = payload
+ const rewardReport = state.entities[address]
+ if (!rewardReport) return
+
+ const newSuperLike = rewardReport.superLikesCount + superLikeCountChange
+ if (rewardReport.superLikesCount > 0) {
+ const rewardMultiplier = BigInt(
+ Math.min(newSuperLike, CREATORS_CONSTANTS.SUPER_LIKES_FOR_MAX_REWARD),
+ )
+
+ const rewardPerLike = BigInt(rewardReport.currentRewardAmount) / rewardMultiplier
+ const weeklyWithoutCurrentReward =
+ BigInt(rewardReport.weeklyReward) - BigInt(rewardReport.currentRewardAmount)
+
+ rewardReport.currentRewardAmount = (rewardMultiplier * rewardPerLike).toString()
+ rewardReport.weeklyReward = (
+ weeklyWithoutCurrentReward + BigInt(rewardReport.currentRewardAmount)
+ ).toString()
+ }
+ rewardReport.superLikesCount = newSuperLike
+ },
+ setRewardReport: adapter.upsertOne,
+ },
+})
+
+export const { setOptimisticRewardReportChange } = slice.actions
+
+export default slice.reducer
diff --git a/src/rtk/features/activeStaking/superLikeCountsSlice.ts b/src/rtk/features/activeStaking/superLikeCountsSlice.ts
new file mode 100644
index 000000000..8d564d368
--- /dev/null
+++ b/src/rtk/features/activeStaking/superLikeCountsSlice.ts
@@ -0,0 +1,63 @@
+import { createEntityAdapter, createSlice } from '@reduxjs/toolkit'
+import { getSuperLikeCounts } from 'src/components/utils/datahub/super-likes'
+import { RootState } from 'src/rtk/app/rootReducer'
+import { createSimpleFetchWrapper } from 'src/rtk/app/wrappers'
+
+export type SuperLikeCount = {
+ postId: string
+ count: number
+}
+
+const sliceName = 'superLikesCounts'
+
+const adapter = createEntityAdapter({
+ selectId: data => data.postId,
+})
+const selectors = adapter.getSelectors(state => state.superLikeCounts)
+
+export const selectPostSuperLikeCount = selectors.selectById
+export const selectPostSuperLikeCounts = selectors.selectEntities
+
+export const fetchSuperLikeCounts = createSimpleFetchWrapper<
+ { postIds: string[] },
+ SuperLikeCount[]
+>({
+ fetchData: async function ({ postIds }) {
+ return await getSuperLikeCounts(postIds)
+ },
+ saveToCacheAction: data => slice.actions.setSuperLikeCounts(data),
+ getCachedData: (state, { postIds }) => {
+ const entities = selectPostSuperLikeCounts(state)
+ let isEveryDataCached = true
+
+ const postEntities: SuperLikeCount[] = []
+ for (let i = 0; i < postIds.length; i++) {
+ const postId = postIds[i]
+ if (!entities[postId]) {
+ isEveryDataCached = false
+ break
+ } else {
+ postEntities.push(entities[postId]!)
+ }
+ }
+
+ if (isEveryDataCached) {
+ return postEntities
+ }
+ return undefined
+ },
+ sliceName,
+})
+
+const slice = createSlice({
+ name: sliceName,
+ initialState: adapter.getInitialState(),
+ reducers: {
+ setSuperLikeCount: adapter.upsertOne,
+ setSuperLikeCounts: adapter.upsertMany,
+ },
+})
+
+export const { setSuperLikeCount } = slice.actions
+
+export default slice.reducer
diff --git a/src/rtk/features/posts/postsSlice.ts b/src/rtk/features/posts/postsSlice.ts
index 0fea53f5c..922b0e364 100644
--- a/src/rtk/features/posts/postsSlice.ts
+++ b/src/rtk/features/posts/postsSlice.ts
@@ -40,6 +40,9 @@ import {
SpaceData,
SpaceStruct,
} from 'src/types'
+import { fetchAddressLikeCounts } from '../activeStaking/addressLikeCountSlice'
+import { fetchCanPostsSuperLiked } from '../activeStaking/canPostSuperLikedSlice'
+import { fetchSuperLikeCounts } from '../activeStaking/superLikeCountsSlice'
import { Content, fetchContents, selectPostContentById } from '../contents/contentsSlice'
import { fetchProfileSpaces } from '../profiles/profilesSlice'
import { fetchMyReactionsByPostIds } from '../reactions/myPostReactionsSlice'
@@ -241,6 +244,7 @@ export const fetchPosts = createAsyncThunk[] = []
+
if (withOwner) {
const ids = getUniqueOwnerIds(entities)
const prefetchedData = generatePrefetchData(
@@ -334,6 +338,11 @@ export const fetchPosts = createAsyncThunk {
}
/** Select two lists of space ids: that I own, I gave any role */
-export const useSelectSpaceIdsWhereAccountCanPost = (address?: AccountId) =>
- useAppSelector(state => {
+export const useSelectSpaceIdsWhereAccountCanPost = (address?: AccountId) => {
+ return useAppSelector(state => {
if (!address) return []
const ownSpaceIds = selectSpaceIdsByOwner(state, address) || []
const spaceIdsWithRolesByAccount = selectSpaceIdsWithRolesByAccount(state, address) || []
+ const ids = [...new Set([...ownSpaceIds, ...spaceIdsWithRolesByAccount])]
+ const spaces = selectSpaces(state, { ids })
+
+ const spacesMap = new Map()
+ spaces.forEach(space => spacesMap.set(space.id, space))
- return [...new Set([...ownSpaceIds, ...spaceIdsWithRolesByAccount])]
+ return ids.filter(id => {
+ const space = spacesMap.get(id)
+ return !space?.struct.hidden
+ })
}, shallowEqual)
+}
export const useSelectSpaceIdsWhereAccountCanPostWithLoadingStatus = (address?: AccountId) =>
useAppSelector(state => {
diff --git a/src/server/common.ts b/src/server/common.ts
new file mode 100644
index 000000000..14a3cc465
--- /dev/null
+++ b/src/server/common.ts
@@ -0,0 +1,94 @@
+import { Keyring } from '@polkadot/keyring'
+import { waitReady } from '@polkadot/wasm-crypto'
+import { NextApiRequest, NextApiResponse } from 'next'
+import { serverMnemonic } from 'src/config/env'
+import { z } from 'zod'
+
+export type ApiResponse = T & {
+ success: boolean
+ message: string
+ errors?: any
+}
+
+export function handlerWrapper(config: {
+ inputSchema: Input | null
+ dataGetter: (req: NextApiRequest) => unknown
+}) {
+ return