Start work on the Activity page
Signed-off-by: Marquis Kurt <software@marquiskurt.net>
This commit is contained in:
Marquis Kurt
parent
a57e240500
commit
78b97b1b82
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "hyperspace",
|
||||
"version": "1.0.0",
|
||||
"version": "1.1.0-beta1",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
|
@ -1055,13 +1055,23 @@
|
|||
}
|
||||
},
|
||||
"@material-ui/icons": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-3.0.2.tgz",
|
||||
"integrity": "sha512-QY/3gJnObZQ3O/e6WjH+0ah2M3MOgLOzCy8HTUoUx9B6dDrS18vP7Ycw3qrDEKlB6q1KNxy6CZHm5FCauWGy2g==",
|
||||
"version": "4.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.5.1.tgz",
|
||||
"integrity": "sha512-YZ/BgJbXX4a0gOuKWb30mBaHaoXRqPanlePam83JQPZ/y4kl+3aW0Wv9tlR70hB5EGAkEJGW5m4ktJwMgxQAeA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.2.0",
|
||||
"recompose": "0.28.0 - 0.30.0"
|
||||
"@babel/runtime": "^7.4.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": {
|
||||
"version": "7.6.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.6.3.tgz",
|
||||
"integrity": "sha512-kq6anf9JGjW8Nt5rYfEuGRaEAaH1mkv3Bbu6rYvLOpPh/RusSJXuKPEAoZ7L7gybZkchE8+NV5g9vKF4AGAtsA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"regenerator-runtime": "^0.13.2"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"@material-ui/system": {
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
"devDependencies": {
|
||||
"@date-io/moment": "^1.3.11",
|
||||
"@material-ui/core": "^3.9.3",
|
||||
"@material-ui/icons": "^3.0.2",
|
||||
"@material-ui/icons": "^4.5.1",
|
||||
"@types/emoji-mart": "^2.11.0",
|
||||
"@types/jest": "^24.0.18",
|
||||
"@types/node": "11.11.6",
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ import Missingno from "./pages/Missingno";
|
|||
import Blocked from "./pages/Blocked";
|
||||
import You from "./pages/You";
|
||||
import RequestsPage from "./pages/Requests";
|
||||
import ActivityPage from "./pages/Activity";
|
||||
import { withSnackbar } from "notistack";
|
||||
import { PrivateRoute } from "./interfaces/overrides";
|
||||
import { userLoggedIn } from "./utilities/accounts";
|
||||
|
|
@ -125,6 +126,7 @@ class App extends Component<any, IAppState> {
|
|||
component={RecommendationsPage}
|
||||
/>
|
||||
<PrivateRoute path="/requests" component={RequestsPage} />
|
||||
<PrivateRoute path="/activity" component={ActivityPage} />
|
||||
</div>
|
||||
</MuiThemeProvider>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,156 @@
|
|||
import React, { Component } from "react";
|
||||
import {
|
||||
withStyles,
|
||||
Typography,
|
||||
CircularProgress,
|
||||
ListSubheader
|
||||
} from "@material-ui/core";
|
||||
import { styles } from "./PageLayout.styles";
|
||||
import { UAccount, Account } from "../types/Account";
|
||||
import { Tag } from "../types/Tag";
|
||||
import Mastodon from "megalodon";
|
||||
|
||||
import FireplaceIcon from "@material-ui/icons/Fireplace";
|
||||
|
||||
interface IActivityPageState {
|
||||
user?: UAccount;
|
||||
trendingTags?: [Tag];
|
||||
profileDirectory?: [Account];
|
||||
viewLoading: boolean;
|
||||
viewLoaded?: boolean;
|
||||
viewErrored?: boolean;
|
||||
}
|
||||
|
||||
class ActivityPage extends Component<any, IActivityPageState> {
|
||||
client: Mastodon;
|
||||
|
||||
constructor(props: any) {
|
||||
super(props);
|
||||
|
||||
this.client = new Mastodon(
|
||||
localStorage.getItem("access_token") as string,
|
||||
localStorage.getItem("baseurl") + "/api/v1"
|
||||
);
|
||||
|
||||
this.state = {
|
||||
viewLoading: true
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getAccountData();
|
||||
|
||||
this.client
|
||||
.get("/trends")
|
||||
.then((resp: any) => {
|
||||
let trendingTags: [Tag] = resp.data;
|
||||
this.setState({ trendingTags });
|
||||
})
|
||||
.catch((err: Error) => {
|
||||
this.setState({
|
||||
viewLoading: false,
|
||||
viewErrored: true
|
||||
});
|
||||
console.error(err.message);
|
||||
});
|
||||
|
||||
this.client
|
||||
.get("/directory", { local: true, order: "active" })
|
||||
.then((resp: any) => {
|
||||
let profileDirectory: [Account] = resp.data;
|
||||
this.setState({
|
||||
profileDirectory,
|
||||
viewLoading: false,
|
||||
viewLoaded: true
|
||||
});
|
||||
})
|
||||
.catch((err: Error) => {
|
||||
this.setState({
|
||||
viewLoading: false,
|
||||
viewErrored: true
|
||||
});
|
||||
console.log(err.message);
|
||||
});
|
||||
}
|
||||
|
||||
getAccountData() {
|
||||
this.client
|
||||
.get("/accounts/verify_credentials")
|
||||
.then((resp: any) => {
|
||||
let data: UAccount = resp.data;
|
||||
this.setState({ user: data });
|
||||
})
|
||||
.catch((err: Error) => {
|
||||
this.props.enqueueSnackbar(
|
||||
"Couldn't find profile info: " + err.name
|
||||
);
|
||||
console.error(err.message);
|
||||
let acct = localStorage.getItem("account") as string;
|
||||
this.setState({ user: JSON.parse(acct) });
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const { classes } = this.props;
|
||||
return (
|
||||
<div className={classes.pageLayoutConstraints}>
|
||||
<div
|
||||
style={{
|
||||
textAlign: "center"
|
||||
}}
|
||||
>
|
||||
<FireplaceIcon style={{ fontSize: 64 }} />
|
||||
<Typography variant="h6">
|
||||
Hey there,{" "}
|
||||
{this.state.user
|
||||
? this.state.user.display_name ||
|
||||
this.state.user.acct
|
||||
: "user"}
|
||||
!
|
||||
</Typography>
|
||||
<Typography paragraph>
|
||||
Take a look at what's been happening on your instance.
|
||||
</Typography>
|
||||
</div>
|
||||
{this.state.viewLoaded ? (
|
||||
<div>
|
||||
<ListSubheader>Trending hashtags</ListSubheader>
|
||||
{this.state.trendingTags &&
|
||||
this.state.trendingTags.length > 0 ? (
|
||||
<div></div>
|
||||
) : (
|
||||
<Typography paragraph>
|
||||
It looks like there aren't any trending tags on
|
||||
your instance as of right now.
|
||||
</Typography>
|
||||
)}
|
||||
<ListSubheader>
|
||||
Active on profile directory
|
||||
</ListSubheader>
|
||||
{this.state.profileDirectory &&
|
||||
this.state.profileDirectory.length > 0 ? (
|
||||
<div></div>
|
||||
) : (
|
||||
<Typography paragraph>
|
||||
It looks like there aren't any people in the
|
||||
profile directory yet.
|
||||
</Typography>
|
||||
)}
|
||||
</div>
|
||||
) : null}
|
||||
{this.state.viewLoading ? (
|
||||
<div style={{ textAlign: "center" }}>
|
||||
<CircularProgress
|
||||
className={classes.progress}
|
||||
color="primary"
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<span />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withStyles(styles)(ActivityPage);
|
||||
|
|
@ -32,7 +32,6 @@ interface IRecommendationsPageState {
|
|||
viewDidError?: Boolean;
|
||||
viewDidErrorCode?: string;
|
||||
followSuggestions?: [Account];
|
||||
trendingTags?: [any];
|
||||
}
|
||||
|
||||
class RecommendationsPage extends Component<
|
||||
|
|
|
|||
|
|
@ -17,10 +17,11 @@ import { styles } from "./PageLayout.styles";
|
|||
import { Account } from "../types/Account";
|
||||
import Mastodon from "megalodon";
|
||||
import { LinkableAvatar, LinkableIconButton } from "../interfaces/overrides";
|
||||
import CheckIcon from "@material-ui/core/SvgIcon/SvgIcon";
|
||||
import CheckIcon from "@material-ui/icons/Check";
|
||||
import AccountCircleIcon from "@material-ui/icons/AccountCircle";
|
||||
import CloseIcon from "@material-ui/icons/Close";
|
||||
import CheckCircleIcon from "@material-ui/icons/CheckCircle";
|
||||
import { withSnackbar } from "notistack";
|
||||
|
||||
interface IRequestsPageState {
|
||||
viewLoading: boolean;
|
||||
|
|
@ -211,4 +212,4 @@ class RequestsPage extends Component<any, IRequestsPageState> {
|
|||
}
|
||||
}
|
||||
|
||||
export default withStyles(styles)(RequestsPage);
|
||||
export default withStyles(styles)(withSnackbar(RequestsPage));
|
||||
|
|
|
|||
Loading…
Reference in New Issue