@fy-/fws-vue 0.0.908 → 0.0.910

package/components/fws/CmsArticleSingle.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, watchEffect } from "vue";
 import { useRoute } from "vue-router";
 import type { Component } from "vue";
-import { useRest } from "../../rest";
-import { LazyHead, useSeo } from "../../seo";
+import { useRest } from "../../composables/rest";
+import { LazyHead, useSeo } from "../../composables/seo";
 import type { BreadcrumbLink } from "../../types";
 import DefaultBreadcrumb from "../ui/DefaultBreadcrumb.vue";
 
@@ -15,11 +15,15 @@ const props = withDefaults(
     baseBreadcrumb?: BreadcrumbLink[];
     showImage?: boolean;
     showPreview?: boolean;
+    showTitle?: boolean;
+    postValue?: any;
   }>(),
   {
     baseBreadcrumb: () => [],
     showImage: true,
     showPreview: true,
+    showTitle: true,
+    postValue: () => undefined,
   },
 );
 
@@ -29,10 +33,12 @@ const route = useRoute();
 const seo = ref<LazyHead>({});
 const is404 = ref(false);
 const getBlogPost = async () => {
-  const data = await rest(
-    `Cms/${props.cmsAlias}/Post/${route.params.slug}`,
-    "GET",
-  );
+  let data: any = undefined;
+  if (!props.postValue) {
+    data = await rest(`Cms/${props.cmsAlias}/Post/${route.params.slug}`, "GET");
+  } else {
+    data = props.postValue;
+  }
   if (data && data.result == "success") {
     post.value = data.data;
     seo.value.title = post.value.Title;
@@ -59,6 +65,9 @@ const getBlogPost = async () => {
   }
 };
 await getBlogPost();
+watchEffect(() => {
+  getBlogPost();
+});
 useSeo(seo);
 </script>
 <template>
@@ -83,7 +92,7 @@ useSeo(seo);
           v-if="post.CoverUUID"
           :content="`https://s.nocachenocry.com/${post.CoverUUID}?vars=format=webp:resize=512x512`"
         />
-        <div class="py-4 px-4 max-w-6xl mx-auto">
+        <div class="py-4 px-4 max-w-6xl mx-auto" v-if="showTitle">
           <h1
             class="mb-4 text-4xl tracking-tight font-extrabold text-center text-fv-neutral-900 dark:text-white"
           >

package/components/fws/DataTable.vue

@@ -7,8 +7,8 @@ import {
 } from "@heroicons/vue/24/solid";
 import DefaultPaging from "../ui/DefaultPaging.vue";
 import DefaultInput from "../ui/DefaultInput.vue";
-import { useEventBus } from "../../event-bus";
-import { useRest } from "../../rest";
+import { useEventBus } from "../../composables/event-bus";
+import { useRest } from "../../composables/rest";
 import { useRoute } from "vue-router";
 import { useStorage } from "@vueuse/core";
 interface DefaultStringObject {

package/components/fws/FilterData.vue

@@ -3,8 +3,8 @@ import useVuelidate from "@vuelidate/core";
 import { reactive } from "vue";
 import { onMounted } from "vue";
 import { onUnmounted } from "vue";
-import { useTranslation } from "../../translations";
-import { useEventBus } from "../../event-bus";
+import { useTranslation } from "../../composables/translations";
+import { useEventBus } from "../../composables/event-bus";
 import DefaultDateSelection from "../ui/DefaultDateSelection.vue";
 import DefaultInput from "../ui/DefaultInput.vue";
 

package/components/fws/UserFlow.vue

@@ -2,10 +2,10 @@
 import { ref, onMounted } from "vue";
 import type { KlbFlowData, KlbUserFlowField } from "@fy-/fws-types";
 import { useRoute, useRouter } from "vue-router";
-import { useTranslation } from "../../translations";
-import { useEventBus } from "../../event-bus";
+import { useTranslation } from "../../composables/translations";
+import { useEventBus } from "../../composables/event-bus";
 import { useUserStore } from "../../stores/user";
-import { useRest, APIResult } from "../../rest";
+import { useRest, APIResult } from "../../composables/rest";
 import DefaultInput from "../ui/DefaultInput.vue";
 import { ClientOnly } from "../ssr/ClientOnly";
 const rest = useRest();

package/components/ui/DefaultConfirm.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted } from "vue";
 import { ExclamationCircleIcon } from "@heroicons/vue/24/solid";
-import { useEventBus } from "../../event-bus";
+import { useEventBus } from "../../composables/event-bus";
 import DefaultModal from "./DefaultModal.vue";
 
 const eventBus = useEventBus();

package/components/ui/DefaultInput.vue

@@ -2,7 +2,7 @@
 import { LinkIcon } from "@heroicons/vue/24/solid";
 import { computed, ref, toRef } from "vue";
 import type { ErrorObject } from "@vuelidate/core";
-import { useTranslation } from "../../translations";
+import { useTranslation } from "../../composables/translations";
 type modelValueType = string | number | string[] | undefined;
 type checkboxValueType = any[] | Set<any> | undefined | boolean;
 const props = withDefaults(

package/components/ui/DefaultLoader.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, ref } from "vue";
-import type { Component } from "vue";
-import { useEventBus } from "../../event-bus";
+import { useEventBus } from "../../composables/event-bus";
 
 const props = withDefaults(
   defineProps<{
@@ -32,18 +31,16 @@ onUnmounted(() => {
 <template>
   <div
     v-if="loading || force"
-    class="flex-grow flex flex-col bg-fv-neutral-800/[.8] items-center justify-center absolute inset-0 z-50"
+    class="flex-grow flex flex-col bg-fv-neutral-200/[.8] dark:bg-fv-neutral-800/[.8] items-center justify-center absolute inset-0 z-50"
   >
-    <div class="text-center animate-pulse w-40 h-40 p-4 rounded-full shadow">
-      <div class="relative flex flex-col items-center">
-        <div class="flex items-center justify-center flex-col">
-          <img
-            :src="image"
-            :alt="$t('global_loading')"
-            class="w-full h-full relative"
-          />
-        </div>
-      </div>
+    <div
+      class="text-center animate-pulse w-40 h-40 p-6 rounded-full shadow bg-fv-neutral-50 dark:bg-fv-neutral-900 flex items-center justify-center"
+    >
+      <img
+        :src="image"
+        :alt="$t('global_loading')"
+        class="w-full h-full relative"
+      />
     </div>
   </div>
 </template>

package/components/ui/DefaultModal.vue

@@ -7,7 +7,7 @@ import {
 } from "@headlessui/vue";
 import { ref, onMounted, onUnmounted, h } from "vue";
 import { XCircleIcon } from "@heroicons/vue/24/solid";
-import { useEventBus } from "../../event-bus";
+import { useEventBus } from "../../composables/event-bus";
 const props = withDefaults(
   defineProps<{
     id: string;

package/components/ui/DefaultPaging.vue

@@ -8,8 +8,8 @@ import {
   onMounted,
   computed,
 } from "vue";
-import type { APIPaging } from "../../rest";
-import { useEventBus } from "../../event-bus";
+import type { APIPaging } from "../../composables/rest";
+import { useEventBus } from "../../composables/event-bus";
 import { useServerRouter } from "../../stores/serverRouter";
 import { useRoute } from "vue-router";
 import { useFyHead } from "@fy-/head";

package/{rest.ts → composables/rest.ts}

@@ -1,5 +1,5 @@
 import { RestMethod, RestParams, getMode, rest, stringHash } from "@fy-/fws-js";
-import { useRestStore } from "./stores/rest";
+import { useRestStore } from "../stores/rest";
 import { isServerRendered } from "./ssr";
 import { useEventBus } from "./event-bus";
 

package/{ssr.ts → composables/ssr.ts}

@@ -2,7 +2,7 @@ import { Router } from "vue-router";
 import { Pinia } from "pinia";
 import { renderToString } from "@vue/server-renderer";
 import { getInitialState, getPath, getURL, getUUID } from "@fy-/fws-js";
-import { useServerRouter } from "./stores/serverRouter";
+import { useServerRouter } from "../stores/serverRouter";
 
 export interface SSRResult {
   initial: {

package/index.ts

@@ -3,10 +3,14 @@ import i18next from "i18next";
 import mitt from "mitt";
 import { Emitter } from "mitt";
 import { useServerRouter } from "./stores/serverRouter";
-import { useEventBus, Events } from "./event-bus";
-import { i18nextPromise, useTranslation } from "./translations";
-import { initVueClient, initVueServer, isServerRendered } from "./ssr";
-import { useSeo } from "./seo";
+import { useEventBus, Events } from "./composables/event-bus";
+import { i18nextPromise, useTranslation } from "./composables/translations";
+import {
+  initVueClient,
+  initVueServer,
+  isServerRendered,
+} from "./composables/ssr";
+import { useSeo } from "./composables/seo";
 import { useUserStore, useUserCheck } from "./stores/user";
 import { ClientOnly } from "./components/ssr/ClientOnly";
 import {
@@ -15,8 +19,8 @@ import {
   formatDate,
   formatDatetime,
   formatTimeago,
-} from "./templating";
-import { useRest } from "./rest";
+} from "./composables/templating";
+import { useRest } from "./composables/rest";
 export * from "./stores/serverRouter";
 
 // Components/UI/Transitions

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fy-/fws-vue",
-  "version": "0.0.908",
+  "version": "0.0.910",
   "author": "Florian 'Fy' Gasquez <m@fy.to>",
   "license": "MIT",
   "repository": {

package/stores/rest.ts

@@ -1,5 +1,5 @@
 import { defineStore } from "pinia";
-import { APIResult } from "../rest";
+import { APIResult } from "../composables/rest";
 
 type SharedState = {
   results: Record<number, APIResult | undefined>;

package/stores/user.ts

@@ -1,6 +1,6 @@
 import { defineStore } from "pinia";
 import type { User } from "@fy-/fws-types";
-import { APIResult } from "../rest";
+import { APIResult } from "../composables/rest";
 import { rest } from "@fy-/fws-js";
 import { computed } from "vue";
 import { RouteLocation, useRouter } from "vue-router";