Mastodon
/
hyperspace-desktop-client-windows-linux-macos
mirror of https://github.com/hyperspacedev/hyperspace
1
0
Fork 0
Code Issues Releases Wiki Activity

Make all avatars clickable and change profile button to new icon

This commit is contained in:
Marquis Kurt 2019-04-24 17:12:08 -04:00
parent 5ae9f688e7
commit 4db838590d
4 changed files with 46 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/pages/About.tsx
View File

@ -18,6 +18,7 @@ import OpenInNewIcon from '@material-ui/icons/OpenInNew';
import DomainIcon from '@material-ui/icons/Domain';
import ChatIcon from '@material-ui/icons/Chat';
import PersonIcon from '@material-ui/icons/Person';
import AssignmentIndIcon from '@material-ui/icons/AssignmentInd';
import NetworkCheckIcon from '@material-ui/icons/NetworkCheck';
import UpdateIcon from '@material-ui/icons/Update';
import InfoIcon from '@material-ui/icons/Info';
@ -25,7 +26,7 @@ import NotesIcon from '@material-ui/icons/Notes';
import CodeIcon from '@material-ui/icons/Code';
import {styles} from './PageLayout.styles';
import {Instance} from '../types/Instance';
import {LinkableIconButton} from '../interfaces/overrides';
import {LinkableIconButton, LinkableAvatar} from '../interfaces/overrides';
import Mastodon from 'megalodon';
import { UAccount } from '../types/Account';
import { getConfig } from '../utilities/settings';
@ -114,7 +115,7 @@ class AboutPage extends Component<any, IAboutPageState> {
</ListItem>
<ListItem>
<ListItemAvatar>
<Avatar alt="Instance admin" src={this.state.instance? this.state.instance.contact_account.avatar_static: ""}/>
<LinkableAvatar to={`/profile/${this.state.instance? this.state.instance.contact_account.id: 0}`} alt="Instance admin" src={this.state.instance? this.state.instance.contact_account.avatar_static: ""}/>
</ListItemAvatar>
<ListItemText primary="Instance admin" secondary={
this.state.instance ? `${this.state.instance.contact_account.display_name} (@${this.state.instance.contact_account.acct})`:
@ -128,7 +129,7 @@ class AboutPage extends Component<any, IAboutPageState> {
</Tooltip>
<Tooltip title="View profile">
<LinkableIconButton to={`/profile/${this.state.instance? this.state.instance.contact_account.id: 0}`}>
<PersonIcon/>
<AssignmentIndIcon/>
</LinkableIconButton>
</Tooltip>
</ListItemSecondaryAction>
@ -193,9 +194,9 @@ class AboutPage extends Component<any, IAboutPageState> {
<List>
<ListItem>
<ListItemAvatar>
<Avatar src={this.state.hyperspaceAdmin? this.state.hyperspaceAdmin.avatar_static: ""}>
<LinkableAvatar to={`/profile/${this.state.hyperspaceAdmin? this.state.hyperspaceAdmin.id: 0}`} src={this.state.hyperspaceAdmin? this.state.hyperspaceAdmin.avatar_static: ""}>
<PersonIcon/>
</Avatar>
</LinkableAvatar>
</ListItemAvatar>
<ListItemText primary="App provider" secondary={this.state.hyperspaceAdmin && this.state.hyperspaceAdminName? (this.state.hyperspaceAdminName || this.state.hyperspaceAdmin.display_name || "@" + this.state.hyperspaceAdmin.acct): "No provider set in config"}/>
<ListItemSecondaryAction>
@ -206,7 +207,7 @@ class AboutPage extends Component<any, IAboutPageState> {
</Tooltip>
<Tooltip title="View profile">
<LinkableIconButton to={`/profile/${this.state.hyperspaceAdmin? this.state.hyperspaceAdmin.id: 0}`}>
<PersonIcon/>
<AssignmentIndIcon/>
</LinkableIconButton>
</Tooltip>
</ListItemSecondaryAction>

6
src/pages/Messages.tsx
View File

@ -5,7 +5,7 @@ import ForumIcon from '@material-ui/icons/Forum';
import {styles} from './PageLayout.styles';
import Mastodon from 'megalodon';
import { Status } from '../types/Status';
import { LinkableIconButton } from '../interfaces/overrides';
import { LinkableIconButton, LinkableAvatar } from '../interfaces/overrides';
interface IMessagesState {
posts?: [Status];
@ -73,9 +73,9 @@ class MessagesPage extends Component<any, IMessagesState> {
return (
<ListItem>
<ListItemAvatar>
<Avatar alt={message.account.username} src={message.account.avatar_static}>
<LinkableAvatar to={`/profile/${message.account.id}`} alt={message.account.username} src={message.account.avatar_static}>
<PersonIcon/>
</Avatar>
</LinkableAvatar>
</ListItemAvatar>
<ListItemText primary={message.account.display_name || "@" + message.account.acct} secondary={this.removeHTMLContent(message.content)}/>
<ListItemSecondaryAction>

17
src/pages/Recommendations.tsx
View File

@ -3,8 +3,9 @@ import {withStyles, Typography, List, ListItem, Paper, ListItemText, Avatar, Lis
import {styles} from './PageLayout.styles';
import Mastodon from 'megalodon';
import {Account} from '../types/Account';
import { LinkableIconButton } from '../interfaces/overrides';
import { LinkableIconButton, LinkableAvatar } from '../interfaces/overrides';
import AccountCircleIcon from '@material-ui/icons/AccountCircle';
import AssignmentIndIcon from '@material-ui/icons/AssignmentInd';
import PersonAddIcon from '@material-ui/icons/PersonAdd';
import CheckIcon from '@material-ui/icons/Check';
import CloseIcon from '@material-ui/icons/Close';
@ -120,7 +121,7 @@ class RecommendationsPage extends Component<IRecommendationsPageProps, IRecommen
return (
<ListItem key={request.id}>
<ListItemAvatar>
<Avatar alt={request.username} src={request.avatar_static}/>
<LinkableAvatar to={`/profile/${request.id}`} alt={request.username} src={request.avatar_static}/>
</ListItemAvatar>
<ListItemText primary={request.display_name || request.acct} secondary={request.acct}/>
<ListItemSecondaryAction>
@ -164,20 +165,20 @@ class RecommendationsPage extends Component<IRecommendationsPageProps, IRecommen
return (
<ListItem key={suggestion.id}>
<ListItemAvatar>
<Avatar alt={suggestion.username} src={suggestion.avatar_static}/>
<LinkableAvatar to={`/profile/${suggestion.id}`} alt={suggestion.username} src={suggestion.avatar_static}/>
</ListItemAvatar>
<ListItemText primary={suggestion.display_name || suggestion.acct} secondary={suggestion.acct}/>
<ListItemSecondaryAction>
<Tooltip title="View profile">
<LinkableIconButton to={`/profile/${suggestion.id}`}>
<AssignmentIndIcon/>
</LinkableIconButton>
</Tooltip>
<Tooltip title="Follow">
<IconButton onClick={() => this.followMember(suggestion)}>
<PersonAddIcon/>
</IconButton>
</Tooltip>
<Tooltip title="View profile">
<LinkableIconButton to={`/profile/${suggestion.id}`}>
<AccountCircleIcon/>
</LinkableIconButton>
</Tooltip>
</ListItemSecondaryAction>
</ListItem>
);

33
src/pages/Search.tsx
View File

@ -10,11 +10,15 @@ import {
Paper,
withStyles,
Typography,
CircularProgress
CircularProgress,
Tooltip,
IconButton
} from '@material-ui/core';
import PersonIcon from '@material-ui/icons/Person';
import AssignmentIndIcon from '@material-ui/icons/AssignmentInd';
import PersonAddIcon from '@material-ui/icons/PersonAdd';
import {styles} from './PageLayout.styles';
import {LinkableIconButton} from '../interfaces/overrides';
import {LinkableIconButton, LinkableAvatar} from '../interfaces/overrides';
import Mastodon from 'megalodon';
import {parse as parseParams, ParsedQuery} from 'query-string';
import { Results } from '../types/Search';
@ -145,6 +149,16 @@ class SearchPage extends Component<any, ISearchPageState> {
});
}
followMemberFromQuery(acct: Account) {
let client = new Mastodon(localStorage.getItem('access_token') as string, localStorage.getItem('baseurl') + "/api/v1");
client.post(`/accounts/${acct.id}/follow`).then((resp: any) => {
this.props.enqueueSnackbar('You are now following this account.');
}).catch((err: Error) => {
this.props.enqueueSnackbar("Couldn't follow account: " + err.name, { variant: 'error' });
console.error(err.message);
})
}
showAllAccountsFromQuery() {
const { classes } = this.props;
return (
@ -158,13 +172,20 @@ class SearchPage extends Component<any, ISearchPageState> {
return (
<ListItem key={acct.id}>
<ListItemAvatar>
<Avatar alt={acct.username} src={acct.avatar_static}/>
<LinkableAvatar to={`/profile/${acct.id}`} alt={acct.username} src={acct.avatar_static}/>
</ListItemAvatar>
<ListItemText primary={acct.display_name || acct.acct} secondary={acct.acct}/>
<ListItemSecondaryAction>
<LinkableIconButton to={`/profile/${acct.id}`}>
<PersonIcon/>
</LinkableIconButton>
<Tooltip title="View profile">
<LinkableIconButton to={`/profile/${acct.id}`}>
<AssignmentIndIcon/>
</LinkableIconButton>
</Tooltip>
<Tooltip title="Follow">
<IconButton onClick={() => this.followMemberFromQuery(acct)}>
<PersonAddIcon/>
</IconButton>
</Tooltip>
</ListItemSecondaryAction>
</ListItem>
);