storage-migrator

Manage your Local Storage & cookies migrations like you would with a database.

• Features
• Usage
  • Installation
  • Migration file
  • Vanilla JS/TS Initialization
  • React Hook Initialization
• Contributing

Features

• [x] JS library
• [x] React hook
• [ ] Cookies
• [x] LocalStorage

Usage

Installation

npm i -E storage-migrator

Migration file

import { type LocalStorageMigration, OperationType, StorageType } from 'storage-migrator'

export const MIGRATIONS: LocalStorageMigration[] = [
  {
    description: 'Rename "oldKey" to "newKey"',
    operations: [
      {
        from: 'oldKey',
        to: 'newKey',
        type: OperationType.RenameKey,
        storageType: StorageType.LocalStorage,
      },
    ],
  },
  {
    description: 'Delete "deprecatedKey"',
    operations: [
      {
        key: 'deprecatedKey',
        storageType: StorageType.LocalStorage,
        type: OperationType.DeleteKey,
      },
    ],
  },
  {
    description: 'Rename JSON property key "oldJsonKey" to "newJsonKey"',
    operations: [
      {
        key: 'jsonKey1',
        newJsonKey: 'newJsonKey',
        oldJsonKey: 'oldJsonKey',
        storageType: StorageType.LocalStorage,
        type: OperationType.RenameJsonValuePropertyKey,
      },
    ],
  },
  {
    description: 'Update JSON property value from `OLD_VALUE` to `NEW_VALUE`',
    operations: [
      {
        jsonKey: 'key',
        key: 'jsonKey2',
        newJsonValue: 'NEW_VALUE',
        oldJsonValue: 'OLD_VALUE',
        storageType: StorageType.LocalStorage,
        type: OperationType.UpdateJsonPropertyValue,
      },
    ],
  },
]

Vanilla JS/TS Initialization

import { LocalStorageMigrator, type LocalStorageMigration } from 'storage-migrator'

import { MIGRATIONS } from '...'

const localStorageMigrator = new LocalStorageMigrator(MIGRATIONS)

localStorageMigrator.run()

React Hook Initialization

import { useLocalStorageMigrator } from 'storage-migrator'

import { MIGRATIONS } from '...'

export function App() {
  useLocalStorageMigrator(MIGRATIONS)

  return <div>My App</div>
}

Contributing

Please read the contributing document for setup and contributing instructions.