refactor: more precise types for config helper

src/components/SettingsBar.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import Icon from 'components/Icon'
-import configHelper, { config } from 'utils/configHelper'
+import configHelper, { configKeys } from 'utils/configHelper'
 import keyHelper from 'utils/keyHelper'
 import { friendlyFormatShortcut } from 'utils/general.js'
 import { version } from '../../package.json'
@@ -56,7 +56,7 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
         key: 'compress-singleton',
         label: 'Compress singleton folder',
         onChange: this.createOnToggleChecked(
-          config.compressSingletonFolder,
+          configKeys.compressSingletonFolder,
           this.props.setCompressSingleton,
         ),
         getValue: () => this.props.compressSingletonFolder,
@@ -65,14 +65,17 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
       {
         key: 'copy-file',
         label: 'Copy File',
-        onChange: this.createOnToggleChecked(config.copyFileButton, this.props.setCopyFile),
+        onChange: this.createOnToggleChecked(configKeys.copyFileButton, this.props.setCopyFile),
         getValue: () => this.props.copyFileButton,
         wikiLink: wikiLinks.copyFileButton,
       },
       {
         key: 'copy-snippet',
         label: 'Copy Snippet',
-        onChange: this.createOnToggleChecked(config.copySnippetButton, this.props.setCopySnippet),
+        onChange: this.createOnToggleChecked(
+          configKeys.copySnippetButton,
+          this.props.setCopySnippet,
+        ),
         getValue: () => this.props.copySnippetButton,
         wikiLink: wikiLinks.copySnippet,
       },
@@ -97,7 +100,7 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
     const { onAccessTokenChange } = this.props
     const { accessToken } = this.state
     if (accessToken) {
-      await configHelper.setOne(config.accessToken, accessToken)
+      await configHelper.setOne(configKeys.accessToken, accessToken)
       onAccessTokenChange(accessToken)
       this.setState({
         accessToken: '',
@@ -115,7 +118,7 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
 
   clearToken = async () => {
     const { onAccessTokenChange } = this.props
-    await configHelper.setOne(config.accessToken, '')
+    await configHelper.setOne(configKeys.accessToken, '')
     onAccessTokenChange('')
     this.setState({ accessToken: '' })
   }
@@ -123,7 +126,7 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
   saveShortcut = async () => {
     const { onShortcutChange } = this.props
     const { toggleShowSideBarShortcut } = this.state
-    await configHelper.setOne(config.shortcut, toggleShowSideBarShortcut)
+    await configHelper.setOne(configKeys.shortcut, toggleShowSideBarShortcut)
     if (typeof toggleShowSideBarShortcut === 'string') {
       onShortcutChange(toggleShowSideBarShortcut)
       this.setState({
@@ -153,7 +156,7 @@ export default class SettingsBar extends React.PureComponent<Props, State> {
   }
 
   createOnToggleChecked(
-    configKey: config,
+    configKey: configKeys,
     set: (value: boolean) => void,
   ): (e: React.FormEvent<HTMLInputElement>) => Promise<void> {
     return async e => {

src/utils/configHelper.ts

@@ -2,14 +2,14 @@ import storageHelper from 'utils/storageHelper'
 import { pick } from 'utils/general'
 
 type Config = {
-  shortcut: string
-  accessToken: string | null
+  shortcut: string | null
+  access_token: string | null
   compressSingletonFolder: boolean
   copyFileButton: boolean
   copySnippetButton: boolean
 }
 
-export enum config {
+export enum configKeys {
   shortcut = 'shortcut',
   accessToken = 'access_token',
   compressSingletonFolder = 'compressSingletonFolder',
@@ -17,22 +17,45 @@ export enum config {
   copySnippetButton = 'copySnippetButton',
 }
 
-const configKeys = Object.values(config)
-
-function getAll(): any {
-  return storageHelper.get(configKeys) || {}
+const defaultConfigs = {
+  shortcut: null,
+  access_token: null,
+  compressSingletonFolder: true,
+  copyFileButton: true,
+  copySnippetButton: true,
 }
 
-function getOne(key: keyof Config) {
-  return getAll()[key]
+function applyDefaultConfigs(configs: Config) {
+  return Object.keys(configs).reduce(
+    (applied, configKey) => {
+      const key = configKey as keyof Config
+      if (configs[key] === undefined) {
+        applied[key] = defaultConfigs[key]
+      } else {
+        applied[key] = configs[key]
+      }
+      return applied
+    },
+    {} as Config,
+  )
 }
 
-function set(partialConfig: Partial<Config>) {
-  return storageHelper.set(pick(partialConfig, configKeys))
+const configKeyArray = Object.values(configKeys)
+
+async function getAll(): Promise<Config> {
+  return applyDefaultConfigs(await storageHelper.get(configKeyArray))
 }
 
-function setOne(key: config, value: any) {
-  return set({
+async function getOne(key: keyof Config) {
+  return (await getAll())[key]
+}
+
+async function set(partialConfig: Partial<Config>) {
+  return await storageHelper.set(pick(partialConfig, configKeyArray))
+}
+
+async function setOne(key: configKeys, value: any) {
+  return await set({
     [key]: value,
   })
 }