https://github.com/rksm/yet-another-covid-viz

https://github.com/rksm/yet-another-covid-viz

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/rksm/yet-another-covid-viz
• Owner: rksm
• Created: 2020-04-17T00:43:57.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2022-12-12T12:20:25.000Z (about 2 years ago)
• Last Synced: 2024-10-13T10:25:23.904Z (3 months ago)
• Language: TypeScript
• Size: 3.46 MB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 22
• Metadata Files:
  • Readme: README.org

Awesome Lists containing this project

README

        
* Yet another COVID-19 visualize

This uses [[https://github.com/pomber/covid19][pomber/covid19]] as a data source.

It's running at [[https://robert.kra.hn/stuff/yet-another-covid-viz/][robert.kra.hn/stuff/yet-another-covid-viz]]

** Purpose

This is a test app to take [[https://vuejs.org/][vue]], [[https://vuex.vuejs.org/][vuex]], and their [[https://blog.logrocket.com/how-to-write-a-vue-js-app-completely-in-typescript/][TypeScript support]] for a spin.

Overall this works fairly well but the vuex type support is lacking. In particular it would be *very* desirable if actions and mutations could be typed. [[https://github.com/ktsn/vuex-class][vuex-class]] provides bindings for state and actions but those attributes do not get the actual types defined for the state and actions.

As an example consider the [[src/store/actions.ts#L29][updateSelectedCountry action]]. To type it properly (i.e. to get a check for the payload argument wich is what matters when calling the action) we need to manually specialize the =ActionHandler= and =DataMethod= types so that they are parameterized with the type of the payload argument (=SetSelectedCountryPayload=).

Also not that the =ctx.commit= call is "stringly" typed, i.e. not typed at all, what we pass into that isn't checked. We could specialize =ActionContext.commit("setSelectedCountry", ...)= but I haven't done this in that example.

On the other hand, the [[src/components/CountrySelector.ts:16][calling code]] needs an annotation for =UpdateSelectedCountryMethod= as well. So these are at least three places (more if there are more users of the action) that need to be manually typed and kept in sync.