@cwa/nuxt-edge 0.0.0-29696494.72f11a4

package/dist/runtime/templates/components/core/admin/RoutesTab.vue

@@ -0,0 +1,264 @@
+<template>
+  <div>
+    <div v-if="currentScreen === 'view'">
+      <div class="cwa:flex cwa:flex-col cwa:gap-y-6">
+        <RoutesTabView
+          :resource="resource"
+          :is-loading="isLoadingRoute"
+          :parent-has-no-route="parentHasNoRoute"
+          @deleted="handleRedirectDeleted"
+          @change-page="handleChangePage"
+        />
+        <div v-if="childRoutes.length">
+          <span class="cwa:text-xs cwa:text-stone-400 cwa:uppercase cwa:tracking-wide">Child routes</span>
+          <div class="cwa:mt-1 cwa:flex cwa:flex-col cwa:divide-y cwa:divide-stone-700">
+            <div
+              v-for="child in flatChildRoutes"
+              :key="child.route"
+              class="cwa:py-1.5 cwa:text-sm cwa:text-stone-300"
+              :style="{ paddingLeft: child.depth > 0 ? `${child.depth}rem` : void 0 }"
+            >
+              {{ child.path }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      v-else-if="!resource"
+      class="p-4"
+    >
+      <CwaUiAlertWarning>
+        Internal Error: No Route Resource Loaded.
+      </CwaUiAlertWarning>
+    </div>
+    <div v-else>
+      <div class="cwa:flex cwa:flex-col cwa:gap-y-8">
+        <div>
+          <button
+            class="cwa:cursor-pointer"
+            type="button"
+            @click="handleChangePage('view')"
+          >
+            &lt; Back to Routes
+          </button>
+        </div>
+
+        <div v-if="currentScreen === 'manage-route'">
+          <CwaUiAlertWarning v-if="!localResourceData">
+            Critical Errors: Local Resource Data has not been propagated.
+          </CwaUiAlertWarning>
+          <RoutesTabManage
+            v-else
+            v-model="localResourceData.path"
+            :current-path="resource.path"
+            :disable-buttons="disableButtons"
+            :page-resource="pageResource"
+            :parent-route-prefix="parentRoutePrefix"
+            @save="handleSaveRoute"
+            @generate="handleGenerateRoute"
+            @delete="handleDeleteRoute"
+          />
+        </div>
+
+        <div v-if="currentScreen === 'create-redirect'">
+          <RoutesTabAddRedirect
+            :disable-buttons="disableButtons"
+            :route-path="resource.path"
+            @create="handleCreateRedirect"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref, watch, watchEffect } from "vue";
+import { createConfirmDialog } from "vuejs-confirm-dialog";
+import { useItemPage } from "#cwa-layer/pages/_cwa/index/composables/useItemPage";
+import { useCwa, navigateTo, useRoute } from "#imports";
+import RoutesTabView from "#cwa/templates/components/core/admin/RoutesTabView.vue";
+import RoutesTabAddRedirect from "#cwa/templates/components/core/admin/RoutesTabAddRedirect.vue";
+import RoutesTabManage from "#cwa/templates/components/core/admin/RoutesTabManage.vue";
+import ConfirmDialog from "#cwa/templates/components/core/ConfirmDialog.vue";
+import { CwaResourceApiStatuses } from "#cwa/storage/stores/resources/state";
+const props = defineProps({
+  pageResource: { type: Object, required: true }
+});
+const emit = defineEmits(["close", "reload"]);
+const $cwa = useCwa();
+const route = useRoute();
+const parentIri = computed(() => props.pageResource.parentPage || props.pageResource.parentPageData);
+const parentResource = computed(() => parentIri.value ? $cwa.resources.getResource(parentIri.value).value : null);
+watchEffect(() => {
+  const iri = parentIri.value;
+  if (iri && !parentResource.value?.data) {
+    $cwa.fetchResource({ path: iri, shallowFetch: true });
+  }
+});
+const parentRoutePrefix = computed(() => {
+  const routeIri = parentResource.value?.data?.route;
+  if (!routeIri) {
+    return null;
+  }
+  return routeIri.replace(/^.*\/_\/routes\//, "");
+});
+const parentHasNoRoute = computed(() => !!parentIri.value && !parentRoutePrefix.value);
+const routeIriFromPage = computed(() => props.pageResource.route);
+const endpoint = computed(() => routeIriFromPage.value ? `${routeIriFromPage.value}/redirects` : "add");
+const disableButtons = computed(() => submitting.value || isUpdating.value);
+const submitting = ref(false);
+const currentScreen = ref("view");
+const childRoutes = ref([]);
+function flattenRouteNodes(nodes, depth = 0) {
+  const result = [];
+  for (const node of nodes) {
+    result.push({ ...node, depth });
+    result.push(...flattenRouteNodes(node.children, depth + 1));
+  }
+  return result;
+}
+const flatChildRoutes = computed(() => flattenRouteNodes(childRoutes.value));
+async function loadChildRoutes() {
+  const iri = routeIriFromPage.value;
+  if (!iri) {
+    childRoutes.value = [];
+    return;
+  }
+  try {
+    const { response } = $cwa.fetch({ path: `${iri}/children` });
+    const { _data: data } = await response;
+    childRoutes.value = data?.children ?? [];
+  } catch {
+    childRoutes.value = [];
+  }
+}
+function handleChangePage(screen) {
+  if (screen === "manage-route") {
+    resetResource();
+  }
+  currentScreen.value = screen;
+}
+async function handleCreateRedirect(path) {
+  submitting.value = true;
+  const newResource = await $cwa.resourcesManager.createResource({
+    endpoint: "/_/routes",
+    data: {
+      name: path,
+      path,
+      redirect: props.pageResource.route
+    }
+  });
+  submitting.value = false;
+  if (newResource) {
+    handleChangePage("view");
+    await loadResource();
+  }
+}
+async function askCascadeChildPaths() {
+  const dialog = createConfirmDialog(ConfirmDialog);
+  const { isCanceled } = await dialog.reveal({
+    title: "Update child routes?",
+    content: "<p>The route path has changed. If this page has child routes that share the old prefix, would you like to update them too? Routes using a different prefix will be unchanged.</p>"
+  });
+  return !isCanceled;
+}
+async function handleGenerateRoute() {
+  submitting.value = true;
+  const oldPath = resource.value?.path;
+  const newResource = await $cwa.resourcesManager.createResource({
+    endpoint: "/_/routes/generate",
+    data: {
+      page: defaultResource.value.page,
+      pageData: defaultResource.value.pageData
+    }
+  });
+  submitting.value = false;
+  if (newResource) {
+    emit("reload");
+    handleChangePage("view");
+    const newPath = newResource.path;
+    if (oldPath && newPath && newPath !== oldPath) {
+      if (await askCascadeChildPaths()) {
+        await $cwa.resourcesManager.updateResource({
+          endpoint: newResource["@id"],
+          data: { path: newPath, cascadeChildPaths: true, oldPath }
+        });
+      }
+    }
+  }
+}
+async function handleSaveRoute() {
+  const pathChanged = localResourceData.value?.path !== resource.value?.path;
+  let cascadeData;
+  if (pathChanged && await askCascadeChildPaths()) {
+    cascadeData = { cascadeChildPaths: true };
+  }
+  const savedResource = await saveResource(false, cascadeData);
+  if (savedResource) {
+    isLoadingRoute.value = true;
+    emit("reload");
+    handleChangePage("view");
+    if (routeIriFromPage.value === savedResource["@id"]) {
+      await loadResource();
+    }
+    await loadChildRoutes();
+  }
+}
+async function handleDeleteRoute() {
+  const deletingPath = resource.value?.path;
+  const requestCompleteFn = (_) => {
+    if (deletingPath === route.path) {
+      navigateTo($cwa.resources.isDataPage.value ? $cwa.resources.pageDataIri.value : $cwa.resources.pageIri.value);
+    }
+  };
+  await deleteResource(void 0, requestCompleteFn);
+  handleChangePage("view");
+}
+async function handleRedirectDeleted() {
+  isLoadingRoute.value = true;
+  await loadResource();
+}
+watch(routeIriFromPage, async () => {
+  await loadResource();
+});
+const defaultResource = computed(() => {
+  const obj = {
+    path: ""
+  };
+  if (props.pageResource["@type"] === "Page") {
+    obj.page = props.pageResource["@id"];
+  } else {
+    obj.pageData = props.pageResource["@id"];
+  }
+  return obj;
+});
+const { isLoading: isLoadingRoute, isUpdating, resource, localResourceData, loadResource, deleteResource, saveResource, resetResource, apiState } = useItemPage({
+  createEndpoint: "/_/routes",
+  emit,
+  resourceType: "Route",
+  defaultResource: defaultResource.value,
+  validate(data) {
+    data.name = data.path;
+    return true;
+  },
+  endpoint,
+  iri: routeIriFromPage,
+  // exclude this field when updating the resource or creating
+  excludeFields: ["redirectedFrom"]
+});
+watch(resource, (res) => {
+  if (res?.["@id"]) {
+    loadChildRoutes();
+  } else {
+    childRoutes.value = [];
+  }
+}, { immediate: true });
+watch(apiState, (newState) => {
+  if (newState?.status === CwaResourceApiStatuses.SUCCESS && !newState?.path?.endsWith("/redirects")) {
+    isLoadingRoute.value = true;
+    loadResource();
+  }
+});
+</script>

package/dist/runtime/templates/components/core/admin/RoutesTab.vue.d.ts

@@ -0,0 +1,14 @@
+import type { CwaResource } from '#cwa/resources/resource-utils';
+export type RouteScreens = 'view' | 'manage-route' | 'create-redirect';
+type __VLS_Props = {
+    pageResource: CwaResource;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: () => any;
+    reload: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onReload?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabAddRedirect.d.vue.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    disableButtons: boolean;
+    routePath: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    create: (path: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onCreate?: ((path: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabAddRedirect.vue

@@ -0,0 +1,45 @@
+<script setup>
+import { computed, ref } from "vue";
+import ModalInput from "#cwa/templates/components/core/admin/form/ModalInput.vue";
+defineProps({
+  disableButtons: { type: Boolean, required: true },
+  routePath: { type: String, required: true }
+});
+defineEmits(["create"]);
+const newRedirectPath = ref("");
+const finalPath = computed(() => {
+  return newRedirectPath.value?.startsWith("/") ? newRedirectPath.value : `/${newRedirectPath.value}`;
+});
+</script>
+
+<template>
+  <div class="cwa:flex cwa:flex-col cwa:gap-y-6">
+    <div class="cwa:flex cwa:flex-col cwa:gap-y-4">
+      <div>
+        <ModalInput
+          v-model="newRedirectPath"
+          label="Redirect from path"
+          placeholder="/some-path"
+        />
+      </div>
+      <div class="cwa:text-sm cwa:text-stone-300 cwa:flex cwa:flex-col cwa:gap-y-2 cwa:leading-6">
+        <p
+          v-if="newRedirectPath"
+        >
+          <span class="cwa:max-w-full cwa:truncate cwa:inline-block cwa:align-bottom cwa:font-bold cwa:bg-dark cwa:px-2">{{ finalPath }}</span>
+          will be redirected to
+          <span class="cwa:max-w-full cwa:truncate cwa:inline-block cwa:align-bottom cwa:font-bold cwa:bg-dark cwa:px-2">{{ routePath }}</span>
+        </p>
+      </div>
+    </div>
+    <div class="cwa:flex cwa:justify-start">
+      <CwaUiFormButton
+        color="blue"
+        :disabled="disableButtons"
+        @click="$emit('create', newRedirectPath)"
+      >
+        Create Redirect
+      </CwaUiFormButton>
+    </div>
+  </div>
+</template>

package/dist/runtime/templates/components/core/admin/RoutesTabAddRedirect.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    disableButtons: boolean;
+    routePath: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    create: (path: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onCreate?: ((path: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabManage.d.vue.ts

@@ -0,0 +1,24 @@
+import type { CwaResource } from '#cwa/resources/resource-utils';
+type __VLS_Props = {
+    disableButtons: boolean;
+    pageResource: CwaResource;
+    currentPath: string;
+    parentRoutePrefix?: string | null;
+};
+type __VLS_ModelProps = {
+    modelValue: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    delete: () => any;
+    "update:modelValue": (value: string) => any;
+    save: () => any;
+    generate: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDelete?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onSave?: (() => any) | undefined;
+    onGenerate?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabManage.vue

@@ -0,0 +1,139 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+import slugify from "slugify";
+import ModalInfo from "#cwa/templates/components/core/admin/form/ModalInfo.vue";
+import ModalInput from "#cwa/templates/components/core/admin/form/ModalInput.vue";
+import ModalSelect from "#cwa/templates/components/core/admin/form/ModalSelect.vue";
+const { pageResource, parentRoutePrefix, currentPath, disableButtons } = defineProps({
+  disableButtons: { type: Boolean, required: true },
+  pageResource: { type: Object, required: true },
+  currentPath: { type: String, required: true },
+  parentRoutePrefix: { type: [String, null], required: false }
+});
+const pathModel = defineModel({ type: String, ...{ required: true } });
+defineEmits(["save", "delete", "generate"]);
+function splitPath(fullPath, prefix) {
+  if (prefix && prefix !== "/" && fullPath.startsWith(prefix)) {
+    return { prefix, suffix: fullPath.slice(prefix.length) || "" };
+  }
+  return { prefix: "/", suffix: fullPath };
+}
+const initial = splitPath(pathModel.value, parentRoutePrefix);
+const localPrefix = ref(initial.prefix);
+const localSuffix = ref(initial.suffix);
+watch([localPrefix, localSuffix], ([prefix, suffix]) => {
+  if (prefix === "/") {
+    pathModel.value = suffix.startsWith("/") ? suffix : "/" + suffix;
+  } else {
+    const p = prefix.replace(/\/+$/, "");
+    const s = suffix.replace(/^\/+/, "");
+    pathModel.value = s ? `${p}/${s}` : p;
+  }
+});
+watch(() => parentRoutePrefix, (newPrefix) => {
+  if (newPrefix && localPrefix.value === "/") {
+    const split = splitPath(pathModel.value, newPrefix);
+    localPrefix.value = split.prefix;
+    localSuffix.value = split.suffix;
+  }
+});
+const prefixOptions = computed(() => {
+  const options = [{ label: "/ (root)", value: "/" }];
+  if (parentRoutePrefix && parentRoutePrefix !== "/") {
+    options.push({ label: parentRoutePrefix, value: parentRoutePrefix });
+  }
+  return options;
+});
+const recommendedSuffix = computed(() => {
+  if (!pageResource.title) {
+    return void 0;
+  }
+  return "/" + slugify(pageResource.title.toLowerCase());
+});
+const fullRecommendedPath = computed(() => {
+  if (!recommendedSuffix.value) {
+    return void 0;
+  }
+  return parentRoutePrefix && parentRoutePrefix !== "/" ? parentRoutePrefix + recommendedSuffix.value : recommendedSuffix.value;
+});
+const isApplyDisabled = computed(() => disableButtons || fullRecommendedPath.value === currentPath);
+const pageResourceRouteIri = computed(() => pageResource.route);
+</script>
+
+<template>
+  <div
+    class="cwa:flex cwa:flex-col cwa:gap-y-6"
+  >
+    <div class="cwa:flex cwa:flex-col cwa:gap-y-4">
+      <div class="cwa:flex">
+        <div class="cwa:flex-none cwa:w-40">
+          <ModalSelect
+            v-model="localPrefix"
+            label="Prefix"
+            :options="prefixOptions"
+            container-class="cwa:rounded-r-none cwa:border-r-0"
+          />
+        </div>
+        <div class="cwa:flex-1">
+          <ModalInput
+            v-model="localSuffix"
+            label="Route suffix"
+            class="cwa:rounded-l-none"
+          />
+        </div>
+      </div>
+      <div>
+        <p class="cwa:text-sm cwa:text-stone-300">
+          When updating, we will automatically create a new redirect from the old path.
+        </p>
+      </div>
+      <div class="cwa:flex cwa:justify-between">
+        <div>
+          <CwaUiFormButton
+            color="blue"
+            :disabled="disableButtons"
+            @click="$emit('save')"
+          >
+            Save Route
+          </CwaUiFormButton>
+        </div>
+        <div v-if="!!pageResourceRouteIri">
+          <CwaUiFormButton
+            color="grey"
+            :disabled="disableButtons"
+            @click="$emit('delete')"
+          >
+            Delete Route
+          </CwaUiFormButton>
+        </div>
+      </div>
+    </div>
+    <div
+      v-if="recommendedSuffix"
+      class="cwa:p-4 cwa:bg-dark/80 cwa:rounded-lg cwa:flex cwa:flex-col cwa:gap-y-2 cwa:text-sm"
+    >
+      <div>
+        <ModalInfo
+          label="SEO recommendation"
+          class="cwa:font-bold"
+        >
+          <span data-seo-recommendation>{{ fullRecommendedPath }}</span>
+        </ModalInfo>
+      </div>
+      <div class="cwa:flex cwa:justify-start">
+        <CwaUiFormButton
+          data-apply-seo
+          :color="isApplyDisabled ? 'grey' : 'blue'"
+          :disabled="isApplyDisabled"
+          class="cwa:text-sm"
+          @click="$emit('generate')"
+        >
+          {{ fullRecommendedPath === currentPath ? "You are using the recommended route" : "Apply" }}
+        </CwaUiFormButton>
+      </div>
+      <div class="cwa:text-xs cwa:text-stone-300 cwa:flex cwa:flex-col cwa:gap-y-2">
+        <p>Recommended route is based on your page title <b>`{{ pageResource.title }}`</b>.</p>
+      </div>
+    </div>
+  </div>
+</template>

package/dist/runtime/templates/components/core/admin/RoutesTabManage.vue.d.ts

@@ -0,0 +1,24 @@
+import type { CwaResource } from '#cwa/resources/resource-utils';
+type __VLS_Props = {
+    disableButtons: boolean;
+    pageResource: CwaResource;
+    currentPath: string;
+    parentRoutePrefix?: string | null;
+};
+type __VLS_ModelProps = {
+    modelValue: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    delete: () => any;
+    "update:modelValue": (value: string) => any;
+    save: () => any;
+    generate: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDelete?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onSave?: (() => any) | undefined;
+    onGenerate?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabView.d.vue.ts

@@ -0,0 +1,17 @@
+import type { CwaResource } from '#cwa/resources/resource-utils';
+import type { TempCwaResource } from '#cwa-layer/pages/_cwa/index/composables/useItemPage';
+import type { RouteScreens } from '#cwa/templates/components/core/admin/RoutesTab.vue';
+type __VLS_Props = {
+    resource: CwaResource | TempCwaResource | undefined;
+    isLoading: boolean;
+    parentHasNoRoute?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    deleted: (resource: CwaResource) => any;
+    changePage: (page: RouteScreens) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDeleted?: ((resource: CwaResource) => any) | undefined;
+    onChangePage?: ((page: RouteScreens) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/RoutesTabView.vue

@@ -0,0 +1,74 @@
+<script setup>
+import ModalInfo from "#cwa/templates/components/core/admin/form/ModalInfo.vue";
+import Spinner from "#cwa/templates/components/utils/Spinner.vue";
+import RouteRedirectsTree from "#cwa/templates/components/core/admin/RouteRedirectsTree.vue";
+defineProps({
+  resource: { type: null, required: true },
+  isLoading: { type: Boolean, required: true },
+  parentHasNoRoute: { type: Boolean, required: false }
+});
+const emit = defineEmits(["changePage", "deleted"]);
+function handleDeletedEvent(resource) {
+  emit("deleted", resource);
+}
+</script>
+
+<template>
+  <div class="cwa:flex cwa:flex-col cwa:gap-y-6">
+    <ModalInfo
+      label="Route"
+      :content="isLoading ? void 0 : resource?.path"
+    >
+      <Spinner
+        v-if="isLoading"
+        :show="true"
+      />
+      <p
+        v-else-if="parentHasNoRoute"
+        class="cwa:text-sm cwa:text-stone-400"
+      >
+        Parent page has no public URL — resources are not publicly accessible. Set a route on the parent first.
+      </p>
+      <CwaUiFormButton
+        v-else
+        :color="resource?.path ? 'dark' : 'blue'"
+        @click="$emit('changePage', 'manage-route')"
+      >
+        {{ resource?.path ? "Edit" : "Create New Route" }}
+      </CwaUiFormButton>
+    </ModalInfo>
+    <div class="cwa:dark-blur cwa:p-4 cwa:flex cwa:flex-col cwa:gap-y-2.5 cwa:border cwa:rounded-xl cwa:border-stone-600">
+      <div class="cwa:flex cwa:gap-x-4 cwa:items-center">
+        <h2 class="cwa:text-stone-400 cwa:text-2xl">
+          Redirects
+        </h2>
+        <div>
+          <button
+            class="cwa:text-white cwa:bg-blue-600/90 cwa:hover:bg-blue-600 cwa:border-transparent cwa:p-2.5 cwa:cursor-pointer"
+            @click="$emit('changePage', 'create-redirect')"
+          >
+            <CwaUiIconPlusIcon class="cwa:w-4 cwa:h-4" />
+            <span class="cwa:sr-only">Add</span>
+          </button>
+        </div>
+      </div>
+      <div>
+        <Spinner
+          v-if="isLoading"
+          :show="true"
+        />
+        <RouteRedirectsTree
+          v-else-if="resource?.redirectedFrom?.length"
+          :redirects="resource.redirectedFrom"
+          @deleted="handleDeletedEvent"
+        />
+        <p
+          v-else
+          class="cwa:text-lg cwa:font-bold cwa:text-stone-400 cwa:mb-2 cwa:mt-4"
+        >
+          You do not have any redirects
+        </p>
+      </div>
+    </div>
+  </div>
+</template>

package/dist/runtime/templates/components/core/admin/RoutesTabView.vue.d.ts

@@ -0,0 +1,17 @@
+import type { CwaResource } from '#cwa/resources/resource-utils';
+import type { TempCwaResource } from '#cwa-layer/pages/_cwa/index/composables/useItemPage';
+import type { RouteScreens } from '#cwa/templates/components/core/admin/RoutesTab.vue';
+type __VLS_Props = {
+    resource: CwaResource | TempCwaResource | undefined;
+    isLoading: boolean;
+    parentHasNoRoute?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    deleted: (resource: CwaResource) => any;
+    changePage: (page: RouteScreens) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDeleted?: ((resource: CwaResource) => any) | undefined;
+    onChangePage?: ((page: RouteScreens) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/templates/components/core/admin/form/FilterFormWrapper.d.vue.ts

@@ -0,0 +1,16 @@
+type __VLS_Props = {
+    label: string;
+    inputId?: string;
+};
+type __VLS_Slots = {
+    default(): any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};