|
|
@ -1,10 +1,13 @@
|
|
|
|
import React from 'react';
|
|
|
|
import React, { useMemo } from 'react';
|
|
|
|
import styled from 'styled-components';
|
|
|
|
import styled from 'styled-components';
|
|
|
|
import {
|
|
|
|
import {
|
|
|
|
postRequest,
|
|
|
|
postRequest,
|
|
|
|
useAsync,
|
|
|
|
useAsync,
|
|
|
|
useAsyncRequest,
|
|
|
|
useAsyncRequest,
|
|
|
|
getTextColorHex,
|
|
|
|
getTextColorHex,
|
|
|
|
|
|
|
|
getGlobalState,
|
|
|
|
|
|
|
|
useNavigate,
|
|
|
|
|
|
|
|
useEvent,
|
|
|
|
} from '@capital/common';
|
|
|
|
} from '@capital/common';
|
|
|
|
import { Avatar, Skeleton, Button } from '@capital/component';
|
|
|
|
import { Avatar, Skeleton, Button } from '@capital/component';
|
|
|
|
import { Translate } from '../translate';
|
|
|
|
import { Translate } from '../translate';
|
|
|
@ -85,6 +88,7 @@ interface DiscoverServerCardProps {
|
|
|
|
|
|
|
|
|
|
|
|
export const DiscoverServerCard: React.FC<DiscoverServerCardProps> = React.memo(
|
|
|
|
export const DiscoverServerCard: React.FC<DiscoverServerCardProps> = React.memo(
|
|
|
|
(props) => {
|
|
|
|
(props) => {
|
|
|
|
|
|
|
|
const navigate = useNavigate();
|
|
|
|
const { value: groupBasicInfo } = useAsync(async () => {
|
|
|
|
const { value: groupBasicInfo } = useAsync(async () => {
|
|
|
|
const { data } = await postRequest('/group/getGroupBasicInfo', {
|
|
|
|
const { data } = await postRequest('/group/getGroupBasicInfo', {
|
|
|
|
groupId: props.groupId,
|
|
|
|
groupId: props.groupId,
|
|
|
@ -99,6 +103,21 @@ export const DiscoverServerCard: React.FC<DiscoverServerCardProps> = React.memo(
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}, [props.groupId]);
|
|
|
|
}, [props.groupId]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleJumpTo = useEvent(() => {
|
|
|
|
|
|
|
|
navigate(`/main/group/${props.groupId}`);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const isJoined = useMemo(() => {
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
return Object.keys(getGlobalState().group.groups).includes(
|
|
|
|
|
|
|
|
props.groupId
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
} catch (err) {
|
|
|
|
|
|
|
|
console.error(err);
|
|
|
|
|
|
|
|
return false;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}, [props.groupId]);
|
|
|
|
|
|
|
|
|
|
|
|
if (!groupBasicInfo) {
|
|
|
|
if (!groupBasicInfo) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Root>
|
|
|
|
<Root>
|
|
|
@ -142,6 +161,17 @@ export const DiscoverServerCard: React.FC<DiscoverServerCardProps> = React.memo(
|
|
|
|
groupBasicInfo.memberCount
|
|
|
|
groupBasicInfo.memberCount
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{isJoined ? (
|
|
|
|
|
|
|
|
<Button
|
|
|
|
|
|
|
|
size="small"
|
|
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
|
|
loading={joinLoading}
|
|
|
|
|
|
|
|
onClick={handleJumpTo}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
{Translate.joined}
|
|
|
|
|
|
|
|
</Button>
|
|
|
|
|
|
|
|
) : (
|
|
|
|
<Button
|
|
|
|
<Button
|
|
|
|
size="small"
|
|
|
|
size="small"
|
|
|
|
type="primary"
|
|
|
|
type="primary"
|
|
|
@ -150,6 +180,7 @@ export const DiscoverServerCard: React.FC<DiscoverServerCardProps> = React.memo(
|
|
|
|
>
|
|
|
|
>
|
|
|
|
{Translate.join}
|
|
|
|
{Translate.join}
|
|
|
|
</Button>
|
|
|
|
</Button>
|
|
|
|
|
|
|
|
)}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</Root>
|
|
|
|
</Root>
|
|
|
|
);
|
|
|
|
);
|
|
|
|