# New structure proposal:
### Goal: Simplify current structure, easy to add/remove and manage new module/feature, resuse existing work.

## Main Idea
1. Public/share module
2. Private module

## Public/Shared
1. Vue:
1. Base component:
1. Location: `src/base-component`
2. Should start with `Base` prefix for auto import (IMPLEMENTED)
3. Share across the application for consistency in style and behavior
2. Container component:
1. Location: `src/containers`
2. Should start with `Container` prefix for auto import (TO DO)
3. Defined layout style
3. Layout component:
1. Location: `src/layout-component`
2. Navbar, sidebar, footer,…. Component use in container component
3. Auto import all of component inside this directory (TODO)
4. Icon (.vue):
1. Location: `src/assets/icons`
2. Should start with `Icon` prefix for auto import (IMPLEMENTED)
3. SVG icon for global use
5. Helper (.js):
1. Location: `src/helpers`
2. Store global custom filter `src/helpers/filters`
3. Directive `src/helpers/directives`
4. Mixins `src/helpers/mixins`
5. Utility `src/helpers/utilities` (transformer, static data, data structure, json data,…)
6. Every subfolder need an `index.js` file to export all of it function
6. Plugin:
1. Location `src/plugins`
2. Plugin should self install and just need to import to `main.ts` to make it work
2. Vuex:
1. Location: `src/store`
2. The `store.ts` should place here
3. Location for global store module `src/store/modules/[MODULE_NAME].js`
4. User data
5. auth data
6. lookup data/dictionary data (country list, bank list, business list,…)
7. Avoid refetch data many time and rewrite fetching action
3. Service:
1. Locations: `src/service`
2. Common service use across the app

## Feature module
1. View, Custom component, service, router, vuex module,…. just to use inside that feature
2. Location: MODULE_SOURCE = `src/feature/[FEATURE_NAME]`
3. Inside the MODULE_SOURCE we will create subfolder for views, components, service, router, vuex module, mixin,… everything that only need in that module
4. With new feature just create a subfolder inside `src/feature`, with deprecated feature/module just clean this folder
5. This way we could easily navigate around, manage our feature module and easier to remove deprecated feature
6. The router, vuex module of feature will be import to `store.ts` and `router.ts`, easily to add or remove in the future