[v2] Web Storage

[JesseRWeigel]

Summary:

#52

I added a web-storage option that uses localStorage(default) or sessionStorage(by passing true as the first param when creating a Webstorage instance).

I also added a react app as an example to demonstrate using Webstorage. I followed the same UI structure as the React Native example app.

Test Plan:

You can test Webstorage by running yarn start from the examples/web folder. To use sessionStorage instead of localStorage, pass in true as the first parameter to WebStorage() in storage.js in the web folder.
const web = new WebStorage(true);

There are still some things that should be done:

• Write tests
• Write documentation

Also, I am not very familiar with Typescript, so I expect that there may be some issues with how I implemented it.

[krizzu]

So far so good - left few commnets. I'm going to revisit this PR later today

[krizzu]

@JesseRWeigel On the second thought, it's a lot to tackle at once: Storage, Example and Docs. Let's keep this PR with only Storage implementation and tests for it - let's leave other two for separate PRs.

[JesseRWeigel]

@krizzu Good idea! I will keep everything in separate PRs.

[JesseRWeigel]

@krizzu I removed the example app and finished the unit tests for local and session storage. Everything is working, but I have a few type errors that I haven't been able to resolve. Any assistance with the type errors that you could provide would be greatly appreciated.

packages/storage-web/__tests__/index.test.ts:34:35 - error TS2741: Property 'key2' is missing in type '{ key1: string; }' but required in type '{ key1: any; key2: any; }'.

34         await webStorage.setMany([{key1: 'value1'}, {key2: 'value2'}]);
                                     ~~~~~~~~~~~~~~~~

packages/storage-web/__tests__/index.test.ts:34:53 - error TS2741: Property 'key1' is missing in type '{ key2: string; }' but required in type '{ key1: any; key2: any; }'.

34         await webStorage.setMany([{key1: 'value1'}, {key2: 'value2'}]);
                                                       ~~~~~~~~~~~~~~~~

packages/storage-web/src/index.ts:53:5 - error TS2322: Type 'any[]' is not assignable to type '{ [k in K]: T[k] | null; }'.

53     return Promise.all(keys.map(k => this.storage.getItem(k)));
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

packages/storage-web/src/index.ts:68:33 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ [k in K]: T[k]; }'.
  No index signature with a parameter of type 'string' was found on type '{ [k in K]: T[k]; }'.

68       this.storage.setItem(key, keyValue[key]);

It seems like the first two type errors are related to the third one, and would be resolved along with it.

[krizzu]

Good work so far 💪

Your issues comes from the wrongly typed Storage - I've left comments to help you find them.

Also, I see that we need to change TS settings - each package should have its own tsconfig, extending the main one. I'm going to fix this one once you're done with requested changes.

[krizzu]

@JesseRWeigel Sorry for late response.

I've pushed a commit, that includes few changes to packages - this makes each of them an independent projects.

What's left to do here are typing of Storage.

[krizzu]

We're almost there 💪
Please pull the changes I committed and look through comments I left for you.

If you need more help, just ask

[krizzu]

@JesseRWeigel Great work, thanks a lot!