Mastodon/hyperspace-desktop-client-windows-linux-macos
1
0
Fork 0
mirror of https://github.com/hyperspacedev/hyperspace synced 2025-01-30 17:14:57 +01:00
Code Issues Releases Wiki Activity

adds masonry layout to local and public feeds

Browse Source
This commit is contained in:
Travis Kohlbeck 2019-12-21 18:10:24 -05:00
parent af4f6e1d53
commit 95e5849be8
4 changed files with 92 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@ -41,7 +41,8 @@
"dependencies": {
"electron-notarize": "^0.1.1",
"electron-updater": "^4.1.2",
"electron-window-state": "^5.0.3"
"electron-window-state": "^5.0.3",
"react-masonry-css": "^1.0.14"
},
"main": "public/electron.js",
"scripts": {

12
src/pages/Home.tsx
View File

@ -15,11 +15,8 @@ import { Status } from "../types/Status";
import Mastodon, { StreamListener } from "megalodon";
import { withSnackbar } from "notistack";
import Masonry from 'react-masonry-css'
import { getUserDefaultBool } from "../utilities/settings";
import ArrowUpwardIcon from "@material-ui/icons/ArrowUpward";
import {
getConfig,
getUserDefaultBool
} from "../utilities/settings";
interface IHomePageState {
posts?: [Status];
@ -214,8 +211,8 @@ class HomePage extends Component<any, IHomePageState> {
</div>
);
})}
</Masonry>)
: (
</Masonry>
) : (
<div>
{this.state.posts.map((post: Status) => {
return (
@ -229,8 +226,7 @@ class HomePage extends Component<any, IHomePageState> {
);
})}
</div>
)
}
)}
<br />
{this.state.viewDidLoad && !this.state.viewDidError ? (
<div

35
src/pages/Local.tsx
View File

@ -14,6 +14,8 @@ import Post from "../components/Post";
import { Status } from "../types/Status";
import Mastodon, { StreamListener } from "megalodon";
import { withSnackbar } from "notistack";
import Masonry from 'react-masonry-css';
import { getUserDefaultBool } from "../utilities/settings";
import ArrowUpwardIcon from "@material-ui/icons/ArrowUpward";
interface ILocalPageState {
@ -23,6 +25,7 @@ interface ILocalPageState {
viewDidLoad?: boolean;
viewDidError?: boolean;
viewDidErrorCode?: any;
isMasonryLayout?: boolean;
}
class LocalPage extends Component<any, ILocalPageState> {
@ -34,7 +37,8 @@ class LocalPage extends Component<any, ILocalPageState> {
this.state = {
viewIsLoading: true,
backlogPosts: null
backlogPosts: null,
isMasonryLayout: getUserDefaultBool('isMasonryLayout'),
};
this.client = new Mastodon(
@ -186,15 +190,44 @@ class LocalPage extends Component<any, ILocalPageState> {
) : null}
{this.state.posts ? (
<div>
{this.state.isMasonryLayout ? (
<Masonry
breakpointCols={{
default: 4,
2000: 3,
1400: 2,
1050: 1,
}}
className={classes.masonryGrid}
columnClassName={classes['my-masonry-grid_column']}
>
{this.state.posts.map((post: Status) => {
return (
<div className={classes.masonryGrid_item}>
<Post
key={post.id}
post={post}
client={this.client}
/>
</div>
);
})}
</Masonry>
) : (
<div>
{this.state.posts.map((post: Status) => {
return (
<div className={classes.masonryGrid_item}>
<Post
key={post.id}
post={post}
client={this.client}
/>
</div>
);
})}
</div>
)}
<br />
{this.state.viewDidLoad && !this.state.viewDidError ? (
<div

35
src/pages/Public.tsx
View File

@ -14,6 +14,8 @@ import Post from "../components/Post";
import { Status } from "../types/Status";
import Mastodon, { StreamListener } from "megalodon";
import { withSnackbar } from "notistack";
import Masonry from 'react-masonry-css';
import { getUserDefaultBool } from "../utilities/settings";
import ArrowUpwardIcon from "@material-ui/icons/ArrowUpward";
interface IPublicPageState {
@ -23,6 +25,7 @@ interface IPublicPageState {
viewDidLoad?: boolean;
viewDidError?: boolean;
viewDidErrorCode?: any;
isMasonryLayout?:boolean;
}
class PublicPage extends Component<any, IPublicPageState> {
@ -34,7 +37,8 @@ class PublicPage extends Component<any, IPublicPageState> {
this.state = {
viewIsLoading: true,
backlogPosts: null
backlogPosts: null,
isMasonryLayout: getUserDefaultBool('isMasonryLayout')
};
this.client = new Mastodon(
@ -185,15 +189,44 @@ class PublicPage extends Component<any, IPublicPageState> {
) : null}
{this.state.posts ? (
<div>
{this.state.isMasonryLayout ? (
<Masonry
breakpointCols={{
default: 4,
2000: 3,
1400: 2,
1050: 1,
}}
className={classes.masonryGrid}
columnClassName={classes['my-masonry-grid_column']}
>
{this.state.posts.map((post: Status) => {
return (
<div className={classes.masonryGrid_item}>
<Post
key={post.id}
post={post}
client={this.client}
/>
</div>
);
})}
</Masonry>
) : (
<div>
{this.state.posts.map((post: Status) => {
return (
<div className={classes.masonryGrid_item}>
<Post
key={post.id}
post={post}
client={this.client}
/>
</div>
);
})}
</div>
)}
<br />
{this.state.viewDidLoad && !this.state.viewDidError ? (
<div