feat: 添加邀请链接
This commit is contained in:
parent
db6db2ed36
commit
016f948610
|
|
@ -74,6 +74,7 @@ const Menu: React.FC<NavProps> = ({
|
|||
links,
|
||||
profile,
|
||||
children,
|
||||
inviteUrl,
|
||||
}) => {
|
||||
const { isXl } = useMatchBreakpoints();
|
||||
const isMobile = isXl === false;
|
||||
|
|
@ -124,7 +125,7 @@ const Menu: React.FC<NavProps> = ({
|
|||
/>
|
||||
{!!login && !!logout && (
|
||||
<Flex>
|
||||
<UserBlock account={account} login={login} logout={logout} />
|
||||
<UserBlock account={account} inviteUrl={inviteUrl} login={login} logout={logout} />
|
||||
{profile && <Avatar profile={profile} />}
|
||||
</Flex>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,21 @@
|
|||
import React from "react";
|
||||
import Text from "../../../components/Text/Text";
|
||||
import { Modal } from "../../Modal";
|
||||
import { CopyToClipboard } from "../../WalletModal";
|
||||
|
||||
interface Props {
|
||||
inviteUrl: string;
|
||||
onDismiss?: () => void;
|
||||
}
|
||||
|
||||
const InviteModal: React.FC<Props> = ({ inviteUrl, onDismiss }) => (
|
||||
<Modal title="Invite" onDismiss={onDismiss}>
|
||||
<CopyToClipboard toCopy={inviteUrl}>
|
||||
<Text fontSize="20px" bold style={{ whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" }}>
|
||||
{inviteUrl}
|
||||
</Text>
|
||||
</CopyToClipboard>
|
||||
</Modal>
|
||||
);
|
||||
|
||||
export default InviteModal;
|
||||
|
|
@ -1,19 +1,32 @@
|
|||
import React from "react";
|
||||
import Button from "../../../components/Button/Button";
|
||||
import { useModal } from "../../Modal";
|
||||
import InviteModal from "./InviteModal";
|
||||
import { useWalletModal } from "../../WalletModal";
|
||||
import { Login } from "../../WalletModal/types";
|
||||
|
||||
interface Props {
|
||||
account?: string;
|
||||
inviteUrl: string;
|
||||
login: Login;
|
||||
logout: () => void;
|
||||
}
|
||||
|
||||
const UserBlock: React.FC<Props> = ({ account, login, logout }) => {
|
||||
const UserBlock: React.FC<Props> = ({ account, login, logout, inviteUrl }) => {
|
||||
const { onPresentConnectModal, onPresentAccountModal } = useWalletModal(login, logout, account);
|
||||
const [onPresentInviteModal] = useModal(<InviteModal inviteUrl={inviteUrl} />);
|
||||
const accountEllipsis = account ? `${account.substring(0, 4)}...${account.substring(account.length - 4)}` : null;
|
||||
return (
|
||||
<div>
|
||||
<Button
|
||||
scale="sm"
|
||||
mr={10}
|
||||
onClick={() => {
|
||||
onPresentInviteModal();
|
||||
}}
|
||||
>
|
||||
Invite
|
||||
</Button>
|
||||
{account ? (
|
||||
<Button
|
||||
scale="sm"
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@ export interface PanelProps {
|
|||
|
||||
export interface NavProps extends PanelProps {
|
||||
account?: string;
|
||||
inviteUrl: string;
|
||||
login?: Login;
|
||||
profile?: Profile;
|
||||
logout?: () => void;
|
||||
|
|
|
|||
Loading…
Reference in New Issue