add mount of menu

fix store usage

add page loader

src/menu.js

@@ -19,39 +19,29 @@ import './scss/menu.scss'
 
 import { createApp } from 'vue'
 import { createPinia } from 'pinia'
-import { waitContainer } from './lib/dom.js'
+import { createElement } from './lib/dom.js'
 
-// import AppMenu from './menus/AppMenu.vue'
-import SideMenu from './menus/SideMenu.vue'
-import SideMenuBig from './menus/SideMenuBig.vue'
-import SideMenuWithCategories from './menus/SideMenuWithCategories.vue'
+import MenuContainer from './menus/MenuContainer.vue'
 
 // import PageLoader from './components/PageLoader.vue'
-
 // window.PageLoader = PageLoader
 
 const pinia = createPinia()
-
-waitContainer('#side-menu').then((selector, container) => {
-  const component = (() => {
-    if (container.getAttribute('data-bigmenu')) {
-      return SideMenuBig
-    } else if (container.getAttribute('data-sidewithcategories')) {
-      return SideMenuWithCategories
-    } else {
-      return SideMenu
-    }
-  })()
-
-  const app = createApp(component)
-
-  app.use(pinia)
-  app.mount(selector)
+const body = document.querySelector('body')
+const container = createElement('div', {
+  id: 'side-menu-container',
 })
 
-waitContainer('#header .app-menu').then((selector) => {
-  const app = createApp(AppMenu)
+body.appendChild(container)
 
-  app.use(pinia)
-  app.mount(selector)
-})
+const app = createApp(MenuContainer)
+app.use(pinia)
+app.mixin({ methods: { t, n }})
+app.mount(container)
+
+// waitContainer('#header .app-menu').then((selector) => {
+//   const app = createApp(AppMenu)
+//   app.use(pinia)
+//   app.mixin({ methods: { t, n }})
+//   app.mount(selector)
+// })