Update style for exporting / importing actions and getters

Description of the proposal

When we export actions, getters, or mutations to be imported into a Vuex store there are two approaches we can take:

1. Individual exports

This is how we currently do it. We export each action individually then export a blank default action to get around some babel-plugin-rewire nonsense.

// actions.js
export const actionOne = () => {[...]}
export const actionTwo = () => {[...]}

// prevent babel-plugin-rewire from generating an invalid default during karma tests
export default () => {};

// index.js (store) or actions_spec.js
import * as actions from './actions';

actions.actionOne(doStuff);

[...]

There are a few issues with this approach:

1. The obvious babel-plugin-rewire superfluous code.
2. We actually import three actions, actionOne(), actionTwo(), and default(). This sometimes causes issues when using Vuex modules.
3. It has other side effects when testing with Jest that @winh and @leipert encountered.
4. import * as actions from 'actions.js' is ugly. Edit: It seems this point distracted people

2. One export to rule them all

This would be my preferred solution. We wrap everything in a default export and include it all at once. It looks like this:

// actions.js
export default {
  actionOne: () => {[...]}
  actionTwo: () => {[...]}
}

// index.js (store) or actions_spec.js
import actions from './actions';

actions.actionOne(doStuff);

[...]

This approach fixes all the issues with our current approach and looks a lot cleaner IMO.

I propose we make this the new standard and update all our old actions and getters to match it. But first, I want to hear your thoughts. If you think I'm right, give it a :thumbs_up:. If you think I'm wrong, give it a 👎 and tell me why in a comment.

---

/cc @gitlab-org/maintainers/frontend