mirror of
https://github.com/hyperspacedev/hyperspace
synced 2025-01-30 17:14:57 +01:00
Get some data from Mastodon
This commit is contained in:
parent
fec1a94e59
commit
5880abd7ae
@ -1,7 +1,6 @@
|
||||
import React, { Component } from 'react';
|
||||
import {MuiThemeProvider, CssBaseline, withStyles, Typography } from '@material-ui/core';
|
||||
import { setHyperspaceTheme, darkMode } from './utilities/themes';
|
||||
import { defaultTheme } from './types/HyperspaceTheme';
|
||||
import AppLayout from './components/AppLayout';
|
||||
import {styles} from './App.styles';
|
||||
import {Route} from 'react-router-dom';
|
||||
@ -10,7 +9,7 @@ import Settings from './pages/Settings';
|
||||
import { getUserDefaultBool, getUserDefaultTheme } from './utilities/settings';
|
||||
|
||||
let theme = setHyperspaceTheme(getUserDefaultTheme());
|
||||
console.log(theme);
|
||||
|
||||
class App extends Component<any, any> {
|
||||
|
||||
constructor(props: any) {
|
||||
|
@ -93,7 +93,7 @@ export const styles = (theme: Theme) => createStyles({
|
||||
},
|
||||
},
|
||||
appBarAcctMenuIcon: {
|
||||
backgroundColor: theme.palette.secondary.main
|
||||
backgroundColor: theme.palette.primary.dark
|
||||
},
|
||||
drawer: {
|
||||
[theme.breakpoints.up('sm')]: {
|
||||
|
@ -15,9 +15,12 @@ import ExitToAppIcon from '@material-ui/icons/ExitToApp';
|
||||
import {styles} from './AppLayout.styles';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { ListItemProps } from '@material-ui/core/ListItem';
|
||||
import { getCurrentUserData } from '../../utilities/accounts';
|
||||
import { UAccount } from '../../types/Account';
|
||||
|
||||
interface IAppLayoutState {
|
||||
drawerOpenOnMobile: boolean;
|
||||
currentUser: UAccount;
|
||||
}
|
||||
|
||||
interface ILinkableListItemProps extends ListItemProps {
|
||||
@ -34,7 +37,8 @@ export class AppLayout extends Component<any, IAppLayoutState> {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
drawerOpenOnMobile: false
|
||||
drawerOpenOnMobile: false,
|
||||
currentUser: getCurrentUserData()
|
||||
}
|
||||
|
||||
this.toggleDrawerOnMobile = this.toggleDrawerOnMobile.bind(this);
|
||||
@ -71,9 +75,9 @@ export class AppLayout extends Component<any, IAppLayoutState> {
|
||||
<div className={classes.drawerDisplayMobile}>
|
||||
<LinkableListItem button key="profile-mobile" to="/profile">
|
||||
<ListItemAvatar>
|
||||
<Avatar alt="You" src="https://preview.redd.it/9a5zntent0g21.jpg?width=960&crop=smart&auto=webp&s=5668a0a2d3cb52e43a302aa3d0902ae0704c9dc1"/>
|
||||
<Avatar alt="You" src={this.state.currentUser.avatar_static}/>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="Asriel Dreemurr" secondary="@asriel@dreemurr.io"/>
|
||||
<ListItemText primary={this.state.currentUser.display_name} secondary={this.state.currentUser.acct}/>
|
||||
</LinkableListItem>
|
||||
<LinkableListItem button key="notifications-mobile" to="/notifications">
|
||||
<ListItemIcon><NotificationsIcon/></ListItemIcon>
|
||||
@ -166,7 +170,7 @@ export class AppLayout extends Component<any, IAppLayoutState> {
|
||||
<MailIcon/>
|
||||
</IconButton>
|
||||
<IconButton>
|
||||
<Avatar className={classes.appBarAcctMenuIcon} alt="You" src="https://preview.redd.it/9a5zntent0g21.jpg?width=960&crop=smart&auto=webp&s=5668a0a2d3cb52e43a302aa3d0902ae0704c9dc1"/>
|
||||
<Avatar className={classes.appBarAcctMenuIcon} alt="You" src={this.state.currentUser.avatar_static}/>
|
||||
</IconButton>
|
||||
</div>
|
||||
</Toolbar>
|
||||
|
@ -18,8 +18,27 @@ import DomainIcon from '@material-ui/icons/Domain';
|
||||
import ChatIcon from '@material-ui/icons/Chat';
|
||||
import PersonIcon from '@material-ui/icons/Person';
|
||||
import {styles} from './PageLayout.styles';
|
||||
import {getCurrentInstanceData} from '../utilities/instances';
|
||||
import {Instance} from '../types/Instance';
|
||||
|
||||
class AboutPage extends Component<any, any> {
|
||||
interface IAboutPageState {
|
||||
instance: Instance;
|
||||
}
|
||||
|
||||
class AboutPage extends Component<any, IAboutPageState> {
|
||||
|
||||
constructor(props: any) {
|
||||
super(props);
|
||||
|
||||
let instance = getCurrentInstanceData();
|
||||
instance.then((resp: any) => {
|
||||
let data: Instance = resp.data;
|
||||
console.log("From response: " + data);
|
||||
this.setState({
|
||||
instance: data
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
const { classes } = this.props;
|
||||
@ -34,7 +53,7 @@ class AboutPage extends Component<any, any> {
|
||||
<DomainIcon/>
|
||||
</Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="Instance location (URL)" secondary="dreemurr.io"/>
|
||||
<ListItemText primary="Instance location (URL)" secondary={this.state ? this.state.instance.uri: "Couldn't determine location"}/>
|
||||
<ListItemSecondaryAction>
|
||||
<IconButton>
|
||||
<OpenInNewIcon/>
|
||||
@ -43,9 +62,12 @@ class AboutPage extends Component<any, any> {
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemAvatar>
|
||||
<Avatar alt="Instance admin" src="https://preview.redd.it/wkdcm71za0i21.jpg?auto=webp&s=a59ce15710bf3bf5ab74bcce9d86055fd97c6102"/>
|
||||
<Avatar alt="Instance admin" src={this.state? this.state.instance.contact_account.avatar_static: ""}/>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="Instance admin" secondary="Toriel (@toriel)"/>
|
||||
<ListItemText primary="Instance admin" secondary={
|
||||
this.state ? `${this.state.instance.contact_account.display_name} (@${this.state.instance.contact_account.acct})`:
|
||||
"Couldn't determine admin"
|
||||
}/>
|
||||
<ListItemSecondaryAction>
|
||||
<IconButton>
|
||||
<ChatIcon/>
|
||||
|
@ -106,10 +106,10 @@ class SettingsPage extends Component<any, ISettingsState> {
|
||||
</RadioGroup>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={this.toggleThemeDialog} color="primary">
|
||||
<Button onClick={this.toggleThemeDialog} color="default">
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={this.changeTheme} color="primary">
|
||||
<Button onClick={this.changeTheme} color="secondary">
|
||||
Ok
|
||||
</Button>
|
||||
</DialogActions>
|
||||
|
@ -24,4 +24,10 @@ export type Account = {
|
||||
moved: Account | null;
|
||||
fields: [Field];
|
||||
bot: boolean | null;
|
||||
}
|
||||
|
||||
export type UAccount = {
|
||||
acct: string;
|
||||
display_name: string;
|
||||
avatar_static: string;
|
||||
}
|
15
src/types/Instance.tsx
Normal file
15
src/types/Instance.tsx
Normal file
@ -0,0 +1,15 @@
|
||||
import { Field } from "./Field";
|
||||
import { Account } from "./Account";
|
||||
|
||||
export type Instance = {
|
||||
uri: string;
|
||||
title: string;
|
||||
description: string;
|
||||
email: string;
|
||||
version: string;
|
||||
thumbnail: string | null;
|
||||
urls: Field;
|
||||
stats: Field;
|
||||
languages: [string];
|
||||
contact_account: Account;
|
||||
}
|
16
src/utilities/accounts.tsx
Normal file
16
src/utilities/accounts.tsx
Normal file
@ -0,0 +1,16 @@
|
||||
import Mastodon from 'megalodon';
|
||||
import { Account, UAccount } from '../types/Account';
|
||||
|
||||
export function getCurrentUserData() {
|
||||
let currentData: Account = JSON.parse(localStorage.getItem('account') as string);
|
||||
if (currentData === null) {
|
||||
let client = new Mastodon(localStorage.getItem('access_token') as string, localStorage.getItem('baseurl') as string + "/api/v1/");
|
||||
client.get('/account/verify_credentials').then((resp: any) => { let acct: Account = resp.data; currentData = acct; return acct; });
|
||||
}
|
||||
let account: UAccount = {
|
||||
acct: "@" + currentData.acct,
|
||||
display_name: currentData.display_name || "@" + currentData.acct,
|
||||
avatar_static: currentData.avatar_static
|
||||
}
|
||||
return account;
|
||||
}
|
9
src/utilities/instances.tsx
Normal file
9
src/utilities/instances.tsx
Normal file
@ -0,0 +1,9 @@
|
||||
import Mastodon from 'megalodon';
|
||||
import { Instance } from '../types/Instance';
|
||||
|
||||
export function getCurrentInstanceData() {
|
||||
let instance;
|
||||
let client = new Mastodon(localStorage.getItem('access_token') as string, localStorage.getItem('baseurl') as string + "/api/v1/");
|
||||
instance = client.get<Instance>('/instance');
|
||||
return instance;
|
||||
}
|
@ -37,7 +37,6 @@ export function setUserDefaultBool(key: string, value: boolean) {
|
||||
* Gets the user's default theme or the default theme
|
||||
*/
|
||||
export function getUserDefaultTheme() {
|
||||
console.log(localStorage.getItem('theme'));
|
||||
let returnTheme = defaultTheme;
|
||||
themes.forEach((theme) => {
|
||||
if(theme.key === localStorage.getItem('theme')) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user