Skip to content

Commit

Permalink
Edit codes improvements #259
Browse files Browse the repository at this point in the history
  • Loading branch information
Levminer committed Jun 23, 2023
1 parent ab9ccb2 commit 7712123
Show file tree
Hide file tree
Showing 3 changed files with 39 additions and 94 deletions.
73 changes: 8 additions & 65 deletions interface/windows/edit/edit.svelte
Original file line number Diff line number Diff line change
@@ -1,70 +1,13 @@
<div class="transparent-900 loadSavedCodes m-auto my-20 w-4/5 rounded-2xl p-10 text-left">
<h1 class="px-10">Load saved codes</h1>
<div class="mx-auto flex flex-col items-center justify-center rounded-2xl p-10">
<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Loading saved codes</h2>
<h3>Load your saved 2FA codes. You can edit or delete your codes, or you can even add new codes here.</h3>
</div>
<div class="ml-20 flex gap-3">
<button class="button" on:click={loadSavedCodes}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z" /><path d="m9 12 2 2 4-4" /></svg>
Confirm
</button>
</div>
</div>
</div>
</div>

<div class="transparent-900 editSavedCodes m-auto my-20 hidden w-4/5 rounded-2xl p-10 text-left">
<h1 class="px-10">Edit saved codes</h1>
<div class="mx-auto flex flex-col items-center justify-center rounded-2xl p-10">
<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Save changes</h2>
<h3>Save the changes you made. This will overwrite your codes.</h3>
</div>
<div class="ml-10 flex gap-3">
<button class="button" on:click={saveChanges}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" /><polyline points="17 21 17 13 7 13 7 21" /><polyline points="7 3 7 8 15 8" /></svg>
Save changes
</button>
</div>
</div>

<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Revert changes</h2>
<h3>You can revert the current changes you made.</h3>
</div>
<div class="ml-10 flex gap-3">
<button class="button" on:click={revertChanges}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10" /><line x1="12" y1="8" x2="12" y2="12" /><line x1="12" y1="16" x2="12.01" y2="16" /></svg>
Revert changes
</button>
</div>
</div>

<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Delete codes</h2>
<h3>You can delete all codes. Be careful, this can not be undone.</h3>
</div>
<div class="ml-10 flex gap-3">
<button class="button" on:click={deleteCodes}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18" /><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" /><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" /><line x1="10" y1="11" x2="10" y2="17" /><line x1="14" y1="11" x2="14" y2="17" /></svg>
Delete codes
</button>
</div>
</div>
</div>
</div>

<div class="transparent-900 loadedCodes m-auto mb-20 hidden w-4/5 rounded-2xl p-10 text-left">
<h1 class="px-10">Loaded codes</h1>
<div class="transparent-900 loadedCodes m-auto my-20 hidden w-4/5 rounded-2xl p-10 text-left">
<h1 class="px-10">Edit codes</h1>
<div class="content mx-auto flex flex-col items-center justify-center rounded-2xl p-10" />
</div>

<script lang="ts">
import { deleteCodes, loadSavedCodes, revertChanges, saveChanges } from "./index"
import { onMount } from "svelte"
import { deleteCodes, loadSavedCodes } from "./index"

Check warning on line 8 in interface/windows/edit/edit.svelte

View workflow job for this annotation

GitHub Actions / build

'deleteCodes' is defined but never used
onMount(() => {
loadSavedCodes()
})
</script>
46 changes: 17 additions & 29 deletions interface/windows/edit/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,7 @@ let secrets: string[] = []
* Generate the edit elements from the saved codes
*/
const generateEditElements = () => {
document.querySelector(".editSavedCodes").style.display = "block"
document.querySelector(".loadedCodes").style.display = "block"
document.querySelector(".loadSavedCodes").style.display = "none"

for (let i = 0; i < names.length; i++) {
// create div
Expand Down Expand Up @@ -69,7 +67,9 @@ export const loadSavedCodes = async () => {
const codes = settings.vault.codes

if (codes === null) {
return dialog.message("No save file found. \n\nGo to the codes or the import page and import your codes!", { type: "error" })
await dialog.message("No save file found. \n\nGo to the codes or the import page and import your codes!", { type: "error" })

return navigate("import")
}

const decryptedText = await decryptData(codes)
Expand All @@ -86,12 +86,6 @@ export const loadSavedCodes = async () => {
* Save the current changes
*/
export const saveChanges = async () => {
const confirm = await dialog.ask("Are you sure you want to save the changes? \n\nThis will overwrite your saved codes!", { type: "warning" })

if (confirm === false) {
return
}

let saveText = ""

for (let i = 0; i < names.length; i++) {
Expand All @@ -103,21 +97,6 @@ export const saveChanges = async () => {

settings.vault.codes = encryptedText
setSettings(settings)

navigate("codes")
}

/**
* Revert all current changes
*/
export const revertChanges = async () => {
const confirm = await dialog.ask("Are you sure you want to revert all changes? \n\nYou will lose all current changes!", { type: "warning" })

if (confirm === false) {
return
}

location.reload()
}

/**
Expand All @@ -143,7 +122,7 @@ export const deleteCodes = async () => {
/**
* Edit a specific code
*/
export const editCode = (id: number) => {
export const editCode = async (id: number) => {
const issuer: HTMLInputElement = document.querySelector(`#issuer${id}`)
const name: HTMLInputElement = document.querySelector(`#name${id}`)

Expand All @@ -167,24 +146,33 @@ export const editCode = (id: number) => {
const newIssuer = document.querySelector(`#issuer${id}`).value
const newName = document.querySelector(`#name${id}`).value

issuers[id] = newIssuer
names[id] = newName
const res = await dialog.ask("Do you want to save your changes?", { type: "warning" })

dialog.message("Code edited. \n\nYou can save or revert this change at the top of the page.")
if (res === true) {
issuers[id] = newIssuer
names[id] = newName

saveChanges()
} else {
issuer.value = issuers[id]
name.value = names[id]
}
}
}

/**
* Delete a specific code
*/
export const deleteCode = async (id: number) => {
const res = await dialog.ask("Are you sure you want to delete this code? \n\nYou can save or revert this change at the top of the page.", { type: "warning" })
const res = await dialog.ask("Are you sure you want to delete this code? \n\nYou can not revert this.", { type: "warning" })

if (res === true) {
names.splice(id, 1)
secrets.splice(id, 1)
issuers.splice(id, 1)

document.querySelector(`#edit${id}`).remove()

saveChanges()
}
}
14 changes: 14 additions & 0 deletions interface/windows/settings/settings.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,19 @@
<h1 class="px-10">Codes</h1>

<div class="mx-auto flex flex-col items-center justify-center rounded-2xl p-10">
<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Delete codes</h2>
<h3>You can delete all codes. Be careful, this can not be undone.</h3>
</div>
<div class="ml-20 flex gap-3">
<button class="button" on:click={deleteCodes}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18" /><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" /><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" /><line x1="10" y1="11" x2="10" y2="17" /><line x1="14" y1="11" x2="14" y2="17" /></svg>
Delete codes
</button>
</div>
</div>

<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
<div>
<h2>Codes description</h2>
Expand Down Expand Up @@ -190,6 +203,7 @@
import { settings } from "../../stores/settings"
import { open } from "../../utils/navigate"
import { deleteShortcut, editShortcut, resetShortcut, shortcuts } from "../../utils/shortcuts"
import { deleteCodes } from "../edit/index"
$: windowCapture = false
</script>

0 comments on commit 7712123

Please sign in to comment.