Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

feat(status): add global realtime visitors#1204

Merged
mydearxym merged 1 commit intodevfromrealtime-visitors
Nov 28, 2021
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -27,6 +27,7 @@ const NON_STANDARD_COMMUNITIES = [HCN, 'feedback']

type TProps = {
community: TCommunity
realtimeVisitors: number
descExpand: boolean
activeThread: TThread
layout: TC11NLayout
Expand All@@ -35,6 +36,7 @@ type TProps = {

const ClassicLayout: FC<TProps> = ({
community,
realtimeVisitors,
descExpand,
activeThread,
layout,
Expand DownExpand Up@@ -62,6 +64,7 @@ const ClassicLayout: FC<TProps> = ({
community={community}
onShowEditorList={onShowEditorList}
onShowSubscriberList={onShowSubscriberList}
realtimeVisitors={realtimeVisitors}
/>
</CommunityBaseInfo>
<TabBarWrapper>
Expand Down
2 changes: 2 additions & 0 deletionssrc/containers/digest/CommunityDigest/index.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -33,6 +33,7 @@ const CommunityDigestContainer: FC<TProps> = ({
accountInfo: {
customization: { bannerLayout },
},
realtimeVisitors,
curThread,
curCommunity,
descExpand,
Expand All@@ -41,6 +42,7 @@ const CommunityDigestContainer: FC<TProps> = ({
return (
<ClassicLayout
metric={metric}
realtimeVisitors={realtimeVisitors}
community={curCommunity}
activeThread={curThread}
layout={bannerLayout}
Expand Down
4 changes: 4 additions & 0 deletionssrc/containers/digest/CommunityDigest/store.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -34,6 +34,10 @@ const CommunityDigest = T.model('CommunityDigest', {
const root = getParent(self) as TRootStore
return toJS(root.viewing)
},
get realtimeVisitors(): number {
const root = getParent(self) as TRootStore
return root.footer.realtimeVisitors
},
get accountInfo(): TAccount {
const root = getParent(self) as TRootStore
return root.accountInfo
Expand Down
2 changes: 1 addition & 1 deletionsrc/containers/thread/ArticlesThread/logic.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -166,7 +166,7 @@ export const useInit = (_store: TStore): void =>
useEffect(() => {
store = _store
sub$ = sr71$.data().subscribe($solver(DataSolver, ErrSolver))
console.log('### see me client side?: ', store.isEmpty)

if (store.isEmpty) loadArticles()

return () => {
Expand Down
26 changes: 22 additions & 4 deletionssrc/containers/unit/Footer/logic.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,20 @@
import { useEffect } from 'react'

import type { TMetric } from '@/spec'
import { EVENT, PAYMENT_USAGE } from '@/constant'
import { EVENT } from '@/constant'

import asyncSuit from '@/utils/async'
import { send } from '@/utils/helper'
import { buildLog } from '@/utils/logger'
// import S from './schema'
import uid from '@/utils/uid'
import S from './schema'

import type { TStore } from './store'

/* eslint-disable-next-line */
const log = buildLog('L:Footer2')

const { SR71, $solver } = asyncSuit
const { SR71, $solver, asyncRes } = asyncSuit
const sr71$ = new SR71()

let sub$ = null
Expand All@@ -25,11 +26,27 @@ export const toggleSponsorHelper = (): void =>
export const onLogin = (): void => store.authWarning({ hideToast: true })
export const queryDoraemon = (data): void => send(EVENT.QUERY_DORAMON, { data })

const getOnlineStatus = (): void => {
sr71$.query(S.onlineStatus, { freshkey: uid.gen() })

setInterval(() => {
sr71$.query(S.onlineStatus, { freshkey: uid.gen() })
}, 10000)
}

// ###############################
// Data & Error handlers
// ###############################

const DataSolver = []
const DataSolver = [
{
match: asyncRes('onlineStatus'),
action: ({ onlineStatus }): void => {
const { realtimeVisitors } = onlineStatus
store.mark({ realtimeVisitors })
},
},
]
const ErrSolver = []

// ###############################
Expand All@@ -40,6 +57,7 @@ export const useInit = (_store: TStore, metric: TMetric): void => {
store = _store
store.mark({ metric })
sub$ = sr71$.data().subscribe($solver(DataSolver, ErrSolver))
getOnlineStatus()

return () => {
sub$.unsubscribe()
Expand Down
15 changes: 15 additions & 0 deletionssrc/containers/unit/Footer/schema.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
import { gql } from '@urql/core'

const onlineStatus = gql`
query ($freshkey: String) {
onlineStatus(freshkey: $freshkey) {
realtimeVisitors
}
}
`

const schema = {
onlineStatus,
}

export default schema
2 changes: 2 additions & 0 deletionssrc/containers/unit/Footer/store.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -14,6 +14,8 @@ import { markStates, toJS } from '@/utils/mobx'
const FooterStore = T.model('FooterStore', {
showSponsor: T.optional(T.boolean, false),
metric: T.optional(T.string, METRIC.COMMUNITY),
// online-status
realtimeVisitors: T.optional(T.number, 1),
})
.views((self) => ({
get isLogin(): boolean {
Expand Down
10 changes: 7 additions & 3 deletionssrc/widgets/CommunityStatesPad/NumberGroup.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,12 +2,14 @@ import { FC, memo } from 'react'

import { prettyNum } from '@/utils/helper'
import { buildLog } from '@/utils/logger'
import AnimatedCount from '@/widgets/AnimatedCount'

import {
Wrapper,
NumberItem,
LargeNumberItem,
SubNumberWrapper,
SubNum,
GreenDot,
PlusSign,
} from './styles/number_group'
Expand All@@ -32,7 +34,7 @@ const NumberGroup: FC<TProps> = ({
}) => {
return (
<Wrapper>
{subCount ? (
{subCount>= 0? (
<NumberItem readOnly={readOnly} onClick={onClick}>
{prettyNum(count)}
</NumberItem>
Expand All@@ -42,11 +44,13 @@ const NumberGroup: FC<TProps> = ({
</LargeNumberItem>
)}

{subCount && (
{subCount>= 0&& (
<SubNumberWrapper>
{subPrefix === 'online' && <GreenDot />}
{subPrefix === 'add' && <PlusSign>+</PlusSign>}
{subCount}
<SubNum>
<AnimatedCount count={subCount} size="tiny" />
</SubNum>
</SubNumberWrapper>
)}
</Wrapper>
Expand Down
42 changes: 30 additions & 12 deletionssrc/widgets/CommunityStatesPad/index.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -9,6 +9,8 @@ import { FC, memo } from 'react'
import type { TCommunity } from '@/spec'
import usePlatform from '@/hooks/usePlatform'
import { buildLog } from '@/utils/logger'
import { getRandomInt } from '@/utils/helper'
import Tooltip from '@/widgets/Tooltip'

import Charger from '@/widgets/Charger'

Expand All@@ -22,20 +24,23 @@ import {
ChargeSection,
NumberDivider,
NumberTitle,
PopHint,
} from './styles'

/* eslint-disable-next-line */
const log = buildLog('c:CommunityStatesPad:index')

type TProps = {
community: TCommunity
realtimeVisitors?: number
withoutFounding?: boolean
onShowEditorList?: () => void
onShowSubscriberList?: () => void
}

const CommunityStatesPad: FC<TProps> = ({
community,
realtimeVisitors = 1,
onShowEditorList = log,
onShowSubscriberList = log,
withoutFounding = true,
Expand All@@ -48,22 +53,35 @@ const CommunityStatesPad: FC<TProps> = ({
<Wrapper>
<NumberSection>
{!isMobile && <NumberTitle>成员</NumberTitle>}
<NumberGroup
count={subscribersCount}
subCount={12}
onClick={onShowSubscriberList}
subPrefix="online"
/>
<Tooltip
content={
<PopHint>
实时在线人数，后续会单独统计每个子社区的实时在线人数。
</PopHint>
}
placement="bottom"
>
<NumberGroup
count={subscribersCount}
subCount={realtimeVisitors}
onClick={onShowSubscriberList}
subPrefix="online"
/>
</Tooltip>
</NumberSection>
<NumberDivider />
<ContentSection>
<NumberTitle readOnly>内容</NumberTitle>
<NumberGroup
subPrefix="add"
count={contentsCount}
subCount={4}
readOnly
/>
<Tooltip
content={<PopHint>较前一天新增内容，功能开发中</PopHint>}
placement="bottom"
>
<NumberGroup
subPrefix="add"
count={contentsCount}
subCount={getRandomInt(1, 8)}
/>
</Tooltip>
</ContentSection>
<NumberDivider />
<VolunteerSection alignCenter={editorsCount < 99}>
Expand Down
4 changes: 4 additions & 0 deletionssrc/widgets/CommunityStatesPad/styles/index.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -54,3 +54,7 @@ export const NumberDivider = styled.div`
`};
${css.media.mobile`display: none`};
`

export const PopHint = styled.div`
width: 200px;
`
4 changes: 3 additions & 1 deletionsrc/widgets/CommunityStatesPad/styles/number_group.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,9 +11,11 @@ export const SubNumberWrapper = styled.div`
${css.flex('align-center')};
color: ${theme('banner.numberDesc')};
font-size: 13px;
margin-right: 0.5px;
margin-top: -1px;
`
export const SubNum = styled.div`
opacity: 0.6;
`
export const GreenDot = styled.div`
background: ${theme('baseColor.green')};
width: 5px;
Expand Down
[8]ページ先頭
©2009-2025 Movatter.jp