fix: keep font settings visible during repo navigation
- resetFiles() no longer clears userSettings so FontChange stays visible while navigating between repos (old fonts show until new ones load) - Add _requestId counter to setUserRepo() to discard stale async callbacks from previous navigations, preventing state corruption on quick nav - Load savedRepo and userSettings caches in parallel with Promise.all, reducing yield points so cache hits apply before first render Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -20,6 +20,7 @@ interface State {
|
|||||||
readme?: string | null
|
readme?: string | null
|
||||||
userSettings?: UserSettings | null
|
userSettings?: UserSettings | null
|
||||||
needToLogin: boolean
|
needToLogin: boolean
|
||||||
|
_requestId: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
||||||
@@ -29,40 +30,44 @@ export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
|||||||
files: [],
|
files: [],
|
||||||
readme: undefined,
|
readme: undefined,
|
||||||
userSettings: undefined,
|
userSettings: undefined,
|
||||||
needToLogin: false
|
needToLogin: false,
|
||||||
|
_requestId: 0
|
||||||
}),
|
}),
|
||||||
actions: {
|
actions: {
|
||||||
async setUserRepo(user: string, repo: string) {
|
async setUserRepo(user: string, repo: string) {
|
||||||
|
const requestId = ++this._requestId
|
||||||
this.user = user
|
this.user = user
|
||||||
this.repo = repo
|
this.repo = repo
|
||||||
|
|
||||||
const savedRepoId = data.generateId(DataType.SavedRepo, `${user}-${repo}`)
|
const savedRepoId = data.generateId(DataType.SavedRepo, `${user}-${repo}`)
|
||||||
const cachedSavedRepo = await data.get<DataType.SavedRepo, SavedRepo>(
|
const userSettingsId = `UserSetting-${user}-${repo}`
|
||||||
savedRepoId
|
|
||||||
)
|
const [cachedSavedRepo, cachedUserSettings] = await Promise.all([
|
||||||
|
data.get<DataType.SavedRepo, SavedRepo>(savedRepoId),
|
||||||
|
data.get<DataType.UserSettings, UserSettings>(userSettingsId)
|
||||||
|
])
|
||||||
|
|
||||||
|
if (requestId !== this._requestId) return
|
||||||
|
|
||||||
if (cachedSavedRepo) {
|
if (cachedSavedRepo) {
|
||||||
this.files = cachedSavedRepo.files
|
this.files = cachedSavedRepo.files
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (cachedUserSettings) {
|
||||||
|
this.userSettings = cachedUserSettings
|
||||||
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await refreshToken()
|
await refreshToken()
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.warn("impossible to refresh token", error)
|
console.warn("impossible to refresh token", error)
|
||||||
}
|
}
|
||||||
|
|
||||||
const userSettingsId = `UserSetting-${user}-${repo}`
|
if (requestId !== this._requestId) return
|
||||||
const cachedUserSettings = await data.get<
|
|
||||||
DataType.UserSettings,
|
|
||||||
UserSettings
|
|
||||||
>(userSettingsId)
|
|
||||||
|
|
||||||
if (cachedUserSettings) {
|
|
||||||
this.userSettings = cachedUserSettings
|
|
||||||
}
|
|
||||||
|
|
||||||
getFiles(user, repo)
|
getFiles(user, repo)
|
||||||
.then(async (files) => {
|
.then(async (files) => {
|
||||||
|
if (requestId !== this._requestId) return
|
||||||
data.update<DataType.SavedRepo, SavedRepo>({
|
data.update<DataType.SavedRepo, SavedRepo>({
|
||||||
_id: savedRepoId,
|
_id: savedRepoId,
|
||||||
$type: DataType.SavedRepo,
|
$type: DataType.SavedRepo,
|
||||||
@@ -74,6 +79,7 @@ export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
|||||||
return getUserSettingsContent(user, repo, files)
|
return getUserSettingsContent(user, repo, files)
|
||||||
})
|
})
|
||||||
.then((userSettings) => {
|
.then((userSettings) => {
|
||||||
|
if (requestId !== this._requestId) return
|
||||||
const chosenFontFamily = userSettings?.fontFamilies?.find(
|
const chosenFontFamily = userSettings?.fontFamilies?.find(
|
||||||
(font) => font === this.userSettings?.chosenFontFamily
|
(font) => font === this.userSettings?.chosenFontFamily
|
||||||
)
|
)
|
||||||
@@ -109,6 +115,7 @@ export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
|||||||
})
|
})
|
||||||
|
|
||||||
getCachedMainReadme(user, repo).then(async (cachedReadme) => {
|
getCachedMainReadme(user, repo).then(async (cachedReadme) => {
|
||||||
|
if (requestId !== this._requestId) return
|
||||||
this.readme = cachedReadme
|
this.readme = cachedReadme
|
||||||
this.readme = await getMainReadme(user, repo)
|
this.readme = await getMainReadme(user, repo)
|
||||||
})
|
})
|
||||||
@@ -142,11 +149,11 @@ export const useUserRepoStore = defineStore("USER_REPO_STATE", {
|
|||||||
this.user = ""
|
this.user = ""
|
||||||
this.repo = ""
|
this.repo = ""
|
||||||
this.resetFiles()
|
this.resetFiles()
|
||||||
|
this.userSettings = undefined
|
||||||
},
|
},
|
||||||
resetFiles() {
|
resetFiles() {
|
||||||
this.files = []
|
this.files = []
|
||||||
this.readme = null
|
this.readme = null
|
||||||
this.userSettings = undefined
|
|
||||||
},
|
},
|
||||||
setFontFamily(fontFamily: string) {
|
setFontFamily(fontFamily: string) {
|
||||||
if (!this.userSettings) {
|
if (!this.userSettings) {
|
||||||
|
|||||||
Reference in New Issue
Block a user