diff --git a/client/app/components/Navbar/Navbar.tsx b/client/app/components/Navbar/Navbar.tsx index ccb6ed4..581267f 100644 --- a/client/app/components/Navbar/Navbar.tsx +++ b/client/app/components/Navbar/Navbar.tsx @@ -1,18 +1,15 @@ import React from 'react'; import { NavLink } from 'react-router-dom'; import jwt_decode from 'jwt-decode'; -import { StorageService } from '../../services'; +import { OauthService, StorageService } from '../../services'; import './Navbar.scss'; -const baseUrl = window.location.origin + '/oauth'; - -const oauthUrl = `https://discordapp.com/api/oauth2/authorize?client_id=410818759746650140&redirect_uri=${baseUrl}&response_type=code&scope=identify%20guilds`; - interface Props {} interface State { token: string | null; email?: string; + oauthUrl?: string; } export class Navbar extends React.Component { @@ -24,20 +21,46 @@ export class Navbar extends React.Component { } componentDidMount() { + this.loadOauthUrl(); const token = StorageService.getJWT(); if (token) { - const claims: any = jwt_decode(token!); + const claims: any = jwt_decode(token); const email = claims['email']; this.setState({ token, email }); } } + async loadOauthUrl() { + try { + const oauthUrl = await OauthService.getOauthUrl(); + this.setState({ oauthUrl }); + } catch (e) { + console.error(e); + } + } + private logout = () => { StorageService.clear(); window.location.href = '/'; }; + renderLoginButton() { + if (!this.state.oauthUrl) { + return null; + } + + return !this.state.token ? ( + + Login + + ) : ( + + Logout + + ); + } + render() { return (
@@ -58,15 +81,7 @@ export class Navbar extends React.Component { Stats - {!this.state.token ? ( - - Login - - ) : ( - - Logout - - )} + {this.renderLoginButton()} {this.state.email &&
{this.state.email}
}
diff --git a/client/app/services/index.ts b/client/app/services/index.ts index f1bad6e..47481b8 100644 --- a/client/app/services/index.ts +++ b/client/app/services/index.ts @@ -1,2 +1,3 @@ export * from './axios.service'; +export * from './oauth.service'; export * from './storage.service'; diff --git a/client/app/services/oauth.service.ts b/client/app/services/oauth.service.ts new file mode 100644 index 0000000..03aba5a --- /dev/null +++ b/client/app/services/oauth.service.ts @@ -0,0 +1,18 @@ +import { axios } from './axios.service'; + +const redirectUrl = window.location.origin + '/oauth'; + +const getClientID = async (): Promise => { + const res = await axios.get('/api/config/client_id'); + return res.data['id']; +}; + +const getOauthUrl = async (): Promise => { + const clientID = await getClientID(); + return `https://discordapp.com/api/oauth2/authorize?client_id=${clientID}&redirect_uri=${redirectUrl}&response_type=code&scope=email%20identify`; +}; + +export const OauthService = { + getClientID, + getOauthUrl, +}; diff --git a/server/webserver/handlers/config.go b/server/webserver/handlers/config.go new file mode 100644 index 0000000..22964cd --- /dev/null +++ b/server/webserver/handlers/config.go @@ -0,0 +1,10 @@ +package handlers + +import ( + "github.com/gin-gonic/gin" + "github.com/mgerb/go-discord-bot/server/config" +) + +func GetClientID(c *gin.Context) { + c.JSON(200, map[string]string{"id": config.Config.ClientID}) +} diff --git a/server/webserver/server.go b/server/webserver/server.go index e2a7c68..f195e42 100644 --- a/server/webserver/server.go +++ b/server/webserver/server.go @@ -30,6 +30,7 @@ func getRouter() *gin.Engine { api.POST("/oauth", handlers.Oauth) api.GET("/logger/messages", handlers.GetMessages) api.GET("/logger/linkedmessages", handlers.GetLinkedMessages) + api.GET("/config/client_id", handlers.GetClientID) authorizedAPI := router.Group("/api") authorizedAPI.Use(middleware.AuthorizedJWT())