fix display of gives on contact screen; adjust give UI for project #49

Merged
anomalist merged 4 commits from ui-fix into master 1 year ago
  1. 1
      project.task.yaml
  2. 11
      src/libs/endorserServer.ts
  3. 2
      src/views/ContactsView.vue
  4. 27
      src/views/DiscoverView.vue
  5. 16
      src/views/ProjectViewView.vue

1
project.task.yaml

@ -24,6 +24,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

11
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<string>,
contacts: Array<Contact>,
): 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) {

2
src/views/ContactsView.vue

@ -135,7 +135,7 @@
<fa icon="trash-can" class="fa-fw" />
</button>
<div v-if="!showGiveNumbers" class="ml-auto flex gap-1.5">
<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)"

27
src/views/DiscoverView.vue

@ -90,10 +90,12 @@
</div>
<div class="grow">
<h2 class="text-base font-semibold">Canyon cleanup</h2>
<h2 class="text-base font-semibold">{{ project.name }}</h2>
<div class="text-sm">
<fa icon="user" class="fa-fw text-slate-400"></fa>
{{ project.name }}
{{
didInfo(project.issuerDid, activeDid, allMyDids, allContacts)
}}
</div>
</div>
</a>
@ -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<Contact> = [];
allMyDids: Array<string> = [];
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}`;
}
@ -204,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 {
@ -310,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) {

16
src/views/ProjectViewView.vue

@ -93,7 +93,7 @@
<h1 class="text-xl">Given to this Project</h1>
</div>
<div>
<h1 class="text-xl">... and from this Project</h1>
<h1 class="text-xl">... and paid forward from this Project</h1>
</div>
</div>
<div class="flex justify-around">
@ -108,7 +108,12 @@
}}</span>
</div>
<div class="flex gap-2" v-if="give.amount">
<fa icon="coins" class="fa-fw text-slate-400"></fa>
<fa
icon="clock"
v-if="give.unit === 'HUR'"
class="fa-fw text-slate-400"
></fa>
<fa icon="coins" v-else class="fa-fw text-slate-400"></fa>
<span>{{ give.amount }}</span>
</div>
<div class="flex gap-2" v-if="give.description">
@ -130,7 +135,12 @@
}}</span>
</div>
<div class="flex gap-2" v-if="give.amount">
<fa icon="coins" class="fa-fw text-slate-400"></fa>
<fa
icon="clock"
v-if="give.unit === 'HUR'"
class="fa-fw text-slate-400"
></fa>
<fa icon="coins" v-else class="fa-fw text-slate-400"></fa>
<span>{{ give.amount }}</span>
</div>
<div class="flex gap-2">

Loading…
Cancel
Save