swcs/simplelogin-browser-extension
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #154 from simple-login/feature/add-login-with-proton-to-extension

Browse Source 
Add login with proton to extension
This commit is contained in:
Son Nguyen Kim
2022-06-18 19:03:32 +02:00
committed by GitHub
parent eb707a0f19 a9582503f6
commit 9c783804d1
7 changed files with 87 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.github/workflows/release.yaml
+7
View File
@@ -110,6 +110,13 @@ jobs:
echo "RELEASE_VERSION=$release_version" >> $GITHUB_ENV
echo "release version: $RELEASE_VERSION"
- name: Generate buildConfig
shell: bash
env:
ENABLE_LOGIN_WITH_PROTON: false
run: |
npm run generate:buildconfig
- name: Build lite version
if: ${{ matrix.variant }} == 'lite'
shell: bash
package.json
+1
View File
@@ -14,6 +14,7 @@
"build:beta": "cross-env NODE_ENV=production BETA=1 webpack",
"build:dev": "cross-env NODE_ENV=development BETA=1 webpack",
"build-zip": "node scripts/build-zip.js",
"generate:buildconfig": "node scripts/generateBuildConfig.js",
"watch": "npm run build -- --watch",
"watch:dev": "cross-env HMR=true npm run build:dev -- --watch",
"start": "cross-env HMR=true npm run build:dev -- --watch"
scripts/generateBuildConfig.js
+13
View File
@@ -0,0 +1,13 @@
const fs = require('fs');
const path = require('path');
const PATH = path.join(__dirname, '../src', 'popup', 'buildConfig.json');
const config = {
features: {
loginWithProtonEnabled: process.env.ENABLE_LOGIN_WITH_PROTON === 'true'
},
buildTime: new Date().getTime()
};
fs.writeFileSync(PATH, JSON.stringify(config, null, 2));
src/images/proton.svg
+19
View File
@@ -0,0 +1,19 @@
<svg width="12" height="16" viewBox="0 0 317 400" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_4917_2728)">
<path d="M-7.51553e-05 295.38V399.38H72.9999V299.89C72.9999 290.21 76.8455 280.925 83.6906 274.08C90.5357 267.235 99.8195 263.39 109.5 263.39H184.35C201.643 263.39 218.767 259.984 234.744 253.365C250.721 246.747 265.238 237.047 277.466 224.818C289.693 212.589 299.393 198.072 306.009 182.095C312.626 166.118 316.031 148.993 316.03 131.7C316.033 114.406 312.629 97.2805 306.012 81.302C299.396 65.3235 289.697 50.8052 277.469 38.5754C265.241 26.3457 250.724 16.6444 234.747 10.0256C218.769 3.40684 201.644 -0.00024434 184.35 -0.000244141H-7.51553e-05V130H72.9999V68.7H179.41C195.934 68.7 211.781 75.2633 223.466 86.9465C235.151 98.6298 241.717 114.476 241.72 131C241.72 147.525 235.155 163.374 223.47 175.06C211.785 186.745 195.936 193.31 179.41 193.31H102.04C88.6359 193.305 75.3623 195.942 62.978 201.07C50.5936 206.198 39.3412 213.716 29.8644 223.196C20.3877 232.675 12.8723 243.93 7.74797 256.316C2.62361 268.702 -0.00927507 281.976 -7.51553e-05 295.38Z" fill="url(#paint0_radial_4917_2728)"/>
<path d="M109.48 263.38C95.1024 263.379 80.8655 266.21 67.5822 271.711C54.2989 277.213 42.2296 285.277 32.0631 295.443C21.8967 305.61 13.8324 317.679 8.33096 330.962C2.82954 344.245 -0.00141216 358.483 -9.87253e-05 372.86V399.37H72.9999V299.88C72.9999 290.203 76.8427 280.922 83.6835 274.077C90.5242 267.233 99.8029 263.385 109.48 263.38Z" fill="url(#paint1_linear_4917_2728)"/>
</g>
<defs>
<radialGradient id="paint0_radial_4917_2728" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(317.15 -55.4503) scale(401.97 401.97)">
<stop stop-color="#A995FF"/>
<stop offset="1" stop-color="#6652F5"/>
</radialGradient>
<linearGradient id="paint1_linear_4917_2728" x1="54.7399" y1="379.7" x2="54.7399" y2="226.88" gradientUnits="userSpaceOnUse">
<stop stop-color="#6D4BFD"/>
<stop offset="1" stop-color="#1C0554"/>
</linearGradient>
<clipPath id="clip0_4917_2728">
<rect width="316.02" height="399.37" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

src/popup/Utils.js
+6
View File
@@ -1,4 +1,6 @@
const browser = require("webextension-polyfill");
const buildConfig = require("./buildConfig.json");
let toasted = null;
class Utils {
@@ -82,6 +84,10 @@ class Utils {
static cloneObject(obj) {
return JSON.parse(JSON.stringify(obj));
}
static getBuildConfig() {
return buildConfig;
}
}
export default Utils;
src/popup/buildConfig.json
+6
View File
@@ -0,0 +1,6 @@
{
"features": {
"loginWithProtonEnabled": false
},
"buildTime": 1655462531232
}
src/popup/components/Login.vue
+35 -5
View File
@@ -33,21 +33,35 @@
<button class="btn btn-primary btn-block mt-2">Login</button>
</form>
<div class="text-center">
<!-- Login with Proton -->
<div v-if="loginWithProtonEnabled">
<div class="text-center my-2 text-gray"><span>or</span></div>
<a
:href="apiUrl + '/auth/register?next=%2Fdashboard%2Fsetup_done'"
class="btn btn-primary btn-block mt-2 proton-button"
target="_blank"
class="mt-2 btn btn-outline-success btn-block"
:href="apiUrl + '/auth/proton/login?next=/onboarding/setup_done'"
>
Sign Up <font-awesome-icon icon="external-link-alt" />
<img class="mr-2" src="/images/proton.svg" />
Login with Proton
</a>
</div>
<div class="text-center">
<div class="text-center mt-2">
<button @click="showApiKeySetup" class="mt-2 btn btn-link text-center">
Sign in with API Key
</button>
</div>
<div class="text-center">
Don't have an account yet?
<a
:href="apiUrl + '/auth/register?next=%2Fdashboard%2Fsetup_done'"
target="_blank"
>
Sign Up
</a>
</div>
</div>
<!-- END Login/register screen -->
@@ -97,6 +111,8 @@ export default {
mfaCode: "",
isShowMfa: false,
apiUrl: "",
loginWithProtonEnabled:
Utils.getBuildConfig().features.loginWithProtonEnabled,
};
},
async mounted() {
@@ -171,3 +187,17 @@ export default {
computed: {},
};
</script>
<style lang="css">
.proton-button {
border-color: #6d4aff;
background-color: white;
color: #6d4aff;
}
.proton-button:hover {
background-color: #1b1340;
}
.text-gray {
color: #868e96;
}
</style>