Skip to content
This repository has been archived by the owner on Jun 17, 2022. It is now read-only.

Commit

Permalink
Merge pull request #9 from hyperspacedev/beta2
Browse files Browse the repository at this point in the history
Beta 2 updates
  • Loading branch information
alicerunsonfedora authored Apr 21, 2019
2 parents 025f92f + e8c3bdb commit 9ead8b3
Show file tree
Hide file tree
Showing 18 changed files with 675 additions and 123 deletions.
3 changes: 2 additions & 1 deletion public/config.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"version": "1.0.0beta1u1",
"version": "1.0.0beta2",
"location": "https://hyperspaceapp-next.herokuapp.com",
"branding": {
"name": "Hyperspace",
"logo": "logo.svg",
Expand Down
32 changes: 19 additions & 13 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import {MuiThemeProvider, CssBaseline, withStyles } from '@material-ui/core';
import { setHyperspaceTheme, darkMode } from './utilities/themes';
import AppLayout from './components/AppLayout';
import {styles} from './App.styles';
import {Route} from 'react-router-dom';
import {Route, Switch} from 'react-router-dom';
import AboutPage from './pages/About';
import Settings from './pages/Settings';
import { getUserDefaultBool, getUserDefaultTheme } from './utilities/settings';
Expand All @@ -17,6 +17,8 @@ import SearchPage from './pages/Search';
import Composer from './pages/Compose';
import WelcomePage from './pages/Welcome';
import MessagesPage from './pages/Messages';
import RecommendationsPage from './pages/Recommendations';
import Missingno from './pages/Missingno';
import {withSnackbar} from 'notistack';
import {PrivateRoute} from './interfaces/overrides';
import { userLoggedIn } from './utilities/accounts';
Expand Down Expand Up @@ -48,18 +50,22 @@ class App extends Component<any, any> {
<Route path="/welcome" component={WelcomePage}/>
<div>
{ userLoggedIn()? <AppLayout/>: null}
<PrivateRoute exact path="/" component={HomePage}/>
<PrivateRoute path="/home" component={HomePage}/>
<PrivateRoute path="/local" component={LocalPage}/>
<PrivateRoute path="/public" component={PublicPage}/>
<PrivateRoute path="/messages" component={MessagesPage}/>
<PrivateRoute path="/notifications" component={NotificationsPage}/>
<PrivateRoute path="/profile/:profileId" component={ProfilePage}/>
<PrivateRoute path="/conversation/:conversationId" component={Conversation}/>
<PrivateRoute path="/search" component={SearchPage}/>
<PrivateRoute path="/settings" component={Settings}/>
<PrivateRoute path="/about" component={AboutPage}/>
<PrivateRoute path="/compose" component={Composer}/>
<Switch>
<PrivateRoute exact path="/" component={HomePage}/>
<PrivateRoute path="/home" component={HomePage}/>
<PrivateRoute path="/local" component={LocalPage}/>
<PrivateRoute path="/public" component={PublicPage}/>
<PrivateRoute path="/messages" component={MessagesPage}/>
<PrivateRoute path="/notifications" component={NotificationsPage}/>
<PrivateRoute path="/profile/:profileId" component={ProfilePage}/>
<PrivateRoute path="/conversation/:conversationId" component={Conversation}/>
<PrivateRoute path="/search" component={SearchPage}/>
<PrivateRoute path="/settings" component={Settings}/>
<PrivateRoute path="/about" component={AboutPage}/>
<PrivateRoute path="/compose" component={Composer}/>
<PrivateRoute path="/recommended" component={RecommendationsPage}/>
<PrivateRoute component={Missingno}/>
</Switch>
</div>

</MuiThemeProvider>
Expand Down
39 changes: 27 additions & 12 deletions src/components/AppLayout/AppLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import GroupIcon from '@material-ui/icons/Group';
import SettingsIcon from '@material-ui/icons/Settings';
import InfoIcon from '@material-ui/icons/Info';
import EditIcon from '@material-ui/icons/Edit';
import SupervisedUserCircleIcon from '@material-ui/icons/SupervisedUserCircle';
//import SupervisedUserCircleIcon from '@material-ui/icons/SupervisedUserCircle';
import ExitToAppIcon from '@material-ui/icons/ExitToApp';
import {styles} from './AppLayout.styles';
import { UAccount } from '../../types/Account';
Expand Down Expand Up @@ -52,6 +52,7 @@ export class AppLayout extends Component<any, IAppLayoutState> {

this.toggleDrawerOnMobile = this.toggleDrawerOnMobile.bind(this);
this.toggleAcctMenu = this.toggleAcctMenu.bind(this);
this.clearBadge = this.clearBadge.bind(this);
}

componentDidMount() {
Expand Down Expand Up @@ -162,6 +163,12 @@ export class AppLayout extends Component<any, IAppLayoutState> {
}
}

clearBadge() {
if (!getUserDefaultBool('displayAllOnNotificationBadge')) {
this.setState({ notificationCount: 0 });
}
}

titlebar() {
const { classes } = this.props;
if (this.state.developerMode || process.env.NODE_ENV === "development") {
Expand Down Expand Up @@ -191,14 +198,6 @@ export class AppLayout extends Component<any, IAppLayoutState> {
</ListItemAvatar>
<ListItemText primary={this.state.currentUser? (this.state.currentUser.display_name || this.state.currentUser.acct): "Loading..."} secondary={this.state.currentUser? this.state.currentUser.acct: "Loading..."}/>
</LinkableListItem>
<LinkableListItem button key="notifications-mobile" to="/notifications">
<ListItemIcon><NotificationsIcon/></ListItemIcon>
<ListItemText primary="Notifications"/>
</LinkableListItem>
<LinkableListItem button key="messages-mobile" to="/messages">
<ListItemIcon><MailIcon/></ListItemIcon>
<ListItemText primary="Messages"/>
</LinkableListItem>
{/* <LinkableListItem button key="acctSwitch-module" to="/switchacct">
<ListItemIcon><SupervisedUserCircleIcon/></ListItemIcon>
<ListItemText primary="Switch account"/>
Expand Down Expand Up @@ -230,10 +229,26 @@ export class AppLayout extends Component<any, IAppLayoutState> {
</ListItem>
}
<Divider/>
<div className={classes.drawerDisplayMobile}>
<ListSubheader>Account</ListSubheader>
<LinkableListItem button key="notifications-mobile" to="/notifications">
<ListItemIcon>
<Badge badgeContent={this.state.notificationCount > 0? this.state.notificationCount: ""} color="secondary">
<NotificationsIcon />
</Badge>
</ListItemIcon>
<ListItemText primary="Notifications"/>
</LinkableListItem>
<LinkableListItem button key="messages-mobile" to="/messages">
<ListItemIcon><MailIcon/></ListItemIcon>
<ListItemText primary="Messages"/>
</LinkableListItem>
<Divider/>
</div>
<ListSubheader>More</ListSubheader>
<LinkableListItem button key="recommended" to="/recommended" disabled>
<LinkableListItem button key="recommended" to="/recommended">
<ListItemIcon><GroupIcon/></ListItemIcon>
<ListItemText primary="Who to follow" secondary="Coming soon!"/>
<ListItemText primary="Who to follow"/>
</LinkableListItem>
<LinkableListItem button key="settings" to="/settings">
<ListItemIcon><SettingsIcon/></ListItemIcon>
Expand Down Expand Up @@ -288,7 +303,7 @@ export class AppLayout extends Component<any, IAppLayoutState> {
<div className={classes.appBarFlexGrow}/>
<div className={classes.appBarActionButtons}>
<Tooltip title="Notifications">
<LinkableIconButton color="inherit" to="/notifications" onClick={() => this.setState({ notificationCount: 0 })}>
<LinkableIconButton color="inherit" to="/notifications" onClick={this.clearBadge}>
<Badge badgeContent={this.state.notificationCount > 0? this.state.notificationCount: ""} color="secondary">
<NotificationsIcon />
</Badge>
Expand Down
57 changes: 57 additions & 0 deletions src/components/ThemePreview/ThemePreview.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import React, {Component} from 'react';
import {MuiThemeProvider, Theme, AppBar, Typography, CssBaseline, Toolbar, Fab, Paper} from '@material-ui/core';
import EditIcon from '@material-ui/icons/Edit';
import MenuIcon from '@material-ui/icons/Menu';

interface IThemePreviewProps {
theme: Theme;
}

interface IThemePreviewState {
theme: Theme;
}

class ThemePreview extends Component<IThemePreviewProps, IThemePreviewState> {
constructor(props: IThemePreviewProps) {
super(props);

this.state = {
theme: this.props.theme
}
}

render() {
return (
<div style={{ position: 'relative' }}>
<MuiThemeProvider theme={this.props.theme}>
<CssBaseline/>
<Paper>
<AppBar color="primary" position="static">
<Toolbar>
<MenuIcon style={{ marginRight: 20, marginLeft: -4 }}/>
<Typography variant="h6" color="inherit">Hyperspace</Typography>
</Toolbar>
</AppBar>
<div style={{ paddingLeft: 16, paddingTop: 16, paddingRight: 16, paddingBottom: 16, flexGrow: 1 }}>
<Typography variant="h4" component="p">
This is your theme.
</Typography>
<br/>
<Typography paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vestibulum congue sem ac ornare. In nec imperdiet neque. In eleifend laoreet efficitur. Vestibulum vel odio mattis, scelerisque nibh a, ornare lectus. Phasellus sollicitudin erat et turpis pellentesque consequat. In maximus luctus purus, eu molestie elit euismod eu. Pellentesque quam lectus, sagittis eget accumsan in, consequat ut sapien. Morbi aliquet ligula erat, id dapibus nunc laoreet at. Integer sodales lacinia finibus. Aliquam augue nibh, eleifend quis consectetur et, rhoncus ut odio. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</Typography>
</div>
<div style={{ textAlign: 'right' }}>
<Fab color="secondary" style={{ marginRight: 8, marginBottom: 8 }}>
<EditIcon/>
</Fab>
</div>

</Paper>
</MuiThemeProvider>
</div>
)
}
}

export default ThemePreview;
3 changes: 3 additions & 0 deletions src/components/ThemePreview/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import ThemePreview from './ThemePreview';

export default ThemePreview;
4 changes: 2 additions & 2 deletions src/pages/About.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -236,8 +236,8 @@ class AboutPage extends Component<any, IAboutPageState> {
</List>
</Paper>
<br/>
<div>
<Typography variant="caption">(C) 2019 {this.state? this.state.brandName: "Hyperspace"} developers. All rights reserved.</Typography>
<div className={classes.pageLayoutFooter}>
<Typography variant="caption">(C) {new Date().getFullYear()} {this.state? this.state.brandName: "Hyperspace"} developers. All rights reserved.</Typography>
<Typography variant="caption" paragraph>{this.state? this.state.brandName: "Hyperspace"} is made possible by the <Link href={"https://material-ui.com"} target="_blank" rel="noreferrer">Material UI</Link> project, <Link href={"https://www.npmjs.com/package/megalodon"} target="_blank" rel="noreferrer">Megalodon</Link> library, and other <Link href={"https://github.com/hyperspacedev/hyperspace/blob/master/package.json"} target="_blank" rel="noreferrer">open source software</Link>.</Typography>
</div>
</div>
Expand Down
6 changes: 4 additions & 2 deletions src/pages/Compose.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import ComposeMediaAttachment from '../components/ComposeMediaAttachment';
import EmojiPicker from '../components/EmojiPicker';
import { DateTimePicker, MuiPickersUtilsProvider } from 'material-ui-pickers';
import MomentUtils from '@date-io/moment';
import { getUserDefaultVisibility } from '../utilities/settings';

interface IComposerState {
account: UAccount;
Expand Down Expand Up @@ -48,7 +49,7 @@ class Composer extends Component<any, IComposerState> {

this.state = {
account: JSON.parse(localStorage.getItem('account') as string),
visibility: "public",
visibility: getUserDefaultVisibility(),
sensitive: false,
visibilityMenu: false,
text: '',
Expand Down Expand Up @@ -95,7 +96,7 @@ class Composer extends Component<any, IComposerState> {
let params = this.checkComposerParams(props.location);
let reply: string = "";
let acct: string = "";
let visibility: Visibility = "public";
let visibility= this.state.visibility;

if (params.reply) {
reply = params.reply.toString();
Expand Down Expand Up @@ -347,6 +348,7 @@ class Composer extends Component<any, IComposerState> {

render() {
const {classes} = this.props;
console.log(this.state);

return (
<Dialog open={true} maxWidth="sm" fullWidth={true} className={classes.dialog} onClose={() => window.history.back()}>
Expand Down
25 changes: 25 additions & 0 deletions src/pages/Missingno.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import React, {Component} from 'react';
import {withStyles, Typography} from '@material-ui/core';
import {styles} from './PageLayout.styles';
import {LinkableButton} from '../interfaces/overrides';

class Missingno extends Component<any, any> {

render() {
const {classes} = this.props;
return (
<div className={classes.pageLayoutConstraints}>
<div>
<Typography variant="h4" component="h1"><b>Uh oh!</b></Typography>
<Typography variant="h6" component="p">The part of Hyperspace you're looking for isn't here.</Typography>
<br/>
<LinkableButton to="/home" color="primary" variant="contained">
Go back to home timeline
</LinkableButton>
</div>
</div>
)
}
}

export default withStyles(styles)(Missingno);
15 changes: 13 additions & 2 deletions src/pages/Notifications.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,8 @@ class NotificationsPage extends Component<any, INotificationsPageState> {
const div = document.createElement('div');
div.innerHTML = text;
let innerContent = div.textContent || div.innerText || "";
innerContent = innerContent.slice(0, 85) + "..."
if (innerContent.length > 65)
innerContent = innerContent.slice(0, 65) + "...";
return innerContent;
}

Expand Down Expand Up @@ -115,6 +116,7 @@ class NotificationsPage extends Component<any, INotificationsPageState> {
}

createNotification(notif: Notification) {
const { classes } = this.props;
let primary = "";
let secondary = "";
switch (notif.type) {
Expand Down Expand Up @@ -149,7 +151,16 @@ class NotificationsPage extends Component<any, INotificationsPageState> {
<PersonIcon/>
</Avatar>
</ListItemAvatar>
<ListItemText primary={primary} secondary={secondary}/>
<ListItemText primary={primary} secondary={
<span>
<Typography color="textSecondary" className={classes.mobileOnly}>
{secondary.slice(0, 35) + "..."}
</Typography>
<Typography color="textSecondary" className={classes.desktopOnly}>
{secondary}
</Typography>
</span>
}/>
<ListItemSecondaryAction>
{
notif.type === "follow"?
Expand Down
5 changes: 5 additions & 0 deletions src/pages/PageLayout.styles.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -169,5 +169,10 @@ export const styles = (theme: Theme) => createStyles({
[theme.breakpoints.up('sm')]: {
display: 'block'
}
},
pageLayoutFooter: {
'& a': {
color: theme.palette.primary.light
}
}
});
Loading

0 comments on commit 9ead8b3

Please sign in to comment.