@tager/admin-blog 0.3.24 → 0.3.25

package/dist/index.umd.js

@@ -68,6 +68,14 @@
       blogCategoryWasSuccessfullyUpdated: 'Blog category was successfully updated',
       blogCategoryCreationWasFailed: 'Blog category creation was failed',
       blogCategoryUpdateWasFailed: 'Blog category update was failed',
+      clone: 'Clone',
+      cloneConfirm: 'Are you sure you want to clone the page?',
+      cloneSuccess: 'Page have copied successfully',
+      cloneFailure: 'Page copy failure',
+      tabs: {
+          common: 'Common',
+          seo: 'SEO',
+      },
   };
 
   const RU = {
@@ -134,6 +142,14 @@
       blogCategoryWasSuccessfullyUpdated: 'Категория блога успешно обновлена',
       blogCategoryCreationWasFailed: 'Не удалось создать категорию блога',
       blogCategoryUpdateWasFailed: 'Не удалось обновить категорию блога',
+      clone: 'Клонировать',
+      cloneConfirm: 'Вы уверены, что хотите создать копию страницы?',
+      cloneSuccess: 'Копия страницы успешно создана',
+      cloneFailure: 'Ошибка копирования страницы',
+      tabs: {
+          common: 'Общие',
+          seo: 'SEO',
+      },
   };
 
   var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -2507,6 +2523,9 @@
 
   var lodash_pick = pick;
 
+  function getUserProfile() {
+      return adminServices.request.get({ path: '/admin/self' });
+  }
   /** Blog Posts */
   function getBlogPostList(params) {
       return adminServices.request.get({ path: '/admin/blog/posts', params });
@@ -2517,6 +2536,9 @@
   function getBlogPost(postId) {
       return adminServices.request.get({ path: `/admin/blog/posts/${postId}` });
   }
+  function clonePost(postId) {
+      return adminServices.request.post({ path: `/admin/blog/posts/${postId}/clone` });
+  }
   function createBlogPost(payload) {
       return adminServices.request.post({ path: '/admin/blog/posts', body: payload });
   }
@@ -2618,6 +2640,117 @@
       return resource;
   }
 
+  function useStore(context) {
+      return context.root.$store;
+  }
+
+  const Scope = {
+      All: '*',
+      OrdersCreate: 'orders.create',
+      OrdersView: 'orders.view',
+      OrdersDelete: 'orders.delete',
+      RbacViewRoles: 'rbac.view-roles',
+      RbacEditRoles: 'rbac.edit-roles',
+      AdministratorsView: 'administrators.view',
+      AdministratorsEdit: 'administrators.edit',
+      AdministratorsDelete: 'administrators.delete',
+  };
+
+  const USER_MODULE_NAMESPACE = 'user';
+  const USER_MUTATION_TYPES = {
+      PROFILE_REQUEST_STARTED: 'profileRequestStarted',
+      PROFILE_REQUEST_FULFILLED: 'profileRequestFulfilled',
+      PROFILE_REQUEST_REJECTED: 'profileRequestRejected',
+  };
+  const USER_ACTION_TYPES = {
+      FETCH_USER_PROFILE: 'fetchUserProfile',
+  };
+  const userGetters = {
+      userProfile(state) {
+          return state.profile;
+      },
+      userScopes(state) {
+          const roles = state.profile ? state.profile.roles : [];
+          const scopes = [];
+          roles.forEach((role) => {
+              scopes.push(...role.scopes);
+          });
+          return scopes;
+      },
+      userHasPermission: (state, getters) => (scope) => {
+          const scopes = getters.userScopes;
+          if (scopes.includes(Scope.All))
+              return true;
+          return scopes.includes(scope);
+      },
+  };
+  const userModule = {
+      namespaced: true,
+      state: {
+          profile: null,
+          status: adminServices.FETCH_STATUSES.IDLE,
+      },
+      mutations: {
+          [USER_MUTATION_TYPES.PROFILE_REQUEST_STARTED](state) {
+              if (state.status === adminServices.FETCH_STATUSES.IDLE) {
+                  state.status = adminServices.FETCH_STATUSES.LOADING;
+              }
+          },
+          [USER_MUTATION_TYPES.PROFILE_REQUEST_FULFILLED](state, user) {
+              if (state.status === adminServices.FETCH_STATUSES.LOADING) {
+                  state.status = adminServices.FETCH_STATUSES.SUCCESS;
+                  state.profile = user;
+              }
+          },
+          [USER_MUTATION_TYPES.PROFILE_REQUEST_REJECTED](state) {
+              if (state.status === adminServices.FETCH_STATUSES.LOADING) {
+                  state.status = adminServices.FETCH_STATUSES.FAILURE;
+                  state.profile = null;
+              }
+          },
+      },
+      actions: {
+          [USER_ACTION_TYPES.FETCH_USER_PROFILE](store) {
+              if (store.state.status !== adminServices.FETCH_STATUSES.IDLE)
+                  return;
+              store.commit(USER_MUTATION_TYPES.PROFILE_REQUEST_STARTED);
+              getUserProfile()
+                  .then((response) => {
+                  store.commit(USER_MUTATION_TYPES.PROFILE_REQUEST_FULFILLED, response.data);
+              })
+                  .catch((error) => {
+                  console.error(error);
+                  store.commit(USER_MUTATION_TYPES.PROFILE_REQUEST_REJECTED);
+              });
+          },
+      },
+      getters: userGetters,
+  };
+
+  function namespace(namespace, name) {
+      return `${namespace}/${name}`;
+  }
+  function userNamespace(name) {
+      return namespace(USER_MODULE_NAMESPACE, name);
+  }
+  function generateNumberArray(length) {
+      return Array.from({ length }, (_, index) => index);
+  }
+  function getNameWithDepth(name, depth) {
+      return (generateNumberArray(depth)
+          .map(() => '—')
+          .join(' ') +
+          ' ' +
+          name);
+  }
+
+  function useUserPermission(context, scope) {
+      const store = useStore(context);
+      return compositionApi.computed(() => {
+          return store.getters[userNamespace('userHasPermission')](scope);
+      });
+  }
+
   function convertPostList(postList, selectedCategory, languages) {
       return postList
           .filter((post) => selectedCategory
@@ -2626,7 +2759,10 @@
           .map((post) => {
           if (languages.length > 0) {
               const foundLanguage = languages.find(({ id }) => id === post.language);
-              return Object.assign(Object.assign({}, post), { language: foundLanguage ? foundLanguage.name : post.language });
+              return {
+                  ...post,
+                  language: foundLanguage ? foundLanguage.name : post.language,
+              };
           }
           return post;
       });
@@ -2701,9 +2837,9 @@
   const dateFormat = (date) => date.split('-').reverse().join('.');
   function useAdvancedSearch({ context, categoryList, languageList, }) {
       /** Category **/
-      const categoryOptionList = compositionApi.computed(() => categoryList.value.map(({ id, name }) => ({
+      const categoryOptionList = compositionApi.computed(() => categoryList.value.map(({ id, name, depth }) => ({
           value: String(id),
-          label: name,
+          label: getNameWithDepth(name, depth),
       })));
       const initialCategoryFilter = compositionApi.computed(() => {
           const queryValue = adminUi.getFilterParamAsStringArray(context.root.$route.query, FilterTypes.CATEGORY);
@@ -2724,13 +2860,14 @@
           languageFilter.value = initialLanguageFilter.value;
       });
       /** From date **/
-      const initialFromDateFilter = compositionApi.computed(() => { var _a; return (_a = adminUi.getFilterParamAsString(context.root.$route.query, FilterTypes.FROM_DATE)) !== null && _a !== void 0 ? _a : ''; });
+      const initialFromDateFilter = compositionApi.computed(() => adminUi.getFilterParamAsString(context.root.$route.query, FilterTypes.FROM_DATE) ?? '');
       const fromDateFilter = compositionApi.ref(initialFromDateFilter.value);
       compositionApi.watch(initialFromDateFilter, () => {
           fromDateFilter.value = initialFromDateFilter.value;
       });
       /** To date **/
-      const initialToDateFilter = compositionApi.computed(() => { var _a; return (_a = adminUi.getFilterParamAsString(context.root.$route.query, FilterTypes.TO_DATE)) !== null && _a !== void 0 ? _a : ''; });
+      const initialToDateFilter = compositionApi.computed(() => adminUi.getFilterParamAsString(context.root.$route.query, FilterTypes.TO_DATE) ??
+          '');
       const toDateFilter = compositionApi.ref(initialToDateFilter.value);
       compositionApi.watch(initialToDateFilter, () => {
           toDateFilter.value = initialToDateFilter.value;
@@ -2806,9 +2943,9 @@
               return categoryOptionList.value;
           }
           const selectedList = categoryList.value.filter(({ language }) => languageFilter.value.some(({ value }) => value === language));
-          return selectedList.map(({ id, name }) => ({
+          return selectedList.map(({ id, name, depth }) => ({
               value: String(id),
-              label: name,
+              label: getNameWithDepth(name, depth),
           }));
       });
       return {
@@ -2827,21 +2964,21 @@
   var script = compositionApi.defineComponent({
       name: 'BlogPostList',
       setup(props, context) {
+          const { t } = adminUi.useTranslation(context);
+          const canViewAdministrators = useUserPermission(context, Scope.AdministratorsView);
           const categoryId = compositionApi.computed(() => {
-              var _a;
               return Array.isArray(context.root.$route.query.category)
-                  ? (_a = context.root.$route.query.category[0]) !== null && _a !== void 0 ? _a : '' : context.root.$route.query.category;
+                  ? context.root.$route.query.category[0] ?? ''
+                  : context.root.$route.query.category;
           });
           /** Fetch module config */
           const { data: moduleConfig, loading: isModuleConfigLoading, } = useModuleConfig({ context });
-          const languageList = compositionApi.computed(() => { var _a, _b; return (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : []; });
+          const languageList = compositionApi.computed(() => moduleConfig.value?.languages ?? []);
           /** Fetch category list */
           const { data: categoryList, loading: isCategoryListLoading, } = useBlogCategoryList({ context });
-          const selectedCategory = compositionApi.computed(() => {
-              var _a;
-              return categoryId.value
-                  ? (_a = categoryList.value.find(({ id }) => String(id) === String(categoryId.value))) !== null && _a !== void 0 ? _a : null : null;
-          });
+          const selectedCategory = compositionApi.computed(() => categoryId.value
+              ? categoryList.value.find(({ id }) => String(id) === String(categoryId.value)) ?? null
+              : null);
           const pageTitle = compositionApi.computed(() => {
               return selectedCategory.value
                   ? `${context.root.$t('blog:postsByCategory')} "${selectedCategory.value.name}"`
@@ -2856,7 +2993,12 @@
           const isLangSpecific = compositionApi.computed(() => languageOptionList.value.length > 1);
           /** Fetch Post list */
           const { fetchEntityList: fetchPostList, isLoading: isPostLoading, rowData: postList, errorMessage, searchQuery, handleChange, pageNumber, pageCount, pageSize, } = adminUi.useDataTable({
-              fetchEntityList: (params) => getBlogPostList(Object.assign({ query: params.searchQuery, pageNumber: params.pageNumber, pageSize: params.pageSize }, filterParams.value)),
+              fetchEntityList: (params) => getBlogPostList({
+                  query: params.searchQuery,
+                  pageNumber: params.pageNumber,
+                  pageSize: params.pageSize,
+                  ...filterParams.value,
+              }),
               initialValue: [],
               context,
               resourceName: 'Blog post list',
@@ -2866,25 +3008,36 @@
               if (isModuleConfigLoading.value || isCategoryListLoading.value) {
                   return;
               }
-              const newQuery = Object.assign(Object.assign({}, lodash_pick(context.root.$route.query, ['query', 'pageNumber'])), filterParams.value);
+              const newQuery = {
+                  ...lodash_pick(context.root.$route.query, ['query', 'pageNumber']),
+                  ...filterParams.value,
+              };
               if (!lodash_isequal(context.root.$route.query, newQuery)) {
                   context.root.$router.replace({ query: newQuery });
                   fetchPostList();
               }
           });
-          const displayedPostList = compositionApi.computed(() => {
-              var _a, _b;
-              return convertPostList(postList.value, selectedCategory.value, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : []);
-          });
-          const { handleResourceDelete, isDeleting } = adminServices.useResourceDelete({
+          const displayedPostList = compositionApi.computed(() => convertPostList(postList.value, selectedCategory.value, moduleConfig.value?.languages ?? []));
+          const isRowDataLoading = compositionApi.computed(() => isCategoryListLoading.value ||
+              isPostLoading.value ||
+              isModuleConfigLoading.value);
+          const { isDeleting, handleResourceDelete } = adminServices.useResourceDelete({
               deleteResource: deleteBlogPost,
               resourceName: 'Post',
               onSuccess: fetchPostList,
               context,
           });
-          const isRowDataLoading = compositionApi.computed(() => isCategoryListLoading.value ||
-              isPostLoading.value ||
-              isModuleConfigLoading.value);
+          const { isCloning, handleResourceClone } = adminServices.useResourceClone({
+              cloneResource: clonePost,
+              confirmMessage: t('blog:cloneConfirm'),
+              successMessage: t('blog:cloneSuccess'),
+              failureMessage: t('blog:cloneFailure'),
+              onSuccessRedirectTo: (data) => `/posts/${data.id}`,
+              context,
+          });
+          function isBusy(postId) {
+              return isDeleting(postId) || isCloning(postId) || isRowDataLoading.value;
+          }
           const columnDefs = compositionApi.computed(() => getPostTableColumnDefs(moduleConfig.value, context.root.$t));
           return {
               columnDefs,
@@ -2911,6 +3064,11 @@
               toDateFilter,
               tags,
               tagRemovalHandler,
+              // Permissions
+              canViewAdministrators,
+              // Clone
+              handleResourceClone,
+              isBusy,
           };
       },
   });
@@ -3055,11 +3213,13 @@
       attrs: {
         title: _vm.pageTitle,
         "header-buttons": [
-          {
-            text: _vm.$t("blog:newPost"),
-            href: _vm.getBlogPostFormUrl({ postId: "create" }),
-          },
-        ],
+          _vm.canViewAdministrators
+            ? {
+                text: _vm.$t("blog:newPost"),
+                href: _vm.getBlogPostFormUrl({ postId: "create" }),
+              }
+            : null,
+        ].filter(Boolean),
       },
       scopedSlots: _vm._u([
         {
@@ -3196,37 +3356,61 @@
                     fn: function (ref) {
                       var row = ref.row;
                       return [
-                        _c(
-                          "base-button",
-                          {
-                            attrs: {
-                              variant: "icon",
-                              title: _vm.$t("blog:edit"),
-                              disabled: _vm.isDeleting(row.id),
-                              href: _vm.getBlogPostFormUrl({ postId: row.id }),
-                            },
-                          },
-                          [_c("svg-icon", { attrs: { name: "edit" } })],
-                          1
-                        ),
+                        _vm.canViewAdministrators
+                          ? _c(
+                              "base-button",
+                              {
+                                attrs: {
+                                  variant: "icon",
+                                  title: _vm.$t("blog:edit"),
+                                  disabled: _vm.isBusy(row.id),
+                                  href: _vm.getBlogPostFormUrl({
+                                    postId: row.id,
+                                  }),
+                                },
+                              },
+                              [_c("svg-icon", { attrs: { name: "edit" } })],
+                              1
+                            )
+                          : _vm._e(),
                         _vm._v(" "),
                         _c(
                           "base-button",
                           {
                             attrs: {
                               variant: "icon",
-                              title: _vm.$t("blog:remove"),
-                              disabled: _vm.isDeleting(row.id),
+                              title: _vm.$t("blog:clone"),
+                              disabled: _vm.isBusy(row.id),
                             },
                             on: {
                               click: function ($event) {
-                                return _vm.handleResourceDelete(row.id)
+                                return _vm.handleResourceClone(row.id)
                               },
                             },
                           },
-                          [_c("svg-icon", { attrs: { name: "delete" } })],
+                          [_c("svg-icon", { attrs: { name: "contentCopy" } })],
                           1
                         ),
+                        _vm._v(" "),
+                        _vm.canViewAdministrators
+                          ? _c(
+                              "base-button",
+                              {
+                                attrs: {
+                                  variant: "icon",
+                                  title: _vm.$t("blog:remove"),
+                                  disabled: _vm.isBusy(row.id),
+                                },
+                                on: {
+                                  click: function ($event) {
+                                    return _vm.handleResourceDelete(row.id)
+                                  },
+                                },
+                              },
+                              [_c("svg-icon", { attrs: { name: "delete" } })],
+                              1
+                            )
+                          : _vm._e(),
                       ]
                     },
                   },
@@ -3245,11 +3429,11 @@
     /* style */
     const __vue_inject_styles__ = function (inject) {
       if (!inject) return
-      inject("data-v-4aed84bf_0", { source: ".filters[data-v-4aed84bf] {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters[data-v-4aed84bf]:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter[data-v-4aed84bf] {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n.date-label[data-v-4aed84bf] {\n  margin-bottom: 0.5rem;\n}\n.date-content[data-v-4aed84bf] {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n\n/*# sourceMappingURL=PostList.vue.map */", map: {"version":3,"sources":["/home/runner/work/tager-admin-blog/tager-admin-blog/src/views/Posts/PostList/PostList.vue","PostList.vue"],"names":[],"mappings":"AAoRA;EACA,aAAA;EACA,eAAA;ACnRA;ADqRA;EACA,gBAAA;ACnRA;ADsRA;EACA,oBAAA;EACA,UAAA;EACA,SAAA;ACpRA;ADwRA;EACA,qBAAA;ACrRA;ADwRA;EACA,aAAA;EACA,qCAAA;EACA,gBAAA;ACrRA;;AAEA,uCAAuC","file":"PostList.vue","sourcesContent":["<template>\n  <page\n    :title=\"pageTitle\"\n    :header-buttons=\"[\n      {\n        text: $t('blog:newPost'),\n        href: getBlogPostFormUrl({ postId: 'create' }),\n      },\n    ]\"\n  >\n    <template v-slot:content>\n      <data-table\n        :column-defs=\"columnDefs\"\n        :row-data=\"rowData\"\n        :loading=\"isRowDataLoading\"\n        :error-message=\"errorMessage\"\n        :search-query=\"searchQuery\"\n        :pagination=\"{\n          pageNumber,\n          pageCount,\n          pageSize,\n          disabled: isRowDataLoading,\n        }\"\n        data-table=\"blog-post\"\n        @change=\"handleChange\"\n      >\n        <template v-slot:filters>\n          <advanced-search :tags=\"tags\" @click:tag=\"tagRemovalHandler\">\n            <div class=\"filters\">\n              <form-field-multi-select\n                v-model=\"categoryFilter\"\n                :options=\"categoryOptionList\"\n                name=\"categoryFilter\"\n                :searchable=\"true\"\n                :label=\"$t('blog:category')\"\n                class=\"filter\"\n              />\n\n              <form-field-multi-select\n                v-if=\"isLangSpecific\"\n                v-model=\"languageFilter\"\n                :options=\"languageOptionList\"\n                name=\"languageFilter\"\n                :searchable=\"true\"\n                :label=\"$t('blog:language')\"\n                class=\"filter\"\n              />\n\n              <div class=\"filter\">\n                <div class=\"date-label\">\n                  {{ $t('blog:dateOfPublication') }}\n                </div>\n\n                <div class=\"date-content\">\n                  <form-field\n                    v-model=\"fromDateFilter\"\n                    :label=\"$t('blog:From')\"\n                    name=\"fromDateFilter\"\n                    type=\"date\"\n                    :max=\"toDateFilter\"\n                  />\n\n                  <form-field\n                    v-model=\"toDateFilter\"\n                    :label=\"$t('blog:To')\"\n                    name=\"toDateFilter\"\n                    type=\"date\"\n                    :min=\"fromDateFilter\"\n                  />\n                </div>\n              </div>\n            </div>\n          </advanced-search>\n        </template>\n\n        <template v-slot:cell(actions)=\"{ row }\">\n          <base-button\n            variant=\"icon\"\n            :title=\"$t('blog:edit')\"\n            :disabled=\"isDeleting(row.id)\"\n            :href=\"getBlogPostFormUrl({ postId: row.id })\"\n          >\n            <svg-icon name=\"edit\"></svg-icon>\n          </base-button>\n          <base-button\n            variant=\"icon\"\n            :title=\"$t('blog:remove')\"\n            :disabled=\"isDeleting(row.id)\"\n            @click=\"handleResourceDelete(row.id)\"\n          >\n            <svg-icon name=\"delete\"></svg-icon>\n          </base-button>\n        </template>\n      </data-table>\n    </template>\n  </page>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, watch } from '@vue/composition-api';\nimport isEqual from 'lodash.isequal';\nimport pick from 'lodash.pick';\n\nimport { ColumnDefinition, useDataTable } from '@tager/admin-ui';\nimport { Nullable, useResourceDelete } from '@tager/admin-services';\n\nimport { Category, Language, PostShort } from '../../../typings/model';\nimport { deleteBlogPost, getBlogPostList } from '../../../services/requests';\nimport { getBlogPostFormUrl } from '../../../constants/paths';\nimport { useModuleConfig, useBlogCategoryList } from '../../../hooks';\n\nimport { convertPostList, getPostTableColumnDefs } from './PostList.helpers';\nimport { useAdvancedSearch } from './hooks';\n\nexport default defineComponent({\n  name: 'BlogPostList',\n  setup(props, context) {\n    const categoryId = computed<string>(() => {\n      return Array.isArray(context.root.$route.query.category)\n        ? context.root.$route.query.category[0] ?? ''\n        : context.root.$route.query.category;\n    });\n\n    /** Fetch module config */\n    const {\n      data: moduleConfig,\n      loading: isModuleConfigLoading,\n    } = useModuleConfig({ context });\n\n    const languageList = computed<Language[]>(\n      () => moduleConfig.value?.languages ?? []\n    );\n\n    /** Fetch category list */\n    const {\n      data: categoryList,\n      loading: isCategoryListLoading,\n    } = useBlogCategoryList({ context });\n\n    const selectedCategory = computed<Nullable<Category>>(() =>\n      categoryId.value\n        ? categoryList.value.find(\n            ({ id }) => String(id) === String(categoryId.value)\n          ) ?? null\n        : null\n    );\n\n    const pageTitle = computed<string>(() => {\n      return selectedCategory.value\n        ? `${context.root.$t('blog:postsByCategory')} \"${\n            selectedCategory.value.name\n          }\"`\n        : context.root.$t('blog:posts');\n    });\n\n    /** Advanced search **/\n\n    const {\n      categoryFilter,\n      categoryOptionList,\n      languageFilter,\n      languageOptionList,\n      fromDateFilter,\n      toDateFilter,\n      filterParams,\n      tags,\n      tagRemovalHandler,\n    } = useAdvancedSearch({\n      context,\n      categoryList,\n      languageList,\n    });\n\n    const isLangSpecific = computed<boolean>(\n      () => languageOptionList.value.length > 1\n    );\n\n    /** Fetch Post list */\n    const {\n      fetchEntityList: fetchPostList,\n      isLoading: isPostLoading,\n      rowData: postList,\n      errorMessage,\n      searchQuery,\n      handleChange,\n      pageNumber,\n      pageCount,\n      pageSize,\n    } = useDataTable<PostShort>({\n      fetchEntityList: (params) =>\n        getBlogPostList({\n          query: params.searchQuery,\n          pageNumber: params.pageNumber,\n          pageSize: params.pageSize,\n          ...filterParams.value,\n        }),\n      initialValue: [],\n      context,\n      resourceName: 'Blog post list',\n      pageSize: 100,\n    });\n\n    watch(filterParams, () => {\n      if (isModuleConfigLoading.value || isCategoryListLoading.value) {\n        return;\n      }\n\n      const newQuery = {\n        ...pick(context.root.$route.query, ['query', 'pageNumber']),\n        ...filterParams.value,\n      };\n\n      if (!isEqual(context.root.$route.query, newQuery)) {\n        context.root.$router.replace({ query: newQuery });\n        fetchPostList();\n      }\n    });\n\n    const displayedPostList = computed<PostShort[]>(() =>\n      convertPostList(\n        postList.value,\n        selectedCategory.value,\n        moduleConfig.value?.languages ?? []\n      )\n    );\n\n    const { handleResourceDelete, isDeleting } = useResourceDelete({\n      deleteResource: deleteBlogPost,\n      resourceName: 'Post',\n      onSuccess: fetchPostList,\n      context,\n    });\n\n    const isRowDataLoading = computed<boolean>(\n      () =>\n        isCategoryListLoading.value ||\n        isPostLoading.value ||\n        isModuleConfigLoading.value\n    );\n\n    const columnDefs = computed<ColumnDefinition<PostShort>[]>(() =>\n      getPostTableColumnDefs(moduleConfig.value, context.root.$t)\n    );\n\n    return {\n      columnDefs,\n      rowData: displayedPostList,\n      handleResourceDelete,\n      isDeleting,\n      categoryList,\n      isRowDataLoading,\n      errorMessage,\n      getBlogPostFormUrl,\n      pageTitle,\n      searchQuery,\n      handleChange,\n      pageNumber,\n      pageCount,\n      pageSize,\n\n      // Advanced search\n      categoryFilter,\n      categoryOptionList,\n      isLangSpecific,\n      languageFilter,\n      languageOptionList,\n      fromDateFilter,\n      toDateFilter,\n      tags,\n      tagRemovalHandler,\n    };\n  },\n});\n</script>\n\n<style scoped lang=\"scss\">\n.filters {\n  display: flex;\n  margin: 0 -10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n\n  .filter {\n    padding: 10px 10px 0;\n    width: 50%;\n    margin: 0;\n  }\n}\n\n.date-label {\n  margin-bottom: 0.5rem;\n}\n\n.date-content {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n</style>\n",".filters {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n\n.date-label {\n  margin-bottom: 0.5rem;\n}\n\n.date-content {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n\n/*# sourceMappingURL=PostList.vue.map */"]}, media: undefined });
+      inject("data-v-7a3e00a4_0", { source: ".filters[data-v-7a3e00a4] {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters[data-v-7a3e00a4]:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter[data-v-7a3e00a4] {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n.date-label[data-v-7a3e00a4] {\n  margin-bottom: 0.5rem;\n}\n.date-content[data-v-7a3e00a4] {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n\n/*# sourceMappingURL=PostList.vue.map */", map: {"version":3,"sources":["/home/runner/work/tager-admin-blog/tager-admin-blog/src/views/Posts/PostList/PostList.vue","PostList.vue"],"names":[],"mappings":"AAgVA;EACA,aAAA;EACA,eAAA;AC/UA;ADiVA;EACA,gBAAA;AC/UA;ADkVA;EACA,oBAAA;EACA,UAAA;EACA,SAAA;AChVA;ADoVA;EACA,qBAAA;ACjVA;ADoVA;EACA,aAAA;EACA,qCAAA;EACA,gBAAA;ACjVA;;AAEA,uCAAuC","file":"PostList.vue","sourcesContent":["<template>\n  <page\n    :title=\"pageTitle\"\n    :header-buttons=\"\n      [\n        canViewAdministrators\n          ? {\n              text: $t('blog:newPost'),\n              href: getBlogPostFormUrl({ postId: 'create' }),\n            }\n          : null,\n      ].filter(Boolean)\n    \"\n  >\n    <template v-slot:content>\n      <data-table\n        :column-defs=\"columnDefs\"\n        :row-data=\"rowData\"\n        :loading=\"isRowDataLoading\"\n        :error-message=\"errorMessage\"\n        :search-query=\"searchQuery\"\n        :pagination=\"{\n          pageNumber,\n          pageCount,\n          pageSize,\n          disabled: isRowDataLoading,\n        }\"\n        data-table=\"blog-post\"\n        @change=\"handleChange\"\n      >\n        <template v-slot:filters>\n          <advanced-search :tags=\"tags\" @click:tag=\"tagRemovalHandler\">\n            <div class=\"filters\">\n              <form-field-multi-select\n                v-model=\"categoryFilter\"\n                :options=\"categoryOptionList\"\n                name=\"categoryFilter\"\n                :searchable=\"true\"\n                :label=\"$t('blog:category')\"\n                class=\"filter\"\n              />\n\n              <form-field-multi-select\n                v-if=\"isLangSpecific\"\n                v-model=\"languageFilter\"\n                :options=\"languageOptionList\"\n                name=\"languageFilter\"\n                :searchable=\"true\"\n                :label=\"$t('blog:language')\"\n                class=\"filter\"\n              />\n\n              <div class=\"filter\">\n                <div class=\"date-label\">\n                  {{ $t('blog:dateOfPublication') }}\n                </div>\n\n                <div class=\"date-content\">\n                  <form-field\n                    v-model=\"fromDateFilter\"\n                    :label=\"$t('blog:From')\"\n                    name=\"fromDateFilter\"\n                    type=\"date\"\n                    :max=\"toDateFilter\"\n                  />\n\n                  <form-field\n                    v-model=\"toDateFilter\"\n                    :label=\"$t('blog:To')\"\n                    name=\"toDateFilter\"\n                    type=\"date\"\n                    :min=\"fromDateFilter\"\n                  />\n                </div>\n              </div>\n            </div>\n          </advanced-search>\n        </template>\n\n        <template v-slot:cell(actions)=\"{ row }\">\n          <base-button\n            v-if=\"canViewAdministrators\"\n            variant=\"icon\"\n            :title=\"$t('blog:edit')\"\n            :disabled=\"isBusy(row.id)\"\n            :href=\"getBlogPostFormUrl({ postId: row.id })\"\n          >\n            <svg-icon name=\"edit\" />\n          </base-button>\n\n          <base-button\n            variant=\"icon\"\n            :title=\"$t('blog:clone')\"\n            :disabled=\"isBusy(row.id)\"\n            @click=\"handleResourceClone(row.id)\"\n          >\n            <svg-icon name=\"contentCopy\" />\n          </base-button>\n\n          <base-button\n            v-if=\"canViewAdministrators\"\n            variant=\"icon\"\n            :title=\"$t('blog:remove')\"\n            :disabled=\"isBusy(row.id)\"\n            @click=\"handleResourceDelete(row.id)\"\n          >\n            <svg-icon name=\"delete\" />\n          </base-button>\n        </template>\n      </data-table>\n    </template>\n  </page>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, watch } from '@vue/composition-api';\nimport isEqual from 'lodash.isequal';\nimport pick from 'lodash.pick';\n\nimport {\n  ColumnDefinition,\n  useDataTable,\n  useTranslation,\n} from '@tager/admin-ui';\nimport {\n  Nullable,\n  useResourceClone,\n  useResourceDelete,\n} from '@tager/admin-services';\n\nimport { Category, Language, PostFull, PostShort } from '@/typings/model';\nimport {\n  clonePost,\n  deleteBlogPost,\n  getBlogPostList,\n} from '@/services/requests';\nimport { getBlogPostFormUrl } from '@/constants/paths';\nimport {\n  useModuleConfig,\n  useBlogCategoryList,\n  useUserPermission,\n} from '@/hooks';\nimport { Scope } from '@/constants/scopes';\n\nimport { convertPostList, getPostTableColumnDefs } from './PostList.helpers';\nimport { useAdvancedSearch } from './hooks';\n\nexport default defineComponent({\n  name: 'BlogPostList',\n  setup(props, context) {\n    const { t } = useTranslation(context);\n\n    const canViewAdministrators = useUserPermission(\n      context,\n      Scope.AdministratorsView\n    );\n\n    const categoryId = computed<string>(() => {\n      return Array.isArray(context.root.$route.query.category)\n        ? context.root.$route.query.category[0] ?? ''\n        : context.root.$route.query.category;\n    });\n\n    /** Fetch module config */\n    const {\n      data: moduleConfig,\n      loading: isModuleConfigLoading,\n    } = useModuleConfig({ context });\n\n    const languageList = computed<Language[]>(\n      () => moduleConfig.value?.languages ?? []\n    );\n\n    /** Fetch category list */\n    const {\n      data: categoryList,\n      loading: isCategoryListLoading,\n    } = useBlogCategoryList({ context });\n\n    const selectedCategory = computed<Nullable<Category>>(() =>\n      categoryId.value\n        ? categoryList.value.find(\n            ({ id }) => String(id) === String(categoryId.value)\n          ) ?? null\n        : null\n    );\n\n    const pageTitle = computed<string>(() => {\n      return selectedCategory.value\n        ? `${context.root.$t('blog:postsByCategory')} \"${\n            selectedCategory.value.name\n          }\"`\n        : context.root.$t('blog:posts');\n    });\n\n    /** Advanced search **/\n\n    const {\n      categoryFilter,\n      categoryOptionList,\n      languageFilter,\n      languageOptionList,\n      fromDateFilter,\n      toDateFilter,\n      filterParams,\n      tags,\n      tagRemovalHandler,\n    } = useAdvancedSearch({\n      context,\n      categoryList,\n      languageList,\n    });\n\n    const isLangSpecific = computed<boolean>(\n      () => languageOptionList.value.length > 1\n    );\n\n    /** Fetch Post list */\n    const {\n      fetchEntityList: fetchPostList,\n      isLoading: isPostLoading,\n      rowData: postList,\n      errorMessage,\n      searchQuery,\n      handleChange,\n      pageNumber,\n      pageCount,\n      pageSize,\n    } = useDataTable<PostShort>({\n      fetchEntityList: (params) =>\n        getBlogPostList({\n          query: params.searchQuery,\n          pageNumber: params.pageNumber,\n          pageSize: params.pageSize,\n          ...filterParams.value,\n        }),\n      initialValue: [],\n      context,\n      resourceName: 'Blog post list',\n      pageSize: 100,\n    });\n\n    watch(filterParams, () => {\n      if (isModuleConfigLoading.value || isCategoryListLoading.value) {\n        return;\n      }\n\n      const newQuery = {\n        ...pick(context.root.$route.query, ['query', 'pageNumber']),\n        ...filterParams.value,\n      };\n\n      if (!isEqual(context.root.$route.query, newQuery)) {\n        context.root.$router.replace({ query: newQuery });\n        fetchPostList();\n      }\n    });\n\n    const displayedPostList = computed<PostShort[]>(() =>\n      convertPostList(\n        postList.value,\n        selectedCategory.value,\n        moduleConfig.value?.languages ?? []\n      )\n    );\n\n    const isRowDataLoading = computed<boolean>(\n      () =>\n        isCategoryListLoading.value ||\n        isPostLoading.value ||\n        isModuleConfigLoading.value\n    );\n\n    const { isDeleting, handleResourceDelete } = useResourceDelete({\n      deleteResource: deleteBlogPost,\n      resourceName: 'Post',\n      onSuccess: fetchPostList,\n      context,\n    });\n\n    const { isCloning, handleResourceClone } = useResourceClone({\n      cloneResource: clonePost,\n      confirmMessage: t('blog:cloneConfirm'),\n      successMessage: t('blog:cloneSuccess'),\n      failureMessage: t('blog:cloneFailure'),\n      onSuccessRedirectTo: (data: PostFull) => `/posts/${data.id}`,\n      context,\n    });\n\n    function isBusy(postId: number): boolean {\n      return isDeleting(postId) || isCloning(postId) || isRowDataLoading.value;\n    }\n\n    const columnDefs = computed<ColumnDefinition<PostShort>[]>(() =>\n      getPostTableColumnDefs(moduleConfig.value, context.root.$t)\n    );\n\n    return {\n      columnDefs,\n      rowData: displayedPostList,\n      handleResourceDelete,\n      isDeleting,\n      categoryList,\n      isRowDataLoading,\n      errorMessage,\n      getBlogPostFormUrl,\n      pageTitle,\n      searchQuery,\n      handleChange,\n      pageNumber,\n      pageCount,\n      pageSize,\n\n      // Advanced search\n      categoryFilter,\n      categoryOptionList,\n      isLangSpecific,\n      languageFilter,\n      languageOptionList,\n      fromDateFilter,\n      toDateFilter,\n      tags,\n      tagRemovalHandler,\n\n      // Permissions\n      canViewAdministrators,\n\n      // Clone\n      handleResourceClone,\n      isBusy,\n    };\n  },\n});\n</script>\n\n<style scoped lang=\"scss\">\n.filters {\n  display: flex;\n  margin: 0 -10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n\n  .filter {\n    padding: 10px 10px 0;\n    width: 50%;\n    margin: 0;\n  }\n}\n\n.date-label {\n  margin-bottom: 0.5rem;\n}\n\n.date-content {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n</style>\n",".filters {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n\n.date-label {\n  margin-bottom: 0.5rem;\n}\n\n.date-content {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n\n/*# sourceMappingURL=PostList.vue.map */"]}, media: undefined });
 
     };
     /* scoped */
-    const __vue_scope_id__ = "data-v-4aed84bf";
+    const __vue_scope_id__ = "data-v-7a3e00a4";
     /* module identifier */
     const __vue_module_identifier__ = undefined;
     /* functional template */
@@ -3274,7 +3458,6 @@
     );
 
   function convertPostToFormValues(post, languageOptionList, postOptionList, additionalFieldList) {
-      var _a, _b;
       if (!post) {
           return {
               title: '',
@@ -3309,8 +3492,8 @@
           imageMobile: post.imageMobile
               ? { id: adminServices.createId(), file: post.imageMobile }
               : null,
-          pageTitle: (_a = post.pageTitle) !== null && _a !== void 0 ? _a : '',
-          pageDescription: (_b = post.pageDescription) !== null && _b !== void 0 ? _b : '',
+          pageTitle: post.pageTitle ?? '',
+          pageDescription: post.pageDescription ?? '',
           openGraphImage: post.openGraphImage
               ? { id: adminServices.createId(), file: post.openGraphImage }
               : null,
@@ -3319,32 +3502,31 @@
               value: category.id,
               label: category.name,
           })),
-          language: currentLangOption !== null && currentLangOption !== void 0 ? currentLangOption : null,
+          language: currentLangOption ?? null,
           relatedPosts: selectedPostOptionList,
           tags: post.tags.join(','),
           additionalFields: additionalFieldList.map((fieldConfig, index) => {
               const postAdditionalField = post.additionalFields.find((item) => item.name === fieldConfig.name);
-              return adminDynamicField.universalFieldUtils.createFormField(fieldConfig, postAdditionalField === null || postAdditionalField === void 0 ? void 0 : postAdditionalField.value);
+              return adminDynamicField.universalFieldUtils.createFormField(fieldConfig, postAdditionalField?.value);
           }),
       };
   }
   function convertFormValuesToCreationPayload(values) {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
       return {
           title: values.title,
           excerpt: values.excerpt,
           urlAlias: values.urlAlias,
           body: values.body,
           date: values.date,
-          coverImage: (_b = (_a = values.coverImage) === null || _a === void 0 ? void 0 : _a.file.id) !== null && _b !== void 0 ? _b : null,
-          image: (_d = (_c = values.image) === null || _c === void 0 ? void 0 : _c.file.id) !== null && _d !== void 0 ? _d : null,
-          imageMobile: (_f = (_e = values.imageMobile) === null || _e === void 0 ? void 0 : _e.file.id) !== null && _f !== void 0 ? _f : null,
+          coverImage: values.coverImage?.file.id ?? null,
+          image: values.image?.file.id ?? null,
+          imageMobile: values.imageMobile?.file.id ?? null,
           pageTitle: values.pageTitle,
           pageDescription: values.pageDescription,
-          openGraphImage: (_h = (_g = values.openGraphImage) === null || _g === void 0 ? void 0 : _g.file.id) !== null && _h !== void 0 ? _h : null,
+          openGraphImage: values.openGraphImage?.file.id ?? null,
           status: 'PUBLISHED',
           categories: values.categories.map((option) => option.value),
-          language: (_k = (_j = values.language) === null || _j === void 0 ? void 0 : _j.value) !== null && _k !== void 0 ? _k : null,
+          language: values.language?.value ?? null,
           relatedPosts: values.relatedPosts.map((relatedPostOption) => relatedPostOption.value),
           tags: values.tags.split(',').filter((tag) => tag.trim().length > 0),
           additionalFields: values.additionalFields.map((field) => ({
@@ -3354,7 +3536,10 @@
       };
   }
   function convertFormValuesToUpdatePayload(values) {
-      return Object.assign(Object.assign({}, convertFormValuesToCreationPayload(values)), { urlAlias: values.urlAlias });
+      return {
+          ...convertFormValuesToCreationPayload(values),
+          urlAlias: values.urlAlias,
+      };
   }
   function convertCategoryListToOptions(categoryList, languageId) {
       return categoryList
@@ -3366,13 +3551,12 @@
       name: 'BlogPostForm',
       components: { DynamicField: adminDynamicField.DynamicField, ShortCodeConstructor: adminUi.ShortCodeConstructor, FormFooter: adminUi.FormFooter },
       setup(props, context) {
-          var _a, _b;
           const postId = compositionApi.computed(() => context.root.$route.params.postId);
           const isCreation = compositionApi.computed(() => postId.value === 'create');
           const urlAliasChanged = compositionApi.ref(false);
           /** Fetch module config */
           const { data: moduleConfig, loading: isModuleConfigLoading, } = useModuleConfig({ context });
-          const languageList = compositionApi.computed(() => { var _a, _b; return (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : []; });
+          const languageList = compositionApi.computed(() => moduleConfig.value?.languages ?? []);
           const languageOptionList = compositionApi.computed(() => languageList.value.map(({ id, name }) => ({
               value: id,
               label: name,
@@ -3402,18 +3586,17 @@
               context,
           });
           const postOptionList = compositionApi.computed(() => postList.value
-              .filter((relatedPost) => { var _a; return relatedPost.id !== ((_a = post.value) === null || _a === void 0 ? void 0 : _a.id); })
+              .filter((relatedPost) => relatedPost.id !== post.value?.id)
               .map((post) => ({
               value: post.id,
               label: post.title,
           })));
           /** Form State */
-          const values = compositionApi.ref(convertPostToFormValues(post.value, languageOptionList.value, postOptionList.value, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : []));
+          const values = compositionApi.ref(convertPostToFormValues(post.value, languageOptionList.value, postOptionList.value, moduleConfig.value?.fields ?? []));
           const errors = compositionApi.ref({});
           const isSubmitting = compositionApi.ref(false);
           compositionApi.watch([post, languageOptionList, postOptionList, moduleConfig], () => {
-              var _a, _b;
-              values.value = convertPostToFormValues(post.value, languageOptionList.value, postOptionList.value, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : []);
+              values.value = convertPostToFormValues(post.value, languageOptionList.value, postOptionList.value, moduleConfig.value?.fields ?? []);
           });
           function submitForm(event) {
               isSubmitting.value = true;
@@ -3424,7 +3607,6 @@
                   : updateBlogPost(postId.value, updateBody);
               requestPromise
                   .then(({ data }) => {
-                  var _a, _b;
                   errors.value = {};
                   if (event.type === 'create') {
                       context.root.$router.push(getBlogPostFormUrl({ postId: String(data.id) }));
@@ -3438,7 +3620,7 @@
                       }
                   }
                   if (event.type === 'create_create-another') {
-                      values.value = convertPostToFormValues(null, languageOptionList.value, postOptionList.value, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : []);
+                      values.value = convertPostToFormValues(null, languageOptionList.value, postOptionList.value, moduleConfig.value?.fields ?? []);
                   }
                   context.root.$toast({
                       variant: 'success',
@@ -3464,17 +3646,13 @@
               });
           }
           /** Category Options */
-          const categoryOptionList = compositionApi.computed(() => {
-              var _a, _b;
-              return convertCategoryListToOptions(categoryList.value, (_b = (_a = values.value.language) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : null);
-          });
+          const categoryOptionList = compositionApi.computed(() => convertCategoryListToOptions(categoryList.value, values.value.language?.value ?? null));
           compositionApi.watch([categoryOptionList, moduleConfig], () => {
-              var _a;
               function isOptionExist(selectedCategoryOption) {
                   return categoryOptionList.value.some((option) => option.value === selectedCategoryOption.value);
               }
               if (isCreation.value) {
-                  if ((_a = moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.value) === null || _a === void 0 ? void 0 : _a.defaultCategories) {
+                  if (moduleConfig?.value?.defaultCategories) {
                       const defaultIds = moduleConfig.value.defaultCategories.map((item) => item.id);
                       values.value.categories = categoryOptionList.value.filter((item) => {
                           return defaultIds.indexOf(item.value) !== -1;
@@ -3489,13 +3667,11 @@
               isPostListLoading.value ||
               isModuleConfigLoading.value);
           function getUploadAdapterOptions() {
-              var _a;
-              return { uploadScenario: (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fileScenarios.content };
+              return { uploadScenario: moduleConfig.value?.fileScenarios.content };
           }
           const blogPagePath = compositionApi.computed(() => {
-              var _a, _b;
               const origin = process.env.VUE_APP_WEBSITE_URL || window.location.origin;
-              return origin + ((_b = (_a = post.value) === null || _a === void 0 ? void 0 : _a.urlTemplate) !== null && _b !== void 0 ? _b : '');
+              return origin + (post.value?.urlTemplate ?? '');
           });
           const tabList = compositionApi.computed(() => {
               const hasErrors = adminUi.createTabErrorFinder(errors.value);
@@ -3970,7 +4146,10 @@
       return categoryList.map((category) => {
           if (languages.length > 0) {
               const foundLanguage = languages.find(({ id }) => category.language === id);
-              return Object.assign(Object.assign({}, category), { language: foundLanguage ? foundLanguage.name : category.language });
+              return {
+                  ...category,
+                  language: foundLanguage ? foundLanguage.name : category.language,
+              };
           }
           return category;
       });
@@ -3981,40 +4160,44 @@
           : false;
       const COLUMN_DEFS = [
           {
-              id: 2,
+              id: 1,
               name: t('blog:name'),
               field: 'name',
               type: 'name',
-              format: ({ row }) => {
-                  return {
-                      adminLink: {
-                          url: getBlogCategoryFormUrl({ categoryId: row.id }),
-                          text: row.name,
-                      },
-                      websiteLink: {
-                          url: [
-                              process.env.VUE_APP_WEBSITE_URL || window.location.origin,
-                              row.url,
-                          ].join(''),
-                          text: row.url,
-                      },
-                      paramList: row.isDefault
-                          ? [{ name: t('blog:defaultCategory'), value: t('blog:yes') }]
-                          : [],
-                  };
+              format: ({ row }) => ({
+                  adminLink: {
+                      url: getBlogCategoryFormUrl({ categoryId: row.id }),
+                      text: getNameWithDepth(row.name, row.depth),
+                  },
+                  paramList: row.isDefault
+                      ? [{ name: t('blog:defaultCategory'), value: t('blog:yes') }]
+                      : [],
+              }),
+          },
+          {
+              id: 2,
+              name: t('pages:path'),
+              field: 'path',
+              type: 'link',
+              format: ({ row }) => ({
+                  url: `${adminServices.getWebsiteOrigin()}${row.url}`,
+                  text: row.url,
+              }),
+              options: {
+                  shouldOpenNewTab: true,
               },
           },
           isLangSpecific
-              ? { id: 4, name: t('blog:language'), field: 'language' }
+              ? { id: 3, name: t('blog:language'), field: 'language' }
               : null,
           {
-              id: 3,
+              id: 4,
               name: t('blog:posts'),
               field: 'linkToPosts',
               style: { whiteSpace: 'nowrap', width: '130px' },
           },
           {
-              id: 4,
+              id: 5,
               name: t('blog:actions'),
               field: 'actions',
               style: { whiteSpace: 'nowrap', width: '205px' },
@@ -4074,32 +4257,40 @@
   var script$2 = compositionApi.defineComponent({
       name: 'BlogCategoryList',
       setup(props, context) {
+          const canViewAdministrators = useUserPermission(context, Scope.AdministratorsView);
           /** Fetch module config */
           const { data: moduleConfig, loading: isModuleConfigLoading, } = useModuleConfig({ context });
-          const languageList = compositionApi.computed(() => { var _a, _b; return (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : []; });
+          const languageList = compositionApi.computed(() => moduleConfig.value?.languages ?? []);
           /** Advanced search **/
           const { languageFilter, languageOptionList, filterParams, tags, tagRemovalHandler, } = useAdvancedSearch$1({ context, languageList });
           const isLangSpecific = compositionApi.computed(() => languageOptionList.value.length > 1);
           /** Fetch category list */
           const { fetchEntityList: fetchCategoryList, isLoading: isCategoryListLoading, rowData: categoryList, errorMessage, searchQuery, handleChange, pageNumber, pageCount, pageSize, } = adminUi.useDataTable({
-              fetchEntityList: (params) => getBlogCategoryList(Object.assign({ query: params.searchQuery, pageNumber: params.pageNumber, pageSize: params.pageSize }, filterParams.value)),
+              fetchEntityList: (params) => getBlogCategoryList({
+                  query: params.searchQuery,
+                  pageNumber: params.pageNumber,
+                  pageSize: params.pageSize,
+                  ...filterParams.value,
+              }),
               initialValue: [],
               context,
               resourceName: 'Blog category list',
               pageSize: 100,
           });
           compositionApi.watch(filterParams, () => {
-              var _a;
               if (isModuleConfigLoading.value || isCategoryListLoading.value) {
                   return;
               }
-              const newQuery = Object.assign(Object.assign({}, filterParams.value), { query: ((_a = context.root.$route.query.query) !== null && _a !== void 0 ? _a : '') });
+              const newQuery = {
+                  ...filterParams.value,
+                  query: (context.root.$route.query.query ?? ''),
+              };
               if (!lodash_isequal(context.root.$route.query, newQuery)) {
                   context.root.$router.replace({ query: newQuery });
                   fetchCategoryList();
               }
           });
-          const { handleResourceDelete: handleCategoryDelete, isDeleting, } = adminServices.useResourceDelete({
+          const { isDeleting, handleResourceDelete: handleCategoryDelete, } = adminServices.useResourceDelete({
               deleteResource: deleteBlogCategory,
               resourceName: 'Post',
               onSuccess: fetchCategoryList,
@@ -4144,6 +4335,8 @@
               languageOptionList,
               tags,
               tagRemovalHandler,
+              // Permissions
+              canViewAdministrators,
           };
       },
   });
@@ -4160,11 +4353,13 @@
       attrs: {
         title: _vm.$t("blog:blogCategories"),
         "header-buttons": [
-          {
-            text: _vm.$t("blog:newCategory"),
-            href: _vm.getBlogCategoryFormUrl({ categoryId: "create" }),
-          },
-        ],
+          _vm.canViewAdministrators
+            ? {
+                text: _vm.$t("blog:newCategory"),
+                href: _vm.getBlogCategoryFormUrl({ categoryId: "create" }),
+              }
+            : null,
+        ].filter(Boolean),
       },
       scopedSlots: _vm._u([
         {
@@ -4262,21 +4457,23 @@
                         var row = ref.row;
                         var rowIndex = ref.rowIndex;
                         return [
-                          _c(
-                            "base-button",
-                            {
-                              attrs: {
-                                variant: "icon",
-                                title: _vm.$t("blog:edit"),
-                                disabled: _vm.isDeleting(row.id),
-                                href: _vm.getBlogCategoryFormUrl({
-                                  categoryId: row.id,
-                                }),
-                              },
-                            },
-                            [_c("svg-icon", { attrs: { name: "edit" } })],
-                            1
-                          ),
+                          _vm.canViewAdministrators
+                            ? _c(
+                                "base-button",
+                                {
+                                  attrs: {
+                                    variant: "icon",
+                                    title: _vm.$t("blog:edit"),
+                                    disabled: _vm.isDeleting(row.id),
+                                    href: _vm.getBlogCategoryFormUrl({
+                                      categoryId: row.id,
+                                    }),
+                                  },
+                                },
+                                [_c("svg-icon", { attrs: { name: "edit" } })],
+                                1
+                              )
+                            : _vm._e(),
                           _vm._v(" "),
                           _c(
                             "base-button",
@@ -4316,24 +4513,27 @@
                             1
                           ),
                           _vm._v(" "),
-                          _c(
-                            "base-button",
-                            {
-                              attrs: {
-                                variant: "icon",
-                                title: _vm.$t("blog:remove"),
-                                disabled:
-                                  _vm.isDeleting(row.id) || row.postsCount > 0,
-                              },
-                              on: {
-                                click: function ($event) {
-                                  return _vm.handleCategoryDelete(row.id)
+                          _vm.canViewAdministrators
+                            ? _c(
+                                "base-button",
+                                {
+                                  attrs: {
+                                    variant: "icon",
+                                    title: _vm.$t("blog:remove"),
+                                    disabled:
+                                      _vm.isDeleting(row.id) ||
+                                      row.postsCount > 0,
+                                  },
+                                  on: {
+                                    click: function ($event) {
+                                      return _vm.handleCategoryDelete(row.id)
+                                    },
+                                  },
                                 },
-                              },
-                            },
-                            [_c("svg-icon", { attrs: { name: "delete" } })],
-                            1
-                          ),
+                                [_c("svg-icon", { attrs: { name: "delete" } })],
+                                1
+                              )
+                            : _vm._e(),
                         ]
                       },
                     },
@@ -4382,57 +4582,66 @@
     );
 
   function convertCategoryToFormValues(category, languageOptionList) {
-      var _a, _b;
-      const currentLangOption = languageOptionList.find(({ value }) => value === (category === null || category === void 0 ? void 0 : category.language));
+      const currentLangOption = languageOptionList.find(({ value }) => value === category?.language);
       if (!category) {
           return {
               name: '',
               isDefault: false,
               pageTitle: '',
               pageDescription: '',
+              openGraphTitle: '',
+              openGraphDescription: '',
+              pageKeywords: '',
               openGraphImage: null,
               urlAlias: '',
-              language: currentLangOption !== null && currentLangOption !== void 0 ? currentLangOption : null,
+              language: currentLangOption ?? null,
           };
       }
       return {
           name: category.name,
           isDefault: category.isDefault,
-          pageTitle: (_a = category.pageTitle) !== null && _a !== void 0 ? _a : '',
-          pageDescription: (_b = category.pageDescription) !== null && _b !== void 0 ? _b : '',
+          pageTitle: category.pageTitle ?? '',
+          pageDescription: category.pageDescription ?? '',
+          pageKeywords: category.pageKeywords ?? '',
+          openGraphTitle: category.openGraphTitle ?? '',
+          openGraphDescription: category.openGraphDescription ?? '',
           openGraphImage: category.openGraphImage
               ? { id: adminServices.createId(), file: category.openGraphImage }
               : null,
           urlAlias: category.urlAlias,
-          language: currentLangOption !== null && currentLangOption !== void 0 ? currentLangOption : null,
+          language: currentLangOption ?? null,
       };
   }
   function convertCategoryFormValuesToCreationPayload(values) {
-      var _a, _b, _c, _d;
       return {
           name: values.name,
           isDefault: values.isDefault,
           pageTitle: values.pageTitle,
           pageDescription: values.pageDescription,
-          openGraphImage: (_b = (_a = values.openGraphImage) === null || _a === void 0 ? void 0 : _a.file.id) !== null && _b !== void 0 ? _b : null,
-          language: (_d = (_c = values.language) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : null,
+          openGraphImage: values.openGraphImage?.file.id ?? null,
+          language: values.language?.value ?? null,
       };
   }
   function convertCategoryFormValuesToUpdatePayload(values) {
-      return Object.assign(Object.assign({}, convertCategoryFormValuesToCreationPayload(values)), { urlAlias: values.urlAlias });
+      return {
+          ...convertCategoryFormValuesToCreationPayload(values),
+          urlAlias: values.urlAlias,
+      };
   }
 
   var script$3 = compositionApi.defineComponent({
       name: 'BlogCategoryForm',
       components: { FormFooter: adminUi.FormFooter },
       setup(props, context) {
+          const { t } = adminUi.useTranslation(context);
           const categoryId = compositionApi.computed(() => context.root.$route.params.categoryId);
           const isCreation = compositionApi.computed(() => categoryId.value === 'create');
           /** Fetch module config */
           const { data: moduleConfig, loading: isModuleConfigLoading, } = useModuleConfig({ context });
-          const languageList = compositionApi.computed(() => { var _a, _b; return (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : []; });
+          const languageList = compositionApi.computed(() => moduleConfig.value?.languages ?? []);
           const languageOptionList = compositionApi.computed(() => languageList.value.map(({ id, name }) => ({ value: id, label: name })));
           const isLangSpecific = compositionApi.computed(() => languageOptionList.value.length > 0);
+          const imageScenario = compositionApi.computed(() => moduleConfig.value?.fileScenarios?.openGraph ?? null);
           /** Fetch Category */
           const [fetchCategory, { data: category, loading: isCategoryLoading },] = adminServices.useResource({
               fetchResource: () => getBlogCategory(categoryId.value),
@@ -4441,13 +4650,15 @@
               resourceName: 'Category',
           });
           compositionApi.onMounted(() => {
-              if (isCreation.value)
+              if (isCreation.value) {
                   return;
+              }
               fetchCategory();
           });
           compositionApi.watch(categoryId, () => {
-              if (isCreation.value)
+              if (isCreation.value) {
                   return;
+              }
               fetchCategory();
           });
           /** Form State */
@@ -4458,12 +4669,13 @@
               values.value = convertCategoryToFormValues(category.value, languageOptionList.value);
           });
           function submitForm(event) {
-              var _a, _b;
               isSubmitting.value = true;
               const creationBody = convertCategoryFormValuesToCreationPayload(values.value);
               const updateBody = convertCategoryFormValuesToUpdatePayload(values.value);
               if (!isCreation.value) {
-                  updateBody.language = ((_a = category.value) === null || _a === void 0 ? void 0 : _a.language) ? (_b = category.value) === null || _b === void 0 ? void 0 : _b.language : null;
+                  updateBody.language = category.value?.language
+                      ? category.value?.language
+                      : null;
               }
               const requestPromise = isCreation.value
                   ? createBlogCategory(creationBody)
@@ -4506,10 +4718,21 @@
           /** Misc */
           const isContentLoading = compositionApi.computed(() => isCategoryLoading.value || isModuleConfigLoading.value);
           const categoryPagePath = compositionApi.computed(() => {
-              var _a, _b;
-              const origin = process.env.VUE_APP_WEBSITE_URL || window.location.origin;
-              return origin + ((_b = (_a = category.value) === null || _a === void 0 ? void 0 : _a.urlTemplate) !== null && _b !== void 0 ? _b : '');
+              return `${adminServices.getWebsiteOrigin()}${category.value?.urlTemplate ?? ''}`;
           });
+          // SEO
+          function handleSeoFieldGroupChange({ title, description, keywords, image, }) {
+              values.value.pageTitle = title;
+              values.value.pageDescription = description;
+              values.value.pageKeywords = keywords;
+              values.value.openGraphImage = image;
+          }
+          /** Tabs */
+          const tabList = compositionApi.computed(() => [
+              { id: 'common', label: t('blog:tabs.common') },
+              { id: 'seo', label: t('blog:tabs.seo') },
+          ]);
+          const selectedTabId = compositionApi.ref(tabList.value[0].id);
           return {
               isCreation,
               isContentLoading: isContentLoading,
@@ -4522,6 +4745,12 @@
               submitForm,
               isSubmitting,
               moduleConfig,
+              // SEO
+              imageScenario,
+              handleSeoFieldGroupChange,
+              // Tabs
+              tabList,
+              selectedTabId,
           };
       },
   });
@@ -4558,123 +4787,162 @@
                   },
                 },
                 [
-                  _vm.isCreation && _vm.isLangSpecific
-                    ? _c("form-field-select", {
-                        attrs: {
-                          name: "language",
-                          label: _vm.$t("blog:language"),
-                          options: _vm.languageOptionList,
-                          error: _vm.errors.language,
-                        },
-                        model: {
-                          value: _vm.values.language,
-                          callback: function ($$v) {
-                            _vm.$set(_vm.values, "language", $$v);
+                  _vm.isCreation
+                    ? [
+                        _vm.isLangSpecific
+                          ? _c("form-field-select", {
+                              attrs: {
+                                name: "language",
+                                label: _vm.$t("blog:language"),
+                                options: _vm.languageOptionList,
+                                error: _vm.errors.language,
+                              },
+                              model: {
+                                value: _vm.values.language,
+                                callback: function ($$v) {
+                                  _vm.$set(_vm.values, "language", $$v);
+                                },
+                                expression: "values.language",
+                              },
+                            })
+                          : _vm._e(),
+                        _vm._v(" "),
+                        _c("form-field", {
+                          attrs: {
+                            name: "name",
+                            label: _vm.$t("blog:name"),
+                            error: _vm.errors.name,
                           },
-                          expression: "values.language",
-                        },
-                      })
-                    : _vm._e(),
-                  _vm._v(" "),
-                  _c("form-field", {
-                    attrs: {
-                      name: "name",
-                      label: _vm.$t("blog:name"),
-                      error: _vm.errors.name,
-                    },
-                    model: {
-                      value: _vm.values.name,
-                      callback: function ($$v) {
-                        _vm.$set(_vm.values, "name", $$v);
-                      },
-                      expression: "values.name",
-                    },
-                  }),
-                  _vm._v(" "),
-                  _c("form-field-checkbox", {
-                    attrs: {
-                      name: "isDefault",
-                      label: _vm.$t("blog:defaultCategory"),
-                      error: _vm.errors.isDefault,
-                    },
-                    model: {
-                      value: _vm.values.isDefault,
-                      callback: function ($$v) {
-                        _vm.$set(_vm.values, "isDefault", $$v);
-                      },
-                      expression: "values.isDefault",
-                    },
-                  }),
-                  _vm._v(" "),
-                  !_vm.isCreation
-                    ? _c("form-field-url-alias-input", {
-                        attrs: {
-                          id: "urlAlias",
-                          name: "urlAlias",
-                          label: _vm.$t("blog:URLAlias"),
-                          "url-template": _vm.pagePath,
-                          error: _vm.errors.urlAlias,
-                        },
-                        model: {
-                          value: _vm.values.urlAlias,
-                          callback: function ($$v) {
-                            _vm.$set(_vm.values, "urlAlias", $$v);
+                          model: {
+                            value: _vm.values.name,
+                            callback: function ($$v) {
+                              _vm.$set(_vm.values, "name", $$v);
+                            },
+                            expression: "values.name",
                           },
-                          expression: "values.urlAlias",
-                        },
-                      })
-                    : _vm._e(),
-                  _vm._v(" "),
-                  _c("form-field", {
-                    attrs: {
-                      name: "pageTitle",
-                      label: _vm.$t("blog:pageTitle"),
-                      error: _vm.errors.pageTitle,
-                    },
-                    model: {
-                      value: _vm.values.pageTitle,
-                      callback: function ($$v) {
-                        _vm.$set(_vm.values, "pageTitle", $$v);
-                      },
-                      expression: "values.pageTitle",
-                    },
-                  }),
-                  _vm._v(" "),
-                  _c("form-field", {
-                    attrs: {
-                      name: "pageDescription",
-                      label: _vm.$t("blog:pageDescription"),
-                      type: "textarea",
-                      error: _vm.errors.pageDescription,
-                    },
-                    model: {
-                      value: _vm.values.pageDescription,
-                      callback: function ($$v) {
-                        _vm.$set(_vm.values, "pageDescription", $$v);
-                      },
-                      expression: "values.pageDescription",
-                    },
-                  }),
-                  _vm._v(" "),
-                  _c("form-field-file-input", {
-                    attrs: {
-                      label: _vm.$t("blog:openGraphImage"),
-                      name: "openGraphImage",
-                      "file-type": "image",
-                      "image-scenario": _vm.moduleConfig
-                        ? _vm.moduleConfig.fileScenarios.openGraph
-                        : null,
-                    },
-                    model: {
-                      value: _vm.values.openGraphImage,
-                      callback: function ($$v) {
-                        _vm.$set(_vm.values, "openGraphImage", $$v);
-                      },
-                      expression: "values.openGraphImage",
-                    },
-                  }),
+                        }),
+                        _vm._v(" "),
+                        _c("form-field-checkbox", {
+                          attrs: {
+                            name: "isDefault",
+                            label: _vm.$t("blog:defaultCategory"),
+                            error: _vm.errors.isDefault,
+                          },
+                          model: {
+                            value: _vm.values.isDefault,
+                            callback: function ($$v) {
+                              _vm.$set(_vm.values, "isDefault", $$v);
+                            },
+                            expression: "values.isDefault",
+                          },
+                        }),
+                        _vm._v(" "),
+                        _c("form-field-url-alias-input", {
+                          attrs: {
+                            id: "urlAlias",
+                            name: "urlAlias",
+                            label: _vm.$t("blog:URLAlias"),
+                            "url-template": _vm.pagePath,
+                            error: _vm.errors.urlAlias,
+                          },
+                          model: {
+                            value: _vm.values.urlAlias,
+                            callback: function ($$v) {
+                              _vm.$set(_vm.values, "urlAlias", $$v);
+                            },
+                            expression: "values.urlAlias",
+                          },
+                        }),
+                      ]
+                    : [
+                        _c("tab-list", {
+                          attrs: {
+                            "tab-list": _vm.tabList,
+                            "selected-tab-id": _vm.selectedTabId,
+                          },
+                          on: {
+                            "tab:update": function ($event) {
+                              _vm.selectedTabId = $event.tabId;
+                            },
+                          },
+                        }),
+                        _vm._v(" "),
+                        _vm.selectedTabId === "common"
+                          ? [
+                              _c("form-field", {
+                                attrs: {
+                                  name: "name",
+                                  label: _vm.$t("blog:name"),
+                                  error: _vm.errors.name,
+                                },
+                                model: {
+                                  value: _vm.values.name,
+                                  callback: function ($$v) {
+                                    _vm.$set(_vm.values, "name", $$v);
+                                  },
+                                  expression: "values.name",
+                                },
+                              }),
+                              _vm._v(" "),
+                              _c("form-field-checkbox", {
+                                attrs: {
+                                  name: "isDefault",
+                                  label: _vm.$t("blog:defaultCategory"),
+                                  error: _vm.errors.isDefault,
+                                },
+                                model: {
+                                  value: _vm.values.isDefault,
+                                  callback: function ($$v) {
+                                    _vm.$set(_vm.values, "isDefault", $$v);
+                                  },
+                                  expression: "values.isDefault",
+                                },
+                              }),
+                              _vm._v(" "),
+                              _c("form-field-url-alias-input", {
+                                attrs: {
+                                  id: "urlAlias",
+                                  name: "urlAlias",
+                                  label: _vm.$t("blog:URLAlias"),
+                                  "url-template": _vm.pagePath,
+                                  error: _vm.errors.urlAlias,
+                                },
+                                model: {
+                                  value: _vm.values.urlAlias,
+                                  callback: function ($$v) {
+                                    _vm.$set(_vm.values, "urlAlias", $$v);
+                                  },
+                                  expression: "values.urlAlias",
+                                },
+                              }),
+                            ]
+                          : _vm._e(),
+                        _vm._v(" "),
+                        _vm.selectedTabId === "seo"
+                          ? [
+                              _c("seo-field-group", {
+                                attrs: {
+                                  title: _vm.values.pageTitle,
+                                  "title-error-message": _vm.errors.pageTitle,
+                                  description: _vm.values.pageDescription,
+                                  "description-error-message":
+                                    _vm.errors.pageDescription,
+                                  "should-display-keywords": false,
+                                  keywords: _vm.values.pageKeywords,
+                                  "keywords-error-message":
+                                    _vm.errors.pageKeywords,
+                                  image: _vm.values.openGraphImage,
+                                  "image-scenario": _vm.imageScenario,
+                                  "image-error-message":
+                                    _vm.errors.openGraphImage,
+                                },
+                                on: { change: _vm.handleSeoFieldGroupChange },
+                              }),
+                            ]
+                          : _vm._e(),
+                      ],
                 ],
-                1
+                2
               ),
             ]
           },
@@ -4807,6 +5075,7 @@
   exports.BLOG_POST_FORM_ROUTE = BLOG_POST_FORM_ROUTE;
   exports.BLOG_POST_LIST_ROUTE = BLOG_POST_LIST_ROUTE;
   exports.BLOG_ROUTE_PATHS = BLOG_ROUTE_PATHS;
+  exports.clonePost = clonePost;
   exports.createBlogCategory = createBlogCategory;
   exports.createBlogPost = createBlogPost;
   exports.deleteBlogCategory = deleteBlogCategory;
@@ -4822,6 +5091,7 @@
   exports.getBlogPostFormUrl = getBlogPostFormUrl;
   exports.getBlogPostList = getBlogPostList;
   exports.getBlogPostListUrl = getBlogPostListUrl;
+  exports.getUserProfile = getUserProfile;
   exports.moveBlogCategory = moveBlogCategory;
   exports.updateBlogCategory = updateBlogCategory;
   exports.updateBlogPost = updateBlogPost;