Update 'project.task.yaml'

proposed move to jdenticon
Add button with gift icon for future dialog
2023-07-19 22:07:02 -04:00 · 2023-07-19 22:06:30 -04:00 · 2023-07-19 18:41:12 +08:00 · 2023-07-19 18:26:59 +08:00 · 2023-07-19 18:25:58 +08:00 · 2023-07-19 18:25:03 +08:00
20 changed files with 263 additions and 974 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -38,7 +38,6 @@
        "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",
@@ -20929,11 +20928,6 @@
        "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",
@@ -21281,17 +21275,6 @@
        "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",
--- a/package.json
+++ b/package.json
@@ -38,7 +38,6 @@
    "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",
--- a/project.task.yaml
+++ b/project.task.yaml
@@ -1,36 +1,32 @@

 tasks:
+- 40 notifications :
+  - push, where we trigger a ServiceWorker(?) in the app to reach out and check for new data assignee:matthew
+
 - 01 add a location for a project via map pin
 - 04 search by a bounding box for local projects (see API by clicking on "Nearby")
- 01 Replace Gifted/Give in ContactsView with GiftedDialog assignee:jose
- 02 Fix images on projectview - allow choice of image from a pallete of images or a url image.
+- 01 Replace Gifted/Give in ContactsView with GiftedDialog assignee:matthew
+- 02 Fix images on projectview - allow choice of image from a pallete of images or a url image (discovery page display also)
+  - SEE: https://github.com/dmester/jdenticon assignee:jose

- 08 Scan QR code to import into contacts.
+- 08 Scan QR code to import into contacts assignee:matthew
+  - SEE: https://github.com/gruhn/vue-qrcode-reader

- 40 notifications :
-    - push, where we trigger a ServiceWorker(?) in the app to reach out and check for new data
+- Show pop-up or some message confirming that settings & contacts download has been initiated/finished assignee:matthew

- refactor UI :
-  - .5 Alerts show at the top and can be missed if you've scrolled down on the page, eg. account data download
-  - .2 Make alerts at the top more visible (because they're currently a similar color and sometimes aren't seen)
-
- Show pop-up or some message confirming that settings & contacts download has been initiated/finished
-
- Ensure each action sent to the server has a confirmation - eg registration
+- Ensure each action sent to the server has a confirmation - eg registration (ie a toast something that dismisses after 5-10s)
+  - SEE: https://github.com/emmanuelsw/notiwind assignee:jose

 - Home Feed & Quick Give screen :
  - 01 save the feed-viewed status in settings storage ("afterQuery")
-  - 01 quick action - send action, maybe choose via canvas tool https://github.com/konvajs/vue-konva
+  - 01 quick action - send action, maybe choose via canvas tool 
+    - SEE: https://github.com/konvajs/vue-konva

- 24 Move to Vite
+- 24 Move to Vite assignee:matthew

- .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
- .2 there are three dots at the top of ProjectViewView that refreshes the page but doesn't do anything else
- 01 fix images on project page, on discovery page
 - .2 on ProjectViewView, show different messages for "to" and "from" sections if none exist
- .2 fix static icon to the right on project page (Matthew - I've made "Rotary" into issuer?)
+- .2 fix static icon to the right on project page (Matthew - I've made "Rotary" into issuer?) assignee:jose
 - .2 fix rate limit verbiage (with the new one-per-day allowance) assignee:trent

 - Discuss whether the remaining tasks are worthwhile before MVP release.
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,132 +1,5 @@
 <template>
  <router-view />
-
-  <NotificationGroup group="alert">
-    <div
-      class="fixed top-4 right-4 w-full max-w-sm flex flex-col items-start justify-end"
-    >
-      <Notification
-        v-slot="{ notifications, close }"
-        enter="transform ease-out duration-300 transition"
-        enter-from="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-4"
-        enter-to="translate-y-0 opacity-100 sm:translate-x-0"
-        leave="transition ease-in duration-500"
-        leave-from="opacity-100"
-        leave-to="opacity-0"
-        move="transition duration-500"
-        move-delay="delay-300"
-      >
-        <div
-          v-for="notification in notifications"
-          :key="notification.id"
-          class="w-full"
-          role="alert"
-        >
-          <div
-            v-if="notification.type === 'toast'"
-            class="w-full max-w-sm mx-auto mb-3 overflow-hidden bg-slate-900/90 text-white rounded-lg shadow-md"
-          >
-            <div class="w-full px-4 py-3">
-              <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
-            </div>
-          </div>
-
-          <div
-            v-if="notification.type === 'info'"
-            class="flex w-full max-w-sm mx-auto mb-3 overflow-hidden bg-slate-100 rounded-lg shadow-md"
-          >
-            <div
-              class="flex items-center justify-center w-12 bg-slate-600 text-slate-100"
-            >
-              <fa icon="circle-info" class="fa-fw fa-xl"></fa>
-            </div>
-
-            <div class="relative w-full pl-4 pr-8 py-2 text-slate-900">
-              <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
-
-              <button
-                @click="close(notification.id)"
-                class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-slate-200 text-slate-600"
-              >
-                <fa icon="xmark" class="fa-fw"></fa>
-              </button>
-            </div>
-          </div>
-
-          <div
-            v-if="notification.type === 'success'"
-            class="flex w-full max-w-sm mx-auto mb-3 overflow-hidden bg-emerald-100 rounded-lg shadow-md"
-          >
-            <div
-              class="flex items-center justify-center w-12 bg-emerald-600 text-emerald-100"
-            >
-              <fa icon="circle-info" class="fa-fw fa-xl"></fa>
-            </div>
-
-            <div class="relative w-full pl-4 pr-8 py-2 text-emerald-900">
-              <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
-
-              <button
-                @click="close(notification.id)"
-                class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-emerald-200 text-emerald-600"
-              >
-                <fa icon="xmark" class="fa-fw"></fa>
-              </button>
-            </div>
-          </div>
-
-          <div
-            v-if="notification.type === 'warning'"
-            class="flex w-full max-w-sm mx-auto mb-3 overflow-hidden bg-amber-100 rounded-lg shadow-md"
-          >
-            <div
-              class="flex items-center justify-center w-12 bg-amber-600 text-amber-100"
-            >
-              <fa icon="triangle-exclamation" class="fa-fw fa-xl"></fa>
-            </div>
-
-            <div class="relative w-full pl-4 pr-8 py-2 text-amber-900">
-              <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
-
-              <button
-                @click="close(notification.id)"
-                class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-amber-200 text-amber-600"
-              >
-                <fa icon="xmark" class="fa-fw"></fa>
-              </button>
-            </div>
-          </div>
-
-          <div
-            v-if="notification.type === 'danger'"
-            class="flex w-full max-w-sm mx-auto mb-3 overflow-hidden bg-rose-100 rounded-lg shadow-md"
-          >
-            <div
-              class="flex items-center justify-center w-12 bg-rose-600 text-rose-100"
-            >
-              <fa icon="triangle-exclamation" class="fa-fw fa-xl"></fa>
-            </div>
-
-            <div class="relative w-full pl-4 pr-8 py-2 text-rose-900">
-              <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
-
-              <button
-                @click="close(notification.id)"
-                class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-rose-200 text-rose-600"
-              >
-                <fa icon="xmark" class="fa-fw"></fa>
-              </button>
-            </div>
-          </div>
-        </div>
-      </Notification>
-    </div>
-  </NotificationGroup>
 </template>

 <style></style>
--- a/src/components/GiftedDialog.vue
+++ b/src/components/GiftedDialog.vue
@@ -2,7 +2,7 @@
  <div v-if="visible" class="dialog-overlay">
    <div class="dialog">
      <h1 class="text-xl font-bold text-center mb-4">
-        {{ message }} {{ giver?.name || "somebody not specified" }}
+        {{ message }} {{ giver?.did || "somebody not specified" }}
      </h1>
      <input
        type="text"
--- a/src/main.ts
+++ b/src/main.ts
@@ -5,7 +5,6 @@ import "./registerServiceWorker";
 import router from "./router";
 import axios from "axios";
 import VueAxios from "vue-axios";
-import Notifications from "notiwind";

 import "./assets/styles/tailwind.css";

@@ -17,7 +16,6 @@ import {
  faChevronRight,
  faCircle,
  faCircleCheck,
-  faCircleInfo,
  faCircleQuestion,
  faCircleUser,
  faClock,
@@ -47,7 +45,6 @@ import {
  faSquareCaretDown,
  faSquareCaretUp,
  faTrashCan,
-  faTriangleExclamation,
  faUser,
  faUsers,
  faXmark,
@@ -60,7 +57,6 @@ library.add(
  faChevronRight,
  faCircle,
  faCircleCheck,
-  faCircleInfo,
  faCircleQuestion,
  faCircleUser,
  faClock,
@@ -90,7 +86,6 @@ library.add(
  faSquareCaretDown,
  faSquareCaretUp,
  faTrashCan,
-  faTriangleExclamation,
  faUser,
  faUsers,
  faXmark,
@@ -103,5 +98,4 @@ createApp(App)
  .use(createPinia())
  .use(VueAxios, axios)
  .use(router)
-  .use(Notifications)
  .mount("#app");
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -182,14 +182,4 @@ 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;
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -400,19 +400,13 @@ export default class AccountViewView extends Vue {
        this.limitsMessage = "No identity.";
        this.loadingLimits = false;
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error Creating Account",
-            text: "Clear your cache and start over (after data backup).",
-          },
-          -1,
-        );
+        this.alertMessage =
+          "Clear your cache and start over (after data backup).";
        console.error(
          "Telling user to clear cache at page create because:",
          err,
        );
+        this.alertTitle = "Error Creating Account";
      }
    }
  }
@@ -424,19 +418,13 @@ export default class AccountViewView extends Vue {
        showContactGivesInline: this.showContactGives,
      });
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error Updating Contact Setting",
-          text: "Clear your cache and start over (after data backup).",
-        },
-        -1,
-      );
+      this.alertMessage =
+        "Clear your cache and start over (after data backup).";
      console.error(
        "Telling user to clear cache after contact setting update because:",
        err,
      );
+      this.alertTitle = "Error Updating Contact Setting";
    }
  }

@@ -452,25 +440,11 @@ export default class AccountViewView extends Vue {

      URL.revokeObjectURL(url);

-      this.$notify(
-        {
-          group: "alert",
-          type: "toast",
-          title: "Download Started",
-          text: "See your downloads directory for the backup.",
-        },
-        5000,
-      );
+      this.alertTitle = "Download Started";
+      this.alertMessage = "See your downloads directory for the backup.";
    } catch (error) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Export Error",
-          text: "See console logs for more info.",
-        },
-        -1,
-      );
+      this.alertTitle = "Export Error";
+      this.alertMessage = "See console logs for more info.";
      console.error("Export Error:", error);
    }
  }
--- a/src/views/ContactAmountsView.vue
+++ b/src/views/ContactAmountsView.vue
@@ -1,6 +1,18 @@
 <template>
  <QuickNav selected="Contacts"></QuickNav>
  <section id="Content" class="p-6 pb-24">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Back -->
+        <router-link
+          :to="{ name: 'contacts' }"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          ><fa icon="chevron-left" class="fa-fw"></fa
+        ></router-link>
+      </h1>
+    </div>
+
    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
      Given with {{ contact?.name }}
    </h1>
@@ -146,17 +158,10 @@ export default class ContactsView extends Vue {
        this.loadGives(this.activeDid, this.contact);
      }
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            err.userMessage ||
-            "There was an error retrieving the latest sweet, sweet action.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        err.userMessage ||
+        "There was an error retrieving the latest sweet, sweet action.";
    }
  }

@@ -180,15 +185,9 @@ export default class ContactsView extends Vue {
          resp.status,
          resp.data,
        );
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error With Server",
-            text: "Got an error retrieving your given time from the server.",
-          },
-          -1,
-        );
+        this.alertTitle = "Error With Server";
+        this.alertMessage =
+          "Got an error retrieving your given time from the server.";
      }

      const url2 =
@@ -207,15 +206,9 @@ export default class ContactsView extends Vue {
          resp2.status,
          resp2.data,
        );
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error With Server",
-            text: "Got an error retrieving your given time from the server.",
-          },
-          -1,
-        );
+        this.alertTitle = "Error With Server";
+        this.alertMessage =
+          "Got an error retrieving your given time from the server.";
      }

      const sortedResult: Array<GiveServerRecord> = R.sort(
@@ -225,15 +218,8 @@ export default class ContactsView extends Vue {
      );
      this.giveRecords = sortedResult;
    } catch (error) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error With Server",
-          text: error as string,
-        },
-        -1,
-      );
+      this.alertTitle = "Error With Server";
+      this.alertMessage = error as string;
    }
  }

@@ -302,29 +288,15 @@ export default class ContactsView extends Vue {
          userMessage = error as string;
        }
        // Now set that error for the user to see.
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error With Server",
-            text: userMessage,
-          },
-          -1,
-        );
+        this.alertTitle = "Error With Server";
+        this.alertMessage = userMessage;
      }
    }
  }

  cannotConfirmMessage() {
-    this.$notify(
-      {
-        group: "alert",
-        type: "danger",
-        title: "Not Allowed",
-        text: "Only the recipient can confirm final receipt.",
-      },
-      -1,
-    );
+    this.alertTitle = "Not Allowed";
+    this.alertMessage = "Only the recipient can confirm final receipt.";
  }
 }
 </script>
--- a/src/views/ContactGiftingView.vue
+++ b/src/views/ContactGiftingView.vue
@@ -145,17 +145,10 @@ export default class HomeView extends Vue {
      this.feedLastViewedId = settings?.lastViewedClaimId;
      this.updateAllFeed();
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            err.userMessage ||
-            "There was an error retrieving the latest sweet, sweet action.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        err.userMessage ||
+        "There was an error retrieving the latest sweet, sweet action.";
    }
  }

@@ -204,27 +197,17 @@ export default class HomeView extends Vue {
   */
  public async recordGive(giverDid, description, hours) {
    if (!this.activeDid) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must select an identity before you can record a give.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        "You must select an identity before you can record a give.",
      );
      return;
    }

    if (!description && !hours) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must enter a description or some number of hours.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        "You must enter a description or some number of hours.",
      );
      return;
    }
@@ -244,38 +227,18 @@ export default class HomeView extends Vue {
      if (isGiveCreationError(result)) {
        const errorMessage = getGiveCreationErrorMessage(result);
        console.log("Error with give result:", result);
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: errorMessage || "There was an error recording the give.",
-          },
-          -1,
+        this.setAlert(
+          "Error",
+          errorMessage || "There was an error recording the give.",
        );
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Success",
-            text: "That gift was recorded.",
-          },
-          -1,
-        );
+        this.setAlert("Success", "That gift was recorded.");
      }
    } catch (error) {
      console.log("Error with give caught:", error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            getGiveErrorMessage(error) ||
-            "There was an error recording the give.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        getGiveErrorMessage(error) || "There was an error recording the give.",
      );
    }
  }
--- a/src/views/ContactQRScanShowView.vue
+++ b/src/views/ContactQRScanShowView.vue
@@ -85,15 +85,7 @@ 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.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "",
-          text: "You have no identity yet.",
-        },
-        -1,
-      );
+      this.alertMessage = "You have no identity yet.";
    } else {
      const identity = await this.getIdentity(this.activeDid);
      const publicKeyHex = identity.keys[0].publicKeyHex;
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -70,9 +70,9 @@
    </div>

    <!-- Results List -->
-    <ul v-if="contacts.length > 0" class="border-t border-slate-300">
+    <ul v-if="contacts.length > 0">
      <li
-        class="border-b border-slate-300 py-4"
+        class="border-b border-slate-300"
        v-for="contact in contacts"
        :key="contact.did"
      >
@@ -85,82 +85,64 @@
            Public Key (base 64): {{ contact.publicKeyBase64 }}
          </div>

-          <div id="ContactActions" class="flex gap-1.5 mt-2">
-            <button
-              v-if="contact.seesMe"
-              class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-              @click="setVisibility(contact, false)"
-              title="They can see you"
-            >
-              <fa icon="eye" class="fa-fw" />
-            </button>
-            <button
-              v-else
-              class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-              @click="setVisibility(contact, true)"
-              title="They cannot see you"
-            >
-              <fa icon="eye-slash" class="fa-fw" />
-            </button>
+          <button
+            v-if="contact.seesMe"
+            class="tooltip"
+            @click="setVisibility(contact, false)"
+          >
+            <fa icon="eye" class="text-slate-900 fa-fw ml-1" />
+            <span class="tooltiptext">They can see you</span>
+          </button>
+          <button v-else class="tooltip" @click="setVisibility(contact, true)">
+            <span class="tooltiptext">They cannot see you</span>
+            <fa icon="eye-slash" class="text-slate-900 fa-fw ml-1" />
+          </button>

-            <button
-              class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-              @click="checkVisibility(contact)"
-              title="Check Visibility"
-            >
-              <fa icon="rotate" class="fa-fw" />
-            </button>
+          <button class="tooltip" @click="checkVisibility(contact)">
+            <span class="tooltiptext">Check Visibility</span>
+            <fa icon="rotate" class="text-slate-900 fa-fw ml-1" />
+          </button>

-            <button
-              v-if="contact.registered"
-              class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-              title="Registered"
-            >
-              <fa icon="person-circle-check" class="fa-fw" />
-            </button>
-            <button
-              v-else
-              @click="register(contact)"
-              class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-              title="Registration unknown"
-            >
-              <fa icon="person-circle-question" class="fa-fw" />
-            </button>
+          <button v-if="contact.registered" class="tooltip">
+            <span class="tooltiptext">Registered</span>
+            <fa icon="person-circle-check" class="text-slate-900 fa-fw ml-1" />
+          </button>
+          <button v-else @click="register(contact)" class="tooltip">
+            <span class="tooltiptext">Registration Unknown</span>
+            <fa
+              icon="person-circle-question"
+              class="text-slate-900 fa-fw ml-1"
+            />
+          </button>

-            <button
-              @click="deleteContact(contact)"
-              class="text-sm uppercase bg-red-600 text-white px-2 py-1.5 rounded-md"
-              title="Delete"
-            >
-              <fa icon="trash-can" class="fa-fw" />
-            </button>
+          <button @click="deleteContact(contact)" class="px-9 tooltip">
+            <span class="tooltiptext">Delete!</span>
+            <fa icon="trash-can" class="text-red-600 fa-fw ml-1" />
+          </button>

-            <div v-if="!showGiveNumbers" class="ml-auto flex gap-1.5">
-              <button
-                class="text-sm uppercase bg-blue-600 text-white px-2 py-1.5 rounded-md"
-                @click="onClickAddGive(activeDid, contact.did)"
-                title="givenByMeDescriptions[contact.did]"
-              >
-                To:
+          <div v-if="showGiveNumbers" class="float-right">
+            <div class="float-right">
+              <div class="tooltip">
+                to:
                {{
                  /* eslint-disable prettier/prettier */
                  this.showGiveTotals
                    ? ((givenByMeConfirmed[contact.did] || 0)
-                      + (givenByMeUnconfirmed[contact.did] || 0))
+                       + (givenByMeUnconfirmed[contact.did] || 0))
                    : this.showGiveConfirmed
                        ? (givenByMeConfirmed[contact.did] || 0)
                        : (givenByMeUnconfirmed[contact.did] || 0)
                  /* eslint-enable prettier/prettier */
                }}
-                <fa icon="plus" class="fa-fw" />
-              </button>
-
-              <button
-                class="text-sm uppercase bg-blue-600 text-white px-2 py-1.5 rounded-md"
-                @click="onClickAddGive(contact.did, activeDid)"
-                title="givenToMeDescriptions[contact.did]"
-              >
-                From:
+                <span
+                  v-if="givenByMeDescriptions[contact.did]"
+                  class="tooltiptext-left"
+                >
+                  {{ givenByMeDescriptions[contact.did] }}
+                </span>
+              </div>
+              <div class="tooltip px-2">
+                from:
                {{
                  /* eslint-disable prettier/prettier */
                  this.showGiveTotals
@@ -171,18 +153,25 @@
                        : (givenToMeUnconfirmed[contact.did] || 0)
                  /* eslint-enable prettier/prettier */
                }}
-                <fa icon="plus" class="fa-fw" />
-              </button>
-
+                <span
+                  v-if="givenToMeDescriptions[contact.did]"
+                  class="tooltiptext-left"
+                >
+                  {{ givenToMeDescriptions[contact.did] }}
+                </span>
+              </div>
              <router-link
                :to="{
                  name: 'contact-amounts',
                  query: { contactDid: contact.did },
                }"
-                class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
-                title="See all given activity"
+                class="tooltip"
              >
-                <fa icon="file-lines" class="fa-fw" />
+                <button>
+                  <fa icon="gift" class="pt-1 pr-2 text-slate-500" />Give
+                </button>
+                <fa icon="file-lines" class="text-slate-600 fa-fw ml-1" />
+                <span class="tooltiptext-left">See All Given Activity</span>
              </router-link>
            </div>
          </div>
@@ -214,12 +203,13 @@ import {
 import { Component, Vue } from "vue-facing-decorator";
 import AlertMessage from "@/components/AlertMessage";
 import QuickNav from "@/components/QuickNav";
+import GiftedDialog from "@/components/GiftedDialog.vue";

 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const Buffer = require("buffer/").Buffer;

@Component({
-  components: { AlertMessage, QuickNav },
+  components: { AlertMessage, QuickNav, GiftedDialog },
 })
 export default class ContactsView extends Vue {
  activeDid = "";
@@ -317,19 +307,12 @@ export default class ContactsView extends Vue {
          resp.status,
          resp.data,
        );
-        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,
-        );
+        this.alertTitle = "Error With Server";
+        this.alertMessage =
+          "Got an error retrieving your " +
+          resp.config.url.includes("recipientDid")
+            ? "received"
+            : "given" + " time from the server.";
      }
    };

@@ -377,15 +360,8 @@ export default class ContactsView extends Vue {
      this.givenToMeConfirmed = givenToMeConfirmed;
      this.givenToMeUnconfirmed = givenToMeUnconfirmed;
    } catch (error) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error With Server",
-          text: error as string,
-        },
-        -1,
-      );
+      this.alertTitle = "Error With Server";
+      this.alertMessage = error as string;
    }
  }

@@ -478,32 +454,18 @@ 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.$notify(
-              {
-                group: "alert",
-                type: "danger",
-                title: "Registration Still Unknown",
-                text: message,
-              },
-              -1,
-            );
+            this.alertMessage = message;
          } else if (resp.data?.success?.handleId) {
            contact.registered = true;
            db.contacts.update(contact.did, { registered: true });

-            this.$notify(
-              {
-                group: "alert",
-                type: "info",
-                title: "Registration Success",
-                text: contact.name + " has been registered.",
-              },
-              -1,
-            );
+            this.alertTitle = "Registration Success";
+            this.alertMessage = contact.name + " has been registered.";
          }
        } catch (error) {
          let userMessage = "There was an error. See logs for more info.";
@@ -518,15 +480,8 @@ export default class ContactsView extends Vue {
            userMessage = error as string;
          }
          // Now set that error for the user to see.
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error With Server",
-              text: userMessage,
-            },
-            -1,
-          );
+          this.alertTitle = "Error With Server";
+          this.alertMessage = userMessage;
        }
      }
    }
@@ -547,39 +502,17 @@ 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.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error With Server",
-              text: resp.data.error?.message,
-            },
-            -1,
-          );
+          this.alertMessage = resp.data.error?.message;
        } else {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error With Server",
-              text: "Bad server response of " + resp.status,
-            },
-            -1,
-          );
+          this.alertMessage = "Bad server response of " + resp.status;
        }
      }
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error With Server",
-          text: err as string,
-        },
-        -1,
-      );
+      this.alertTitle = "Error With Server";
+      this.alertMessage = err as string;
    }
  }

@@ -596,52 +529,23 @@ export default class ContactsView extends Vue {
        contact.seesMe = visibility;
        db.contacts.update(contact.did, { seesMe: visibility });

-        this.$notify(
-          {
-            group: "alert",
-            type: "toast",
-            title: "Refreshed",
-            text:
-              this.nameForContact(contact, true) +
-              " can " +
-              (visibility ? "" : "not ") +
-              "see your activity.",
-          },
-          5000,
-        );
+        this.alertTitle = "Refreshed";
+        this.alertMessage =
+          this.nameForContact(contact, true) +
+          " can " +
+          (visibility ? "" : "not ") +
+          "see your activity.";
      } else {
+        this.alertTitle = "Error With Server";
        if (resp.data.error?.message) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error With Server",
-              text: resp.data.error?.message,
-            },
-            -1,
-          );
+          this.alertMessage = resp.data.error?.message;
        } else {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error With Server",
-              text: "Bad server response of " + resp.status,
-            },
-            -1,
-          );
+          this.alertMessage = "Bad server response of " + resp.status;
        }
      }
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error With Server",
-          text: err as string,
-        },
-        -1,
-      );
+      this.alertTitle = "Error With Server";
+      this.alertMessage = err as string;
    }
  }

@@ -680,35 +584,15 @@ export default class ContactsView extends Vue {
      }
    }
    if (!this.isNumeric(this.hourInput)) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Input Error",
-          text: "This is not a valid number of hours: " + this.hourInput,
-        },
-        -1,
-      );
+      this.alertTitle = "Input Error";
+      this.alertMessage =
+        "This is not a valid number of hours: " + this.hourInput;
    } else if (!parseFloat(this.hourInput)) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Input Error",
-          text: "Giving 0 hours does nothing.",
-        },
-        -1,
-      );
+      this.alertTitle = "Input Error";
+      this.alertMessage = "Giving 0 hours does nothing.";
    } else if (!identity) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Status Error",
-          text: "No identity is available.",
-        },
-        -1,
-      );
+      this.alertTitle = "Status Error";
+      this.alertMessage = "No identity is available.";
    } else {
      // ask to confirm amount
      let toFrom;
@@ -792,15 +676,8 @@ export default class ContactsView extends Vue {
      try {
        const resp = await this.axios.post(url, payload, { headers });
        if (resp.data?.success?.handleId) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Done",
-              text: "Successfully logged time to the server.",
-            },
-            -1,
-          );
+          this.alertTitle = "Done";
+          this.alertMessage = "Successfully logged time to the server.";

          if (fromDid === identity.did) {
            const newList = R.clone(this.givenByMeUnconfirmed);
@@ -825,15 +702,8 @@ export default class ContactsView extends Vue {
          userMessage = error as string;
        }
        // Now set that error for the user to see.
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error With Server",
-            text: userMessage,
-          },
-          -1,
-        );
+        this.alertTitle = "Error With Server";
+        this.alertMessage = userMessage;
      }
    }
  }
--- a/src/views/DiscoverView.vue
+++ b/src/views/DiscoverView.vue
@@ -186,16 +186,6 @@ 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;
      }

@@ -214,15 +204,9 @@ export default class DiscoverView extends Vue {
      }
    } catch (e) {
      console.log("Error with feed load:", e);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: e.userMessage || "There was a problem retrieving projects.",
-        },
-        -1,
-      );
+      this.alertMessage =
+        e.userMessage || "There was an error retrieving projects.";
+      this.alertTitle = "Error";
    } finally {
      this.isLoading = false;
    }
@@ -256,16 +240,6 @@ 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();
      }

@@ -289,15 +263,9 @@ export default class DiscoverView extends Vue {
      }
    } catch (e) {
      console.log("Error with feed load:", e);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: e.userMessage || "There was a problem retrieving projects.",
-        },
-        -1,
-      );
+      this.alertMessage =
+        e.userMessage || "There was an error retrieving projects.";
+      this.alertTitle = "Error";
    } finally {
      this.isLoading = false;
    }
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -6,94 +6,6 @@
      Time Safari
    </h1>

-    <div class="mb-8">
-      <h2 class="text-xl font-bold mb-4">Notiwind Alert Test Suite</h2>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'toast',
-              text: 'I\'m a toast. Don\'t mind me.',
-            },
-            5000,
-          )
-        "
-        class="font-bold uppercase bg-slate-400 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Toast (self-dismiss)
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'info',
-              title: 'Information Alert',
-              text: 'Just wanted you to know.',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Info
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'success',
-              title: 'Success Alert',
-              text: 'Congratulations!',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Success
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'warning',
-              title: 'Warning Alert',
-              text: 'You might wanna look at this.',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Warning
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'danger',
-              title: 'Danger Alert',
-              text: 'Something terrible has happened!',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Danger
-      </button>
-    </div>
-
    <div class="mb-8">
      <h2 class="text-xl font-bold">Quick Action</h2>
      <p class="mb-4">Show appreciation to a contact:</p>
@@ -110,7 +22,7 @@
          <h3
            class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden"
          >
-            {{ contact.name || "(no name)" }}
+            {{ contact.name || contact.did }}
          </h3>
        </li>
      </ul>
@@ -127,6 +39,7 @@
      <!-- If there are no contacts, show this instead: -->
      <div
        class="rounded border border-dashed border-slate-300 bg-slate-100 px-4 py-3 text-center italic text-slate-500"
+        v-if="allContacts.length === 0"
      >
        (No contacts to show.)
      </div>
@@ -245,17 +158,10 @@ export default class HomeView extends Vue {
      this.feedLastViewedId = settings?.lastViewedClaimId;
      this.updateAllFeed();
    } catch (err) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            err.userMessage ||
-            "There was an error retrieving the latest sweet, sweet action.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        err.userMessage ||
+        "There was an error retrieving the latest sweet, sweet action.";
    }
  }

@@ -304,15 +210,9 @@ export default class HomeView extends Vue {
      })
      .catch((e) => {
        console.log("Error with feed load:", e);
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Export Error",
-            text: e.userMessage || "There was an error retrieving feed data.",
-          },
-          -1,
-        );
+        this.alertMessage =
+          e.userMessage || "There was an error retrieving feed data.";
+        this.alertTitle = "Error";
      });

    this.isHiddenSpinner = true;
@@ -387,7 +287,7 @@ export default class HomeView extends Vue {
  handleDialogResult(result) {
    if (result.action === "confirm") {
      return new Promise((resolve) => {
-        this.recordGive(result.contact?.did, result.description, result.hours);
+        this.recordGive(result.giver?.did, result.description, result.hours);
        resolve();
      });
    } else {
@@ -403,27 +303,17 @@ export default class HomeView extends Vue {
   */
  public async recordGive(giverDid, description, hours) {
    if (!this.activeDid) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must select an identity before you can record a give.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        "You must select an identity before you can record a give.",
      );
      return;
    }

    if (!description && !hours) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must enter a description or some number of hours.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        "You must enter a description or some number of hours.",
      );
      return;
    }
@@ -443,38 +333,19 @@ export default class HomeView extends Vue {
      if (this.isGiveCreationError(result)) {
        const errorMessage = this.getGiveCreationErrorMessage(result);
        console.log("Error with give result:", result);
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: errorMessage || "There was an error recording the give.",
-          },
-          -1,
+        this.setAlert(
+          "Error",
+          errorMessage || "There was an error recording the give.",
        );
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Success",
-            text: "That gift was recorded.",
-          },
-          -1,
-        );
+        this.setAlert("Success", "That gift was recorded.");
      }
    } catch (error) {
      console.log("Error with give caught:", error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            this.getGiveErrorMessage(error) ||
-            "There was an error recording the give.",
-        },
-        -1,
+      this.setAlert(
+        "Error",
+        this.getGiveErrorMessage(error) ||
+          "There was an error recording the give.",
      );
    }
  }
--- a/src/views/IdentitySwitcherView.vue
+++ b/src/views/IdentitySwitcherView.vue
@@ -133,19 +133,13 @@ export default class IdentitySwitcherView extends Vue {
        this.limitsMessage = "No identity.";
        this.loadingLimits = false;
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error Creating Account",
-            text: "Clear your cache and start over (after data backup).",
-          },
-          -1,
-        );
+        this.alertMessage =
+          "Clear your cache and start over (after data backup).";
        console.error(
          "Telling user to clear cache at page create because:",
          err,
        );
+        this.alertTitle = "Error Creating Account";
      }
    }
  }
--- a/src/views/NewEditProjectView.vue
+++ b/src/views/NewEditProjectView.vue
@@ -245,41 +245,20 @@ 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.$notify(
-              {
-                group: "alert",
-                type: "danger",
-                title: "User Message",
-                text: userMessage,
-              },
-              -1,
-            );
+            this.alertMessage = userMessage;
          } else {
-            this.$notify(
-              {
-                group: "alert",
-                type: "danger",
-                title: "Server Message",
-                text: JSON.stringify(serverError.toJSON()),
-              },
-              -1,
-            );
+            this.alertTitle = "Server Message";
+            this.alertMessage = JSON.stringify(serverError.toJSON());
          }
        } else {
          console.error(
            "Here's the full error trying to save the claim:",
            error,
          );
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Claim Error",
-              text: error as string,
-            },
-            -1,
-          );
+          this.alertTitle = "Claim Error";
+          this.alertMessage = error as string;
        }
        // Now set that error for the user to see.
        this.errorMessage = userMessage;
--- a/src/views/ProjectViewView.vue
+++ b/src/views/ProjectViewView.vue
@@ -12,13 +12,6 @@
        >
          <fa icon="chevron-left" class="fa-fw"></fa>
        </button>
-        <!-- Context Menu -->
-        <a
-          href=""
-          class="text-lg text-center px-2 py-1 absolute -right-2 -top-1"
-          ><fa icon="ellipsis-vertical" class="fa-fw"></fa
-        ></a>
-
        View Plan
      </h1>
    </div>
@@ -56,6 +49,7 @@
        </div>
      </div>
      <button
+        v-if="issuer == activeDid"
        type="button"
        class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
        @click="onEditClick()"
@@ -285,38 +279,16 @@ 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.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "That project does not exist.",
-          },
-          -1,
-        );
+        this.alertMessage = "That project does not exist.";
      }
    } catch (error: unknown) {
      const serverError = error as AxiosError;
      if (serverError.response?.status === 404) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "That project does not exist.",
-          },
-          -1,
-        );
+        this.alertMessage = "That project does not exist.";
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "Something went wrong retrieving that project. See logs for more info.",
-          },
-          -1,
-        );
+        this.alertMessage =
+          "Something went wrong retrieving that project." +
+          " See logs for more info.";
        console.error("Error retrieving project:", serverError.message);
      }
    }
@@ -330,27 +302,12 @@ export default class ProjectViewView extends Vue {
      if (resp.status === 200 && resp.data.data) {
        this.givesToThis = resp.data.data;
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "Failed to retrieve gives to this project.",
-          },
-          -1,
-        );
+        this.alertMessage = "Failed to retrieve gives to this project.";
      }
    } catch (error: unknown) {
      const serverError = error as AxiosError;
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "Something went wrong retrieving gives to this project.",
-        },
-        -1,
-      );
+      this.alertMessage =
+        "Something went wrong retrieving gives to this project.";
      console.error(
        "Error retrieving gives to this project:",
        serverError.message,
@@ -366,27 +323,11 @@ export default class ProjectViewView extends Vue {
      if (resp.status === 200 && resp.data.data) {
        this.givesByThis = resp.data.data;
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "Failed to retrieve gives by this project.",
-          },
-          -1,
-        );
+        this.alertMessage = "Failed to retrieve gives by this project.";
      }
    } catch (error: unknown) {
      const serverError = error as AxiosError;
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "Something went wrong retrieving gives by project.",
-        },
-        -1,
-      );
+      this.alertMessage = "Something went wrong retrieving gives by project.";
      console.error(
        "Error retrieving gives by this project:",
        serverError.message,
@@ -417,28 +358,16 @@ export default class ProjectViewView extends Vue {
   */
  async recordGive(giverDid, description, hours) {
    if (!this.activeDid) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must select an identity before you can record a give.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        "You must select an identity before you can record a give.";
      return;
    }

    if (!description && !hours) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "You must enter a description or some number of hours.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        "You must enter a description or some number of hours.";
      return;
    }

@@ -457,42 +386,21 @@ export default class ProjectViewView extends Vue {

      if (result.status !== 201 || result.data?.error) {
        console.log("Error with give result:", result);
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text:
-              result.data?.error?.message ||
-              "There was an error recording the give.",
-          },
-          -1,
-        );
+        this.alertTitle = "Error";
+        this.alertMessage =
+          result.data?.error?.message ||
+          "There was an error recording the give.";
      } else {
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Success",
-            text: "That gift was recorded.",
-          },
-          -1,
-        );
+        this.alertTitle = "Success";
+        this.alertMessage = "That gift was recorded.";
      }
    } catch (e) {
      console.log("Error with give caught:", e);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            e.userMessage ||
-            e.response?.data?.error?.message ||
-            "There was an error recording the give.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage =
+        e.userMessage ||
+        e.response?.data?.error?.message ||
+        "There was an error recording the give.";
    }
  }
 }
--- a/src/views/ProjectsView.vue
+++ b/src/views/ProjectsView.vue
@@ -8,18 +8,16 @@

    <!-- Quick Search -->

-    <div id="QuickSearch" class="mb-4 flex">
-      <input
-        type="text"
-        placeholder="Search…"
-        class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
-      />
-      <button
-        class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
-      >
-        <fa icon="magnifying-glass" class="fa-fw"></fa>
-      </button>
-    </div>
+    <input
+      type="text"
+      placeholder="Search…"
+      class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
+    />
+    <button
+      class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
+    >
+      <fa icon="magnifying-glass" class="fa-fw"></fa>
+    </button>

    <!-- New Project -->
    <button
@@ -39,7 +37,7 @@

    <!-- Results List -->
    <InfiniteScroll @reached-bottom="loadMoreData">
-      <ul class="border-t border-slate-300">
+      <ul>
        <li
          class="border-b border-slate-300"
          v-for="project in projects"
@@ -126,15 +124,8 @@ export default class ProjectsView extends Vue {
      }
    } catch (error) {
      console.error("Got error loading projects:", error.message);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "Got an error loading projects: " + error.message,
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage = "Got an error loading projects:" + error.message;
    } finally {
      this.isLoading = false;
    }
@@ -203,15 +194,8 @@ export default class ProjectsView extends Vue {

      if (this.numAccounts === 0) {
        console.error("No accounts found.");
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "You need an identity to load your projects.",
-          },
-          -1,
-        );
+        this.alertTitle = "Error";
+        this.alertMessage = "You need an identity to load your projects.";
      } else {
        const identity = await this.getIdentity(activeDid);
        this.current = identity;
@@ -219,15 +203,8 @@ export default class ProjectsView extends Vue {
      }
    } catch (err) {
      console.log("Error initializing:", err);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "Something went wrong loading your projects.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error";
+      this.alertMessage = "Something went wrong loading your projects.";
    }
  }

--- a/src/views/SeedBackupView.vue
+++ b/src/views/SeedBackupView.vue
@@ -72,15 +72,8 @@ 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.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error Loading Account",
-          text: "Got an error loading your seed data.",
-        },
-        -1,
-      );
+      this.alertTitle = "Error Loading Account";
+      this.alertMessage = "Got an error loading your seed data.";
    }
  }

--- a/src/views/StatisticsView.vue
+++ b/src/views/StatisticsView.vue
@@ -62,15 +62,8 @@ export default class StatisticsView extends Vue {
      this.world = newWorld;
    } catch (err) {
      console.log(err);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Mounting Error",
-          text: err.message,
-        },
-        -1,
-      );
+      this.alertTitle = "Mounting error";
+      this.alertMessage = err.message;
    }
  }
Author	SHA1	Message	Date
anomalist	be348461f1	Update 'project.task.yaml'	2023-07-19 22:07:02 -04:00
anomalist	6e2c596030	proposed move to jdenticon	2023-07-19 22:06:30 -04:00
Matthew Raymer	c502869c5f	Add button with gift icon for future dialog	2023-07-19 18:41:12 +08:00
Matthew Raymer	b7aacd63e6	Add and edit project tasks list	2023-07-19 18:26:59 +08:00
Matthew Raymer	5bc0e27b30	Use a DID instead of a name ... this may need some better design on the dialog @jose	2023-07-19 18:25:58 +08:00
Matthew Raymer	a4fe94f081	Add a back arrow	2023-07-19 18:25:03 +08:00
Matthew Raymer	8de95566df	Cleaning up this page to switch to GiftedDialog	2023-07-19 18:23:55 +08:00
Matthew Raymer	97569697f6	* show DID if no name * hide no contacts when there are no contacts * replace contact property with giver (? can you have another contact give you something ?)	2023-07-19 18:22:35 +08:00
Matthew Raymer	b9ed9d748b	Only project owner may see edit button of a project	2023-07-19 18:19:29 +08:00
Matthew Raymer	790d44db81	Remove the stub context menu causing vertical ellipsis	2023-07-19 16:30:56 +08:00
anomalist	e2bf469dc1	set assignees on several tasks.	2023-07-19 02:26:44 -04:00
anomalist	592ffacebc	possible image uploader	2023-07-19 02:16:28 -04:00
anomalist	b706e65598	Remove completed tasks.	2023-07-19 02:11:18 -04:00
Matthew Raymer	6e3066ae92	Stub update of project task list	2023-07-18 21:04:48 +08:00