should use storage.local over window.localStorage

Problem

This template currently uses localStorage(1, 2).

MDN advises against using local storage because of persistence issues:

Although this API is similar to Window.localStorage it is recommended that you don’t use Window.localStorage in extension code. Firefox will clear data stored by extensions using the localStorage API in various scenarios where users clear their browsing history and data for privacy reasons, while data saved using the storage.local API will be correctly persisted in these scenarios.

Proposal

Use storage.local via webextension-polyfill.

FYI VueUse useStorage accepts a 3rd parameter to accept a StoreLike object, so perhaps a wrapper around storage.local could have been passed in. However, storage.local APIs return promises so it cannot.

Because of storage.local’s async nature, it might be best to create another composable function that returns an isLoaded state.

[antfu]

I wasn’t sure if this belongs in VueUse

@privatenumber I guess we are missing a composable to support async storage. I imagine we could have useAsyncStorage in VueUse, and convert the storage interface from webextension-polyfill in this template.

[hankolsen]

@privatenumber PR #58