add checkbox for given-to-user since sometimes it's to someone else

src/components/GiftedDialog.vue

@@ -10,7 +10,7 @@
         placeholder="What was received"
         v-model="description"
       />
-      <div class="flex flex-row mb-6">
+      <div class="flex flex-row">
         <span
           class="rounded-l border border-r-0 border-slate-400 bg-slate-200 w-1/3 text-center px-2 py-2"
           >Hours</span
@@ -33,7 +33,13 @@
           <fa icon="chevron-right" />
         </div>
       </div>
-      <p class="text-center mb-2 italic">Sign & Send to publish to the world</p>
+      <div v-if="showGivenToUser" class="mt-2 text-right">
+        <input type="checkbox" class="mr-2" v-model="givenToUser" />
+        <label class="text-sm">Given to you</label>
+      </div>
+      <p class="text-center mb-2 mt-6 italic">
+        Sign & Send to publish to the world
+      </p>
       <button
         class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2"
         @click="confirm"
@@ -70,12 +76,14 @@ export default class GiftedDialog extends Vue {
 
   @Prop message = "";
   @Prop projectId = "";
+  @Prop showGivenToUser = false;
 
   activeDid = "";
   apiServer = "";
 
   giver?: GiverInputInfo;
   description = "";
+  givenToUser = false;
   hours = "0";
   visible = false;
 
@@ -103,11 +111,17 @@ export default class GiftedDialog extends Vue {
   }
 
   open(giver: GiverInputInfo) {
+    this.description = "";
     this.giver = giver;
+    // if we show "given to user" selection, default checkbox to true
+    this.givenToUser = this.showGivenToUser;
+    this.hours = "0";
+
     this.visible = true;
   }
 
   close() {
+    // close the dialog but don't change values (since it might be submitting info)
     this.visible = false;
   }
 
@@ -121,8 +135,13 @@ export default class GiftedDialog extends Vue {
 
   cancel() {
     this.close();
+    this.eraseValues();
+  }
+
+  eraseValues() {
     this.description = "";
     this.giver = undefined;
+    this.givenToUser = this.showGivenToUser;
     this.hours = "0";
   }
 
@@ -138,14 +157,12 @@ export default class GiftedDialog extends Vue {
       1000,
     );
     // this is asynchronous, but we don't need to wait for it to complete
-    this.recordGive(
+    await this.recordGive(
       this.giver?.did as string | undefined,
       this.description,
       parseFloat(this.hours),
     ).then(() => {
-      this.description = "";
-      this.giver = undefined;
-      this.hours = "0";
+      this.eraseValues();
     });
   }
 
@@ -209,7 +226,7 @@ export default class GiftedDialog extends Vue {
         this.apiServer,
         identity,
         giverDid,
-        this.activeDid,
+        this.givenToUser ? this.activeDid : undefined,
         description,
         hours,
         this.projectId,
@@ -238,7 +255,7 @@ export default class GiftedDialog extends Vue {
             title: "Success",
             text: "That gift was recorded.",
           },
-          10000,
+          7000,
         );
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/ContactGiftingView.vue

@@ -66,7 +66,11 @@
       </li>
     </ul>
 
-    <GiftedDialog ref="customDialog" message="Received from"> </GiftedDialog>
+    <GiftedDialog
+      ref="customDialog"
+      message="Received from"
+      showGivenToUser="true"
+    />
   </section>
 </template>
 

src/views/HomeView.vue

@@ -81,7 +81,11 @@
       </div>
     </div>
 
-    <GiftedDialog ref="customDialog" message="Received from"> </GiftedDialog>
+    <GiftedDialog
+      ref="customDialog"
+      message="Received from"
+      showGivenToUser="true"
+    />
 
     <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
       <h2 class="text-xl font-bold mb-4">Latest Activity</h2>