forked from jsnbuchanan/crowd-funder-for-time-pwa
Fix registration status reactivity in HomeView
Resolved issue where registration banner persisted despite successful API registration. Root cause was loadSettings() being called after initializeIdentity(), overwriting updated isRegistered value with stale database data. Changes: - Remove redundant loadSettings() call from mounted() lifecycle - Add $nextTick() to force template re-render after registration updates - Create isUserRegistered computed property for template reactivity - Clean up debugging console.log statements for production readiness - Simplify template logic to use standard v-if/v-else pattern Registration banner now properly disappears when users are registered, and "Record something given by:" section appears correctly. Fix maintains existing functionality while ensuring proper Vue reactivity.
This commit is contained in:
@@ -83,7 +83,7 @@ Raymer * @version 1.0.0 */
|
||||
-->
|
||||
<div class="mb-4">
|
||||
<div
|
||||
v-if="!isRegistered"
|
||||
v-if="!isUserRegistered"
|
||||
id="noticeSomeoneMustRegisterYou"
|
||||
class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
|
||||
>
|
||||
@@ -460,7 +460,7 @@ export default class HomeView extends Vue {
|
||||
async mounted() {
|
||||
try {
|
||||
await this.initializeIdentity();
|
||||
await this.loadSettings();
|
||||
// Settings already loaded in initializeIdentity()
|
||||
await this.loadContacts();
|
||||
// Registration check already handled in initializeIdentity()
|
||||
await this.loadFeedData();
|
||||
@@ -471,6 +471,17 @@ export default class HomeView extends Vue {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Watch for changes in the current activeDid
|
||||
* Reload settings when user switches identities
|
||||
*/
|
||||
async onActiveDidChanged(newDid: string | null, oldDid: string | null) {
|
||||
if (newDid !== oldDid) {
|
||||
// Re-initialize identity with new settings (loads settings internally)
|
||||
await this.initializeIdentity();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Initializes user identity
|
||||
* - Retrieves existing DIDs
|
||||
@@ -577,10 +588,13 @@ export default class HomeView extends Vue {
|
||||
this.axios,
|
||||
this.activeDid,
|
||||
);
|
||||
|
||||
if (resp.status === 200) {
|
||||
// Ultra-concise settings update with automatic cache invalidation!
|
||||
await this.$saveMySettings({ isRegistered: true });
|
||||
this.isRegistered = true;
|
||||
// Force Vue to re-render the template
|
||||
await this.$nextTick();
|
||||
}
|
||||
} catch (error) {
|
||||
// Consolidate logging: Only log unexpected errors, not expected 400s
|
||||
@@ -671,17 +685,8 @@ export default class HomeView extends Vue {
|
||||
* Called by mounted() and reloadFeedOnChange()
|
||||
*/
|
||||
private async loadSettings() {
|
||||
// First get the active DID from master settings
|
||||
const masterSettings = await this.$settings({
|
||||
apiServer: "",
|
||||
activeDid: "",
|
||||
filterFeedByVisible: false,
|
||||
filterFeedByNearby: false,
|
||||
isRegistered: false,
|
||||
});
|
||||
|
||||
// Then get the full merged settings including account-specific overrides
|
||||
const settings = await this.$accountSettings(masterSettings.activeDid, {
|
||||
// Use the current activeDid (set in initializeIdentity) to get user-specific settings
|
||||
const settings = await this.$accountSettings(this.activeDid, {
|
||||
apiServer: "",
|
||||
activeDid: "",
|
||||
filterFeedByVisible: false,
|
||||
@@ -743,6 +748,8 @@ export default class HomeView extends Vue {
|
||||
// Ultra-concise settings update with automatic cache invalidation!
|
||||
await this.$saveMySettings({ isRegistered: true });
|
||||
this.isRegistered = true;
|
||||
// Force Vue to re-render the template
|
||||
await this.$nextTick();
|
||||
}
|
||||
} catch (e) {
|
||||
// ignore the error... just keep us unregistered
|
||||
@@ -1827,5 +1834,15 @@ export default class HomeView extends Vue {
|
||||
this.showProjectsDialog = true;
|
||||
(this.$refs.customDialog as GiftedDialog).open();
|
||||
}
|
||||
|
||||
/**
|
||||
* Computed property for registration status
|
||||
*
|
||||
* @public
|
||||
* Used in template for registration-dependent UI elements
|
||||
*/
|
||||
get isUserRegistered() {
|
||||
return this.isRegistered;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user