refactor: move persistence logic into a dedicated service (#3493)
This commit is contained in:
James George
GitHub
724
packages/hoppscotch-common/src/services/persistence/index.ts
Normal file
724
packages/hoppscotch-common/src/services/persistence/index.ts
Normal file
@@ -0,0 +1,724 @@
|
||||
/* eslint-disable no-restricted-globals, no-restricted-syntax */
|
||||
|
||||
import {
|
||||
Environment,
|
||||
translateToNewGQLCollection,
|
||||
translateToNewRESTCollection,
|
||||
} from "@hoppscotch/data"
|
||||
import { StorageLike, watchDebounced } from "@vueuse/core"
|
||||
import { Service } from "dioc"
|
||||
import { assign, clone, isEmpty } from "lodash-es"
|
||||
import { z } from "zod"
|
||||
|
||||
import { GQLTabService } from "~/services/tab/graphql"
|
||||
import { RESTTabService } from "~/services/tab/rest"
|
||||
|
||||
import { useToast } from "~/composables/toast"
|
||||
import { MQTTRequest$, setMQTTRequest } from "../../newstore/MQTTSession"
|
||||
import { SSERequest$, setSSERequest } from "../../newstore/SSESession"
|
||||
import { SIORequest$, setSIORequest } from "../../newstore/SocketIOSession"
|
||||
import { WSRequest$, setWSRequest } from "../../newstore/WebSocketSession"
|
||||
import {
|
||||
graphqlCollectionStore,
|
||||
restCollectionStore,
|
||||
setGraphqlCollections,
|
||||
setRESTCollections,
|
||||
} from "../../newstore/collections"
|
||||
import {
|
||||
addGlobalEnvVariable,
|
||||
environments$,
|
||||
globalEnv$,
|
||||
replaceEnvironments,
|
||||
selectedEnvironmentIndex$,
|
||||
setGlobalEnvVariables,
|
||||
setSelectedEnvironmentIndex,
|
||||
} from "../../newstore/environments"
|
||||
import {
|
||||
graphqlHistoryStore,
|
||||
restHistoryStore,
|
||||
setGraphqlHistoryEntries,
|
||||
setRESTHistoryEntries,
|
||||
translateToNewGQLHistory,
|
||||
translateToNewRESTHistory,
|
||||
} from "../../newstore/history"
|
||||
import { bulkApplyLocalState, localStateStore } from "../../newstore/localstate"
|
||||
import {
|
||||
HoppAccentColor,
|
||||
HoppBgColor,
|
||||
applySetting,
|
||||
bulkApplySettings,
|
||||
getDefaultSettings,
|
||||
performSettingsDataMigrations,
|
||||
settingsStore,
|
||||
} from "../../newstore/settings"
|
||||
import {
|
||||
ENVIRONMENTS_SCHEMA,
|
||||
GLOBAL_ENV_SCHEMA,
|
||||
GQL_COLLECTION_SCHEMA,
|
||||
GQL_HISTORY_ENTRY_SCHEMA,
|
||||
GQL_TAB_STATE_SCHEMA,
|
||||
LOCAL_STATE_SCHEMA,
|
||||
MQTT_REQUEST_SCHEMA,
|
||||
NUXT_COLOR_MODE_SCHEMA,
|
||||
REST_COLLECTION_SCHEMA,
|
||||
REST_HISTORY_ENTRY_SCHEMA,
|
||||
REST_TAB_STATE_SCHEMA,
|
||||
SELECTED_ENV_INDEX_SCHEMA,
|
||||
SETTINGS_SCHEMA,
|
||||
SOCKET_IO_REQUEST_SCHEMA,
|
||||
SSE_REQUEST_SCHEMA,
|
||||
THEME_COLOR_SCHEMA,
|
||||
VUEX_SCHEMA,
|
||||
WEBSOCKET_REQUEST_SCHEMA,
|
||||
} from "./validation-schemas"
|
||||
|
||||
/**
|
||||
* This service compiles persistence logic across the codebase
|
||||
*/
|
||||
export class PersistenceService extends Service {
|
||||
public static readonly ID = "PERSISTENCE_SERVICE"
|
||||
|
||||
private readonly restTabService = this.bind(RESTTabService)
|
||||
private readonly gqlTabService = this.bind(GQLTabService)
|
||||
|
||||
public hoppLocalConfigStorage: StorageLike = localStorage
|
||||
|
||||
constructor() {
|
||||
super()
|
||||
}
|
||||
|
||||
private showErrorToast(localStorageKey: string) {
|
||||
const toast = useToast()
|
||||
toast.error(
|
||||
`There's a mismatch with the expected schema for the value corresponding to ${localStorageKey} read from localStorage, keeping a backup in ${localStorageKey}-backup`
|
||||
)
|
||||
}
|
||||
|
||||
private checkAndMigrateOldSettings() {
|
||||
if (window.localStorage.getItem("selectedEnvIndex")) {
|
||||
const index = window.localStorage.getItem("selectedEnvIndex")
|
||||
if (index) {
|
||||
if (index === "-1") {
|
||||
window.localStorage.setItem(
|
||||
"selectedEnvIndex",
|
||||
JSON.stringify({
|
||||
type: "NO_ENV_SELECTED",
|
||||
})
|
||||
)
|
||||
} else if (Number(index) >= 0) {
|
||||
window.localStorage.setItem(
|
||||
"selectedEnvIndex",
|
||||
JSON.stringify({
|
||||
type: "MY_ENV",
|
||||
index: parseInt(index),
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const vuexKey = "vuex"
|
||||
let vuexData = JSON.parse(window.localStorage.getItem(vuexKey) || "{}")
|
||||
|
||||
if (isEmpty(vuexData)) return
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = VUEX_SCHEMA.safeParse(vuexData)
|
||||
if (result.success) {
|
||||
vuexData = result.data
|
||||
} else {
|
||||
this.showErrorToast(vuexKey)
|
||||
window.localStorage.setItem(`${vuexKey}-backup`, JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
const { postwoman } = vuexData
|
||||
|
||||
if (!isEmpty(postwoman?.settings)) {
|
||||
const settingsData = assign(
|
||||
clone(getDefaultSettings()),
|
||||
postwoman.settings
|
||||
)
|
||||
|
||||
window.localStorage.setItem("settings", JSON.stringify(settingsData))
|
||||
|
||||
delete postwoman.settings
|
||||
window.localStorage.setItem(vuexKey, JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
if (postwoman?.collections) {
|
||||
window.localStorage.setItem(
|
||||
"collections",
|
||||
JSON.stringify(postwoman.collections)
|
||||
)
|
||||
|
||||
delete postwoman.collections
|
||||
window.localStorage.setItem(vuexKey, JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
if (postwoman?.collectionsGraphql) {
|
||||
window.localStorage.setItem(
|
||||
"collectionsGraphql",
|
||||
JSON.stringify(postwoman.collectionsGraphql)
|
||||
)
|
||||
|
||||
delete postwoman.collectionsGraphql
|
||||
window.localStorage.setItem(vuexKey, JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
if (postwoman?.environments) {
|
||||
window.localStorage.setItem(
|
||||
"environments",
|
||||
JSON.stringify(postwoman.environments)
|
||||
)
|
||||
|
||||
delete postwoman.environments
|
||||
window.localStorage.setItem(vuexKey, JSON.stringify(vuexData))
|
||||
}
|
||||
|
||||
const themeColorKey = "THEME_COLOR"
|
||||
let themeColorValue = window.localStorage.getItem(themeColorKey)
|
||||
|
||||
if (themeColorValue) {
|
||||
// Validate data read from localStorage
|
||||
const result = THEME_COLOR_SCHEMA.safeParse(themeColorValue)
|
||||
|
||||
if (result.success) {
|
||||
themeColorValue = result.data
|
||||
} else {
|
||||
this.showErrorToast(themeColorKey)
|
||||
window.localStorage.setItem(`${themeColorKey}-backup`, themeColorValue)
|
||||
}
|
||||
|
||||
applySetting(themeColorKey, themeColorValue as HoppAccentColor)
|
||||
window.localStorage.removeItem(themeColorKey)
|
||||
}
|
||||
|
||||
const nuxtColorModeKey = "nuxt-color-mode"
|
||||
let nuxtColorModeValue = window.localStorage.getItem(nuxtColorModeKey)
|
||||
|
||||
if (nuxtColorModeValue) {
|
||||
// Validate data read from localStorage
|
||||
const result = NUXT_COLOR_MODE_SCHEMA.safeParse(nuxtColorModeValue)
|
||||
|
||||
if (result.success) {
|
||||
nuxtColorModeValue = result.data
|
||||
} else {
|
||||
this.showErrorToast(nuxtColorModeKey)
|
||||
window.localStorage.setItem(
|
||||
`${nuxtColorModeKey}-backup`,
|
||||
nuxtColorModeValue
|
||||
)
|
||||
}
|
||||
|
||||
applySetting("BG_COLOR", nuxtColorModeValue as HoppBgColor)
|
||||
window.localStorage.removeItem(nuxtColorModeKey)
|
||||
}
|
||||
}
|
||||
|
||||
public setupLocalStatePersistence() {
|
||||
const localStateKey = "localState"
|
||||
let localStateData = JSON.parse(
|
||||
window.localStorage.getItem(localStateKey) ?? "{}"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = LOCAL_STATE_SCHEMA.safeParse(localStateData)
|
||||
|
||||
if (result.success) {
|
||||
localStateData = result.data
|
||||
} else {
|
||||
this.showErrorToast(localStateKey)
|
||||
window.localStorage.setItem(
|
||||
`${localStateKey}-backup`,
|
||||
JSON.stringify(localStateData)
|
||||
)
|
||||
}
|
||||
|
||||
if (localStateData) bulkApplyLocalState(localStateData)
|
||||
|
||||
localStateStore.subject$.subscribe((state) => {
|
||||
window.localStorage.setItem(localStateKey, JSON.stringify(state))
|
||||
})
|
||||
}
|
||||
|
||||
private setupSettingsPersistence() {
|
||||
const settingsKey = "settings"
|
||||
let settingsData = JSON.parse(
|
||||
window.localStorage.getItem(settingsKey) || "{}"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = SETTINGS_SCHEMA.safeParse(settingsData)
|
||||
if (result.success) {
|
||||
settingsData = result.data
|
||||
} else {
|
||||
this.showErrorToast(settingsKey)
|
||||
window.localStorage.setItem(
|
||||
`${settingsKey}-backup`,
|
||||
JSON.stringify(settingsData)
|
||||
)
|
||||
}
|
||||
|
||||
const updatedSettings = settingsData
|
||||
? performSettingsDataMigrations(settingsData)
|
||||
: settingsData
|
||||
|
||||
if (updatedSettings) {
|
||||
bulkApplySettings(updatedSettings)
|
||||
}
|
||||
|
||||
settingsStore.subject$.subscribe((settings) => {
|
||||
window.localStorage.setItem(settingsKey, JSON.stringify(settings))
|
||||
})
|
||||
}
|
||||
|
||||
private setupHistoryPersistence() {
|
||||
const restHistoryKey = "history"
|
||||
let restHistoryData = JSON.parse(
|
||||
window.localStorage.getItem(restHistoryKey) || "[]"
|
||||
)
|
||||
|
||||
const graphqlHistoryKey = "graphqlHistory"
|
||||
let graphqlHistoryData = JSON.parse(
|
||||
window.localStorage.getItem(graphqlHistoryKey) || "[]"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const restHistorySchemaParsedresult = z
|
||||
.array(REST_HISTORY_ENTRY_SCHEMA)
|
||||
.safeParse(restHistoryData)
|
||||
|
||||
if (restHistorySchemaParsedresult.success) {
|
||||
restHistoryData = restHistorySchemaParsedresult.data
|
||||
} else {
|
||||
this.showErrorToast(restHistoryKey)
|
||||
window.localStorage.setItem(
|
||||
`${restHistoryKey}-backup`,
|
||||
JSON.stringify(restHistoryData)
|
||||
)
|
||||
}
|
||||
|
||||
const gqlHistorySchemaParsedresult = z
|
||||
.array(GQL_HISTORY_ENTRY_SCHEMA)
|
||||
.safeParse(graphqlHistoryData)
|
||||
|
||||
if (gqlHistorySchemaParsedresult.success) {
|
||||
graphqlHistoryData = gqlHistorySchemaParsedresult.data
|
||||
} else {
|
||||
this.showErrorToast(graphqlHistoryKey)
|
||||
window.localStorage.setItem(
|
||||
`${graphqlHistoryKey}-backup`,
|
||||
JSON.stringify(graphqlHistoryData)
|
||||
)
|
||||
}
|
||||
|
||||
const translatedRestHistoryData = restHistoryData.map(
|
||||
translateToNewRESTHistory
|
||||
)
|
||||
const translatedGraphqlHistoryData = graphqlHistoryData.map(
|
||||
translateToNewGQLHistory
|
||||
)
|
||||
|
||||
setRESTHistoryEntries(translatedRestHistoryData)
|
||||
setGraphqlHistoryEntries(translatedGraphqlHistoryData)
|
||||
|
||||
restHistoryStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem(restHistoryKey, JSON.stringify(state))
|
||||
})
|
||||
|
||||
graphqlHistoryStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem(graphqlHistoryKey, JSON.stringify(state))
|
||||
})
|
||||
}
|
||||
|
||||
private setupCollectionsPersistence() {
|
||||
const restCollectionsKey = "collections"
|
||||
let restCollectionsData = JSON.parse(
|
||||
window.localStorage.getItem(restCollectionsKey) || "[]"
|
||||
)
|
||||
|
||||
const graphqlCollectionsKey = "collectionsGraphql"
|
||||
let graphqlCollectionsData = JSON.parse(
|
||||
window.localStorage.getItem(graphqlCollectionsKey) || "[]"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const restCollectionsSchemaParsedresult = z
|
||||
.array(REST_COLLECTION_SCHEMA)
|
||||
.safeParse(restCollectionsData)
|
||||
|
||||
if (restCollectionsSchemaParsedresult.success) {
|
||||
restCollectionsData = restCollectionsSchemaParsedresult.data
|
||||
} else {
|
||||
this.showErrorToast(restCollectionsKey)
|
||||
window.localStorage.setItem(
|
||||
`${restCollectionsKey}-backup`,
|
||||
JSON.stringify(restCollectionsData)
|
||||
)
|
||||
}
|
||||
|
||||
const gqlCollectionsSchemaParsedresult = z
|
||||
.array(GQL_COLLECTION_SCHEMA)
|
||||
.safeParse(graphqlCollectionsData)
|
||||
|
||||
if (gqlCollectionsSchemaParsedresult.success) {
|
||||
graphqlCollectionsData = gqlCollectionsSchemaParsedresult.data
|
||||
} else {
|
||||
this.showErrorToast(graphqlCollectionsKey)
|
||||
window.localStorage.setItem(
|
||||
`${graphqlCollectionsKey}-backup`,
|
||||
JSON.stringify(graphqlCollectionsData)
|
||||
)
|
||||
}
|
||||
|
||||
const translatedRestCollectionsData = restCollectionsData.map(
|
||||
translateToNewRESTCollection
|
||||
)
|
||||
const translatedGraphqlCollectionsData = graphqlCollectionsData.map(
|
||||
translateToNewGQLCollection
|
||||
)
|
||||
|
||||
setRESTCollections(translatedRestCollectionsData)
|
||||
setGraphqlCollections(translatedGraphqlCollectionsData)
|
||||
|
||||
restCollectionStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem(restCollectionsKey, JSON.stringify(state))
|
||||
})
|
||||
|
||||
graphqlCollectionStore.subject$.subscribe(({ state }) => {
|
||||
window.localStorage.setItem(graphqlCollectionsKey, JSON.stringify(state))
|
||||
})
|
||||
}
|
||||
|
||||
private setupEnvironmentsPersistence() {
|
||||
const environmentsKey = "environments"
|
||||
let environmentsData: Environment[] = JSON.parse(
|
||||
window.localStorage.getItem(environmentsKey) || "[]"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = ENVIRONMENTS_SCHEMA.safeParse(environmentsData)
|
||||
if (result.success) {
|
||||
environmentsData = result.data
|
||||
} else {
|
||||
this.showErrorToast(environmentsKey)
|
||||
window.localStorage.setItem(
|
||||
`${environmentsKey}-backup`,
|
||||
JSON.stringify(environmentsData)
|
||||
)
|
||||
}
|
||||
|
||||
// Check if a global env is defined and if so move that to globals
|
||||
const globalIndex = environmentsData.findIndex(
|
||||
(x) => x.name.toLowerCase() === "globals"
|
||||
)
|
||||
|
||||
if (globalIndex !== -1) {
|
||||
const globalEnv = environmentsData[globalIndex]
|
||||
globalEnv.variables.forEach((variable) => addGlobalEnvVariable(variable))
|
||||
|
||||
// Remove global from environments
|
||||
environmentsData.splice(globalIndex, 1)
|
||||
|
||||
// Just sync the changes manually
|
||||
window.localStorage.setItem(
|
||||
environmentsKey,
|
||||
JSON.stringify(environmentsData)
|
||||
)
|
||||
}
|
||||
|
||||
replaceEnvironments(environmentsData)
|
||||
|
||||
environments$.subscribe((envs) => {
|
||||
window.localStorage.setItem(environmentsKey, JSON.stringify(envs))
|
||||
})
|
||||
}
|
||||
|
||||
private setupSelectedEnvPersistence() {
|
||||
const selectedEnvIndexKey = "selectedEnvIndex"
|
||||
let selectedEnvIndexValue = JSON.parse(
|
||||
window.localStorage.getItem(selectedEnvIndexKey) ?? "null"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = SELECTED_ENV_INDEX_SCHEMA.safeParse(selectedEnvIndexValue)
|
||||
if (result.success) {
|
||||
selectedEnvIndexValue = result.data
|
||||
} else {
|
||||
this.showErrorToast(selectedEnvIndexKey)
|
||||
window.localStorage.setItem(
|
||||
`${selectedEnvIndexKey}-backup`,
|
||||
JSON.stringify(selectedEnvIndexValue)
|
||||
)
|
||||
}
|
||||
|
||||
// If there is a selected env index, set it to the store else set it to null
|
||||
if (selectedEnvIndexValue) {
|
||||
setSelectedEnvironmentIndex(selectedEnvIndexValue)
|
||||
} else {
|
||||
setSelectedEnvironmentIndex({
|
||||
type: "NO_ENV_SELECTED",
|
||||
})
|
||||
}
|
||||
|
||||
selectedEnvironmentIndex$.subscribe((envIndex) => {
|
||||
window.localStorage.setItem(selectedEnvIndexKey, JSON.stringify(envIndex))
|
||||
})
|
||||
}
|
||||
|
||||
private setupWebsocketPersistence() {
|
||||
const wsRequestKey = "WebsocketRequest"
|
||||
let wsRequestData = JSON.parse(
|
||||
window.localStorage.getItem(wsRequestKey) || "null"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = WEBSOCKET_REQUEST_SCHEMA.safeParse(wsRequestData)
|
||||
if (result.success) {
|
||||
wsRequestData = result.data
|
||||
} else {
|
||||
this.showErrorToast(wsRequestKey)
|
||||
window.localStorage.setItem(
|
||||
`${wsRequestKey}-backup`,
|
||||
JSON.stringify(wsRequestData)
|
||||
)
|
||||
}
|
||||
|
||||
setWSRequest(wsRequestData)
|
||||
|
||||
WSRequest$.subscribe((req) => {
|
||||
window.localStorage.setItem(wsRequestKey, JSON.stringify(req))
|
||||
})
|
||||
}
|
||||
|
||||
private setupSocketIOPersistence() {
|
||||
const sioRequestKey = "SocketIORequest"
|
||||
let sioRequestData = JSON.parse(
|
||||
window.localStorage.getItem(sioRequestKey) || "null"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = SOCKET_IO_REQUEST_SCHEMA.safeParse(sioRequestData)
|
||||
if (result.success) {
|
||||
sioRequestData = result.data
|
||||
} else {
|
||||
this.showErrorToast(sioRequestKey)
|
||||
window.localStorage.setItem(
|
||||
`${sioRequestKey}-backup`,
|
||||
JSON.stringify(sioRequestData)
|
||||
)
|
||||
}
|
||||
|
||||
setSIORequest(sioRequestData)
|
||||
|
||||
SIORequest$.subscribe((req) => {
|
||||
window.localStorage.setItem(sioRequestKey, JSON.stringify(req))
|
||||
})
|
||||
}
|
||||
|
||||
private setupSSEPersistence() {
|
||||
const sseRequestKey = "SSERequest"
|
||||
let sseRequestData = JSON.parse(
|
||||
window.localStorage.getItem(sseRequestKey) || "null"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = SSE_REQUEST_SCHEMA.safeParse(sseRequestData)
|
||||
if (result.success) {
|
||||
sseRequestData = result.data
|
||||
} else {
|
||||
this.showErrorToast(sseRequestKey)
|
||||
window.localStorage.setItem(
|
||||
`${sseRequestKey}-backup`,
|
||||
JSON.stringify(sseRequestData)
|
||||
)
|
||||
}
|
||||
|
||||
setSSERequest(sseRequestData)
|
||||
|
||||
SSERequest$.subscribe((req) => {
|
||||
window.localStorage.setItem(sseRequestKey, JSON.stringify(req))
|
||||
})
|
||||
}
|
||||
|
||||
private setupMQTTPersistence() {
|
||||
const mqttRequestKey = "MQTTRequest"
|
||||
let mqttRequestData = JSON.parse(
|
||||
window.localStorage.getItem(mqttRequestKey) || "null"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = MQTT_REQUEST_SCHEMA.safeParse(mqttRequestData)
|
||||
if (result.success) {
|
||||
mqttRequestData = result.data
|
||||
} else {
|
||||
this.showErrorToast(mqttRequestKey)
|
||||
window.localStorage.setItem(
|
||||
`${mqttRequestKey}-backup`,
|
||||
JSON.stringify(mqttRequestData)
|
||||
)
|
||||
}
|
||||
|
||||
setMQTTRequest(mqttRequestData)
|
||||
|
||||
MQTTRequest$.subscribe((req) => {
|
||||
window.localStorage.setItem(mqttRequestKey, JSON.stringify(req))
|
||||
})
|
||||
}
|
||||
|
||||
private setupGlobalEnvsPersistence() {
|
||||
const globalEnvKey = "globalEnv"
|
||||
let globalEnvData: Environment["variables"] = JSON.parse(
|
||||
window.localStorage.getItem(globalEnvKey) || "[]"
|
||||
)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = GLOBAL_ENV_SCHEMA.safeParse(globalEnvData)
|
||||
if (result.success) {
|
||||
globalEnvData = result.data
|
||||
} else {
|
||||
this.showErrorToast(globalEnvKey)
|
||||
window.localStorage.setItem(
|
||||
`${globalEnvKey}-backup`,
|
||||
JSON.stringify(globalEnvData)
|
||||
)
|
||||
}
|
||||
|
||||
setGlobalEnvVariables(globalEnvData)
|
||||
|
||||
globalEnv$.subscribe((vars) => {
|
||||
window.localStorage.setItem(globalEnvKey, JSON.stringify(vars))
|
||||
})
|
||||
}
|
||||
|
||||
private setupGQLTabsPersistence() {
|
||||
const gqlTabStateKey = "gqlTabState"
|
||||
const gqlTabStateData = window.localStorage.getItem(gqlTabStateKey)
|
||||
|
||||
try {
|
||||
if (gqlTabStateData) {
|
||||
let parsedGqlTabStateData = JSON.parse(gqlTabStateData)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = GQL_TAB_STATE_SCHEMA.safeParse(parsedGqlTabStateData)
|
||||
|
||||
if (result.success) {
|
||||
parsedGqlTabStateData = result.data
|
||||
} else {
|
||||
this.showErrorToast(gqlTabStateKey)
|
||||
window.localStorage.setItem(
|
||||
`${gqlTabStateKey}-backup`,
|
||||
JSON.stringify(parsedGqlTabStateData)
|
||||
)
|
||||
}
|
||||
|
||||
this.gqlTabService.loadTabsFromPersistedState(parsedGqlTabStateData)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(
|
||||
`Failed parsing persisted tab state, state:`,
|
||||
gqlTabStateData
|
||||
)
|
||||
}
|
||||
|
||||
watchDebounced(
|
||||
this.gqlTabService.persistableTabState,
|
||||
(newGqlTabStateData) => {
|
||||
window.localStorage.setItem(
|
||||
gqlTabStateKey,
|
||||
JSON.stringify(newGqlTabStateData)
|
||||
)
|
||||
},
|
||||
{ debounce: 500, deep: true }
|
||||
)
|
||||
}
|
||||
|
||||
private setupRESTTabsPersistence() {
|
||||
const restTabStateKey = "restTabState"
|
||||
const restTabStateData = window.localStorage.getItem(restTabStateKey)
|
||||
|
||||
try {
|
||||
if (restTabStateData) {
|
||||
let parsedGqlTabStateData = JSON.parse(restTabStateData)
|
||||
|
||||
// Validate data read from localStorage
|
||||
const result = REST_TAB_STATE_SCHEMA.safeParse(parsedGqlTabStateData)
|
||||
|
||||
if (result.success) {
|
||||
parsedGqlTabStateData = result.data
|
||||
} else {
|
||||
this.showErrorToast(restTabStateKey)
|
||||
window.localStorage.setItem(
|
||||
`${restTabStateKey}-backup`,
|
||||
JSON.stringify(parsedGqlTabStateData)
|
||||
)
|
||||
}
|
||||
|
||||
this.restTabService.loadTabsFromPersistedState(parsedGqlTabStateData)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(
|
||||
`Failed parsing persisted tab state, state:`,
|
||||
restTabStateData
|
||||
)
|
||||
}
|
||||
|
||||
watchDebounced(
|
||||
this.restTabService.persistableTabState,
|
||||
(newRestTabStateData) => {
|
||||
window.localStorage.setItem(
|
||||
restTabStateKey,
|
||||
JSON.stringify(newRestTabStateData)
|
||||
)
|
||||
},
|
||||
{ debounce: 500, deep: true }
|
||||
)
|
||||
}
|
||||
|
||||
public setupLocalPersistence() {
|
||||
this.checkAndMigrateOldSettings()
|
||||
|
||||
this.setupLocalStatePersistence()
|
||||
this.setupSettingsPersistence()
|
||||
this.setupRESTTabsPersistence()
|
||||
|
||||
this.setupGQLTabsPersistence()
|
||||
|
||||
this.setupHistoryPersistence()
|
||||
this.setupCollectionsPersistence()
|
||||
this.setupGlobalEnvsPersistence()
|
||||
this.setupEnvironmentsPersistence()
|
||||
this.setupSelectedEnvPersistence()
|
||||
this.setupWebsocketPersistence()
|
||||
this.setupSocketIOPersistence()
|
||||
this.setupSSEPersistence()
|
||||
this.setupMQTTPersistence()
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets a value from localStorage
|
||||
*
|
||||
* NOTE: Use localStorage to only store non-reactive simple data
|
||||
* For more complex data, use stores and connect it to `PersistenceService`
|
||||
*/
|
||||
public getLocalConfig(name: string) {
|
||||
return window.localStorage.getItem(name)
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets a value in localStorage
|
||||
*
|
||||
* NOTE: Use localStorage to only store non-reactive simple data
|
||||
* For more complex data, use stores and connect it to `PersistenceService`
|
||||
*/
|
||||
public setLocalConfig(key: string, value: string) {
|
||||
window.localStorage.setItem(key, value)
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear config value in localStorage
|
||||
*/
|
||||
public removeLocalConfig(key: string) {
|
||||
window.localStorage.removeItem(key)
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user