diff --git a/src/layouts/_AppLayout.vue b/src/layouts/_AppLayout.vue
deleted file mode 100644
index e8657c0..0000000
--- a/src/layouts/_AppLayout.vue
+++ /dev/null
@@ -1,300 +0,0 @@
-<template>
-  <div v-if="isCheckin">
-    <div class="spinner" style="margin: 100px auto; width: 80px; height: 80px;">
-      <div class="dot1" />
-      <div class="dot2" />
-    </div>
-    <div class="flex justify-center text-2xl">
-      {{ t('message.loadding') }} ...
-    </div>
-  </div>
-  <div v-else>
-    <div>
-      <div
-        v-show="useDragHeader && show_top_pane"
-        id="pane-top"
-        :style="`height: ${head_data.h}px`"
-        class="eexpandable p-3 z-999 bg-gray-200 text-gray-100 dark:bg-gray-800 dark:text-white absolute "
-      >
-        <Backdrop :show="show_top_pane" :blur="14" :css="`height: ${head_data.h}px;`" @close="close_top_pane" />
-        <div class="bg-gray-100 text-gray-900 w-auto p-8 absolute top-2" :class="show_top_pane ? 'z-9999' : ''">
-          <keep-alive>
-            <component :is="topPaneComponent" />
-          </keep-alive>
-        </div>
-      </div>
-      <div class="antialiased text-gray-900 bg-white dark:bg-gray-800 dark:text-white">
-        <div class="flex h-screen overflow-y-hidden bg-white">
-          <!-- Sidebar -->
-          <Sidebar />
-
-          <div class="flex flex-col flex-1 h-full overflow-hidden">
-            <!-- Navbar -->
-            <draggable
-              v-if="useDragHeader"
-              @start="start_header"
-              @end="end_header"
-            >
-              <header class="flex-shrink-0 border-b dark:border-gray-700 border-gray-200">
-                <Navbar />
-              </header>
-            </draggable>
-            <div v-else>
-              <header class="flex-shrink-0 border-b dark:border-gray-700 border-gray-200">
-                <Navbar />
-              </header>
-            </div>
-            <!-- Main content -->
-            <main class="flex-1 max-h-full p-1 overflow-hidden overflow-y-scroll  dark:bg-cool-gray-800 dark:text-white">
-              <slot />
-            </main>
-            <!-- Main footer -->
-            <draggable
-              @start="start_footer"
-              @end="end_footer"
-            >
-              <footer class="flex items-center justify-between flex-shrink-0 p-4 border-t dark:border-gray-700 border-gray-200 max-h-14  dark:bg-cool-gray-800 dark:text-white">
-                <div class="flex">
-                  <span
-                    v-for="(itm,index) in left_items"
-                    :key="`${String(index)}-${itm.title}`"
-                  >
-                    <a
-                      v-if="itm && itm.type === 'a-click'"
-                      :href="itm.link"
-                      class=""
-                    >
-                      {{ t(itm.title) }}
-                    </a>
-                    <router-link
-                      v-if="itm && itm.type === 'router-link'"
-                      :title="t(itm.title)"
-                      :to="{ name: itm.name_to }"
-                      class="flex items-center"
-                    >
-                      {{ t(itm.title) }}
-                    </router-link>
-                  </span>
-                </div>
-
-                <div class="text-sm">
-                  <Footer />
-                </div>
-                <div class="flex">
-                  <span
-                    v-for="(itm,index) in right_items"
-                    :key="`${String(index)}-${itm.title}`"
-                  >
-                    <a
-                      v-if="itm && itm.type === 'a-click'"
-                      :href="itm.link"
-                      class=""
-                    >
-                      <span class="hidden text-sm md:block mr-2"> {{ t(itm.title) }} </span>
-                      <span v-if="itm.img" class="w-11 h-11 dark:bg-gray-200 rounded-full mr-2">
-                        <dsc-logo v-if="itm.img === 'dsc'" />
-                        <img v-else :src="itm.img">
-                      </span>
-                    </a>
-                    <router-link
-                      v-if="itm && itm.type === 'router-link'"
-                      :title="t(itm.title)"
-                      :to="{ name: itm.name_to }"
-                      class="flex items-center"
-                    >
-                      <span class="hidden text-sm md:block mr-2"> {{ t(itm.title) }} </span>
-                      <span v-if="itm.img" class="w-11 h-11 rounded-full mr-2">
-                        <app-img v-if="itm.img === 'librecloudd'" />
-                        <img v-else class="h-11 w-auto rounded" :src="`/assets/images/${itm.img}.svg`" alt="App">
-                      </span>
-                    </router-link>
-                  </span>
-                </div>
-              </footer>
-            </draggable>
-          </div>
-          <!-- Setting panel button -->
-          <div v-if="sideSettingButton" v-show="useSettings" class="fixed right-0 transform rotate-90 translate-x-8 top-1/2">
-            <Button class="text-sm font-medium z-999 text-white uppercase bg-gray-600" @click="isSettingsPanelOpen = true">
-              Settings
-            </Button>
-          </div>
-
-          <SettingsPanel :show="isSettingsPanelOpen" @close="isSettingsPanelOpen = false" />
-          <SearchPanel left :show="isSearchPanelOpen" @close="isSearchPanelOpen = false" />
-          <NotificationsPanel left :show="isNotificationsPanelOpen" @close="isNotificationsPanelOpen = false" />
-        </div>
-      </div>
-      <div
-        v-show="useDragFooter && show_bottom_pane"
-        id="pane-bottom"
-        :style="`height: ${bottom_data.h}px; top: ${bottom_data.y}px;`"
-        class="eexpandable p-3 z-999 bg-gray-200 text-gray-100 dark:bg-gray-800 dark:text-white absolute"
-      >
-        <Backdrop :show="show_bottom_pane" :blur="14" :css="`height: 100%$; top: ${bottom_data.y}px;`" @close="close_bottom_pane" />
-        <div class="bg-gray-100 w-screen text-gray-900 my-5 pr-5 z-999 absolute top-2">
-          <keep-alive>
-            <component :is="bottomPaneComponent" />
-          </keep-alive>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-/*
-  <suspense v-else>
-      <template #default>
-      </template>
-      <template #fallback>
-        <div class="space-up">
-          <div class="spinner" style="margin: 100px auto; width: 80px; height: 80px;">
-            <div class="dot1" />
-            <div class="dot2" />
-          </div>
-          <div class="flex justify-center text-2xl">
-            Check-in ...
-          </div>
-        </div>
-      </template>
-    </suspense>
-
-       <div>
-        <a
-          href="https://karyo.dev"
-          target="_blank"
-          class="flex items-center space-x-1"
-        >
-
-          <span class="w-11 h-11 dark:bg-gray-200 rounded-full mr-2">
-            <dsc-logo />
-          </span>
-          <span class="hidden text-sm md:block">Z-Terton</span>
-
-        </a>
-      </div>
-*/
-import { toRefs, onMounted, onUnmounted, ref, computed } from 'vue'
-import { VueDraggableNext as draggable } from 'vue-draggable-next'
-
-import { useRouter } from 'vue-router'
-import Sidebar from '@/sidebar/Sidebar.vue'
-import Navbar from '@/navbar/Navbar.vue'
-import SettingsPanel from '@/panels/SettingsPanel.vue'
-import SearchPanel from '@/panels/SearchPanel.vue'
-import NotificationsPanel from '@/panels/NotificationsPanel.vue'
-import Button from '@/global/Button.vue'
-import Footer from '@/Footer.vue'
-import AppImg from '@/icons/AppImg.vue'
-import Backdrop from '@/global/Backdrop.vue'
-import ReqErrorView from '@/ReqErrorView.vue'
-import { useI18n } from 'vue-i18n'
-import { useStore } from 'vuex'
-import useState from '~/hooks/useState'
-import { AppDefsAction } from '~/store/types'
-import useComponent, { DynComponent } from '~/hooks/useComponent'
-import { check_credentials } from '~/hooks/utils'
-
-const { reqError, isSidebarOpen, isAsidePanelOpen, isSettingsPanelOpen, isSearchPanelOpen, isNotificationsPanelOpen, sideSettingButton, useDragHeader, useDragFooter } = useState()
-
-const checkScreen = () => {
-  if (window.innerWidth <= 1024)
-    isSidebarOpen.value = false
-}
-
-// const props = defineProps<{
-//   appdefs: any
-// }>()
-// const { appdefs } = toRefs(props)
-
-const use_panels = true
-const show_top_pane = ref(false)
-const show_bottom_pane = ref(false)
-
-const isCheckin = ref(true)
-const { t, locale } = useI18n()
-const router = useRouter()
-const map_key = router.currentRoute.value.meta.uiMapkey || 'ui'
-
-const store = useStore()
-
-const defs = computed(() => store.state.app_defs.main.get(map_key) || {})
-
-const left_items = computed(() => {
-  return defs.value && defs.value.footer && defs.value.footer.left_items ? defs.value.footer.left_items : []
-})
-const right_items = computed(() => {
-  return defs.value && defs.value.footer && defs.value.footer.right_items ? defs.value.footer.right_items : []
-})
-
-onMounted(() => {
-  window.addEventListener('resize', checkScreen)
-  isCheckin.value = false
-})
-
-const head_data = ref({ x: 0, y: 0, h: 0 })
-const start_header = (ev: any) => {
-  head_data.value = { x: ev.originalEvent.pageX, y: ev.originalEvent.pageY, h: 0 }
-//  console.log(`start header: ${ev.originalEvent.clientX} (${ev.originalEvent.screenX}) ${ev.originalEvent.pageX}  / ${ev.originalEvent.clientY} (${ev.originalEvent.screenY}) ${ev.originalEvent.pageY} `)
-}
-const end_header = (ev: any) => {
-  // console.log(`end header: ${ev.originalEvent.clientX} (${ev.originalEvent.screenX}) ${ev.originalEvent.pageX}  / ${ev.originalEvent.clientY} (${ev.originalEvent.screenY}) ${ev.originalEvent.pageY} `)
-  // console.log(`target: ${head_data.value.x - ev.originalEvent.pageX}  ${ev.originalEvent.pageY - head_data.value.y} `)
-  head_data.value.h = ev.originalEvent.pageY - head_data.value.y
-  // console.log(head_data.value.h)
-  show_top_pane.value = true
-}
-const close_top_pane = () => {
-  show_top_pane.value = false
-}
-
-const bottom_data = ref({ x: 0, y: 0, h: 0 })
-const start_footer = (ev: any) => {
-  if (useDragFooter.value)
-    bottom_data.value = { x: ev.originalEvent.pageX, y: ev.originalEvent.pageY, h: 0 }
-}
-const end_footer = (ev: any) => {
-  if (useDragFooter.value) {
-    // console.log(`end footer: ${ev.originalEvent.clientX} (${ev.originalEvent.screenX}) ${ev.originalEvent.pageX}  / ${ev.originalEvent.clientY} (${ev.originalEvent.screenY}) ${ev.originalEvent.pageY} `)
-    // console.log(`target: ${bottom_data.value.x - ev.originalEvent.pageX}  ${ev.originalEvent.pageY - bottom_data.value.y} `)
-    bottom_data.value.h = (ev.originalEvent.pageY - bottom_data.value.y) * -1
-    bottom_data.value.y = ev.originalEvent.pageY
-    // console.log(bottom_data.value.h)
-    // console.log(bottom_data.value.y)
-    show_bottom_pane.value = true
-  }
-}
-const close_bottom_pane = () => {
-  show_bottom_pane.value = false
-}
-
-const topPaneComponent = computed(() => useComponent().topPaneComponent.value)
-const bottomPaneComponent = computed(() => useComponent().bottomPaneComponent.value)
-const root_url = router.currentRoute.value.meta.rooturl || ''
-
-onMounted(() => {
-})
-
-onUnmounted(() => {
-  window.removeEventListener('resize', checkScreen)
-})
-
-</script>
-<style scoped>
-.expandable {
-  background: #dadada;
-  overflow: hidden;
-
-  transition: all .5s ease-in-out;
-  line-height: 0;
-  padding: 0 1em;
-  color: transparent;
-}
-.expandable:target {
-  line-height: 1.5;
-  padding-top: 1em;
-  padding-bottom: 1em;
-  color: black;
-}
-</style>