trentlarson/crowd-funder-from-jason
1
0
Fork 0
forked from jsnbuchanan/crowd-funder-for-time-pwa
Code Issues Pull Requests Projects Releases Wiki Activity

refactor: improve router type safety and usage

Browse Source 
- Add explicit Router type imports across views
- Replace $router type casting with proper typing
- Use $router.back() instead of $router.go(-1) for consistency
- Add proper route and router typings to components
- Clean up router navigation methods
- Fix router push/back method calls

This commit improves type safety and consistency in router usage across
the application's view components.
This commit is contained in:
Matthew Raymer
2025-02-26 06:50:08 +00:00
parent 61da40596c
commit 03178d35e7
56 changed files with 581 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
src/views/ProjectViewView.vue
View File

@@ -10,7 +10,7 @@
<h1 class="text-center text-lg font-light relative px-7">
<!-- Back -->
<button
@click="$router.go(-1)"
@click="$router.back()"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
>
<font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
@@ -48,7 +48,10 @@
<div class="overflow-hidden">
<div class="text-sm mb-3">
<div class="truncate">
<font-awesome icon="user" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="user"
class="fa-fw text-slate-400"
></font-awesome>
{{ issuerInfoObject?.displayName }}
<span v-if="!serverUtil.isEmptyOrHiddenDid(issuer)">
<a
@@ -56,7 +59,10 @@
target="_blank"
class="text-blue-500"
>
<font-awesome icon="arrow-up-right-from-square" class="fa-fw" />
<font-awesome
icon="arrow-up-right-from-square"
class="fa-fw"
/>
</a>
</span>
<span v-else-if="serverUtil.isHiddenDid(issuer)">
@@ -68,15 +74,24 @@
</span>
</div>
<div v-if="startTime">
<font-awesome icon="calendar" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="calendar"
class="fa-fw text-slate-400"
></font-awesome>
Starts {{ startTime }}
</div>
<div v-if="endTime">
<font-awesome icon="calendar" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="calendar"
class="fa-fw text-slate-400"
></font-awesome>
Ends {{ endTime }}
</div>
<div v-if="latitude || longitude">
<font-awesome icon="location-dot" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="location-dot"
class="fa-fw text-slate-400"
></font-awesome>
<a
:href="getOpenStreetMapUrl()"
target="_blank"
@@ -89,14 +104,20 @@
</a>
</div>
<div v-if="url">
<font-awesome icon="globe" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="globe"
class="fa-fw text-slate-400"
></font-awesome>
<a
:href="addScheme(url)"
target="_blank"
class="underline text-blue-500"
>
{{ domainForWebsite(this.url) }}
<font-awesome icon="arrow-up-right-from-square" class="fa-fw" />
<font-awesome
icon="arrow-up-right-from-square"
class="fa-fw"
/>
</a>
</div>
</div>
@@ -181,7 +202,10 @@
class="grid grid-cols-4 sm:grid-cols-5 md:grid-cols-6 gap-x-3 gap-y-5 text-center mb-5 mt-2"
>
<li @click="openGiftDialogToProject({ name: 'you', did: activeDid })">
<font-awesome icon="hand" class="fa-fw text-blue-500 text-5xl cursor-pointer" />
<font-awesome
icon="hand"
class="fa-fw text-blue-500 text-5xl cursor-pointer"
/>
<h3
class="mt-5 text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
>
@@ -266,7 +290,10 @@
>
<div class="flex justify-between gap-4">
<span>
<font-awesome icon="user" class="fa-fw text-slate-400"></font-awesome>
<font-awesome
icon="user"
class="fa-fw text-slate-400"
></font-awesome>
{{
serverUtil.didInfo(
offer.offeredByDid,
@@ -292,7 +319,10 @@
@click="onClickLoadClaim(offer.jwtId as string)"
class="cursor-pointer"
>
<font-awesome icon="file-lines" class="pl-2 pt-1 text-blue-500" />
<font-awesome
icon="file-lines"
class="pl-2 pt-1 text-blue-500"
/>
</a>
<a
v-if="checkIsFulfillable(offer)"
@@ -367,7 +397,10 @@
</div>
<div class="flex justify-between">
<a @click="onClickLoadClaim(give.jwtId)">
<font-awesome icon="file-lines" class="text-blue-500 cursor-pointer" />
<font-awesome
icon="file-lines"
class="text-blue-500 cursor-pointer"
/>
</a>
<a
@@ -377,13 +410,19 @@
"
@click="deepCheckConfirmable(give)"
>
<font-awesome icon="circle-check" class="text-blue-500 cursor-pointer" />
<font-awesome
icon="circle-check"
class="text-blue-500 cursor-pointer"
/>
</a>
<a v-else-if="checkingConfirmationForJwtId === give.jwtId">
<font-awesome icon="spinner" class="fa-spin-pulse" />
</a>
<a v-else @click="shallowNotifyWhyCannotConfirm(give)">
<font-awesome icon="circle-check" class="text-slate-500 cursor-pointer" />
<font-awesome
icon="circle-check"
class="text-slate-500 cursor-pointer"
/>
</a>
</div>
<div v-if="give.fullClaim.image" class="flex justify-center">
@@ -456,7 +495,10 @@
</div>
<div class="flex justify-between">
<a @click="onClickLoadClaim(give.jwtId)">
<font-awesome icon="file-lines" class="text-blue-500 cursor-pointer" />
<font-awesome
icon="file-lines"
class="text-blue-500 cursor-pointer"
/>
</a>
<a
@@ -466,13 +508,19 @@
"
@click="deepCheckConfirmable(give)"
>
<font-awesome icon="circle-check" class="text-blue-500 cursor-pointer" />
<font-awesome
icon="circle-check"
class="text-blue-500 cursor-pointer"
/>
</a>
<a v-else-if="checkingConfirmationForJwtId === give.jwtId">
<font-awesome icon="spinner" class="fa-spin-pulse" />
</a>
<a v-else @click="shallowNotifyWhyCannotConfirm(give)">
<font-awesome icon="circle-check" class="text-slate-500 cursor-pointer" />
<font-awesome
icon="circle-check"
class="text-slate-500 cursor-pointer"
/>
</a>
</div>
<div v-if="give.fullClaim.image" class="flex justify-center">
@@ -496,7 +544,7 @@
import { AxiosError } from "axios";
import { Component, Vue } from "vue-facing-decorator";
import { Router } from "vue-router";
import {
import {
GenericVerifiableCredential,
GenericCredWrapper,
GiveSummaryRecord,
@@ -536,7 +584,7 @@ import HiddenDidDialog from "../components/HiddenDidDialog.vue";
})
export default class ProjectViewView extends Vue {
$notify!: (notification: NotificationIface, timeout?: number) => void;
$router!: Router;
activeDid = "";
agentDid = "";
agentDidVisibleToDids: Array<string> = [];
@@ -616,7 +664,7 @@ export default class ProjectViewView extends Vue {
name: "new-edit-project",
query: { projectId: this.projectId },
};
(this.$router as Router).push(route);
this.$router.push(route);
}
// Isn't there a better way to make this available to the template?
@@ -953,7 +1001,7 @@ export default class ProjectViewView extends Vue {
const route = {
path: "/project/" + encodeURIComponent(projectId),
};
(this.$router as Router).push(route);
this.$router.push(route);
this.loadProject(projectId, this.activeDid);
}
@@ -1000,14 +1048,14 @@ export default class ProjectViewView extends Vue {
projectId: this.projectId,
},
};
(this.$router as Router).push(route);
this.$router.push(route);
}
onClickLoadClaim(jwtId: string) {
const route = {
path: "/claim/" + encodeURIComponent(jwtId),
};
(this.$router as Router).push(route);
this.$router.push(route);
}
checkIsFulfillable(offer: OfferSummaryRecord) {