feat(storageManagement): added sm.remove(), function now find the value's nested path, created utils.ts.

Created the `sm.remove()` function that, as its name implies, removes a value inside of LocalStorage's data;

Functions on StorageManagement now uses the nested path to locate a value on the LocalStorage;

Added description to `sm.get()`;

Created `utils.ts` for common functions/utilities;

src/components/PageFooter.vue

@@ -18,20 +18,27 @@ import Vue from 'vue';
 import appInfo from '~~/package.json';
 import sm from '~/libs/storageManagement';
 
-const storageUpdated = sm.get(true)?.date
-	? `- Storage Updated: ${sm.get(true).date.updated.day.readable} ${
-			sm.get(true).date.updated.hour.readable
-	  }`
-	: '';
-
 export default Vue.extend({
 	name: 'PageFooter',
 	data() {
 		return {
 			version: appInfo.version,
-			storage_updated: storageUpdated,
+			storage_updated: sm.get('date.updated', true)
+				? `- Storage Updated: ${sm.get('date.updated', true).day.readable} ${
+						sm.get('date.updated', true).hour.readable
+				  }`
+				: '',
 		};
 	},
+	mounted() {
+		window.addEventListener('localStorage-changed', () => {
+			this.storage_updated = sm.get('date.updated', true)
+				? `- Storage Updated: ${sm.get('date.updated', true).day.readable} ${
+						sm.get('date.updated', true).hour.readable
+				  }`
+				: '';
+		});
+	},
 });
 </script>
 

src/libs/storageManagement.ts

@@ -1,5 +1,6 @@
 import appInfo from '~~/package.json';
 import date from '~/libs/date';
+import obj from '~/libs/utils';
 
 const storageIndex = 'ToToday-storage';
 
@@ -9,66 +10,95 @@ const storageIndex = 'ToToday-storage';
 const sm = {
 	/**
 	 * Adds new value on `data`. *Don't create or rewrite the value if it already exists.*
-	 * @param {string} key New key on `data`;
+	 * @param {string} path New value's path on `data`;
 	 * @param {any} value New value;
 	 */
-	add: (key: string, value: any) => {
-		const data = sm.getJSON().data;
+	add: (path: string, value: any) => {
 
-		if (data[key]) return window.alert('ERROR: Value already in storage');
+		let data = sm.getJSON().data;
 
-		data[key] = value;
+
+		if (obj.getByString(data, `data.${path}`))
+			return window.alert('ERROR: Value already in storage');
+
+		data = obj.setByString(data, value, path);
 
 		sm.setJSON(data);
 	},
 
 	/**
-	 * Rewrite a value inside of `data` with a new *(creates a new key/value if it's doesn't exist before)*.
-	 * @param {string} key Value's key on `data`;
+	 * Rewrite a value inside of `data` with a new *(creates a new path/value if it's doesn't exist before)*.
+	 * @param {string} path Value's path on `data`;
 	 * @param {any} value The new value to replace;
-	 * @param {boolean | undefined} getOld Return the old value of the key?
+	 * @param {boolean | undefined} getOld Return the old value of the path?
 	 * @param {boolean | undefined} meta Update a value on `meta`?
 	 *
-	 * @returns The old value of the key, if `getOld` is `true`.
+	 * @returns The old value of the path, if `getOld` is `true`.
 	 */
 	set: (
-		key: string,
+		path: string,
 		value: any,
 		getOld?: boolean,
 		meta?: boolean
 	): void | any => {
 		if (meta) {
-			const metaData = sm.getJSON();
-			metaData.meta[key] = value;
+			let metaData = sm.getJSON();
+			metaData = obj.setByString(metaData, undefined, path);
 			sm.setJSON(metaData, true);
 			return;
 		}
 
-		const data = sm.getJSON().data;
+		let data = sm.getJSON().data;
 
-		const oldValue = data[key];
+		if (obj.getByString(data, path)) return sm.add(path, value);
 
-		if (!data[key]) return sm.add(key, value);
+		const oldValue = obj.getByString(data, path);
 
-		data[key] = value;
+		data = obj.setByString(data, value, path);
 
 		sm.setJSON(data);
 
 		if (getOld) return oldValue;
 	},
 
-	get: (meta?: boolean) => {
+	/**
+	 * Gets a value from localStorage*.
+	 * @param {string} path Value's path on `data`;
+	 * @param {boolean | undefined} meta Update a value on `meta`?
+	 *
+	 * @returns {any | undefined} Value on localStorage (or undefined if no value wasn't found).
+	 */
+	get: (path: string, meta?: boolean): any | undefined => {
 		const storage = sm.getJSON();
 
-		if (meta) {
-			return storage.meta;
-		}
+		if (meta && path) return obj.getByString(storage, `meta.${path}`);
+		else if (meta) return storage.meta;
 
-		if (storage.data) return storage.data;
+		if (path && obj.getByString(storage, `data.${path}`) !== undefined)
+			return obj.getByString(storage, `data.${path}`);
 
 		return undefined;
 	},
 
+	/**
+	 * Removes a value from localStorage's data
+	 * @param {string} path Value's path on `data`;
+	 * @param {boolean | undefined} getOld Return the old value of the path?
+	 *
+	 * @returns The old value of the path, if `getOld` is `true`.
+	 */
+	remove: (path: string, getOld?: boolean): void | any => {
+		let data = sm.getJSON().data;
+
+		const oldValue = obj.getByString(data, path);
+
+		data = obj.setByString(data, undefined, path);
+
+		sm.setJSON(data);
+
+		if (getOld) return oldValue;
+	},
+
 	/**
 	 * Gets and parses the local storage JSON file.
 	 *
@@ -104,6 +134,7 @@ const sm = {
 
 			localStorage.setItem(storageIndex, JSON.stringify(updatedJSON));
 		}
+		window.dispatchEvent(new CustomEvent('localStorage-changed'));
 	},
 
 	/**
@@ -122,6 +153,12 @@ const sm = {
 			!JSON.parse(localStorage.getItem(storageIndex) + '').meta
 		)
 			sm.createJSON(true);
+
+		if (
+			!localStorage.getItem(storageIndex) ||
+			!JSON.parse(localStorage.getItem(storageIndex) + '').data
+		)
+			sm.createJSON(true);
 	},
 
 	/**

src/libs/utils.ts

@@ -0,0 +1,34 @@
+// * Thanks Alnitak for the original code https://stackoverflow.com/a/6491621
+
+const resolvePath = (path: string) => {
+	path = path.replace(/\[(\w+)\]/g, '.$1');
+	path = path.replace(/^\./, '');
+	return path.split('.');
+}
+
+const obj = {
+	setByString: (object: object | any, newValue: any, path: string) => {
+		const a = resolvePath(path);
+
+		for (let i = 0; i < a.length; i++) {
+			const k = a[i];
+			object[k] = newValue;
+		}
+
+		return object;
+	},
+	getByString: (object: object | any, path: string) => {
+		const a = resolvePath(path);
+		for (let i = 0; i < a.length; i++) {
+			const k = a[i];
+			if (k in object) {
+				object = object[k];
+			} else {
+				return undefined;
+			}
+		}
+		return object;
+	},
+};
+
+export default obj;