mitchell/go-discord-bot
1
0
Fork 0
mirror of https://github.com/mgerb/go-discord-bot synced 2026-01-11 01:22:48 +00:00
Code Issues Releases Wiki Activity

use oauth for file uploads

Browse Source
This commit is contained in:
Mitchell
2018-02-19 16:06:33 -06:00
parent 79b4fecd3c
commit 02fe8e1748
16 changed files with 490 additions and 286 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
client/app/components/Navbar/Navbar.scss
View File

@@ -1,52 +1,63 @@
@import '../../scss/variables';
.Navbar {
position: fixed;
display: flex;
flex-direction: column;
top: 0;
left: 0;
height: 100%;
width: $navbarWidth;
background-color: $gray2;
border-right: 1px solid darken($gray2, 2%);
overflow-y: auto;
padding-bottom: 10px;
position: fixed;
display: flex;
flex-direction: column;
top: 0;
left: 0;
height: 100%;
width: $navbarWidth;
background-color: $gray2;
border-right: 1px solid darken($gray2, 2%);
overflow-y: auto;
padding-bottom: 10px;
}
.Navbar__header {
font-size: 25px;
min-height: 100px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
background-color: $primaryBlue;
border-bottom: 1px solid $gray3;
font-size: 25px;
min-height: 100px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
background-color: $primaryBlue;
border-bottom: 1px solid $gray3;
}
.Navbar__item {
min-height: 50px;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: $white;
transition: background-color 0.1s linear, color 0.2s linear;
&:hover {
background-color: $gray1;
}
& + .Navbar__item {
border-top: 1px solid $gray3;
}
min-height: 50px;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: $white;
transition: background-color 0.1s linear, color 0.2s linear;
&:hover {
background-color: $gray1;
}
& + .Navbar__item {
border-top: 1px solid $gray3;
}
}
.Navbar__item--active {
padding-left: 4px;
border-right: 4px solid $primaryBlue;
color: $primaryBlue !important;
padding-left: 4px;
border-right: 4px solid $primaryBlue;
color: $primaryBlue !important;
}
.Navbar__email {
padding-top: 10px;
flex: 1;
display: flex;
align-items: flex-end;
justify-content: center;
color: $primaryBlue;
bottom: 2;
left: 2;
font-size: 12px;
}

73
client/app/components/Navbar/Navbar.tsx
View File

@@ -1,33 +1,70 @@
import React from 'react';
import { Link } from 'react-router';
import jwt_decode from 'jwt-decode';
import './Navbar.scss';
import { storage } from '../../storage';
// TODO: change url for build
const redirectUri = 'https://localhost/oauth';
const oauthUrl = `https://discordapp.com/api/oauth2/authorize?client_id=410818759746650140&redirect_uri=${redirectUri}&response_type=code&scope=guilds%20identify`;
interface Props {
let oauthUrl: string;
if (!process.env.NODE_ENV) {
// dev
oauthUrl = `https://discordapp.com/api/oauth2/authorize?client_id=410818759746650140&redirect_uri=https%3A%2F%2Flocalhost%2Foauth&response_type=code&scope=identify%20guilds`;
} else {
// prod
oauthUrl = `https://discordapp.com/api/oauth2/authorize?client_id=271998875802402816&redirect_uri=https%3A%2F%2Fcashdiscord.com%2Foauth&response_type=code&scope=identify%20guilds%20email`;
}
interface State {
interface Props {}
interface State {
token: string | null;
email?: string;
}
export class Navbar extends React.Component<Props, State> {
render() {
return (
<div className="Navbar">
<div className="Navbar__header">Go Discord Bot</div>
<Link to="/" className="Navbar__item" onlyActiveOnIndex activeClassName="Navbar__item--active">Home</Link>
<Link to="/soundboard" className="Navbar__item" activeClassName="Navbar__item--active">Soundboard</Link>
<Link to="/downloader" className="Navbar__item" activeClassName="Navbar__item--active">Youtube Downloader</Link>
<Link to="/pubg" className="Navbar__item" activeClassName="Navbar__item--active">Pubg</Link>
<Link to="/clips" className="Navbar__item" activeClassName="Navbar__item--active">Clips</Link>
<a href={oauthUrl} className="Navbar__item">Login</a>
</div>
);
constructor(props: Props) {
super(props);
this.state = {
token: null,
};
}
componentDidMount() {
const token = storage.getJWT();
if (token) {
const claims: any = jwt_decode(token!);
const email = claims['email'];
this.setState({ token, email });
}
}
private logout = () => {
localStorage.clear();
window.location.href = '/';
}
render() {
return (
<div className="Navbar">
<div className="Navbar__header">Go Discord Bot</div>
<Link to="/" className="Navbar__item" onlyActiveOnIndex activeClassName="Navbar__item--active">Home</Link>
<Link to="/soundboard" className="Navbar__item" activeClassName="Navbar__item--active">Soundboard</Link>
<Link to="/downloader" className="Navbar__item" activeClassName="Navbar__item--active">Youtube Downloader</Link>
{/* PUBG - DEPRECATED */}
{/* <Link to="/pubg" className="Navbar__item" activeClassName="Navbar__item--active">Pubg</Link> */}
<Link to="/clips" className="Navbar__item" activeClassName="Navbar__item--active">Clips</Link>
{ !this.state.token ?
<a href={oauthUrl} className="Navbar__item">Login</a> :
<a className="Navbar__item" onClick={this.logout}>Logout</a>
}
{this.state.email && <div className="Navbar__email">{this.state.email}</div>}
</div>
);
}
}