Skip to content

Commit cd0a43e

Browse files
aleckslualeckslu
committed
finished implementing oauth, we now have access to users data/token on electron-main and successfully passed it to Slack Login
1 parent 2542c07 commit cd0a43e

File tree

7 files changed

+122
-72
lines changed

7 files changed

+122
-72
lines changed

‎package-lock.json‎

Lines changed: 16 additions & 17 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
"dotenv": "^10.0.0",
3030
"electron-deeplink": "^1.0.8",
3131
"fs-extra": "^8.1.0",
32+
"jwt-decode": "^3.1.2",
3233
"localforage": "^1.7.3",
3334
"lodash": "^4.17.21",
3435
"lodash.isequal": "^4.5.0",

‎src-electron/main-process/electron-main.js‎

Lines changed: 29 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { app, BrowserWindow, net, shell, ipcMain } from "electron";
22
import { Deeplink } from "electron-deeplink";
33
import isDev from "electron-is-dev";
4+
import jwt_decode from 'jwt-decode';
45

56
import slackApiStuff from "../../secretStuff/slackApiStuff";
67

@@ -88,6 +89,7 @@ const deeplink = new Deeplink({
8889

8990
function getSlackAuth() {
9091
logEverywhere("inside getSlackAuth");
92+
// let chunkedTogether = ''
9193

9294
const authData = {
9395
client_id: clientId,
@@ -105,7 +107,7 @@ function getSlackAuth() {
105107
authData.client_secret +
106108
"&code=" +
107109
authData.code +
108-
"&grant_type=authorization_key" +
110+
"&grant_type=authorization_code" +
109111
"&redirect_uri=" +
110112
authData.redirect_uri;
111113
logEverywhere(url);
@@ -119,20 +121,33 @@ function getSlackAuth() {
119121
});
120122

121123
request.on("response", response => {
122-
let body;
123-
logEverywhere("RESPONSE RECEIVED SON");
124-
mainWindow.webContents.send("tokenReceived", response);
124+
logEverywhere(`STATUS: ${response.statusCode}`)
125+
// logEverywhere(`HEADERS: ${JSON.stringify(response.headers)})`) //error
126+
// let body;
127+
logEverywhere("request.on response received");
128+
// logEverywhere('SEND #1')
129+
// mainWindow.webContents.send("tokenReceived", response);
130+
125131
// logEverywhere('STATUS: ', response.statusCode)
126132
// logEverywhere(`HEADERS: ${JSON.stringify(response.headers)}`)
127-
response.on("data", data => {
128-
// logEverywhere(`response.on datas CHUNK: ${chunk}`)
129-
logEverywhere("chunked");
130-
logEverywhere(data);
131-
body = data;
132-
});
133133
response.on("end", () => {
134134
logEverywhere("Response ended ");
135-
mainWindow.webContents.send("tokenReceived", body);
135+
});
136+
response.on("data", data => {
137+
// logEverywhere(`response.on datas CHUNK: ${chunk}`)
138+
// logEverywhere("chunked");
139+
// logEverywhere(`data.id_token: ${data.id_token}`);
140+
// body = data;
141+
logEverywhere("res on data ");
142+
const decoded = JSON.parse(data.toString())
143+
decoded.id_token = jwt_decode(decoded.id_token)
144+
145+
// chunkedTogether += data
146+
147+
// logEverywhere(data + ')'); //error
148+
logEverywhere(`decoded: ${decoded}`)
149+
logEverywhere('SEND #2')
150+
mainWindow.webContents.send("tokenReceived", decoded);
136151
});
137152
});
138153
request.end();
@@ -141,11 +156,12 @@ function getSlackAuth() {
141156
function getSlackToken() {
142157
return deeplink.on("received", link => {
143158
logEverywhere(`auth worked here link: ${link}`);
144-
// authCode = link.split("=")[1];
145-
authCode = link.split("=")[1].split(".")[2];
159+
authCode = link.split("=")[1];
160+
// authCode = link.split("=")[1].split(".")[2];
146161
getSlackAuth();
147162
});
148163
}
164+
// overvue://lkjasdgjkasdg-235235235.235235235.235235235235235235235235
149165

150166
function createWindow() {
151167
/**

‎src/App.vue‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ const cloneDeep = require('lodash.clonedeep')
1010
const throttle = require('lodash.throttle')
1111
import { defaultState } from './store/state/index.js'
1212
13-
1413
// use this to make sure these actions don't count as things you "undo"
1514
const ignoredActions = new Set([
1615
'setActiveComponent',

‎src/components/slack_login/SlackLoginWindow.vue‎

Lines changed: 73 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,63 @@
1+
<!--<template v-if="show">-->
12
<template>
2-
<div>
3-
<!--
4-
Slack Login Button:
5-
-->
6-
<q-btn @click="slackOauth" class="slackBtn" >
7-
8-
<svg xmlns="http://www.w3.org/2000/svg" style="height:20px;width:20px;margin-right:12px" viewBox="0 0 122.8 122.8">
9-
<path d="M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z" fill="#e01e5a"></path>
10-
<path d="M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z" fill="#36c5f0"></path>
11-
<path d="M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z" fill="#2eb67d"></path>
12-
<path d="M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z" fill="#ecb22e"></path>
13-
</svg>Sign in with Slack
14-
</q-btn>
15-
<!--
16-
Skip button:
17-
-->
18-
<br/>
19-
<q-btn @click="skipToHomePage" class="skipBtn" >Skip</q-btn>
20-
</div>
3+
<div>
4+
<div>
5+
<q-btn class ="openModalBtn" @click="openLogin" >
6+
<svg xmlns="http://www.w3.org/2000/svg" style="height:18px;width:18px;margin-right:0" viewBox="0 0 122.8 122.8">
7+
<path d="M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z" fill="#e01e5a"></path>
8+
<path d="M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z" fill="#36c5f0"></path>
9+
<path d="M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z" fill="#2eb67d"></path>
10+
<path d="M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z" fill="#ecb22e"></path>
11+
</svg>
12+
</q-btn>
13+
</div>
14+
<q-dialog v-model="showLogin" position="top" persistent>
15+
<q-card class="slack-login">
16+
<!--
17+
Slack Login Button:
18+
-->
19+
<q-btn @click="slackOauth" class="slackBtn" >
2120

21+
<svg xmlns="http://www.w3.org/2000/svg" style="height:20px;width:20px;margin-right:12px" viewBox="0 0 122.8 122.8">
22+
<path d="M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z" fill="#e01e5a"></path>
23+
<path d="M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z" fill="#36c5f0"></path>
24+
<path d="M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z" fill="#2eb67d"></path>
25+
<path d="M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z" fill="#ecb22e"></path>
26+
</svg>Sign in with Slack
27+
</q-btn>
28+
<!--
29+
Skip button:
30+
-->
31+
<br/>
32+
<q-btn @click="closeLogin()" class="skipBtn" >Skip</q-btn>
33+
</q-card>
34+
</q-dialog>
35+
</div>
2236
</template>
2337

38+
39+
40+
2441
<script>
2542
// import { mapState, mapActions } from 'vuex'
2643
import localforage from 'localforage'
2744
import { shell, ipcRenderer } from 'electron'
2845
import slackApiStuff from '../../../secretStuff/slackApiStuff.js'
2946
30-
3147
export default {
3248
name: 'SlackLoginWindow',
3349
data () {
3450
return {
35-
isAuthenticating: false
51+
isAuthenticating: false,
52+
showLogin: true,
3653
}
3754
},
3855
created () {
39-
ipcRenderer.on('tokenReceived', (data) => {
40-
console.log('data received in SlackLoginWindow: ', data)
56+
ipcRenderer.on('tokenReceived', (event, data) => {
57+
// JSON.parse(data).then(output => {
58+
// console.log('PARSED DATA: ', output)
59+
// })
60+
console.log('data in SlackLoginWindow: ', data)
4161
})
4262
},
4363
methods: {
@@ -53,7 +73,6 @@ export default {
5373
this.isAuthenticating = true;
5474
5575
console.log('clicked')
56-
// shell.openExternal(this.oauthURL)
5776
// window.open(this.oauthURL, '_blank')
5877
shell.openExternal(
5978
`${slackBaseUrl}?response_type=${responseType}&scope=${scope}&client_id=${clientId}&redirect_uri=${redirectUri}`,
@@ -62,17 +81,25 @@ export default {
6281
// .then(data => console.log(data))
6382
// .then(data => )
6483
},
65-
skipToHomePage: function () {
66-
console.log('CLICKK')
67-
console.log('process.env: ', process.env)
68-
console.log('process.platform: ', process.platform)
84+
closeLogin: function () {
85+
this.showLogin = false
86+
},
87+
openLogin: function () {
88+
this.showLogin = true
6989
}
7090
}
7191
}
7292
</script>
7393

7494
<style>
7595
96+
.slack-login {
97+
display: flex;
98+
flex-direction: column;
99+
align-items: center;
100+
padding: 3em;
101+
}
102+
76103
.slackBtn {
77104
align-items:center;
78105
color:#fff;
@@ -87,6 +114,7 @@ export default {
87114
justify-content:center;
88115
text-decoration:none;
89116
width:256px;
117+
margin: auto;
90118
}
91119
92120
.skipBtn {
@@ -100,6 +128,23 @@ export default {
100128
width:128px;
101129
text-decoration:none;
102130
justify-content:center;
131+
margin: auto;
132+
}
133+
134+
.openModalBtn {
135+
display:inline-flex;
136+
align-items:center;
137+
color:#000;
138+
background-color:#fff;
139+
border:1px solid #ddd;
140+
border-radius:36px;
141+
font-family:Lato, sans-serif;
142+
font-size:14px;
143+
font-weight:600;
144+
height:36px;
145+
justify-content:center;
146+
text-decoration:none;
147+
width:36px;
103148
}
104149
105150
</style>

0 commit comments

Comments
 (0)