From 5fce1118f67246a2772b8716141c940929d38d09 Mon Sep 17 00:00:00 2001 From: Andrew Bastin Date: Tue, 23 Mar 2021 11:18:14 -0400 Subject: [PATCH] Revamp of the Settings State System along with TypeScript support (#1560) * Add vue-rx, rxjs and lodash as dependencies * Added vue-rx plugin integration to nuxt config * Initial settings store implementation * Add babel plugin for private class properties to for Jest * Add DispatchingStore test spec * Initial settings code * Reactive Streams for fb current user and id token * Fix typo * Migrate index and graphql pages to the new store * Migrate network strategy to the new store * Fixed Section.vue errors * Fix getSettingSubject issue * Migrate fb settings reference in components to the new state system * Add typings for lodash as dev dependency * Load setting * Load initial sync setting values * Update proxy url * Add typescript support * Rewrite Settings store to TypeScript * Port Settings page to TypeScript as reference * Move all store migrations to a separate file * Delete test file for fb.js * Add ts-jest as dev dependency * Remove firebase-mock as dependency * Remove FRAME_COLORS_ENABLED settings value --- babel.config.js | 3 + components/app/Section.vue | 13 +- components/collections/Add.vue | 18 +- components/collections/Collection.vue | 18 +- components/collections/Edit.vue | 18 +- components/collections/EditFolder.vue | 18 +- components/collections/EditRequest.vue | 18 +- components/collections/Folder.vue | 18 +- components/collections/ImportExport.vue | 16 +- components/collections/Request.vue | 18 +- components/collections/SaveRequest.vue | 18 +- components/collections/index.vue | 18 +- components/environments/Add.vue | 12 +- components/environments/Edit.vue | 12 +- components/environments/Environment.vue | 12 +- components/environments/ImportExport.vue | 12 +- components/environments/index.vue | 12 +- helpers/__tests__/fb.spec.js | 1252 - helpers/__tests__/network-ExtDisabled.spec.js | 83 + helpers/__tests__/network-ExtEnabled.spec.js | 82 + helpers/__tests__/network.spec.js | 176 - helpers/fb.js | 45 + helpers/migrations.ts | 17 + helpers/network.js | 21 +- helpers/strategies/AxiosStrategy.js | 13 +- helpers/strategies/ExtensionStrategy.js | 15 +- .../__tests__/AxiosStrategy-NoProxy.spec.js | 31 +- .../__tests__/AxiosStrategy-Proxy.spec.js | 41 +- .../ExtensionStrategy-NoProxy.spec.js | 220 + ...pec.js => ExtensionStrategy-Proxy.spec.js} | 134 +- layouts/default.vue | 13 +- newstore/DispatchingStore.ts | 56 + newstore/__tests__/DispatchingStore.spec.js | 185 + newstore/localpersistence.ts | 36 + newstore/settings.ts | 91 + nuxt.config.js | 3 + package-lock.json | 38449 +++++++++++++--- package.json | 13 +- pages/graphql.vue | 22 +- pages/index.vue | 85 +- pages/settings.vue | 175 +- plugins/vue-rx.js | 4 + tsconfig.json | 20 + types/pw-ext-hook.d.ts | 21 + types/ts-utils.d.ts | 1 + types/window.d.ts | 7 + vue-shim.d.ts | 4 + 47 files changed, 32426 insertions(+), 9143 deletions(-) delete mode 100644 helpers/__tests__/fb.spec.js create mode 100644 helpers/__tests__/network-ExtDisabled.spec.js create mode 100644 helpers/__tests__/network-ExtEnabled.spec.js delete mode 100644 helpers/__tests__/network.spec.js create mode 100644 helpers/migrations.ts create mode 100644 helpers/strategies/__tests__/ExtensionStrategy-NoProxy.spec.js rename helpers/strategies/__tests__/{ExtensionStrategy.spec.js => ExtensionStrategy-Proxy.spec.js} (73%) create mode 100644 newstore/DispatchingStore.ts create mode 100644 newstore/__tests__/DispatchingStore.spec.js create mode 100644 newstore/localpersistence.ts create mode 100644 newstore/settings.ts create mode 100644 plugins/vue-rx.js create mode 100644 tsconfig.json create mode 100644 types/pw-ext-hook.d.ts create mode 100644 types/ts-utils.d.ts create mode 100644 types/window.d.ts create mode 100644 vue-shim.d.ts diff --git a/babel.config.js b/babel.config.js index 35e03527d..fbc7468ef 100644 --- a/babel.config.js +++ b/babel.config.js @@ -5,6 +5,9 @@ function isBabelLoader(caller) { module.exports = function (api) { if (api.env("test") && !api.caller(isBabelLoader)) { return { + plugins: [ + "@babel/plugin-proposal-class-properties" + ], presets: [ [ "@babel/preset-env", diff --git a/components/app/Section.vue b/components/app/Section.vue index b16560b38..c9a822171 100644 --- a/components/app/Section.vue +++ b/components/app/Section.vue @@ -34,14 +34,15 @@ fieldset { } - diff --git a/components/collections/Add.vue b/components/collections/Add.vue index e8e98a183..545d103ee 100644 --- a/components/collections/Add.vue +++ b/components/collections/Add.vue @@ -38,6 +38,7 @@ diff --git a/plugins/vue-rx.js b/plugins/vue-rx.js new file mode 100644 index 000000000..23156b5bc --- /dev/null +++ b/plugins/vue-rx.js @@ -0,0 +1,4 @@ +import Vue from "vue" +import VueRx from "vue-rx" + +Vue.use(VueRx) diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 000000000..495c19930 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "target": "ES2018", + "module": "ESNext", + "moduleResolution": "Node", + "lib": ["ESNext", "ESNext.AsyncIterable", "DOM"], + "esModuleInterop": true, + "allowJs": true, + "sourceMap": true, + "strict": true, + "noEmit": true, + "baseUrl": ".", + "paths": { + "~/*": ["./*"], + "@/*": ["./*"] + }, + "types": ["@types/node", "@nuxt/types", "nuxt-i18n", "@nuxtjs/toast", "vue-rx"] + }, + "exclude": ["node_modules"] +} diff --git a/types/pw-ext-hook.d.ts b/types/pw-ext-hook.d.ts new file mode 100644 index 000000000..17183a56a --- /dev/null +++ b/types/pw-ext-hook.d.ts @@ -0,0 +1,21 @@ +interface PWExtensionRequestInfo { + method: string + url: string + data: any & { wantsBinary: boolean } +} + +interface PWExtensionResponse { + data: any + config?: { + timeData?: { + startTime: number + endTime: number + } + } +} + +interface PWExtensionHook { + getVersion: () => { major: number, minor: number } + sendRequest: (req: PWExtensionRequestInfo) => Promise + cancelRunningRequest: () => void +} diff --git a/types/ts-utils.d.ts b/types/ts-utils.d.ts new file mode 100644 index 000000000..704badee9 --- /dev/null +++ b/types/ts-utils.d.ts @@ -0,0 +1 @@ +export type KeysMatching = {[K in keyof T]-?: T[K] extends V ? K : never}[keyof T]; diff --git a/types/window.d.ts b/types/window.d.ts new file mode 100644 index 000000000..424c7bf33 --- /dev/null +++ b/types/window.d.ts @@ -0,0 +1,7 @@ +export {} + +declare global { + interface Window { + __POSTWOMAN_EXTENSION_HOOK__: PWExtensionHook + } +} diff --git a/vue-shim.d.ts b/vue-shim.d.ts new file mode 100644 index 000000000..eb40980e5 --- /dev/null +++ b/vue-shim.d.ts @@ -0,0 +1,4 @@ +declare module "*.vue" { + import Vue from 'vue' + export default Vue +}