mirror of
https://github.com/RoboSats/robosats.git
synced 2025-01-31 10:31:35 +00:00
Create CommunityDialog component
This commit is contained in:
Fernando Porazzi
parent
90939c42e5
commit
423c816389
@ -1,9 +1,8 @@
|
||||
import React, { Component } from 'react'
|
||||
import { withTranslation, Trans} from "react-i18next";
|
||||
import { withTranslation } from "react-i18next";
|
||||
import {FormControlLabel, Link, Switch, CircularProgress, Badge, Tooltip, TextField, ListItemAvatar, Button, Avatar,Paper, Grid, IconButton, Typography, Select, MenuItem, List, ListItemText, ListItem, ListItemIcon, ListItemButton, Divider, Dialog, DialogContent} from "@mui/material";
|
||||
import MediaQuery from 'react-responsive'
|
||||
import { Link as LinkRouter } from 'react-router-dom'
|
||||
import Flags from 'country-flag-icons/react/3x2'
|
||||
|
||||
// Icons
|
||||
import SettingsIcon from '@mui/icons-material/Settings';
|
||||
@ -16,7 +15,7 @@ import PriceChangeIcon from '@mui/icons-material/PriceChange';
|
||||
import BoltIcon from '@mui/icons-material/Bolt';
|
||||
import GitHubIcon from '@mui/icons-material/GitHub';
|
||||
import EqualizerIcon from '@mui/icons-material/Equalizer';
|
||||
import SendIcon from '@mui/icons-material/Send';
|
||||
|
||||
import PublicIcon from '@mui/icons-material/Public';
|
||||
import NumbersIcon from '@mui/icons-material/Numbers';
|
||||
import PasswordIcon from '@mui/icons-material/Password';
|
||||
@ -29,6 +28,8 @@ import EmojiEventsIcon from '@mui/icons-material/EmojiEvents';
|
||||
import AmbossIcon from "./icons/AmbossIcon";
|
||||
import FavoriteIcon from '@mui/icons-material/Favorite';
|
||||
|
||||
import CommunityDialog from './CommunityDialog';
|
||||
|
||||
import { getCookie } from "../utils/cookies";
|
||||
import { pn } from "../utils/prettyNumbers";
|
||||
|
||||
@ -65,7 +66,6 @@ class BottomBar extends Component {
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
console.log("mount fernando");
|
||||
this.getInfo();
|
||||
}
|
||||
|
||||
@ -181,62 +181,6 @@ class BottomBar extends Component {
|
||||
this.setState({openCommuniy: false});
|
||||
};
|
||||
|
||||
CommunityDialog =() =>{
|
||||
const { t } = this.props;
|
||||
|
||||
return(
|
||||
<Dialog
|
||||
open={this.state.openCommuniy}
|
||||
onClose={this.handleClickCloseCommunity}
|
||||
aria-labelledby="community-dialog-title"
|
||||
aria-describedby="community-description"
|
||||
>
|
||||
<DialogContent>
|
||||
<Typography component="h5" variant="h5">{t("Community")}</Typography>
|
||||
<Typography component="body2" variant="body2">
|
||||
<p>{t("Support is only offered via public channels. Join our Telegram community if you have questions or want to hang out with other cool robots. Please, use our Github Issues if you find a bug or want to see new features!")}</p>
|
||||
</Typography>
|
||||
<List>
|
||||
<Divider/>
|
||||
|
||||
<ListItemButton component="a" target="_blank" href="https://t.me/robosats">
|
||||
<ListItemIcon><SendIcon/></ListItemIcon>
|
||||
<ListItemText primary={t("Join the RoboSats group")}
|
||||
secondary={t("Telegram (English / Main)")}/>
|
||||
</ListItemButton>
|
||||
<Divider/>
|
||||
|
||||
<ListItem>
|
||||
<ListItemIcon><SendIcon/></ListItemIcon>
|
||||
<ListItemText secondary={t("RoboSats Telegram Communities")}>
|
||||
<Tooltip title={t("Join RoboSats Spanish speaking community!")}>
|
||||
<IconButton component="a" target="_blank" href="https://t.me/robosats_es"><Flags.ES width={30} height={30} style={{filter: 'drop-shadow(2px 2px 2px #444444)'}}/></IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title={t("Join RoboSats Russian speaking community!")}>
|
||||
<IconButton component="a" target="_blank" href="https://t.me/robosats_ru"><Flags.RU width={30} height={30} style={{filter: 'drop-shadow(2px 2px 2px #444444)'}}/></IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title={t("Join RoboSats Chinese speaking community!")}>
|
||||
<IconButton component="a" target="_blank" href="https://t.me/robosats_cn"><Flags.CN width={30} height={30} style={{filter: 'drop-shadow(2px 2px 2px #444444)'}}/></IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title={t("Join RoboSats English speaking community!")}>
|
||||
<IconButton component="a" target="_blank" href="https://t.me/robosats"><Flags.US width={30} height={30} style={{filter: 'drop-shadow(2px 2px 2px #444444)'}}/></IconButton>
|
||||
</Tooltip>
|
||||
</ListItemText>
|
||||
</ListItem>
|
||||
<Divider/>
|
||||
|
||||
<ListItemButton component="a" target="_blank" href="https://github.com/Reckless-Satoshi/robosats/issues">
|
||||
<ListItemIcon><GitHubIcon/></ListItemIcon>
|
||||
<ListItemText primary={t("Tell us about a new feature or a bug")}
|
||||
secondary={t("Github Issues - The Robotic Satoshis Open Source Project")}/>
|
||||
</ListItemButton>
|
||||
|
||||
</List>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
handleClickOpenProfile = () => {
|
||||
this.getInfo();
|
||||
this.setState({openProfile: true, profileShown: true});
|
||||
@ -448,7 +392,6 @@ bottomBarDesktop =()=>{
|
||||
return(
|
||||
<Paper elevation={6} style={{height:40}}>
|
||||
{this.StatsDialog()}
|
||||
{this.CommunityDialog()}
|
||||
{this.dialogProfile()}
|
||||
{this.exchangeSummaryDialog()}
|
||||
<Grid container xs={12}>
|
||||
@ -709,7 +652,6 @@ bottomBarPhone =()=>{
|
||||
return(
|
||||
<Paper elevation={6} style={{height:40}}>
|
||||
{this.StatsDialog()}
|
||||
{this.CommunityDialog()}
|
||||
{this.exchangeSummaryDialog()}
|
||||
{this.dialogProfile()}
|
||||
<Grid container xs={12}>
|
||||
@ -806,6 +748,10 @@ bottomBarPhone =()=>{
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<CommunityDialog
|
||||
isOpen={this.state.openCommuniy}
|
||||
handleClickCloseCommunity={this.handleClickCloseCommunity}
|
||||
/>
|
||||
<MediaQuery minWidth={1200}>
|
||||
{this.bottomBarDesktop()}
|
||||
</MediaQuery>
|
||||
|
||||
151
frontend/src/components/CommunityDialog/CommunityDialog.tsx
Normal file
151
frontend/src/components/CommunityDialog/CommunityDialog.tsx
Normal file
@ -0,0 +1,151 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
Divider,
|
||||
IconButton,
|
||||
List,
|
||||
ListItemText,
|
||||
ListItem,
|
||||
ListItemIcon,
|
||||
ListItemButton,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import SendIcon from '@mui/icons-material/Send';
|
||||
import GitHubIcon from '@mui/icons-material/GitHub';
|
||||
import Flags from 'country-flag-icons/react/3x2'
|
||||
|
||||
type Props = {
|
||||
isOpen: boolean;
|
||||
handleClickCloseCommunity: () => void;
|
||||
}
|
||||
|
||||
const CommunityDialog = ({
|
||||
isOpen,
|
||||
handleClickCloseCommunity,
|
||||
}: Props): JSX.Element => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const flagProps = {
|
||||
width: 30,
|
||||
height: 30,
|
||||
style: {
|
||||
filter: "drop-shadow(2px 2px 2px #444444)",
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={isOpen}
|
||||
onClose={handleClickCloseCommunity}
|
||||
aria-labelledby="community-dialog-title"
|
||||
aria-describedby="community-description"
|
||||
>
|
||||
<DialogContent>
|
||||
<Typography component="h5" variant="h5">
|
||||
{t("Community")}
|
||||
</Typography>
|
||||
|
||||
<Typography component="div" variant="body2">
|
||||
<p>{t("Support is only offered via public channels. Join our Telegram community if you have questions or want to hang out with other cool robots. Please, use our Github Issues if you find a bug or want to see new features!")}</p>
|
||||
</Typography>
|
||||
|
||||
<List>
|
||||
<Divider/>
|
||||
|
||||
<ListItemButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://t.me/robosats"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<ListItemIcon>
|
||||
<SendIcon/>
|
||||
</ListItemIcon>
|
||||
|
||||
<ListItemText
|
||||
primary={t("Join the RoboSats group")}
|
||||
secondary={t("Telegram (English / Main)")}
|
||||
/>
|
||||
</ListItemButton>
|
||||
|
||||
<Divider/>
|
||||
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<SendIcon/>
|
||||
</ListItemIcon>
|
||||
|
||||
<ListItemText secondary={t("RoboSats Telegram Communities")}>
|
||||
<Tooltip title={t("Join RoboSats Spanish speaking community!") || ""}>
|
||||
<IconButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://t.me/robosats_es"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<Flags.ES {...flagProps} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip title={t("Join RoboSats Russian speaking community!") || ""}>
|
||||
<IconButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://t.me/robosats_ru"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<Flags.RU {...flagProps} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip title={t("Join RoboSats Chinese speaking community!") || ""}>
|
||||
<IconButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://t.me/robosats_cn"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<Flags.CN {...flagProps} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip title={t("Join RoboSats English speaking community!") || ""}>
|
||||
<IconButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://t.me/robosats"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<Flags.US {...flagProps} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
</ListItemText>
|
||||
</ListItem>
|
||||
|
||||
<Divider/>
|
||||
|
||||
<ListItemButton
|
||||
component="a"
|
||||
target="_blank"
|
||||
href="https://github.com/Reckless-Satoshi/robosats/issues"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<ListItemIcon>
|
||||
<GitHubIcon/>
|
||||
</ListItemIcon>
|
||||
|
||||
<ListItemText
|
||||
primary={t("Tell us about a new feature or a bug")}
|
||||
secondary={t("Github Issues - The Robotic Satoshis Open Source Project")}
|
||||
/>
|
||||
</ListItemButton>
|
||||
</List>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default CommunityDialog;
|
||||
1
frontend/src/components/CommunityDialog/index.ts
Normal file
1
frontend/src/components/CommunityDialog/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default } from "./CommunityDialog";
|
||||
Loading…
Reference in New Issue
Block a user