Compare commits
5 Commits
f8fa7a8507
...
ce93c2fb70
Author | SHA1 | Date | |
---|---|---|---|
ce93c2fb70 | |||
f32349717f | |||
78c5ab1a72 | |||
8c8b761c10 | |||
69dddcebb5 |
4
app.json
4
app.json
@ -6,11 +6,11 @@
|
|||||||
"appType": "app",
|
"appType": "app",
|
||||||
"version": {
|
"version": {
|
||||||
"code": 1,
|
"code": 1,
|
||||||
"name": "1.3.1"
|
"name": "1.3.0"
|
||||||
},
|
},
|
||||||
"icon": "icon.png",
|
"icon": "icon.png",
|
||||||
"vender": "zepp",
|
"vender": "zepp",
|
||||||
"description": "Another 2FAuthenticator based on TOTP for Zepp OS"
|
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4"
|
||||||
},
|
},
|
||||||
"permissions": ["data:os.device.info", "device:os.local_storage"],
|
"permissions": ["data:os.device.info", "device:os.local_storage"],
|
||||||
"runtime": {
|
"runtime": {
|
||||||
|
Binary file not shown.
Before Width: | Height: | Size: 87 KiB After Width: | Height: | Size: 74 KiB |
@ -46,9 +46,9 @@ export class BufferReader {
|
|||||||
if (length > bytesAvailable) {
|
if (length > bytesAvailable) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
"Not enough bytes left. Requested: " +
|
"Not enough bytes left. Requested: " +
|
||||||
length +
|
length +
|
||||||
" left: " +
|
" left: " +
|
||||||
bytesAvailable,
|
bytesAvailable,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -107,7 +107,7 @@ export function decodeProto(buffer) {
|
|||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
reader.resetToCheckpoint();
|
reader.resetToCheckpoint();
|
||||||
console.log(err);
|
console.log(`ERR: ${err}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
@ -13,21 +13,25 @@ export function getHOTP(counter, secret, digits = 6, hashType = "SHA-1") {
|
|||||||
//Stage 1: Prepare data
|
//Stage 1: Prepare data
|
||||||
const rawDataCounter = new DataView(new ArrayBuffer(8));
|
const rawDataCounter = new DataView(new ArrayBuffer(8));
|
||||||
rawDataCounter.setUint32(4, counter);
|
rawDataCounter.setUint32(4, counter);
|
||||||
|
|
||||||
const bCounter = new Uint8Array(rawDataCounter.buffer);
|
const bCounter = new Uint8Array(rawDataCounter.buffer);
|
||||||
const bSecret = new Uint8Array(
|
const bSecret = new Uint8Array(
|
||||||
decode(secret)
|
decode(secret)
|
||||||
.match(/.{1,2}/g)
|
.match(/.{1,2}/g)
|
||||||
.map((chunk) => parseInt(chunk, 16)),
|
.map((chunk) => parseInt(chunk, 16)),
|
||||||
); //confirmed
|
); //confirmed
|
||||||
|
|
||||||
//Stage 2: Hash data
|
//Stage 2: Hash data
|
||||||
const jssha = new jsSHA(hashType, "UINT8ARRAY");
|
const jssha = new jsSHA(hashType, "UINT8ARRAY");
|
||||||
jssha.setHMACKey(bSecret, "UINT8ARRAY");
|
jssha.setHMACKey(bSecret, "UINT8ARRAY");
|
||||||
jssha.update(bCounter);
|
jssha.update(bCounter);
|
||||||
const hmacResult = jssha.getHMAC("UINT8ARRAY"); //confirmed
|
const hmacResult = jssha.getHMAC("UINT8ARRAY"); //confirmed
|
||||||
|
|
||||||
//Stage 3: Dynamic truncate
|
//Stage 3: Dynamic truncate
|
||||||
const offsetB = hmacResult[19] & 0xf;
|
const offsetB = hmacResult[19] & 0xf;
|
||||||
const P = hmacResult.slice(offsetB, offsetB + 4);
|
const P = hmacResult.slice(offsetB, offsetB + 4);
|
||||||
P[0] = P[0] & 0x7f;
|
P[0] = P[0] & 0x7f;
|
||||||
|
|
||||||
//Stage 4: Format string
|
//Stage 4: Format string
|
||||||
let res = (
|
let res = (
|
||||||
new DataView(P.buffer).getInt32(0) % Math.pow(10, digits)
|
new DataView(P.buffer).getInt32(0) % Math.pow(10, digits)
|
||||||
|
@ -48,17 +48,12 @@ export class TOTP {
|
|||||||
*/
|
*/
|
||||||
getOTP(time = Date.now()) {
|
getOTP(time = Date.now()) {
|
||||||
const unixTime = (time / 1000 + this.timeOffset) / this.fetchTime;
|
const unixTime = (time / 1000 + this.timeOffset) / this.fetchTime;
|
||||||
const otp = getHOTP(
|
const otp = getHOTP(Math.floor(unixTime), this.secret, this.digits, this.hashType);
|
||||||
Math.floor(unixTime),
|
|
||||||
this.secret,
|
|
||||||
this.digits,
|
|
||||||
this.hashType,
|
|
||||||
);
|
|
||||||
const expireTime =
|
const expireTime =
|
||||||
time +
|
time +
|
||||||
(this.fetchTime -
|
(this.fetchTime -
|
||||||
((time / 1000 + this.timeOffset) % this.fetchTime)) *
|
((time / 1000 + this.timeOffset) % this.fetchTime)) *
|
||||||
1000;
|
1000;
|
||||||
const createdTime =
|
const createdTime =
|
||||||
time - ((time / 1000 + this.timeOffset) % this.fetchTime) * 1000;
|
time - ((time / 1000 + this.timeOffset) % this.fetchTime) * 1000;
|
||||||
|
|
||||||
|
Binary file not shown.
Before Width: | Height: | Size: 21 KiB |
@ -1,13 +1,12 @@
|
|||||||
{
|
{
|
||||||
"name": "totpfit",
|
"name": "totpfit",
|
||||||
"version": "1.3.1",
|
"version": "1.3.0",
|
||||||
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4",
|
"description": "Another 2FAuthenticator based on TOTP for Zepp Amazfit GTS 4",
|
||||||
"main": "app.js",
|
"main": "app.js",
|
||||||
"author": "Lisoveliy",
|
"author": "Lisoveliy",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@zeppos/device-types": "^3.0.0",
|
"@zeppos/device-types": "^3.0.0"
|
||||||
"prettier": "3.6.2"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@zeppos/zml": "^0.0.27",
|
"@zeppos/zml": "^0.0.27",
|
||||||
|
@ -2,18 +2,14 @@ import { RenderAddButton } from "./render/totpRenderer";
|
|||||||
import { initLoop } from "./render/index/renderer";
|
import { initLoop } from "./render/index/renderer";
|
||||||
import { BasePage } from "@zeppos/zml/base-page";
|
import { BasePage } from "@zeppos/zml/base-page";
|
||||||
import { LocalStorage } from "@zos/storage";
|
import { LocalStorage } from "@zos/storage";
|
||||||
import { setPageBrightTime } from "@zos/display";
|
|
||||||
|
|
||||||
const app = getApp();
|
const app = getApp();
|
||||||
|
|
||||||
const brightTimeMs = 300000;
|
|
||||||
|
|
||||||
let waitForFetch = true;
|
let waitForFetch = true;
|
||||||
|
|
||||||
Page(
|
Page(
|
||||||
BasePage({
|
BasePage({
|
||||||
onInit() {
|
onInit() {
|
||||||
setPageBrightTime({ brightTime: brightTimeMs });
|
|
||||||
this.getTOTPData()
|
this.getTOTPData()
|
||||||
.then((x) => {
|
.then((x) => {
|
||||||
app._options.globalData.TOTPS = JSON.parse(x) ?? [];
|
app._options.globalData.TOTPS = JSON.parse(x) ?? [];
|
||||||
@ -26,7 +22,7 @@ Page(
|
|||||||
this.initPage();
|
this.initPage();
|
||||||
})
|
})
|
||||||
.catch((x) => {
|
.catch((x) => {
|
||||||
console.log(`Init failed: ${x}`);
|
console.log(`ERR: Init failed - ${x}`);
|
||||||
try {
|
try {
|
||||||
let localStorage = new LocalStorage();
|
let localStorage = new LocalStorage();
|
||||||
app._options.globalData.TOTPS = JSON.parse(
|
app._options.globalData.TOTPS = JSON.parse(
|
||||||
|
@ -22,12 +22,11 @@ function renderContainers(buffer) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const renderData = [];
|
const renderData = [];
|
||||||
|
|
||||||
function renderTOTPs(buffer) {
|
function renderTOTPs(buffer) {
|
||||||
for (let i = 0; i < buffer.length; i++) {
|
for (let i = 0; i < buffer.length; i++) {
|
||||||
let otpData = TOTP.copy(buffer[i]).getOTP();
|
let otpData = TOTP.copy(buffer[i]).getOTP();
|
||||||
renderData[i] = {
|
renderData[i] = {
|
||||||
OTP: RenderOTPValue(i, formatOTP(otpData.otp)),
|
OTP: RenderOTPValue(i, otpData.otp),
|
||||||
expireBar: RenderExpireBar(
|
expireBar: RenderExpireBar(
|
||||||
i,
|
i,
|
||||||
otpData.createdTime,
|
otpData.createdTime,
|
||||||
@ -50,15 +49,9 @@ function renderTOTPs(buffer) {
|
|||||||
if (otpData.expireTime < Date.now()) {
|
if (otpData.expireTime < Date.now()) {
|
||||||
otpData = TOTP.copy(buffer[i]).getOTP();
|
otpData = TOTP.copy(buffer[i]).getOTP();
|
||||||
renderData[i].OTP.setProperty(prop.MORE, {
|
renderData[i].OTP.setProperty(prop.MORE, {
|
||||||
text: formatOTP(otpData.otp),
|
text: otpData.otp,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}, 50);
|
}, 50);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatOTP(otp) {
|
|
||||||
if (otp.length === 6) return `${otp.substring(0, 3)} ${otp.substring(3)}`;
|
|
||||||
|
|
||||||
return otp;
|
|
||||||
}
|
|
||||||
|
@ -9,32 +9,26 @@ export const colors = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const content = {
|
export const content = {
|
||||||
addTotpsHint:
|
addTotpsHint: "For add a 2FA TOTP record you must have otpauth:// link or otpauth-migration:// link from Google Authenticator Migration QR-Code",
|
||||||
"For add a 2FA TOTP record you must have otpauth:// link or otpauth-migration:// link from Google Authenticator Migration QR-Code",
|
|
||||||
totpRecordsHint: "TOTP records:",
|
|
||||||
createButton: {
|
createButton: {
|
||||||
placeHolder: "otpauth(-migration)://",
|
placeHolder: "otpauth(-migration)://",
|
||||||
label: "Add new TOTP record",
|
label: "Add new TOTP record"
|
||||||
},
|
},
|
||||||
instructionLink: {
|
instructionLink: {
|
||||||
label: "Instruction | Report issue (GitHub)",
|
label: "Instruction | Report issue (GitHub)",
|
||||||
source: "https://github.com/Lisoveliy/totpfit/blob/main/docs/guides/how-to-add-totps/README.md",
|
source: "https://github.com/Lisoveliy/totpfit/blob/main/docs/guides/how-to-add-totps/README.md"
|
||||||
},
|
},
|
||||||
changeButton: {
|
changeButton: {
|
||||||
label: "Change TOTP link",
|
label: "Change TOTP link",
|
||||||
placeHolder: "otpauth(-migration)://",
|
placeHolder: "otpauth(-migration)://"
|
||||||
},
|
},
|
||||||
deleteButton: {
|
deleteButton: {
|
||||||
label: "Delete",
|
label: "Delete"
|
||||||
},
|
},
|
||||||
totpLabelText: {
|
totpLabelText: {
|
||||||
eval(issuer, client) {
|
eval(issuer, client) {return `${issuer}: ${client}`;}
|
||||||
return `${issuer}: ${client}`;
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
totpDescText: {
|
totpDescText: {
|
||||||
eval(hashType, digits, fetchTime, timeOffset) {
|
eval(hashType, digits, fetchTime, timeOffset) { return `${hashType} | ${digits} digits | ${fetchTime} seconds | ${timeOffset} sec offset`; }
|
||||||
return `${hashType} | ${digits} digits | ${fetchTime} seconds | ${timeOffset} sec offset`;
|
}
|
||||||
},
|
};
|
||||||
},
|
|
||||||
};
|
|
337
setting/index.js
337
setting/index.js
@ -1,69 +1,7 @@
|
|||||||
import { getTOTPByLink } from "./utils/queryParser.js";
|
import { getTOTPByLink } from "./utils/queryParser.js";
|
||||||
import { createTOTPCard } from "./ui/card.js";
|
|
||||||
import { colors, content } from "./consts.js";
|
import { colors, content } from "./consts.js";
|
||||||
|
|
||||||
let _props = null;
|
let _props = null;
|
||||||
let editingIndex = -1;
|
|
||||||
let tempIssuer = "";
|
|
||||||
let tempClient = "";
|
|
||||||
let errorMessage = "";
|
|
||||||
|
|
||||||
function updateStorage(storage) {
|
|
||||||
_props.settingsStorage.setItem("TOTPs", JSON.stringify(storage));
|
|
||||||
}
|
|
||||||
|
|
||||||
function GetTOTPList(storage) {
|
|
||||||
return storage.map((element, index) => {
|
|
||||||
return createTOTPCard({
|
|
||||||
element,
|
|
||||||
index,
|
|
||||||
storage,
|
|
||||||
isEditing: editingIndex === index,
|
|
||||||
tempIssuer,
|
|
||||||
tempClient,
|
|
||||||
onIssuerChange: (val) => {
|
|
||||||
tempIssuer = val;
|
|
||||||
},
|
|
||||||
onClientChange: (val) => {
|
|
||||||
tempClient = val;
|
|
||||||
},
|
|
||||||
onRename: () => {
|
|
||||||
editingIndex = index;
|
|
||||||
tempIssuer = element.issuer;
|
|
||||||
tempClient = element.client;
|
|
||||||
updateStorage(storage);
|
|
||||||
},
|
|
||||||
onSave: () => {
|
|
||||||
storage[index].issuer = tempIssuer;
|
|
||||||
storage[index].client = tempClient;
|
|
||||||
editingIndex = -1;
|
|
||||||
updateStorage(storage);
|
|
||||||
},
|
|
||||||
onDelete: () => {
|
|
||||||
storage.splice(index, 1);
|
|
||||||
updateStorage(storage);
|
|
||||||
},
|
|
||||||
onMoveUp: () => {
|
|
||||||
if (index > 0) {
|
|
||||||
[storage[index], storage[index - 1]] = [
|
|
||||||
storage[index - 1],
|
|
||||||
storage[index],
|
|
||||||
];
|
|
||||||
updateStorage(storage);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onMoveDown: () => {
|
|
||||||
if (index < storage.length - 1) {
|
|
||||||
[storage[index], storage[index + 1]] = [
|
|
||||||
storage[index + 1],
|
|
||||||
storage[index],
|
|
||||||
];
|
|
||||||
updateStorage(storage);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
AppSettingsPage({
|
AppSettingsPage({
|
||||||
build(props) {
|
build(props) {
|
||||||
@ -75,44 +13,34 @@ AppSettingsPage({
|
|||||||
const addTOTPsHint =
|
const addTOTPsHint =
|
||||||
storage.length < 1
|
storage.length < 1
|
||||||
? Text(
|
? Text(
|
||||||
{
|
{
|
||||||
paragraph: true,
|
paragraph: true,
|
||||||
align: "center",
|
align: "center",
|
||||||
style: {
|
style: {
|
||||||
paddingTop: "10px",
|
paddingTop: "10px",
|
||||||
marginBottom: "10px",
|
marginBottom: "10px",
|
||||||
color: colors.text,
|
color: colors.text,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
verticalAlign: "middle",
|
verticalAlign: "middle",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
content.addTotpsHint,
|
content.addTotpsHint,
|
||||||
)
|
)
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const createButton = TextInput({
|
const createButton = TextInput({
|
||||||
placeholder: content.createButton.placeHolder,
|
placeholder: content.createButton.placeHolder,
|
||||||
label: content.createButton.label,
|
label: content.createButton.label,
|
||||||
onChange: (changes) => {
|
onChange: (changes) => {
|
||||||
try {
|
let link = getTOTPByLink(changes);
|
||||||
errorMessage = "";
|
if (link == null) {
|
||||||
let link = getTOTPByLink(changes);
|
console.log("ERR: link is invalid");
|
||||||
if (link == null) {
|
return;
|
||||||
throw new Error(
|
|
||||||
"Unsupported link type. Please use an otpauth:// or otpauth-migration:// link",
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (Array.isArray(link)) {
|
|
||||||
storage.push(...link);
|
|
||||||
} else {
|
|
||||||
storage.push(link);
|
|
||||||
}
|
|
||||||
updateStorage(storage);
|
|
||||||
} catch (e) {
|
|
||||||
errorMessage = e.message;
|
|
||||||
updateStorage(storage);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (Array.isArray(link)) storage.push(...link);
|
||||||
|
else storage.push(link);
|
||||||
|
|
||||||
|
updateStorage(storage);
|
||||||
},
|
},
|
||||||
labelStyle: {
|
labelStyle: {
|
||||||
backgroundColor: colors.notify,
|
backgroundColor: colors.notify,
|
||||||
@ -123,58 +51,18 @@ AppSettingsPage({
|
|||||||
fontSize: "20px",
|
fontSize: "20px",
|
||||||
color: colors.text,
|
color: colors.text,
|
||||||
borderRadius: "5px",
|
borderRadius: "5px",
|
||||||
height: "45px",
|
position: storage.length < 1 ? "absolute" : null, //TODO: Сделать что-то с этим кошмаром
|
||||||
|
bottom: storage.length < 1 ? "0px" : null,
|
||||||
|
left: storage.length < 1 ? "0px" : null,
|
||||||
|
right: storage.length < 1 ? "0px" : null,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const errorText = errorMessage
|
var body = Section(
|
||||||
? Text(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
color: colors.alert,
|
|
||||||
textAlign: "center",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
errorMessage,
|
|
||||||
)
|
|
||||||
: null; //TODO: Check for work
|
|
||||||
|
|
||||||
const bottomContainer = View(
|
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
backgroundColor: colors.bg,
|
backgroundColor: colors.bg,
|
||||||
},
|
minHeight: "100vh",
|
||||||
},
|
|
||||||
[
|
|
||||||
View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
display: "flex",
|
|
||||||
justifyContent: "center",
|
|
||||||
marginTop: "20px",
|
|
||||||
marginBottom: "20px",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
Link(
|
|
||||||
{
|
|
||||||
source: content.instructionLink.source,
|
|
||||||
},
|
|
||||||
content.instructionLink.label,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
errorText,
|
|
||||||
createButton,
|
|
||||||
].filter(Boolean),
|
|
||||||
);
|
|
||||||
|
|
||||||
const pageContainer = View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
backgroundColor: colors.bg,
|
|
||||||
height: "100vh",
|
|
||||||
display: "flex",
|
|
||||||
flexDirection: "column",
|
|
||||||
justifyContent: "space-between",
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[
|
[
|
||||||
@ -184,43 +72,154 @@ AppSettingsPage({
|
|||||||
textAlign: "center",
|
textAlign: "center",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[
|
storage.length < 1
|
||||||
storage.length < 1
|
? addTOTPsHint
|
||||||
? addTOTPsHint
|
: Text(
|
||||||
: Text(
|
{
|
||||||
{
|
align: "center",
|
||||||
align: "center",
|
paragraph: true,
|
||||||
paragraph: true,
|
style: {
|
||||||
style: {
|
marginBottom: "10px",
|
||||||
marginTop: "10px",
|
color: colors.bigText,
|
||||||
marginBottom: "10px",
|
fontSize: 23,
|
||||||
color: colors.bigText,
|
fontWeight: "500",
|
||||||
fontSize: 23,
|
verticalAlign: "middle",
|
||||||
fontWeight: "500",
|
},
|
||||||
verticalAlign: "middle",
|
},
|
||||||
},
|
"TOTP records:",
|
||||||
},
|
),
|
||||||
content.totpRecordsHint,
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
|
...totpEntrys,
|
||||||
|
createButton,
|
||||||
View(
|
View(
|
||||||
{
|
{
|
||||||
style: {
|
style: {
|
||||||
height: "100%",
|
display: "flex",
|
||||||
overflowX: "hidden",
|
justifyContent: "center",
|
||||||
overflowY: "auto",
|
|
||||||
backgroundColor: colors.bg,
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[...totpEntrys],
|
Link(
|
||||||
|
{
|
||||||
|
source: content.instructionLink.source,
|
||||||
|
},
|
||||||
|
content.instructionLink.label,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
|
|
||||||
bottomContainer,
|
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
|
return body;
|
||||||
return pageContainer;
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get DOM elements of TOTP records
|
||||||
|
* @param {*} storage Array of TOTP objects
|
||||||
|
* @returns Array of DOM elements
|
||||||
|
*/
|
||||||
|
function GetTOTPList(storage) {
|
||||||
|
let totpEntrys = [];
|
||||||
|
let counter = 0;
|
||||||
|
storage.forEach((element) => {
|
||||||
|
const elementId = counter;
|
||||||
|
const totpLabelText = Text(
|
||||||
|
{
|
||||||
|
align: "center",
|
||||||
|
style: {
|
||||||
|
color: colors.text,
|
||||||
|
fontSize: "18px",
|
||||||
|
fontWeight: "500",
|
||||||
|
},
|
||||||
|
paragraph: true,
|
||||||
|
},
|
||||||
|
content.totpLabelText.eval(element.issuer, element.client),
|
||||||
|
);
|
||||||
|
const changeButton = TextInput({
|
||||||
|
placeholder: content.changeButton.placeHolder,
|
||||||
|
label: content.changeButton.label,
|
||||||
|
onChange: (changes) => {
|
||||||
|
try {
|
||||||
|
let link = getTOTPByLink(changes);
|
||||||
|
if (Array.isArray(link)) return;
|
||||||
|
|
||||||
|
storage[elementId] = link;
|
||||||
|
updateStorage(storage);
|
||||||
|
} catch (err) {
|
||||||
|
console.log(`ERR: ${err}`);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
labelStyle: {
|
||||||
|
backgroundColor: colors.notify,
|
||||||
|
textAlign: "center",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
margin: "10px",
|
||||||
|
flexGrow: 1,
|
||||||
|
fontSize: "20px",
|
||||||
|
color: colors.text,
|
||||||
|
borderRadius: "5px",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const totpDescText = Text(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
color: colors.text,
|
||||||
|
fontSize: "14px",
|
||||||
|
},
|
||||||
|
align: "center",
|
||||||
|
},
|
||||||
|
content.totpDescText.eval(element.hashType, element.digits, element.fetchTime, element.timeOffset),
|
||||||
|
);
|
||||||
|
const deleteButton = Button({
|
||||||
|
onClick: () => {
|
||||||
|
storage = storage.filter(
|
||||||
|
(x) => storage.indexOf(x) != elementId,
|
||||||
|
);
|
||||||
|
updateStorage(storage);
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
backgroundColor: colors.alert,
|
||||||
|
fontSize: "18px",
|
||||||
|
color: colors.text,
|
||||||
|
height: "fit-content",
|
||||||
|
margin: "10px",
|
||||||
|
},
|
||||||
|
label: content.deleteButton.label,
|
||||||
|
});
|
||||||
|
const view = View(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
textAlign: "center",
|
||||||
|
backgroundColor: colors.secondaryBg,
|
||||||
|
borderRadius: "5px",
|
||||||
|
margin: "10px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[
|
||||||
|
totpLabelText,
|
||||||
|
totpDescText,
|
||||||
|
View(
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
display: "grid",
|
||||||
|
gridTemplateColumns: "1fr 100px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[changeButton, deleteButton],
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
totpEntrys.push({ text: totpDescText, view: view });
|
||||||
|
counter++;
|
||||||
|
});
|
||||||
|
|
||||||
|
return totpEntrys.map((x) => x.view);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update
|
||||||
|
* @param {*} storage Array of TOTP objects
|
||||||
|
*/
|
||||||
|
function updateStorage(storage) {
|
||||||
|
_props.settingsStorage.setItem("TOTPs", JSON.stringify(storage));
|
||||||
|
}
|
||||||
|
@ -1,186 +0,0 @@
|
|||||||
import { colors, content } from "../consts";
|
|
||||||
|
|
||||||
export function createTOTPCard({
|
|
||||||
element,
|
|
||||||
index,
|
|
||||||
storage,
|
|
||||||
isEditing,
|
|
||||||
tempIssuer,
|
|
||||||
tempClient,
|
|
||||||
onRename,
|
|
||||||
onSave,
|
|
||||||
onDelete,
|
|
||||||
onMoveUp,
|
|
||||||
onMoveDown,
|
|
||||||
onIssuerChange,
|
|
||||||
onClientChange,
|
|
||||||
}) {
|
|
||||||
const infoView = View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
display: "flex",
|
|
||||||
flexDirection: "column",
|
|
||||||
alignItems: "flex-start",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
isEditing
|
|
||||||
? [
|
|
||||||
TextInput({
|
|
||||||
label: "Rename Issuer",
|
|
||||||
value: tempIssuer,
|
|
||||||
onChange: onIssuerChange,
|
|
||||||
labelStyle: {
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
display: "flex",
|
|
||||||
alignItems: "center",
|
|
||||||
justifyContent: "center",
|
|
||||||
margin: "10px",
|
|
||||||
fontSize: "20px",
|
|
||||||
color: colors.text,
|
|
||||||
borderRadius: "5px",
|
|
||||||
height: "40px",
|
|
||||||
width: "200px"
|
|
||||||
},
|
|
||||||
subStyle: {
|
|
||||||
display: "none",
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
TextInput({
|
|
||||||
label: "Rename client",
|
|
||||||
value: tempClient,
|
|
||||||
onChange: onClientChange,
|
|
||||||
labelStyle: {
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
display: "flex",
|
|
||||||
alignItems: "center",
|
|
||||||
justifyContent: "center",
|
|
||||||
margin: "10px",
|
|
||||||
fontSize: "20px",
|
|
||||||
color: colors.text,
|
|
||||||
borderRadius: "5px",
|
|
||||||
height: "40px",
|
|
||||||
width: "200px"
|
|
||||||
},
|
|
||||||
subStyle: {
|
|
||||||
display: "none",
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
]
|
|
||||||
: [
|
|
||||||
Text(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
color: colors.text,
|
|
||||||
marginBottom: "2px",
|
|
||||||
fontWeight: "600",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
`Issuer: ${element.issuer}`,
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
{ style: { color: colors.text, fontWeight: "600" } },
|
|
||||||
`Client: ${element.client}`,
|
|
||||||
),
|
|
||||||
],
|
|
||||||
);
|
|
||||||
|
|
||||||
const buttonsView = View(
|
|
||||||
{ style: { display: "flex", flexDirection: "row" } },
|
|
||||||
isEditing
|
|
||||||
? [
|
|
||||||
Button({
|
|
||||||
label: "Save",
|
|
||||||
style: {
|
|
||||||
margin: "5px",
|
|
||||||
backgroundColor: "#28a745",
|
|
||||||
color: colors.text,
|
|
||||||
},
|
|
||||||
onClick: onSave,
|
|
||||||
}),
|
|
||||||
]
|
|
||||||
: [
|
|
||||||
Button({
|
|
||||||
label: "Rename",
|
|
||||||
style: {
|
|
||||||
margin: "5px",
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
color: colors.text,
|
|
||||||
},
|
|
||||||
onClick: onRename,
|
|
||||||
}),
|
|
||||||
Button({
|
|
||||||
label: "Delete",
|
|
||||||
style: {
|
|
||||||
margin: "5px",
|
|
||||||
backgroundColor: colors.alert,
|
|
||||||
color: colors.text,
|
|
||||||
},
|
|
||||||
onClick: onDelete,
|
|
||||||
}),
|
|
||||||
],
|
|
||||||
);
|
|
||||||
|
|
||||||
const reorderView = View(
|
|
||||||
{ style: { display: "flex", flexDirection: "column" } },
|
|
||||||
[
|
|
||||||
Button({
|
|
||||||
label: "⬆",
|
|
||||||
disabled: index === 0,
|
|
||||||
style: {
|
|
||||||
width: "50px",
|
|
||||||
margin: "2px",
|
|
||||||
color: colors.text,
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
},
|
|
||||||
onClick: onMoveUp,
|
|
||||||
}),
|
|
||||||
Button({
|
|
||||||
label: "⬇",
|
|
||||||
disabled: index === storage.length - 1,
|
|
||||||
style: {
|
|
||||||
width: "50px",
|
|
||||||
margin: "2px",
|
|
||||||
color: colors.text,
|
|
||||||
backgroundColor: colors.notify,
|
|
||||||
},
|
|
||||||
onClick: onMoveDown,
|
|
||||||
}),
|
|
||||||
],
|
|
||||||
);
|
|
||||||
|
|
||||||
const mainContent = View({ style: { flexGrow: 1, padding: "5px" } }, [
|
|
||||||
infoView,
|
|
||||||
Text(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
color: colors.text,
|
|
||||||
fontSize: "14px",
|
|
||||||
marginTop: "5px",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
content.totpDescText.eval(
|
|
||||||
element.hashType,
|
|
||||||
element.digits,
|
|
||||||
element.fetchTime,
|
|
||||||
element.timeOffset,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
buttonsView,
|
|
||||||
]);
|
|
||||||
|
|
||||||
return View(
|
|
||||||
{
|
|
||||||
style: {
|
|
||||||
display: "flex",
|
|
||||||
flexDirection: "row",
|
|
||||||
justifyContent: "space-between",
|
|
||||||
alignItems: "center",
|
|
||||||
backgroundColor: colors.secondaryBg,
|
|
||||||
borderRadius: "5px",
|
|
||||||
margin: "10px",
|
|
||||||
padding: "5px",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
[mainContent, reorderView],
|
|
||||||
);
|
|
||||||
}
|
|
@ -2,105 +2,13 @@ import { decodeProto, TYPES } from "../../lib/protobuf-decoder/protobufDecoder";
|
|||||||
import { TOTP } from "../../lib/totp-quickjs";
|
import { TOTP } from "../../lib/totp-quickjs";
|
||||||
import { base64decode, encode } from "../../lib/totp-quickjs/base32decoder";
|
import { base64decode, encode } from "../../lib/totp-quickjs/base32decoder";
|
||||||
|
|
||||||
const otpauthScheme = "otpauth://";
|
const otpauthScheme = "otpauth:/";
|
||||||
const googleMigrationScheme = "otpauth-migration://";
|
const googleMigrationScheme = "otpauth-migration:/";
|
||||||
|
|
||||||
function _parseSingleMigrationEntry(part) {
|
|
||||||
const totpProto = decodeProto(part.value);
|
|
||||||
const otpData = {};
|
|
||||||
|
|
||||||
const protoPartHandlers = {
|
|
||||||
1: (p) => {
|
|
||||||
otpData.secret = encode(p.value);
|
|
||||||
},
|
|
||||||
2: (p) => {
|
|
||||||
otpData.name = bytesToString(p.value);
|
|
||||||
},
|
|
||||||
3: (p) => {
|
|
||||||
otpData.issuer = bytesToString(p.value);
|
|
||||||
},
|
|
||||||
4: (p) => {
|
|
||||||
otpData.algorithm = p.value;
|
|
||||||
},
|
|
||||||
5: (p) => {
|
|
||||||
otpData.digits = p.value;
|
|
||||||
},
|
|
||||||
6: (p) => {
|
|
||||||
otpData.type = p.value;
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
totpProto.parts.forEach((p) => {
|
|
||||||
const handler = protoPartHandlers[p.index];
|
|
||||||
if (handler) {
|
|
||||||
handler(p);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
if (otpData.type !== "2") {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const digitsMap = { 1: 6, 2: 8 };
|
|
||||||
const algoMap = { 1: "SHA-1", 2: "SHA-256", 3: "SHA-512" };
|
|
||||||
|
|
||||||
const finalDigits = digitsMap[otpData.digits] || 6;
|
|
||||||
const finalAlgo = algoMap[otpData.algorithm] || "SHA-1";
|
|
||||||
const finalIssuer = otpData.issuer || otpData.name;
|
|
||||||
const finalName = otpData.name;
|
|
||||||
|
|
||||||
if (!otpData.secret || !finalName) {
|
|
||||||
throw new Error("Skipping record with missing secret or name.");
|
|
||||||
}
|
|
||||||
|
|
||||||
return new TOTP(
|
|
||||||
otpData.secret,
|
|
||||||
finalIssuer,
|
|
||||||
finalName,
|
|
||||||
finalDigits,
|
|
||||||
30,
|
|
||||||
0,
|
|
||||||
finalAlgo,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function getByGoogleMigrationScheme(link) {
|
|
||||||
try {
|
|
||||||
const data = link.split("data=")[1];
|
|
||||||
if (!data) return null;
|
|
||||||
|
|
||||||
const decodedData = decodeURIComponent(data);
|
|
||||||
const buffer = base64decode(decodedData);
|
|
||||||
const proto = decodeProto(buffer);
|
|
||||||
|
|
||||||
const totps = [];
|
|
||||||
const otpParameters = proto.parts.filter(
|
|
||||||
(p) => p.index === 1 && p.type === TYPES.LENDELIM,
|
|
||||||
);
|
|
||||||
|
|
||||||
otpParameters.forEach((part) => {
|
|
||||||
const totp = _parseSingleMigrationEntry(part);
|
|
||||||
if (totp) {
|
|
||||||
totps.push(totp);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return totps.length > 0 ? totps : null;
|
|
||||||
} catch (err) {
|
|
||||||
console.log("Failed to parse Google Migration scheme:", err);
|
|
||||||
throw new Error(
|
|
||||||
"Invalid otpauth-migration:// link. Failed to parse migration data.",
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getTOTPByLink(link) {
|
export function getTOTPByLink(link) {
|
||||||
if (link.startsWith(googleMigrationScheme)) {
|
if (link.includes(otpauthScheme)) return getByOtpauthScheme(link);
|
||||||
|
if (link.includes(googleMigrationScheme))
|
||||||
return getByGoogleMigrationScheme(link);
|
return getByGoogleMigrationScheme(link);
|
||||||
}
|
|
||||||
if (link.startsWith(otpauthScheme)) {
|
|
||||||
return getByOtpauthScheme(link);
|
|
||||||
}
|
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
@ -114,52 +22,80 @@ function getHashType(algorithm) {
|
|||||||
|
|
||||||
function getByOtpauthScheme(link) {
|
function getByOtpauthScheme(link) {
|
||||||
try {
|
try {
|
||||||
let args = link.split("?");
|
let args = link.split("/", otpauthScheme.length);
|
||||||
let path = args[0];
|
let type = args[2]; //Returns 'hotp' or 'totp'
|
||||||
let params = args[1];
|
let issuer = args[3].split(":")[0]?.split("?")[0]; //Returns issuer
|
||||||
|
let client =
|
||||||
let pathParts = path.split("/");
|
args[3].split(":")[1]?.split("?")[0] ??
|
||||||
let type = pathParts[2]; //hotp or totp
|
args[3].split(":")[0]?.split("?")[0]; //Returns client
|
||||||
let label = decodeURIComponent(pathParts[3]);
|
let secret = args[3].split("secret=")[1]?.split("&")[0]; //Returns secret
|
||||||
|
let period = args[3].split("period=")[1]?.split("&")[0]; //Returns period
|
||||||
let issuerFromLabel = label.includes(":") ? label.split(":")[0] : null;
|
let digits = args[3].split("digit=")[1]?.split("&")[0]; //Returns digits
|
||||||
let client = label.includes(":") ? label.split(":")[1].trim() : label;
|
let algorithm = args[3].split("algorithm=")[1]?.split("&")[0]; //Returns algorithm
|
||||||
|
let offset = args[3].split("offset=")[1]?.split("&")[0] ?? 0; //Returns offset
|
||||||
let secret = params.match(/secret=([^&]*)/)?.[1];
|
|
||||||
let issuerFromParams = params.match(/issuer=([^&]*)/)?.[1];
|
|
||||||
|
|
||||||
let issuer = issuerFromParams
|
|
||||||
? decodeURIComponent(issuerFromParams)
|
|
||||||
: issuerFromLabel;
|
|
||||||
if (!issuer) issuer = client;
|
|
||||||
|
|
||||||
let period = params.match(/period=([^&]*)/)?.[1];
|
|
||||||
let digits = params.match(/digits=([^&]*)/)?.[1];
|
|
||||||
let algorithm = params.match(/algorithm=([^&]*)/)?.[1];
|
|
||||||
let offset = params.match(/offset=([^&]*)/)?.[1] ?? 0;
|
|
||||||
|
|
||||||
if (type.toLowerCase() != "totp")
|
if (type.toLowerCase() != "totp")
|
||||||
throw new Error("Type is not valid, requires 'TOTP'");
|
throw new Error("Type is not valid, requires 'TOTP'");
|
||||||
|
|
||||||
if (!secret) throw new Error("Secret not defined");
|
if (secret === undefined) throw new Error("Secret not defined");
|
||||||
|
|
||||||
|
if (issuer == client) {
|
||||||
|
issuer = args[3].split("issuer=")[1]?.split("&")[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
issuer = decodeURIComponent(issuer);
|
||||||
|
client = decodeURIComponent(client);
|
||||||
|
|
||||||
return new TOTP(
|
return new TOTP(
|
||||||
secret,
|
secret,
|
||||||
issuer,
|
issuer,
|
||||||
client,
|
client,
|
||||||
Number(digits) || 6,
|
Number(digits),
|
||||||
Number(period) || 30,
|
Number(period),
|
||||||
Number(offset),
|
Number(offset),
|
||||||
getHashType(algorithm),
|
getHashType(algorithm),
|
||||||
);
|
);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log("Failed to parse otpauth scheme:", err);
|
console.log(`ERR: ${err}`);
|
||||||
throw new Error(
|
return null;
|
||||||
`Invalid otpauth:// link. Please check the link and try again. ERR: ${err}`,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getByGoogleMigrationScheme(link) {
|
||||||
|
let data = link.split("data=")[1]; //Returns base64 encoded data
|
||||||
|
data = decodeURIComponent(data);
|
||||||
|
let decode = base64decode(data);
|
||||||
|
let proto = decodeProto(decode);
|
||||||
|
|
||||||
|
let protoTotps = [];
|
||||||
|
|
||||||
|
proto.parts.forEach((part) => {
|
||||||
|
if (part.type == TYPES.LENDELIM) {
|
||||||
|
protoTotps.push(decodeProto(part.value));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let totps = [];
|
||||||
|
protoTotps.forEach((x) => {
|
||||||
|
let type = x.parts.filter((x) => x.index == 6)[0]; //find type of OTP
|
||||||
|
if (type.value !== "2") {
|
||||||
|
console.log("ERR: it's a not TOTP record");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let secret = x.parts.filter((x) => x.index == 1)[0].value;
|
||||||
|
secret = encode(secret);
|
||||||
|
|
||||||
|
let name = bytesToString(x.parts.filter((x) => x.index == 2)[0].value);
|
||||||
|
let issuer = bytesToString(
|
||||||
|
x.parts.filter((x) => x.index == 3)[0].value,
|
||||||
|
);
|
||||||
|
|
||||||
|
totps.push(new TOTP(secret, issuer, name, 6, 30, 0, "SHA-1"));
|
||||||
|
});
|
||||||
|
|
||||||
|
return totps;
|
||||||
|
}
|
||||||
|
|
||||||
function bytesToString(bytes) {
|
function bytesToString(bytes) {
|
||||||
let str = "";
|
let str = "";
|
||||||
for (let i = 0; i < bytes.length; i++) {
|
for (let i = 0; i < bytes.length; i++) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user