Merge branch 'master' into deep_linking

chore: Clean up merge conflicts in documentation files

- Resolve merge conflicts in BUILDING.md and CHANGELOG.md
- Remove duplicate entries in documentation
- Fix formatting inconsistencies from merge
- Maintain consistent documentation style
- Clean up git diff markers

The cleanup improves documentation by:
1. Resolving all merge conflicts
2. Ensuring consistent formatting
3. Removing duplicate content
4. Maintaining documentation standards
5. Preserving change history

BUILDING.md

@@ -338,11 +338,7 @@ Run local tests:
 npm run test-local
 ```
 
-Run all tests (includes building):
+See [TESTING.md](test-playwright/TESTING.md) for more details.
-
-```bash
-npm run test-all
-```
 
 ## Linting
 

CHANGELOG.md

@@ -5,6 +5,15 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+
+
+## [0.4.5] - 2025.02.23
+### Added
+- Total amounts of gives on project page
+### Changed in DB or environment
+- Requires Endorser.ch version 4.2.6+
+
+
 ## [0.4.4] - 2025.02.17
 
 ### Fixed in 0.4.4

README.md

@@ -17,23 +17,15 @@ npm install
 npm run dev
 ```
 
-See the test locations for "IMAGE_API_SERVER" or "PARTNER_API_SERVER" below, or use <http://localhost:3000> for local endorser.ch
+See [BUILDING.md](BUILDING.md) for more details.
 
-### Build the test & production app
+See the test locations for "IMAGE_API_SERVER" or "PARTNER_API_SERVER" below, or use http://localhost:3000 for local endorser.ch
 
-```bash
-npm run serve
-```
-
-### Lint and fix files
-
-```bash
-npm run lint
-```
 
 ### Run all UI tests
 
-Look below for the "test-all" instructions.
+Look at [BUILDING.md](BUILDING.md) for the "test-all" instructions and [TESTING.md](test-playwright/TESTING.md) for more details.
+
 
 ### Compile and minify for test & production
 
@@ -79,10 +71,17 @@ TIME_SAFARI_APP_TITLE="TimeSafari_Test" VITE_APP_SERVER=https://test.timesafari.
 
 * Record the new hash in the changelog. Edit package.json to increment version & add "-beta", `npm install`, and commit. Also record what version is on production.
 
+
+
+
+
 ## Tests
 
 See [TESTING.md](test-playwright/TESTING.md) for detailed test instructions.
 
+
+
+
 ## Icons
 
 To add an icon, add to main.ts and reference with `fa` element and `icon` attribute with the hyphenated name.

src/views/ProjectViewView.vue

@@ -355,83 +355,139 @@
           </div>
         </div>
 
-        <h3 class="text-lg font-bold mb-3 mt-4">Given To This Idea</h3>
+        <h3 class="text-lg font-bold mt-4">Given To This Idea</h3>
 
-        <div v-if="givesToThis.length === 0">
+        <div v-if="givesToThis.length === 0" class="text-sm">
           (None yet. If you've seen something, say something by clicking a
           contact above.)
         </div>
 
-        <ul v-else class="text-sm border-t border-slate-300">
+        <div v-else class="mt-1 text-sm">
-          <li
+          <!-- Totals section -->
-            v-for="give in givesToThis"
+          <div class="mt-1 flex items-center min-h-[1.5rem]">
-            :key="give.jwtId"
+            <div v-if="loadingTotals" class="flex-1">
-            class="py-1.5 border-b border-slate-300"
+              <fa icon="spinner" class="fa-spin-pulse text-blue-500" />
-          >
-            <div class="flex justify-between gap-4">
-              <span>
-                <font-awesome icon="user" class="fa-fw text-slate-400" />
-                {{
-                  serverUtil.didInfo(
-                    give.agentDid,
-                    activeDid,
-                    allMyDids,
-                    allContacts,
-                  )
-                }}
-              </span>
-              <span v-if="give.amount" class="whitespace-nowrap">
-                <font-awesome
-                  :icon="libsUtil.iconForUnitCode(give.unit)"
-                  class="fa-fw text-slate-400"
-                />{{ give.amount }}
-              </span>
             </div>
-            <div class="text-slate-500">
+            <div v-else-if="givesTotalsByUnit.length > 0" class="flex-1">
-              <font-awesome icon="calendar" class="fa-fw text-slate-400" />
+              <span class="font-semibold mr-2 shrink-0">Totals</span>
-              {{ give.issuedAt?.substring(0, 10) }}
+              <span class="whitespace-nowrap overflow-hidden text-ellipsis">
+                <a
+                  @click="totalsExpanded = !totalsExpanded"
+                  class="cursor-pointer text-blue-500"
+                >
+                  <!-- just show the hours, or alternatively whatever is first -->
+                  <span v-if="givenTotalHours() > 0">
+                    {{ givenTotalHours() }} {{ libsUtil.UNIT_SHORT["HUR"] }}
+                  </span>
+                  <span v-else>
+                    {{ givesTotalsByUnit[0].amount }}
+                    {{ libsUtil.UNIT_SHORT[givesTotalsByUnit[0].unit] }}
+                  </span>
+                  <span v-if="givesTotalsByUnit.length > 1">...</span>
+                  <span>
+                    <fa
+                      :icon="totalsExpanded ? 'chevron-up' : 'chevron-right'"
+                      class="fa-fw text-xs ml-1"
+                    />
+                  </span>
+                </a>
+                <!-- show the full list when expanded -->
+                <div v-if="totalsExpanded">
+                  <div
+                    v-for="total in givesTotalsByUnit"
+                    :key="total.unit"
+                    class="ml-2"
+                  >
+                    <fa
+                      :icon="libsUtil.iconForUnitCode(total.unit)"
+                      class="fa-fw text-slate-400 mr-1"
+                    />
+                    {{ total.amount }} {{ libsUtil.UNIT_LONG[total.unit] }}
+                  </div>
+                </div>
+              </span>
             </div>
-            <div v-if="give.description" class="text-slate-500">
+            <div v-else>
-              <font-awesome icon="comment" class="fa-fw text-slate-400" />
+              <span class="font-semibold mr-2 shrink-0">
-              {{ give.description }}
+                {{ givesToThis.length }}{{ givesHitLimit ? "+" : "" }} record{{
+                  givesToThis.length === 1 ? "" : "s"
+                }}
+              </span>
             </div>
-            <div class="flex justify-between">
+          </div>
-              <a @click="onClickLoadClaim(give.jwtId)">
-                <font-awesome
-                  icon="file-lines"
-                  class="text-blue-500 cursor-pointer"
-                />
-              </a>
 
-              <a
+          <!-- List of gives -->
-                v-if="
+          <ul class="mt-2 text-sm border-t border-slate-300">
-                  checkIsConfirmable(give) &&
+            <li
-                  !recentlyCheckedAndUnconfirmableJwts.includes(give.jwtId)
+              v-for="give in givesToThis"
-                "
+              :key="give.id"
-                @click="deepCheckConfirmable(give)"
+              class="py-1.5 border-b border-slate-300"
-              >
+            >
-                <font-awesome
+              <div class="flex justify-between gap-4">
-                  icon="circle-check"
+                <span>
-                  class="text-blue-500 cursor-pointer"
+                  <fa icon="user" class="fa-fw text-slate-400" />
-                />
+                  {{
-              </a>
+                    serverUtil.didInfo(
-              <a v-else-if="checkingConfirmationForJwtId === give.jwtId">
+                      give.agentDid,
-                <font-awesome icon="spinner" class="fa-spin-pulse" />
+                      activeDid,
-              </a>
+                      allMyDids,
-              <a v-else @click="shallowNotifyWhyCannotConfirm(give)">
+                      allContacts,
-                <font-awesome
+                    )
-                  icon="circle-check"
+                  }}
-                  class="text-slate-500 cursor-pointer"
+                </span>
-                />
+                <span v-if="give.amount" class="whitespace-nowrap">
-              </a>
+                  <fa
-            </div>
+                    :icon="libsUtil.iconForUnitCode(give.unit)"
-            <div v-if="give.fullClaim.image" class="flex justify-center">
+                    class="fa-fw text-slate-400"
-              <a :href="give.fullClaim.image" target="_blank">
+                  />{{ give.amount }}
-                <img :src="give.fullClaim.image" class="h-24 mt-2 rounded-xl" />
+                </span>
-              </a>
+              </div>
-            </div>
+              <div class="text-slate-500">
-          </li>
+                <fa icon="calendar" class="fa-fw text-slate-400" />
-        </ul>
+                {{ give.issuedAt?.substring(0, 10) }}
+              </div>
+              <div v-if="give.description" class="text-slate-500">
+                <fa icon="comment" class="fa-fw text-slate-400" />
+                {{ give.description }}
+              </div>
+              <div class="flex justify-between">
+                <a @click="onClickLoadClaim(give.jwtId)">
+                  <fa icon="file-lines" class="text-blue-500 cursor-pointer" />
+                </a>
+
+                <a
+                  v-if="
+                    checkIsConfirmable(give) &&
+                    !recentlyCheckedAndUnconfirmableJwts.includes(give.jwtId)
+                  "
+                  @click="deepCheckConfirmable(give)"
+                >
+                  <fa
+                    icon="circle-check"
+                    class="text-blue-500 cursor-pointer"
+                  />
+                </a>
+                <a v-else-if="checkingConfirmationForJwtId === give.jwtId">
+                  <fa icon="spinner" class="fa-spin-pulse" />
+                </a>
+                <a v-else @click="shallowNotifyWhyCannotConfirm(give)">
+                  <fa
+                    icon="circle-check"
+                    class="text-slate-500 cursor-pointer"
+                  />
+                </a>
+              </div>
+              <div v-if="give.fullClaim.image" class="flex justify-center">
+                <a :href="give.fullClaim.image" target="_blank">
+                  <img
+                    :src="give.fullClaim.image"
+                    class="h-24 mt-2 rounded-xl"
+                  />
+                </a>
+              </div>
+            </li>
+          </ul>
+        </div>
         <div v-if="givesHitLimit" class="text-center text-blue-500">
           <button @click="loadGives()">Load More</button>
         </div>
@@ -646,7 +702,11 @@ export default class ProjectViewView extends Vue {
   fulfillersToThis: Array<PlanSummaryRecord> = [];
   /** Flag for fulfiller pagination */
   fulfillersToHitLimit = false;
-  /** Project image URL */
+  givesToThis: Array<GiveSummaryRecord> = [];
+  givesHitLimit = false;
+  givesProvidedByThis: Array<GiveSummaryRecord> = [];
+  givesProvidedByHitLimit = false;
+  givesTotalsByUnit: Array<{ unit: string; amount: number }> = [];
   imageUrl = "";
   /** Project issuer DID */
   issuer = "";
@@ -660,6 +720,7 @@ export default class ProjectViewView extends Vue {
   issuerVisibleToDids: Array<string> = [];
   /** Project location data */
   latitude = 0;
+  loadingTotals = false;
   longitude = 0;
   /** Project name */
   name = "";
@@ -689,6 +750,8 @@ export default class ProjectViewView extends Vue {
   checkingConfirmationForJwtId = "";
   /** Recently checked unconfirmable JWTs */
   recentlyCheckedAndUnconfirmableJwts: string[] = [];
+  startTime = "";
+  totalsExpanded = false;
   truncatedDesc = "";
   /** Truncation length */
   truncateLength = 40;
@@ -740,21 +803,26 @@ export default class ProjectViewView extends Vue {
       this.projectId = decodeURIComponent(pathParam);
     }
     this.loadProject(this.projectId, this.activeDid);
+    this.loadTotals();
+  }
+
+  onEditClick() {
+    const route = {
+      name: "new-edit-project",
+      query: { projectId: this.projectId },
+    };
+    (this.$router as Router).push(route);
+  }
+
+  // Isn't there a better way to make this available to the template?
+  expandText() {
+    this.expanded = true;
+  }
+
+  collapseText() {
+    this.expanded = false;
   }
 
-  /**
-   * Loads project data and related information
-   *
-   * Workflow:
-   * 1. Fetches project details from API
-   * 2. Updates component state with project data
-   * 3. Initializes related data loading (gifts, offers, fulfillments)
-   *
-   * @param projectId Project handle ID
-   * @param userDid Active user's DID
-   * @throws Logs errors and notifies user
-   * @emits Notification on loading errors
-   */
   async loadProject(projectId: string, userDid: string) {
     this.projectId = projectId;
 
@@ -1394,5 +1462,56 @@ export default class ProjectViewView extends Vue {
       this.allMyDids,
     );
   }
+
+  async loadTotals() {
+    this.loadingTotals = true;
+    const url =
+      this.apiServer +
+      "/api/v2/report/givesToPlans?planIds=" +
+      encodeURIComponent(JSON.stringify([this.projectId]));
+    const headers = await serverUtil.getHeaders(this.activeDid);
+
+    try {
+      const resp = await this.axios.get(url, { headers });
+      if (resp.status === 200 && resp.data.data) {
+        // Calculate totals by unit
+        const totals: { [key: string]: number } = {};
+        resp.data.data.forEach((give: GiveSummaryRecord) => {
+          const amount = give.fullClaim.object?.amountOfThisGood;
+          const unit = give.fullClaim.object?.unitCode;
+          if (amount && unit) {
+            totals[unit] = (totals[unit] || 0) + amount;
+          }
+        });
+
+        // Convert totals object to array format
+        this.givesTotalsByUnit = Object.entries(totals).map(
+          ([unit, amount]) => ({
+            unit,
+            amount,
+          }),
+        );
+      }
+    } catch (error) {
+      console.error("Error loading totals:", error);
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: "Failed to load totals for this project.",
+        },
+        5000,
+      );
+    } finally {
+      this.loadingTotals = false;
+    }
+  }
+
+  givenTotalHours(): number {
+    return (
+      this.givesTotalsByUnit.find((total) => total.unit === "HUR")?.amount || 0
+    );
+  }
 }
 </script>

test-playwright/35-record-gift-from-image-share.spec.ts

@@ -48,7 +48,7 @@
  */
 import path from 'path';
 import { test, expect } from '@playwright/test';
-import { importUser } from './testUtils';
+import { importUserAndCloseOnboarding } from './testUtils';
 
 /**
  * Note: by default, this test uses the test image API server.
@@ -65,7 +65,7 @@ test('Record item given from image-share', async ({ page }) => {
   // Combine title prefix with the random string
   const finalTitle = `Gift ${randomString} from image-share`;
 
-  await importUser(page, '00');
+  await importUserAndCloseOnboarding(page, '00');
 
   // Record something given
   await page.goto('./test');
@@ -84,10 +84,8 @@ test('Record item given from image-share', async ({ page }) => {
   await page.getByRole('spinbutton').fill('2');
   await page.getByRole('button', { name: 'Sign & Send' }).click();
 
-  // we end up on a page with the onboarding info
+  // const recorded = await page.getByText('That gift was recorded.');
-  await page.getByTestId('closeOnboardingAndFinish').click();
+  await expect(await page.getByText('That gift was recorded.')).toBeVisible();
-
-  await expect(page.getByText('That gift was recorded.')).toBeVisible();
   await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss info alert
 
   // Refresh home view and check gift

test-playwright/40-add-contact.spec.ts

@@ -207,7 +207,6 @@ test('Add contact, copy details, delete, and import from paste & from file', asy
   // Add another new contact
   await page.getByPlaceholder('URL or DID, Name, Public Key').fill('did:ethr:0x222BB77E6Ff3774d34c751f3c1260866357B677b, User #222, asdf1234');
   await page.locator('button > svg.fa-plus').click();
-  await expect(page.locator('div[role="alert"]')).toBeVisible();
   await expect(page.locator('div[role="alert"] span:has-text("No")')).toBeVisible();
   await page.locator('div[role="alert"] button:has-text("No")').click(); // don't register
   await expect(page.locator('div[role="alert"] span:has-text("Contact Added")')).toBeVisible();

test-playwright/testUtils.ts

@@ -33,6 +33,13 @@ export async function importUser(page: Page, id?: string): Promise<string> {
   return did;
 }
 
+export async function importUserAndCloseOnboarding(page: Page, id?: string): Promise<string> {
+  const did = await importUser(page, id);
+  await page.goto('./');
+  await page.getByTestId('closeOnboardingAndFinish').click();
+  return did;
+}
+
 // This is to switch to someone already in the identity table. It doesn't include registration.
 export async function switchToUser(page: Page, did: string): Promise<void> {
   // This is the direct approach but users have to tap on things so we'll do that instead.