Skip to content

Instantly share code, notes, and snippets.

@MeyCry

MeyCry/indexeddb-helper.ts

Last active May 18, 2023 13:31
Show Gist options
  • Save MeyCry/ca05520d415f0cab01399217d378289c to your computer and use it in GitHub Desktop.
Save MeyCry/ca05520d415f0cab01399217d378289c to your computer and use it in GitHub Desktop.
Download ZIP
indexeddb-helper.ts
Raw
indexeddb-helper.ts
// indexeddb-helper.ts
class IndexedDBHelper {
private readonly dbName: string;
private readonly storeName: string;
constructor(dbName: string, storeName: string) {
this.dbName = dbName;
this.storeName = storeName;
}
private openDB(): Promise<IDBDatabase> {
return new Promise<IDBDatabase>((resolve, reject) => {
const request = indexedDB.open(this.dbName, 1);
request.onupgradeneeded = event => {
const db = (event.target as IDBOpenDBRequest).result;
if (!db.objectStoreNames.contains(this.storeName)) {
db.createObjectStore(this.storeName, {keyPath: 'id', autoIncrement: true});
}
};
request.onsuccess = event => {
const db = (event.target as IDBOpenDBRequest).result;
resolve(db);
};
request.onerror = event => {
reject((event.target as IDBOpenDBRequest).error);
};
});
}
public async addItem<T extends Record<string, unknown>>(item: T & {id?: IDBValidKey}): Promise<IDBValidKey> {
const db = await this.openDB();
const transaction = db.transaction(this.storeName, 'readwrite');
const store = transaction.objectStore(this.storeName);
const request = store.add(item);
return new Promise<IDBValidKey>((resolve, reject) => {
transaction.oncomplete = () => {
resolve(request.result);
};
transaction.onerror = () => {
reject(transaction.error);
};
});
}
public async getItem<T extends Record<string, unknown>>(id: IDBValidKey): Promise<T | undefined> {
const db = await this.openDB();
const transaction = db.transaction(this.storeName, 'readonly');
const store = transaction.objectStore(this.storeName);
const request = store.get(id);
return new Promise<T>((resolve, reject) => {
request.onsuccess = () => {
resolve(request.result);
};
request.onerror = () => {
reject(request.error);
};
});
}
public async updateItem<T extends Record<string, unknown>>(id: IDBValidKey, item: T): Promise<void> {
const db = await this.openDB();
const transaction = db.transaction(this.storeName, 'readwrite');
const store = transaction.objectStore(this.storeName);
store.put({...item, id});
return new Promise((resolve, reject) => {
transaction.oncomplete = () => {
resolve();
};
transaction.onerror = () => {
reject(transaction.error);
};
});
}
public async deleteItem(id: IDBValidKey): Promise<void> {
const db = await this.openDB();
const transaction = db.transaction(this.storeName, 'readwrite');
const store = transaction.objectStore(this.storeName);
store.delete(id);
return new Promise<void>((resolve, reject) => {
transaction.oncomplete = () => {
resolve();
};
transaction.onerror = () => {
reject(transaction.error);
};
});
}
public async getAllItems<T>(): Promise<T[]> {
const db = await this.openDB();
const transaction = db.transaction(this.storeName, 'readonly');
const store = transaction.objectStore(this.storeName);
const request = store.getAll();
return new Promise<T[]>((resolve, reject) => {
request.onsuccess = () => {
resolve(request.result);
};
request.onerror = () => {
reject(request.error);
};
});
}
}
export default IndexedDBHelper;
Raw
main.ts
// main.ts
import IndexedDBHelper from './indexeddb-helper';
if (NODE_ENV === 'development') {
(async () => {
console.log('IndexedDBHelper self testing');
console.log('============================');
console.log('Create IndexedDBHelperTest');
const IndexedDBHelperTest = new IndexedDBHelper('IndexedDBHelperTest', 'IndexedDBHelperTest');
console.log('Adding item {name: "test"}');
const id = await IndexedDBHelperTest.addItem({name: 'test'});
console.log('added item id', id);
console.log('Getting item by id', id);
const item = await IndexedDBHelperTest.getItem(id);
console.log('Item result by id', item);
console.log('Updating item', id, {name: 'test2'});
await IndexedDBHelperTest.updateItem(id, {name: 'test2'});
console.log('Getting item by id 2', id);
const item2 = await IndexedDBHelperTest.getItem(id);
console.log('Item result by id 2', item2);
const CUSTOM_ID = 'custom_id';
console.log('Add item by existing id', CUSTOM_ID);
await IndexedDBHelperTest.addItem({id: CUSTOM_ID, name: 'the custom id', value: true});
console.log('Getting item by id', CUSTOM_ID);
const item3 = await IndexedDBHelperTest.getItem(CUSTOM_ID);
console.log('Item result by id', item3);
console.log('Getting all items');
const allItems = await IndexedDBHelperTest.getAllItems();
console.log('allItems', allItems);
console.log('Deleting item by id', id, 'and', CUSTOM_ID);
await IndexedDBHelperTest.deleteItem(id);
await IndexedDBHelperTest.deleteItem(CUSTOM_ID);
console.log('Getting all items 2');
const allItems2 = await IndexedDBHelperTest.getAllItems();
console.log('allItems2', allItems2);
console.log('============================');
console.log('IndexedDBHelper self testing done');
})();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment