refactor: improve router type safety and usage

- 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

View File

@@ -22,7 +22,9 @@
<div class="w-full">
<div class="flex columns-3">
<h2 class="text-md font-bold w-full">
{{ capitalizeAndInsertSpacesBeforeCaps(veriClaim.claimType || '') }}
{{
capitalizeAndInsertSpacesBeforeCaps(veriClaim.claimType || "")
}}
<button
v-if="
['GiveAction', 'Offer', 'PlanAction'].includes(
@@ -36,7 +38,10 @@
title="Edit"
data-testId="editClaimButton"
>
<font-awesome icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
<font-awesome
icon="pen"
class="text-sm text-blue-500 ml-2 mb-1"
/>
</button>
</h2>
<div class="flex justify-center w-full">
@@ -45,7 +50,10 @@
class="text-blue-500 mt-2"
title="Printable Certificate"
>
<font-awesome icon="square" class="text-white bg-yellow-500 p-1" />
<font-awesome
icon="square"
class="text-white bg-yellow-500 p-1"
/>
</router-link>
</div>
<!-- show link icon to copy this URL to the clipboard -->
@@ -66,7 +74,7 @@
{{
(veriClaim.claim?.itemOffered as any)?.description ||
(veriClaim.claim as any)?.description ||
''
""
}}
</div>
<div>
@@ -78,9 +86,15 @@
Recorded
{{ veriClaim.issuedAt?.replace(/T/, " ").replace(/Z/, " UTC") }}
</div>
<div v-if="(veriClaim.claim as any).image" class="flex justify-center">
<div
v-if="(veriClaim.claim as any).image"
class="flex justify-center"
>
<a :href="(veriClaim.claim as any).image" target="_blank">
<img :src="(veriClaim.claim as any).image" class="h-24 rounded-xl" />
<img
:src="(veriClaim.claim as any).image"
class="h-24 rounded-xl"
/>
</a>
</div>
@@ -197,7 +211,10 @@
class="col-span-1 block w-fit text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md"
>
Affirm Delivery
<font-awesome icon="hand-holding-heart" class="ml-2 text-white cursor-pointer" />
<font-awesome
icon="hand-holding-heart"
class="ml-2 text-white cursor-pointer"
/>
</button>
</div>
<GiftedDialog ref="customGiveDialog" />
@@ -217,7 +234,10 @@
@click="confirmConfirmClaim()"
>
Confirm
<font-awesome icon="circle-check" class="ml-2 text-white cursor-pointer" />
<font-awesome
icon="circle-check"
class="ml-2 text-white cursor-pointer"
/>
</button>
<h2 v-else class="font-bold uppercase text-xl mt-2">Confirmations</h2>
@@ -277,7 +297,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>
</div>
@@ -315,7 +338,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>
</div>
@@ -428,7 +454,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-if="veriClaim.publicUrls?.[visDid]"
@@ -519,11 +548,11 @@ import {
} from "../db/index";
import { Contact } from "../db/tables/contacts";
import * as serverUtil from "../libs/endorserServer";
import {
GenericCredWrapper,
import {
GenericCredWrapper,
OfferVerifiableCredential,
ProviderInfo
} from '../interfaces';
ProviderInfo,
} from "../interfaces";
import * as libsUtil from "../libs/util";
@Component({
@@ -543,7 +572,11 @@ export default class ClaimView extends Vue {
confirmerIdList: string[] = []; // list of DIDs that have confirmed this claim excluding the issuer
confsVisibleErrorMessage = "";
confsVisibleToIdList: string[] = []; // list of DIDs that can see any confirmer
detailsForGive: { fulfillsPlanHandleId?: string; fulfillsType?: string; fulfillsHandleId?: string } | null = null;
detailsForGive: {
fulfillsPlanHandleId?: string;
fulfillsType?: string;
fulfillsHandleId?: string;
} | null = null;
detailsForOffer: { fulfillsPlanHandleId?: string } | null = null;
fullClaim = null;
fullClaimDump = "";
@@ -598,24 +631,30 @@ export default class ClaimView extends Vue {
"Error retrieving all account DIDs on home page:" + error,
true,
);
this.$notify({
group: "alert",
type: "danger",
title: "Error Loading Profile",
text: "See the Help page for problems with your personal data.",
}, 5000);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error Loading Profile",
text: "See the Help page for problems with your personal data.",
},
5000,
);
}
const claimId = this.$route.params.id as string;
if (claimId) {
await this.loadClaim(claimId, this.activeDid);
} else {
this.$notify({
group: "alert",
type: "danger",
title: "Error",
text: "No claim ID was provided.",
}, 5000);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text: "No claim ID was provided.",
},
5000,
);
}
this.canShare = !!navigator.share;