diff --git a/package-lock.json b/package-lock.json index df6f9bab1..e4ccf88f1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -38,6 +38,7 @@ "luxon": "^3.3.0", "merkletreejs": "^0.3.10", "moment": "^2.29.4", + "notiwind": "^2.0.2", "papaparse": "^5.4.1", "pina": "^0.20.2204228", "pinia-plugin-persistedstate": "^3.1.0", @@ -20928,6 +20929,11 @@ "node": ">= 8" } }, + "node_modules/mitt": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz", + "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==" + }, "node_modules/mkdirp": { "version": "0.5.6", "resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz", @@ -21275,6 +21281,17 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/notiwind": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/notiwind/-/notiwind-2.0.2.tgz", + "integrity": "sha512-wMCf+07E093d0Q78C5UHroT9GQHm4mIGerhg7dGLJ0GN6zONqKj8nTR3clkq/Y44On9k28/0DtDNwOX7FT5p/A==", + "dependencies": { + "mitt": "^3.0.1" + }, + "peerDependencies": { + "vue": "^3.3.4" + } + }, "node_modules/npm-package-arg": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-7.0.0.tgz", diff --git a/package.json b/package.json index 062adb04f..de2f9cad5 100644 --- a/package.json +++ b/package.json @@ -38,6 +38,7 @@ "luxon": "^3.3.0", "merkletreejs": "^0.3.10", "moment": "^2.29.4", + "notiwind": "^2.0.2", "papaparse": "^5.4.1", "pina": "^0.20.2204228", "pinia-plugin-persistedstate": "^3.1.0", diff --git a/project.task.yaml b/project.task.yaml index 87fe0b5eb..e50f441df 100644 --- a/project.task.yaml +++ b/project.task.yaml @@ -26,6 +26,7 @@ tasks: - 24 Move to Vite +- .5 add link to further project / people when a project pays ahead - .5 add project ID to the URL, to make a project publicly-accessible - .5 remove edit from project page for projects owned by others - .5 fix where user 0 sees no txns from user 1 on contacts page but sees them on list page diff --git a/src/App.vue b/src/App.vue index 8b2af9248..8a0147614 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,5 +1,132 @@ diff --git a/src/libs/endorserServer.ts b/src/libs/endorserServer.ts index 60455fbfc..b351ff993 100644 --- a/src/libs/endorserServer.ts +++ b/src/libs/endorserServer.ts @@ -82,10 +82,15 @@ export function isHiddenDid(did) { /** always returns text, maybe UNNAMED_VISIBLE or UNKNOWN_ENTITY **/ -export function didInfo(did, activeDid, allMyDids, contacts) { - const myId: string | undefined = R.find(R.identity, allMyDids); +export function didInfo( + did: string, + activeDid: string, + allMyDids: Array, + contacts: Array, +): string { + const myId: string | undefined = R.find(R.equals(did), allMyDids, did); if (myId) { - return "You" + (myId.did !== activeDid ? " (Alt ID)" : ""); + return "You" + (myId !== activeDid ? " (Alt ID)" : ""); } else { const contact: Contact | undefined = R.find((c) => c.did === did, contacts); if (contact) { diff --git a/src/main.ts b/src/main.ts index bc3f7d580..14eb8d5c7 100644 --- a/src/main.ts +++ b/src/main.ts @@ -5,6 +5,7 @@ import "./registerServiceWorker"; import router from "./router"; import axios from "axios"; import VueAxios from "vue-axios"; +import Notifications from "notiwind"; import "./assets/styles/tailwind.css"; @@ -16,6 +17,7 @@ import { faChevronRight, faCircle, faCircleCheck, + faCircleInfo, faCircleQuestion, faCircleUser, faClock, @@ -45,6 +47,7 @@ import { faSquareCaretDown, faSquareCaretUp, faTrashCan, + faTriangleExclamation, faUser, faUsers, faXmark, @@ -57,6 +60,7 @@ library.add( faChevronRight, faCircle, faCircleCheck, + faCircleInfo, faCircleQuestion, faCircleUser, faClock, @@ -86,6 +90,7 @@ library.add( faSquareCaretDown, faSquareCaretUp, faTrashCan, + faTriangleExclamation, faUser, faUsers, faXmark, @@ -98,4 +103,5 @@ createApp(App) .use(createPinia()) .use(VueAxios, axios) .use(router) + .use(Notifications) .mount("#app"); diff --git a/src/router/index.ts b/src/router/index.ts index 501feda20..c524c1b75 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -182,4 +182,14 @@ const router = createRouter({ routes, }); +const errorHandler = (error, to, from) => { + // Handle the error here + console.error(error, to, from); + console.log("XXXXX"); + + // You can also perform additional actions, such as displaying an error message or redirecting the user to a specific page +}; + +router.onError(errorHandler); // Assign the error handler to the router instance + export default router; diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue index 23e730e7e..3edda7059 100644 --- a/src/views/AccountViewView.vue +++ b/src/views/AccountViewView.vue @@ -400,13 +400,19 @@ export default class AccountViewView extends Vue { this.limitsMessage = "No identity."; this.loadingLimits = false; } else { - this.alertMessage = - "Clear your cache and start over (after data backup)."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error Creating Account", + text: "Clear your cache and start over (after data backup).", + }, + -1, + ); console.error( "Telling user to clear cache at page create because:", err, ); - this.alertTitle = "Error Creating Account"; } } } @@ -418,13 +424,19 @@ export default class AccountViewView extends Vue { showContactGivesInline: this.showContactGives, }); } catch (err) { - this.alertMessage = - "Clear your cache and start over (after data backup)."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error Updating Contact Setting", + text: "Clear your cache and start over (after data backup).", + }, + -1, + ); console.error( "Telling user to clear cache after contact setting update because:", err, ); - this.alertTitle = "Error Updating Contact Setting"; } } @@ -440,11 +452,25 @@ export default class AccountViewView extends Vue { URL.revokeObjectURL(url); - this.alertTitle = "Download Started"; - this.alertMessage = "See your downloads directory for the backup."; + this.$notify( + { + group: "alert", + type: "toast", + title: "Download Started", + text: "See your downloads directory for the backup.", + }, + 5000, + ); } catch (error) { - this.alertTitle = "Export Error"; - this.alertMessage = "See console logs for more info."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Export Error", + text: "See console logs for more info.", + }, + -1, + ); console.error("Export Error:", error); } } diff --git a/src/views/ContactAmountsView.vue b/src/views/ContactAmountsView.vue index 76393eade..2f3770a80 100644 --- a/src/views/ContactAmountsView.vue +++ b/src/views/ContactAmountsView.vue @@ -151,10 +151,17 @@ export default class ContactsView extends Vue { this.loadGives(this.activeDid, this.contact); } } catch (err) { - this.alertTitle = "Error"; - this.alertMessage = - err.userMessage || - "There was an error retrieving the latest sweet, sweet action."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + err.userMessage || + "There was an error retrieving the latest sweet, sweet action.", + }, + -1, + ); } } @@ -178,9 +185,15 @@ export default class ContactsView extends Vue { resp.status, resp.data, ); - this.alertTitle = "Error With Server"; - this.alertMessage = - "Got an error retrieving your given time from the server."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: "Got an error retrieving your given time from the server.", + }, + -1, + ); } const url2 = @@ -199,9 +212,15 @@ export default class ContactsView extends Vue { resp2.status, resp2.data, ); - this.alertTitle = "Error With Server"; - this.alertMessage = - "Got an error retrieving your given time from the server."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: "Got an error retrieving your given time from the server.", + }, + -1, + ); } const sortedResult: Array = R.sort( @@ -211,8 +230,15 @@ export default class ContactsView extends Vue { ); this.giveRecords = sortedResult; } catch (error) { - this.alertTitle = "Error With Server"; - this.alertMessage = error as string; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: error as string, + }, + -1, + ); } } @@ -281,15 +307,29 @@ export default class ContactsView extends Vue { userMessage = error as string; } // Now set that error for the user to see. - this.alertTitle = "Error With Server"; - this.alertMessage = userMessage; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: userMessage, + }, + -1, + ); } } } cannotConfirmMessage() { - this.alertTitle = "Not Allowed"; - this.alertMessage = "Only the recipient can confirm final receipt."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Not Allowed", + text: "Only the recipient can confirm final receipt.", + }, + -1, + ); } } diff --git a/src/views/ContactGiftingView.vue b/src/views/ContactGiftingView.vue index 11b782139..dc32988b0 100644 --- a/src/views/ContactGiftingView.vue +++ b/src/views/ContactGiftingView.vue @@ -145,10 +145,17 @@ export default class HomeView extends Vue { this.feedLastViewedId = settings?.lastViewedClaimId; this.updateAllFeed(); } catch (err) { - this.alertTitle = "Error"; - this.alertMessage = - err.userMessage || - "There was an error retrieving the latest sweet, sweet action."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + err.userMessage || + "There was an error retrieving the latest sweet, sweet action.", + }, + -1, + ); } } @@ -197,17 +204,27 @@ export default class HomeView extends Vue { */ public async recordGive(giverDid, description, hours) { if (!this.activeDid) { - this.setAlert( - "Error", - "You must select an identity before you can record a give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must select an identity before you can record a give.", + }, + -1, ); return; } if (!description && !hours) { - this.setAlert( - "Error", - "You must enter a description or some number of hours.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must enter a description or some number of hours.", + }, + -1, ); return; } @@ -227,18 +244,38 @@ export default class HomeView extends Vue { if (isGiveCreationError(result)) { const errorMessage = getGiveCreationErrorMessage(result); console.log("Error with give result:", result); - this.setAlert( - "Error", - errorMessage || "There was an error recording the give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: errorMessage || "There was an error recording the give.", + }, + -1, ); } else { - this.setAlert("Success", "That gift was recorded."); + this.$notify( + { + group: "alert", + type: "success", + title: "Success", + text: "That gift was recorded.", + }, + -1, + ); } } catch (error) { console.log("Error with give caught:", error); - this.setAlert( - "Error", - getGiveErrorMessage(error) || "There was an error recording the give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + getGiveErrorMessage(error) || + "There was an error recording the give.", + }, + -1, ); } } diff --git a/src/views/ContactQRScanShowView.vue b/src/views/ContactQRScanShowView.vue index acef71f1d..08a6b9170 100644 --- a/src/views/ContactQRScanShowView.vue +++ b/src/views/ContactQRScanShowView.vue @@ -85,7 +85,15 @@ export default class ContactQRScanShow extends Vue { const accounts = await accountsDB.accounts.toArray(); const account = R.find((acc) => acc.did === this.activeDid, accounts); if (!account) { - this.alertMessage = "You have no identity yet."; + this.$notify( + { + group: "alert", + type: "warning", + title: "", + text: "You have no identity yet.", + }, + -1, + ); } else { const identity = await this.getIdentity(this.activeDid); const publicKeyHex = identity.keys[0].publicKeyHex; diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue index e3d214391..f828a898d 100644 --- a/src/views/ContactsView.vue +++ b/src/views/ContactsView.vue @@ -331,12 +331,19 @@ export default class ContactsView extends Vue { resp.status, resp.data, ); - this.alertTitle = "Error With Server"; - this.alertMessage = - "Got an error retrieving your " + - resp.config.url.includes("recipientDid") - ? "received" - : "given" + " time from the server."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: + "Got an error retrieving your " + + resp.config.url.includes("recipientDid") + ? "received" + : "given" + " time from the server.", + }, + -1, + ); } }; @@ -384,8 +391,15 @@ export default class ContactsView extends Vue { this.givenToMeConfirmed = givenToMeConfirmed; this.givenToMeUnconfirmed = givenToMeUnconfirmed; } catch (error) { - this.alertTitle = "Error With Server"; - this.alertMessage = error as string; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: error as string, + }, + -1, + ); } } @@ -478,18 +492,32 @@ export default class ContactsView extends Vue { try { const resp = await this.axios.post(url, payload, { headers }); if (resp.data?.success?.embeddedRecordError) { - this.alertTitle = "Registration Still Unknown"; let message = "There was some problem with the registration."; if (typeof resp.data.success.embeddedRecordError == "string") { message += " " + resp.data.success.embeddedRecordError; } - this.alertMessage = message; + this.$notify( + { + group: "alert", + type: "danger", + title: "Registration Still Unknown", + text: message, + }, + -1, + ); } else if (resp.data?.success?.handleId) { contact.registered = true; db.contacts.update(contact.did, { registered: true }); - this.alertTitle = "Registration Success"; - this.alertMessage = contact.name + " has been registered."; + this.$notify( + { + group: "alert", + type: "info", + title: "Registration Success", + text: contact.name + " has been registered.", + }, + -1, + ); } } catch (error) { let userMessage = "There was an error. See logs for more info."; @@ -504,8 +532,15 @@ export default class ContactsView extends Vue { userMessage = error as string; } // Now set that error for the user to see. - this.alertTitle = "Error With Server"; - this.alertMessage = userMessage; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: userMessage, + }, + -1, + ); } } } @@ -526,17 +561,39 @@ export default class ContactsView extends Vue { contact.seesMe = visibility; db.contacts.update(contact.did, { seesMe: visibility }); } else { - this.alertTitle = "Error With Server"; console.error("Bad response setting visibility: ", resp.data); if (resp.data.error?.message) { - this.alertMessage = resp.data.error?.message; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: resp.data.error?.message, + }, + -1, + ); } else { - this.alertMessage = "Bad server response of " + resp.status; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: "Bad server response of " + resp.status, + }, + -1, + ); } } } catch (err) { - this.alertTitle = "Error With Server"; - this.alertMessage = err as string; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: err as string, + }, + -1, + ); } } @@ -553,23 +610,52 @@ export default class ContactsView extends Vue { contact.seesMe = visibility; db.contacts.update(contact.did, { seesMe: visibility }); - this.alertTitle = "Refreshed"; - this.alertMessage = - this.nameForContact(contact, true) + - " can " + - (visibility ? "" : "not ") + - "see your activity."; + this.$notify( + { + group: "alert", + type: "toast", + title: "Refreshed", + text: + this.nameForContact(contact, true) + + " can " + + (visibility ? "" : "not ") + + "see your activity.", + }, + 5000, + ); } else { - this.alertTitle = "Error With Server"; if (resp.data.error?.message) { - this.alertMessage = resp.data.error?.message; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: resp.data.error?.message, + }, + -1, + ); } else { - this.alertMessage = "Bad server response of " + resp.status; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: "Bad server response of " + resp.status, + }, + -1, + ); } } } catch (err) { - this.alertTitle = "Error With Server"; - this.alertMessage = err as string; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: err as string, + }, + -1, + ); } } @@ -608,15 +694,35 @@ export default class ContactsView extends Vue { } } if (!this.isNumeric(this.hourInput)) { - this.alertTitle = "Input Error"; - this.alertMessage = - "This is not a valid number of hours: " + this.hourInput; + this.$notify( + { + group: "alert", + type: "danger", + title: "Input Error", + text: "This is not a valid number of hours: " + this.hourInput, + }, + -1, + ); } else if (!parseFloat(this.hourInput)) { - this.alertTitle = "Input Error"; - this.alertMessage = "Giving 0 hours does nothing."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Input Error", + text: "Giving 0 hours does nothing.", + }, + -1, + ); } else if (!identity) { - this.alertTitle = "Status Error"; - this.alertMessage = "No identity is available."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Status Error", + text: "No identity is available.", + }, + -1, + ); } else { // ask to confirm amount let toFrom; @@ -700,8 +806,15 @@ export default class ContactsView extends Vue { try { const resp = await this.axios.post(url, payload, { headers }); if (resp.data?.success?.handleId) { - this.alertTitle = "Done"; - this.alertMessage = "Successfully logged time to the server."; + this.$notify( + { + group: "alert", + type: "success", + title: "Done", + text: "Successfully logged time to the server.", + }, + -1, + ); if (fromDid === identity.did) { const newList = R.clone(this.givenByMeUnconfirmed); @@ -726,8 +839,15 @@ export default class ContactsView extends Vue { userMessage = error as string; } // Now set that error for the user to see. - this.alertTitle = "Error With Server"; - this.alertMessage = userMessage; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error With Server", + text: userMessage, + }, + -1, + ); } } } diff --git a/src/views/DiscoverView.vue b/src/views/DiscoverView.vue index a223f72e3..05c7d3e35 100644 --- a/src/views/DiscoverView.vue +++ b/src/views/DiscoverView.vue @@ -90,10 +90,12 @@
-

Canyon cleanup

+

{{ project.name }}

- {{ project.name }} + {{ + didInfo(project.issuerDid, activeDid, allMyDids, allContacts) + }}
@@ -111,8 +113,10 @@ import { Component, Vue } from "vue-facing-decorator"; import { accountsDB, db } from "@/db"; +import { Contact } from "@/db/tables/contacts"; import { MASTER_SETTINGS_KEY } from "@/db/tables/settings"; import { accessToken } from "@/libs/crypto"; +import { didInfo } from "@/libs/endorserServer"; import AlertMessage from "@/components/AlertMessage"; import QuickNav from "@/components/QuickNav"; import InfiniteScroll from "@/components/InfiniteScroll"; @@ -122,6 +126,8 @@ import InfiniteScroll from "@/components/InfiniteScroll"; }) export default class DiscoverView extends Vue { activeDid = ""; + allContacts: Array = []; + allMyDids: Array = []; apiServer = ""; searchTerms = ""; alertMessage = ""; @@ -133,11 +139,20 @@ export default class DiscoverView extends Vue { remoteCount = 0; isLoading = false; + // make this function available to the Vue template + didInfo = didInfo; + async mounted() { await db.open(); const settings = await db.settings.get(MASTER_SETTINGS_KEY); this.activeDid = settings?.activeDid || ""; this.apiServer = settings?.apiServer || ""; + this.allContacts = await db.contacts.toArray(); + + await accountsDB.open(); + const allAccounts = await accountsDB.accounts.toArray(); + this.allMyDids = allAccounts.map((acc) => acc.did); + this.searchLocal(); } @@ -166,7 +181,6 @@ export default class DiscoverView extends Vue { public async search(beforeId?: string) { let queryParams = "claimContents=" + encodeURIComponent(this.searchTerms); - console.log(beforeId); if (beforeId) { queryParams = queryParams + `&beforeId=${beforeId}`; } @@ -186,6 +200,16 @@ export default class DiscoverView extends Vue { if (response.status !== 200) { const details = await response.text(); + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: `There was a problem accessing the server. Please try again later. (${details})`, + }, + -1, + ); + throw details; } @@ -194,9 +218,8 @@ export default class DiscoverView extends Vue { const plans: ProjectData[] = results.data; if (plans) { for (const plan of plans) { - const { name, description, handleId = plan.handleId, rowid } = plan; - console.log("here"); - this.projects.push({ name, description, handleId, rowid }); + const { name, description, handleId, rowid, issuerDid } = plan; + this.projects.push({ name, description, handleId, rowid, issuerDid }); } this.remoteCount = this.projects.length; } else { @@ -204,9 +227,15 @@ export default class DiscoverView extends Vue { } } catch (e) { console.log("Error with feed load:", e); - this.alertMessage = - e.userMessage || "There was an error retrieving projects."; - this.alertTitle = "Error"; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: e.userMessage || "There was a problem retrieving projects.", + }, + -1, + ); } finally { this.isLoading = false; } @@ -240,6 +269,16 @@ export default class DiscoverView extends Vue { ); if (response.status !== 200) { + const details = await response.text(); + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: `There was a problem accessing the server. Please try again later. (${details})`, + }, + -1, + ); throw await response.text(); } @@ -263,9 +302,15 @@ export default class DiscoverView extends Vue { } } catch (e) { console.log("Error with feed load:", e); - this.alertMessage = - e.userMessage || "There was an error retrieving projects."; - this.alertTitle = "Error"; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: e.userMessage || "There was a problem retrieving projects.", + }, + -1, + ); } finally { this.isLoading = false; } @@ -278,8 +323,6 @@ export default class DiscoverView extends Vue { async loadMoreData(payload: boolean) { if (this.projects.length > 0 && payload) { const latestProject = this.projects[this.projects.length - 1]; - console.log("rowid", latestProject, payload); - console.log(Object.keys(latestProject)); if (this.isLocalActive) { this.searchLocal(latestProject["rowid"]); } else if (this.isRemoteActive) { diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index 24637f1e2..3af3b561a 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -6,6 +6,94 @@ Time Safari +
+

Notiwind Alert Test Suite

+ + + + + + + + + + +
+

Quick Action

Show appreciation to a contact:

@@ -157,10 +245,17 @@ export default class HomeView extends Vue { this.feedLastViewedId = settings?.lastViewedClaimId; this.updateAllFeed(); } catch (err) { - this.alertTitle = "Error"; - this.alertMessage = - err.userMessage || - "There was an error retrieving the latest sweet, sweet action."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + err.userMessage || + "There was an error retrieving the latest sweet, sweet action.", + }, + -1, + ); } } @@ -209,9 +304,15 @@ export default class HomeView extends Vue { }) .catch((e) => { console.log("Error with feed load:", e); - this.alertMessage = - e.userMessage || "There was an error retrieving feed data."; - this.alertTitle = "Error"; + this.$notify( + { + group: "alert", + type: "danger", + title: "Export Error", + text: e.userMessage || "There was an error retrieving feed data.", + }, + -1, + ); }); this.isHiddenSpinner = true; @@ -302,17 +403,27 @@ export default class HomeView extends Vue { */ public async recordGive(giverDid, description, hours) { if (!this.activeDid) { - this.setAlert( - "Error", - "You must select an identity before you can record a give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must select an identity before you can record a give.", + }, + -1, ); return; } if (!description && !hours) { - this.setAlert( - "Error", - "You must enter a description or some number of hours.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must enter a description or some number of hours.", + }, + -1, ); return; } @@ -332,19 +443,38 @@ export default class HomeView extends Vue { if (this.isGiveCreationError(result)) { const errorMessage = this.getGiveCreationErrorMessage(result); console.log("Error with give result:", result); - this.setAlert( - "Error", - errorMessage || "There was an error recording the give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: errorMessage || "There was an error recording the give.", + }, + -1, ); } else { - this.setAlert("Success", "That gift was recorded."); + this.$notify( + { + group: "alert", + type: "success", + title: "Success", + text: "That gift was recorded.", + }, + -1, + ); } } catch (error) { console.log("Error with give caught:", error); - this.setAlert( - "Error", - this.getGiveErrorMessage(error) || - "There was an error recording the give.", + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + this.getGiveErrorMessage(error) || + "There was an error recording the give.", + }, + -1, ); } } diff --git a/src/views/IdentitySwitcherView.vue b/src/views/IdentitySwitcherView.vue index f378e5116..41fdfef5c 100644 --- a/src/views/IdentitySwitcherView.vue +++ b/src/views/IdentitySwitcherView.vue @@ -133,13 +133,19 @@ export default class IdentitySwitcherView extends Vue { this.limitsMessage = "No identity."; this.loadingLimits = false; } else { - this.alertMessage = - "Clear your cache and start over (after data backup)."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error Creating Account", + text: "Clear your cache and start over (after data backup).", + }, + -1, + ); console.error( "Telling user to clear cache at page create because:", err, ); - this.alertTitle = "Error Creating Account"; } } } diff --git a/src/views/NewEditProjectView.vue b/src/views/NewEditProjectView.vue index f50e129d2..cf331231d 100644 --- a/src/views/NewEditProjectView.vue +++ b/src/views/NewEditProjectView.vue @@ -245,20 +245,41 @@ export default class NewEditProjectView extends Vue { if (serverError) { if (Object.prototype.hasOwnProperty.call(serverError, "message")) { console.log(serverError); - this.alertTitle = "User Message"; userMessage = serverError.response.data.error.message; // This is info for the user. - this.alertMessage = userMessage; + this.$notify( + { + group: "alert", + type: "danger", + title: "User Message", + text: userMessage, + }, + -1, + ); } else { - this.alertTitle = "Server Message"; - this.alertMessage = JSON.stringify(serverError.toJSON()); + this.$notify( + { + group: "alert", + type: "danger", + title: "Server Message", + text: JSON.stringify(serverError.toJSON()), + }, + -1, + ); } } else { console.error( "Here's the full error trying to save the claim:", error, ); - this.alertTitle = "Claim Error"; - this.alertMessage = error as string; + this.$notify( + { + group: "alert", + type: "danger", + title: "Claim Error", + text: error as string, + }, + -1, + ); } // Now set that error for the user to see. this.errorMessage = userMessage; diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue index f53dc3fc8..5fa3dbc32 100644 --- a/src/views/ProjectViewView.vue +++ b/src/views/ProjectViewView.vue @@ -93,7 +93,7 @@

Given to this Project

-

... and from this Project

+

... and paid forward from this Project

@@ -108,7 +108,12 @@ }}
- + + {{ give.amount }}
@@ -130,7 +135,12 @@ }}
- + + {{ give.amount }}
@@ -285,16 +295,38 @@ export default class ProjectViewView extends Vue { this.truncatedDesc = this.description.slice(0, this.truncateLength); } else if (resp.status === 404) { // actually, axios throws an error so we never get here - this.alertMessage = "That project does not exist."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "That project does not exist.", + }, + -1, + ); } } catch (error: unknown) { const serverError = error as AxiosError; if (serverError.response?.status === 404) { - this.alertMessage = "That project does not exist."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "That project does not exist.", + }, + -1, + ); } else { - this.alertMessage = - "Something went wrong retrieving that project." + - " See logs for more info."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Something went wrong retrieving that project. See logs for more info.", + }, + -1, + ); console.error("Error retrieving project:", serverError.message); } } @@ -308,12 +340,27 @@ export default class ProjectViewView extends Vue { if (resp.status === 200 && resp.data.data) { this.givesToThis = resp.data.data; } else { - this.alertMessage = "Failed to retrieve gives to this project."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Failed to retrieve gives to this project.", + }, + -1, + ); } } catch (error: unknown) { const serverError = error as AxiosError; - this.alertMessage = - "Something went wrong retrieving gives to this project."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Something went wrong retrieving gives to this project.", + }, + -1, + ); console.error( "Error retrieving gives to this project:", serverError.message, @@ -329,11 +376,27 @@ export default class ProjectViewView extends Vue { if (resp.status === 200 && resp.data.data) { this.givesByThis = resp.data.data; } else { - this.alertMessage = "Failed to retrieve gives by this project."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Failed to retrieve gives by this project.", + }, + -1, + ); } } catch (error: unknown) { const serverError = error as AxiosError; - this.alertMessage = "Something went wrong retrieving gives by project."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Something went wrong retrieving gives by project.", + }, + -1, + ); console.error( "Error retrieving gives by this project:", serverError.message, @@ -364,16 +427,28 @@ export default class ProjectViewView extends Vue { */ async recordGive(giverDid, description, hours) { if (!this.activeDid) { - this.alertTitle = "Error"; - this.alertMessage = - "You must select an identity before you can record a give."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must select an identity before you can record a give.", + }, + -1, + ); return; } if (!description && !hours) { - this.alertTitle = "Error"; - this.alertMessage = - "You must enter a description or some number of hours."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You must enter a description or some number of hours.", + }, + -1, + ); return; } @@ -392,21 +467,42 @@ export default class ProjectViewView extends Vue { if (result.status !== 201 || result.data?.error) { console.log("Error with give result:", result); - this.alertTitle = "Error"; - this.alertMessage = - result.data?.error?.message || - "There was an error recording the give."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + result.data?.error?.message || + "There was an error recording the give.", + }, + -1, + ); } else { - this.alertTitle = "Success"; - this.alertMessage = "That gift was recorded."; + this.$notify( + { + group: "alert", + type: "success", + title: "Success", + text: "That gift was recorded.", + }, + -1, + ); } } catch (e) { console.log("Error with give caught:", e); - this.alertTitle = "Error"; - this.alertMessage = - e.userMessage || - e.response?.data?.error?.message || - "There was an error recording the give."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: + e.userMessage || + e.response?.data?.error?.message || + "There was an error recording the give.", + }, + -1, + ); } } } diff --git a/src/views/ProjectsView.vue b/src/views/ProjectsView.vue index 0def1230b..3605e0729 100644 --- a/src/views/ProjectsView.vue +++ b/src/views/ProjectsView.vue @@ -126,8 +126,15 @@ export default class ProjectsView extends Vue { } } catch (error) { console.error("Got error loading projects:", error.message); - this.alertTitle = "Error"; - this.alertMessage = "Got an error loading projects:" + error.message; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Got an error loading projects: " + error.message, + }, + -1, + ); } finally { this.isLoading = false; } @@ -196,8 +203,15 @@ export default class ProjectsView extends Vue { if (this.numAccounts === 0) { console.error("No accounts found."); - this.alertTitle = "Error"; - this.alertMessage = "You need an identity to load your projects."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "You need an identity to load your projects.", + }, + -1, + ); } else { const identity = await this.getIdentity(activeDid); this.current = identity; @@ -205,8 +219,15 @@ export default class ProjectsView extends Vue { } } catch (err) { console.log("Error initializing:", err); - this.alertTitle = "Error"; - this.alertMessage = "Something went wrong loading your projects."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Something went wrong loading your projects.", + }, + -1, + ); } } diff --git a/src/views/SeedBackupView.vue b/src/views/SeedBackupView.vue index 08129049d..05f3ea1f7 100644 --- a/src/views/SeedBackupView.vue +++ b/src/views/SeedBackupView.vue @@ -72,8 +72,15 @@ export default class SeedBackupView extends Vue { this.activeAccount = R.find((acc) => acc.did === activeDid, accounts); } catch (err) { console.error("Got an error loading an identity:", err); - this.alertTitle = "Error Loading Account"; - this.alertMessage = "Got an error loading your seed data."; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error Loading Account", + text: "Got an error loading your seed data.", + }, + -1, + ); } } diff --git a/src/views/StatisticsView.vue b/src/views/StatisticsView.vue index d98755332..0c2c7d625 100644 --- a/src/views/StatisticsView.vue +++ b/src/views/StatisticsView.vue @@ -62,8 +62,15 @@ export default class StatisticsView extends Vue { this.world = newWorld; } catch (err) { console.log(err); - this.alertTitle = "Mounting error"; - this.alertMessage = err.message; + this.$notify( + { + group: "alert", + type: "danger", + title: "Mounting Error", + text: err.message, + }, + -1, + ); } }