Active Staking

.github/workflows/build-deploy.yml

@@ -77,6 +77,11 @@ jobs:
             GH_CONNECTION_KIND=main
             GH_SELLER_CLIENT_ID=${{ secrets.SELLER_CLIENT_ID }}
             GH_SELLER_TOKEN_SIGNER=${{ secrets.SELLER_TOKEN_SIGNER }}
+            GH_SERVER_MNEMONIC=${{ secrets.SERVER_MNEMONIC }}
+            GH_NEXT_PUBLIC_DATAHUB_QUERY_URL=https://data-hub.subsocial.network/graphql
+            GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL=wss://data-hub.subsocial.network/graphql-ws
+            GH_DATAHUB_QUEUE_URL=https://queue-data-hub.subsocial.network/graphql
+            GH_DATAHUB_QUEUE_TOKEN=${{ secrets.DATAHUB_QUEUE_TOKEN }}
 
           tags: |
             ${{ env.image }}

.github/workflows/feature-based.yaml

@@ -67,6 +67,11 @@ jobs:
             GH_CONNECTION_KIND=dev
             GH_SELLER_CLIENT_ID=5DYm3Wk4aa1BbfhH1ajmY6MNEELXoicmKRnP4tzHYjSKnD9K
             GH_SELLER_TOKEN_SIGNER=retire strong pole intact cool music high path salt praise stadium spatial
+            GH_SERVER_MNEMONIC=plunge pumpkin penalty segment cattle more print below fat lemon clap uniform
+            GH_NEXT_PUBLIC_DATAHUB_QUERY_URL=https://super-likes-data-hub.subsocial.network/graphql
+            GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL=wss://super-likes-data-hub.subsocial.network/graphql-ws
+            GH_DATAHUB_QUEUE_URL=https://super-likes-queue-data-hub.subsocial.network/graphql
+            GH_DATAHUB_QUEUE_TOKEN=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhZG1pbiI6dHJ1ZX0.jpXwkIJ4DpV4IvSI3eWVVXE6x89qr_GIq7IlbBv5YE0
           tags: |
             ${{ env.image }}
           cache-from: type=local,src=/tmp/.buildx-cache

ci.env

@@ -9,3 +9,8 @@ NEXT_PUBLIC_OFFCHAIN_SIGNER_URL='$GH_OFFCHAIN_SIGNER_URL'
 NEXT_PUBLIC_AMP_ID='$GH_AMP_ID'
 SELLER_CLIENT_ID='$GH_SELLER_CLIENT_ID'
 SELLER_CLIENT_TOKEN_SIGNER='$GH_SELLER_TOKEN_SIGNER'
+NEXT_PUBLIC_DATAHUB_QUERY_URL='GH_NEXT_PUBLIC_DATAHUB_QUERY_URL'
+NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL='GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL'
+DATAHUB_QUEUE_URL='GH_DATAHUB_QUEUE_URL'
+DATAHUB_QUEUE_TOKEN='GH_DATAHUB_QUEUE_TOKEN'
+SERVER_MNEMONIC='GH_SERVER_MNEMONIC'

docker/Dockerfile

@@ -9,6 +9,11 @@ ARG GH_AMP_ID
 ARG GH_OFFCHAIN_SIGNER_URL
 ARG GH_SELLER_CLIENT_ID
 ARG GH_SELLER_TOKEN_SIGNER
+ARG GH_NEXT_PUBLIC_DATAHUB_QUERY_URL
+ARG GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL
+ARG GH_DATAHUB_QUEUE_URL
+ARG GH_DATAHUB_QUEUE_TOKEN
+ARG GH_SERVER_MNEMONIC
 
 ENV NEXT_PUBLIC_GA_ID=${GH_GA_ID} \
     NEXT_PUBLIC_APP_KIND=${GH_APP_KIND} \
@@ -18,7 +23,12 @@ ENV NEXT_PUBLIC_GA_ID=${GH_GA_ID} \
     NEXT_PUBLIC_OFFCHAIN_SIGNER_URL=${GH_OFFCHAIN_SIGNER_URL} \
     NEXT_PUBLIC_CONNECTION_KIND=${GH_CONNECTION_KIND} \
     SELLER_CLIENT_ID=${GH_SELLER_CLIENT_ID} \
-    SELLER_CLIENT_TOKEN_SIGNER=${GH_SELLER_TOKEN_SIGNER}
+    SELLER_CLIENT_TOKEN_SIGNER=${GH_SELLER_TOKEN_SIGNER} \
+    NEXT_PUBLIC_DATAHUB_QUERY_URL=${GH_NEXT_PUBLIC_DATAHUB_QUERY_URL} \
+    NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL=${GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL} \
+    DATAHUB_QUEUE_URL=${GH_DATAHUB_QUEUE_URL} \
+    DATAHUB_QUEUE_TOKEN=${GH_DATAHUB_QUEUE_TOKEN} \
+    SERVER_MNEMONIC=${GH_SERVER_MNEMONIC}
 
 COPY package.json yarn.lock* ./
 RUN yarn install --no-optional
@@ -42,6 +52,11 @@ ARG GH_AMP_ID
 ARG GH_OFFCHAIN_SIGNER_URL
 ARG GH_SELLER_CLIENT_ID
 ARG GH_SELLER_TOKEN_SIGNER
+ARG GH_NEXT_PUBLIC_DATAHUB_QUERY_URL
+ARG GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL
+ARG GH_DATAHUB_QUEUE_URL
+ARG GH_DATAHUB_QUEUE_TOKEN
+ARG GH_SERVER_MNEMONIC
 
 ENV NEXT_PUBLIC_GA_ID=${GH_GA_ID}  \
     NEXT_PUBLIC_APP_KIND=${GH_APP_KIND} \
@@ -50,7 +65,12 @@ ENV NEXT_PUBLIC_GA_ID=${GH_GA_ID}  \
     NEXT_PUBLIC_OFFCHAIN_SIGNER_URL=${GH_OFFCHAIN_SIGNER_URL} \
     NEXT_PUBLIC_CONNECTION_KIND=${GH_CONNECTION_KIND} \
     SELLER_CLIENT_ID=${GH_SELLER_CLIENT_ID} \
-    SELLER_CLIENT_TOKEN_SIGNER=${GH_SELLER_TOKEN_SIGNER}
+    SELLER_CLIENT_TOKEN_SIGNER=${GH_SELLER_TOKEN_SIGNER} \
+    NEXT_PUBLIC_DATAHUB_QUERY_URL=${GH_NEXT_PUBLIC_DATAHUB_QUERY_URL} \
+    NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL=${GH_NEXT_PUBLIC_DATAHUB_SUBSCRIPTION_URL} \
+    DATAHUB_QUEUE_URL=${GH_DATAHUB_QUEUE_URL} \
+    DATAHUB_QUEUE_TOKEN=${GH_DATAHUB_QUEUE_TOKEN} \
+    SERVER_MNEMONIC=${GH_SERVER_MNEMONIC}
 
 WORKDIR /opt/subsocial/app
 

package.json

@@ -56,7 +56,6 @@
     "@typescript-eslint/parser": "^5.45.0",
     "@welldone-software/why-did-you-render": "^6.2.1",
     "apollo": "^2.34.0",
-    "cypress": "^10.11.0",
     "cypress-network-idle": "^1.10.2",
     "cypress-wait-until": "^1.7.2",
     "eslint": "^8.46.0",
@@ -90,6 +89,7 @@
     "@polkadot/ui-keyring": "^2.9.8",
     "@reduxjs/toolkit": "^1.3.4",
     "@subsocial/api": "0.8.10",
+    "@subsocial/data-hub-sdk": "dappforce/subsocial-data-hub-sdk#staging",
     "@subsocial/definitions": "0.8.10",
     "@subsocial/elasticsearch": "0.8.10",
     "@subsocial/grill-widget": "^0.0.13",
@@ -122,7 +122,9 @@
     "graphql": "^15.5.0",
     "graphql-request": "^5.2.0",
     "graphql-tag": "^2.11.0",
+    "graphql-ws": "^5.14.3",
     "isbot": "^3.0.14",
+    "isomorphic-ws": "^5.0.0",
     "jdenticon": "^3.2.0",
     "jwt-decode": "^3.1.2",
     "localforage": "^1.7.4",
@@ -146,7 +148,7 @@
     "react-embed": "^3.6.0",
     "react-ga": "^3.3.0",
     "react-hook-form": "~5.6.0",
-    "react-icons": "^4.4.0",
+    "react-icons": "^4.12.0",
     "react-infinite-scroll-component": "^6.1.0",
     "react-lite-youtube-embed": "^2.4.0",
     "react-markdown": "6.0.3",
@@ -160,6 +162,7 @@
     "store": "^2.0.12",
     "strip-markdown": "^4.0.0",
     "url-loader": "^4.1.1",
-    "yup": "^0.32.9"
+    "yup": "^0.32.9",
+    "zod": "^3.22.4"
   }
 }

src/components/auth/MyAccountsContext.tsx

@@ -24,6 +24,7 @@ import {
   signOut,
   unsetMyEmailAddress,
 } from 'src/rtk/features/accounts/myAccountSlice'
+import { fetchAddressLikeCounts } from 'src/rtk/features/activeStaking/addressLikeCountSlice'
 import { fetchChainsInfo } from 'src/rtk/features/chainsInfo/chainsInfoSlice'
 import { fetchProfileSpace } from 'src/rtk/features/profiles/profilesSlice'
 import { fetchEntityOfSpaceIdsByFollower } from 'src/rtk/features/spaceIds/followedSpaceIdsSlice'
@@ -148,6 +149,7 @@ export function MyAccountsProvider(props: React.PropsWithChildren<{}>) {
           dispatch(fetchProfileSpace({ id: address, api: subsocial })),
           dispatch(fetchEntityOfSpaceIdsByFollower({ id: address, reload: true, api: subsocial })),
           dispatch(fetchChainsInfo({})),
+          dispatch(fetchAddressLikeCounts({ address, postIds: null })),
         ])
 
         unsubAccountInfo = await readyApi.query.system.account(

src/components/auth/WalletButton.tsx

@@ -1,4 +1,6 @@
-import { AvatarOrSkeleton } from '../utils'
+import Link from 'next/link'
+import { hasInjectedWallet } from 'src/utils/window'
+import { AvatarOrSkeleton, isClientSide } from '../utils'
 import { StepsEnum } from './AuthContext'
 import styles from './WalletButton.module.sass'
 
@@ -11,6 +13,27 @@ const WalletButton = ({ setCurrentStep }: Props) => {
     setCurrentStep(StepsEnum.SelectAccount)
   }
 
+  const isInMobileWalletBrowser = isClientSide() && hasInjectedWallet()
+  if (!isInMobileWalletBrowser) {
+    return (
+      <Link passHref href='https://novawallet.io/'>
+        <a className={styles.WalletButton} target='_blank'>
+          <div className='d-flex align-items-center'>
+            <AvatarOrSkeleton
+              externalIcon
+              icon={'/images/wallets/nova-wallet.jpeg'}
+              size={'default'}
+              className='mr-2 align-items-start'
+            />
+            <div className='font-weight-bold pl-1' style={{ color: 'black' }}>
+              Install Nova Wallet
+            </div>
+          </div>
+        </a>
+      </Link>
+    )
+  }
+
   return (
     <div className={styles.WalletButton} onClick={() => handleClick()}>
       <div className='d-flex align-items-center'>

src/components/auth/signIn/SignInModal.tsx

@@ -1,22 +1,23 @@
-import React, { useState } from 'react'
-import LoadingTransaction from 'src/components/utils/LoadingTransaction'
-import WalletButton from '../WalletButton'
-
 import { ArrowLeftOutlined } from '@ant-design/icons'
 import { Button } from 'antd'
 import Modal from 'antd/lib/modal'
 import clsx from 'clsx'
+import React, { useState } from 'react'
 import { useResponsiveSize } from 'src/components/responsive'
+import LoadingTransaction from 'src/components/utils/LoadingTransaction'
 import { setCurrentEmailAddress } from 'src/components/utils/OffchainSigner/ExternalStorage'
 import config from 'src/config'
+import { isMobileDevice } from 'src/config/Size.config'
 import { EmailAccount } from 'src/types'
+import { hasInjectedWallet } from 'src/utils/window'
 import { AccountSelector } from '../../profile-selector/AccountSelector'
 import ExternalLink from '../../spaces/helpers/ExternalLink'
 import { MutedDiv } from '../../utils/MutedText'
 import PrivacyPolicyLinks from '../../utils/PrivacyPolicyLinks'
 import WalletList from '../../wallets/wallet-list/WalletsList'
 import { CompletedSteps, StepsEnum, useAuth } from '../AuthContext'
 import { useMyAccountsContext } from '../MyAccountsContext'
+import WalletButton from '../WalletButton'
 import ConfirmationModalContent from './email/ConfirmationModalContent'
 import ShowMnemonicModalContent from './email/ShowMnemonicModalContent'
 import SignInEmailButton from './email/SignInEmailButton'
@@ -186,22 +187,36 @@ const ModalContent = ({
 
   const dividerText = isMobile ? 'Or' : 'Or connect wallet'
 
+  const isMobileDeviceAndWidth = isMobileDevice && isMobile
+
   switch (currentStep) {
     case StepsEnum.SelectWallet: {
       return (
         <div>
           <ModalBodyWrapper
             title='Sign In'
-            desc={
-              <>
-                Choose one of the available wallet providers to connect to {config.appName}, or sign
-                in with your email address.{' '}
-                <ExternalLink
-                  url='https://docs.subsocial.network/docs/tutorials/#polkadotjs'
-                  value='How do I set up a wallet?'
-                />
-              </>
-            }
+            desc={(() => {
+              if (isMobileDeviceAndWidth) {
+                if (hasInjectedWallet()) {
+                  return <>To use Polkaverse, you need to connect your wallet</>
+                }
+                return (
+                  <>
+                    To use PolkaVerse, you need a wallet to manage your account. We recommend Nova
+                    Wallet.
+                  </>
+                )
+              }
+              return (
+                <>
+                  Choose one of the available wallet providers to connect to {config.appName}.{' '}
+                  <ExternalLink
+                    url='https://docs.subsocial.network/docs/tutorials/#polkadotjs'
+                    value='How do I set up a wallet?'
+                  />
+                </>
+              )
+            })()}
           >
             {config.enableConfirmationLessMode ? (
               <>

src/components/common/balances/Balance.tsx

@@ -25,10 +25,15 @@ function format(
   decimals: number,
   withSi?: boolean,
   _isShort?: boolean,
+  precision?: number,
+  withMutedDecimals = true,
 ): React.ReactNode {
-  const [prefix, postfix] = formatBalance(value, { forceUnit: '-', decimals, withSi: false }).split(
-    '.',
-  )
+  const [prefix, postfix] = formatBalance(value, {
+    forceUnit: '-',
+    decimals,
+    withSi: false,
+    withZero: true,
+  }).split('.')
   const isShort = _isShort || (withSi && prefix.length >= K_LENGTH)
 
   if (prefix.length > M_LENGTH) {
@@ -45,7 +50,12 @@ function format(
       {prefix}
       {!isShort && (
         <>
-          .<span className='DfBalanceDecimals'>{postfix || '0000'}</span>
+          .
+          <span className={clsx(withMutedDecimals && 'DfBalanceDecimals')}>
+            {precision
+              ? parseFloat(`0.${postfix}`).toPrecision(precision).substring(2)
+              : postfix || '0000'}
+          </span>
         </>
       )}
       &nbsp;{currency}
@@ -58,6 +68,8 @@ type FormatBalanceProps = BareProps & {
   decimals?: number
   currency?: string
   isShort?: boolean
+  precision?: number
+  withMutedDecimals?: boolean
 }
 
 export const FormatBalance = ({
@@ -66,6 +78,8 @@ export const FormatBalance = ({
   currency,
   isShort,
   className,
+  precision,
+  withMutedDecimals = true,
   ...bareProps
 }: FormatBalanceProps) => {
   if (!value) return null
@@ -78,6 +92,8 @@ export const FormatBalance = ({
     decimals || defaultDecimal,
     true,
     isShort,
+    precision,
+    withMutedDecimals,
   )
 
   return (