init commit

src/pages/index.vue

@@ -0,0 +1,155 @@
+<template>
+  <div class="items-center justify-center min-h-full flex w-full">
+    <div class="flex flex-col justify-center items-center gap-4 max-w-3xl">
+      <img
+        src="/logo.svg"
+        class="bg-primary p-3 size-16 rounded-full"
+        alt="HaexVault Logo"
+      />
+
+      <span
+        class="flex flex-wrap font-bold text-pretty text-xl gap-2 justify-center"
+      >
+        <p class="whitespace-nowrap">
+          {{ t('welcome') }}
+        </p>
+        <UiTextGradient>Haex Hub</UiTextGradient>
+      </span>
+
+      <div class="flex flex-col md:flex-row gap-4 w-full">
+        <VaultButtonCreate />
+
+        <!-- <VaultButtonOpen
+          v-model:isOpen="passwordPromptOpen"
+          :path="vaultPath"
+        /> -->
+        <NuxtLinkLocale
+          :to="{
+            name: 'haexBrowser',
+            params: { vaultId: 'test' },
+          }"
+          >test link</NuxtLinkLocale
+        >
+        <!-- <button @click="test">test</button>
+        <NuxtLinkLocale
+          :to="{ name: 'vaultGroup', params: { vaultId: 'test' } }"
+          >test link</NuxtLinkLocale
+        > -->
+
+        <!-- <UiTreeFolder
+          @edit="test"
+          :value="tests"
+          v-for="tests in [1, 2, 3]"
+        />
+        <UiTreeFolder
+          @edit="test"
+          value="test123"
+        /> -->
+      </div>
+
+      <div
+        v-show="lastVaults.length"
+        class="w-full"
+      >
+        <div class="font-thin text-sm justify-start px-2 pb-1">
+          {{ t('lastUsed') }}
+        </div>
+
+        <div
+          class="relative border-base-content/25 divide-base-content/25 flex w-full flex-col divide-y rounded-md border first:*:rounded-t-md last:*:rounded-b-md overflow-scroll"
+        >
+          <div
+            class="flex items-center justify-between group h-12 overflow-x-scroll"
+            v-for="vault in lastVaults"
+            :key="vault.path"
+          >
+            <button
+              class="link link-accent flex items-center no-underline justify-between text-nowrap text-xs md:text-base shrink w-full py-2 px-4"
+              @click="
+                passwordPromptOpen = true;
+                vaultPath = vault.path;
+              "
+            >
+              <span class="block md:hidden">
+                {{ vault.name }}
+              </span>
+              <span class="hidden md:block">
+                {{ vault.path }}
+              </span>
+            </button>
+            <button
+              class="absolute right-2 btn btn-square btn-error btn-xs hidden group-hover:flex min-w-6"
+            >
+              <Icon
+                name="mdi:trash-can-outline"
+                @click="removeVaultAsync(vault.path)"
+              />
+            </button>
+          </div>
+        </div>
+      </div>
+
+      <div class="flex flex-col items-center gap-2">
+        <h4>{{ t('sponsors') }}</h4>
+        <div>
+          <button @click="openUrl('https://itemis.com')">
+            <UiLogoItemis class="text-[#00457C]" />
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { openUrl } from '@tauri-apps/plugin-opener';
+
+const passwordPromptOpen = ref(false);
+const vaultPath = ref('');
+
+definePageMeta({
+  name: 'vaultOpen',
+});
+
+const { t } = useI18n();
+
+const { syncLastVaultsAsync, removeVaultAsync } = useLastVaultStore();
+const { lastVaults } = storeToRefs(useLastVaultStore());
+
+await syncLastVaultsAsync();
+
+/* const { $pluginManager } = useNuxtApp();
+
+console.log('$pluginManager', $pluginManager);
+async function loadModule() {
+  try {
+    // Dynamisches Laden des Moduls
+    const file = await open({
+      multiple: false,
+      directory: false,
+    });
+    const moduleUrl =
+      '/home/haex/Projekte/haex-vault-2/haex-vault/src/extensions/test/testPlugin.ts'; // Pfad relativ zum Server-Root
+    await $pluginManager.loadDynamicModule(file);
+    console.log('Modul erfolgreich geladen');
+  } catch (error) {
+    console.error('Fehler beim Laden des Moduls:', error);
+  }
+}
+//await loadModule(); */
+</script>
+
+<i18n lang="json">
+{
+  "de": {
+    "welcome": "Viel Spass mit",
+    "lastUsed": "Zuletzt verwendete Vaults",
+    "sponsors": "Powered by"
+  },
+  "en": {
+    "welcome": "Have fun with",
+    "lastUsed": "Last used Vaults",
+    "sponsors": "Powered by"
+  }
+}
+</i18n>

src/pages/test.vue

@@ -0,0 +1,10 @@
+<template>
+  <UiSidebarTest />
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  name: 'test',
+});
+
+</script>

src/pages/vault.vue

@@ -0,0 +1,7 @@
+<template>
+  <div>
+    <NuxtLayout name="app">
+      <NuxtPage />
+    </NuxtLayout>
+  </div>
+</template>

src/pages/vault/[vaultId]/browser.vue

@@ -0,0 +1,127 @@
+<template>
+  <div>
+    browser
+    <HaexBrowser
+      :tabs="tabs"
+      :activeTabId="activeTabId"
+      @createTab="createNewTab"
+      @closeTab="closeTab"
+      @navigate="navigateToUrl"
+      @goBack="goBack"
+      @goForward="goForward"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { invoke } from '@tauri-apps/api/core';
+import { listen, type UnlistenFn } from '@tauri-apps/api/event';
+import { Window, getCurrentWindow } from '@tauri-apps/api/window';
+import { Webview } from '@tauri-apps/api/webview';
+
+definePageMeta({
+  name: 'haexBrowser',
+});
+
+interface Tab {
+  id: string;
+  title: string;
+  url: string;
+  isLoading: boolean;
+  isActive: boolean;
+  window_label: string;
+}
+
+const tabs = ref<Tab[]>([]);
+const activeTabId = ref<string | null>(null);
+
+let unlistenTabCreated: UnlistenFn | null = null;
+let unlistenTabClosed: UnlistenFn | null = null;
+
+onMounted(async () => {
+  // Erstelle einen ersten Tab beim Start
+  createNewTab('https://www.google.com');
+
+  // Höre auf Tab-Events
+  unlistenTabCreated = await listen('tab-created', (event) => {
+    const newTab = event.payload as Tab;
+
+    tabs.value = tabs.value.map((tab) => ({
+      ...tab,
+      isActive: tab.id === newTab.id,
+    }));
+
+    if (!tabs.value.some((tab) => tab.id === newTab.id)) {
+      tabs.value.push(newTab);
+    }
+
+    activeTabId.value = newTab.id;
+  });
+
+  unlistenTabClosed = await listen('tab-closed', (event) => {
+    const closedTabId = event.payload as string;
+    tabs.value = tabs.value.filter((tab) => tab.id !== closedTabId);
+  });
+});
+
+onUnmounted(() => {
+  if (unlistenTabCreated) unlistenTabCreated();
+  if (unlistenTabClosed) unlistenTabClosed();
+});
+
+const createNewTab = async (url: string = 'about:blank') => {
+  try {
+    /* const appWindow = new Window('uniqueLabel111', {
+      fullscreen: true,
+    });
+ */
+    /* const appWindow = getCurrentWindow();
+
+    const webview = new Webview(appWindow, 'theUniqueLabel', {
+      url: 'https://github.com/tauri-apps/tauri',
+      height: 1000,
+      width: 1000,
+      x: 110,
+      y: 0,
+    });
+    await webview.show(); */
+    //console.log('create webview', webview);
+    const tab_id = 'foo';
+    await invoke('create_tab', { url, tabId: 'foo' });
+  } catch (error) {
+    console.error('Fehler beim Erstellen des Tabs:', error);
+  }
+};
+
+const closeTab = async (tabId: string) => {
+  try {
+    //await invoke('close_tab', { tabId });
+  } catch (error) {
+    console.error('Fehler beim Schließen des Tabs:', error);
+  }
+};
+
+const navigateToUrl = async (tabId: string, url: string) => {
+  try {
+    //await invoke('navigate_to_url', { tabId, url });
+  } catch (error) {
+    console.error('Fehler bei der Navigation:', error);
+  }
+};
+
+const goBack = async (tabId: string | null) => {
+  try {
+    //await invoke('go_back', { tabId });
+  } catch (error) {
+    console.error('Fehler beim Zurückgehen:', error);
+  }
+};
+
+const goForward = async (tabId: string | null) => {
+  try {
+    //await invoke('go_forward', { tabId });
+  } catch (error) {
+    console.error('Fehler beim Vorwärtsgehen:', error);
+  }
+};
+</script>

src/pages/vault/[vaultId]/extensions/[extensionId].vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    hier kommt die erweiterung
+    {{ useRouter().currentRoute.value.params.extensionId }}
+    <iframe></iframe>
+  </div>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  name: 'haexExtension',
+});
+</script>

src/pages/vault/[vaultId]/extensions/index.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>ad extension</div>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  name: 'extensionAdd',
+});
+</script>

src/pages/vault/[vaultId]/index.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>vault</div>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  name: 'vaultOverview',
+});
+</script>