@tager/admin-blog 0.3.38 → 0.3.42

package/dist/index.umd.js

@@ -37,7 +37,6 @@
       actions: 'Actions',
       updatePost: 'Update post',
       title: 'Title',
-      status: 'Status',
       link: 'Link',
       excerpt: 'Excerpt',
       body: 'Body',
@@ -79,9 +78,16 @@
       },
       parentCategory: 'Parent category',
       noParent: 'No parent',
+      status: 'Status',
       statusPublished: 'Published',
       statusDraft: 'Draft',
-      statusArchived: 'Archived'
+      statusArchived: 'Archived',
+      scheduleArchive: 'Schedule archive',
+      schedulePublish: 'Schedule publish',
+      archiveAt: 'Archive at',
+      publishAt: 'Publish at',
+      archiveAtLabel: 'Archive at',
+      publishAtLabel: 'Publish at',
   };
 
   const RU = {
@@ -118,7 +124,6 @@
       updatePost: 'Обновить пост',
       title: 'Заголовок',
       link: 'Ссылка',
-      status: 'Статус',
       excerpt: 'Краткое описание',
       defaultCategory: 'Категория по-умолчанию',
       body: 'Содержание',
@@ -159,9 +164,16 @@
       },
       parentCategory: 'Родительская категория',
       noParent: 'Нет родительской',
+      status: 'Статус',
       statusPublished: 'Опубликован',
       statusDraft: 'Черновик',
-      statusArchived: 'Снят с публикации'
+      statusArchived: 'В архиве',
+      scheduleArchive: 'Запланировать перенос в архив',
+      schedulePublish: 'Запланировать публикацию',
+      archiveAt: 'Перенести в архив в',
+      publishAt: 'Опубликовать в',
+      archiveAtLabel: 'Перенос в архив',
+      publishAtLabel: 'Публикация',
   };
 
   var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -2671,6 +2683,123 @@
       });
   }
 
+  function generateNumberArray(length) {
+      return Array.from({ length }, (_, index) => index);
+  }
+  function getNameWithDepth(name, depth) {
+      return (generateNumberArray(depth)
+          .map(() => '—')
+          .join(' ') +
+          ' ' +
+          name);
+  }
+
+  const getStatusOptions = (t) => [
+      { label: t('blog:statusPublished'), value: 'PUBLISHED' },
+      { label: t('blog:statusDraft'), value: 'DRAFT' },
+      { label: t('blog:statusArchived'), value: 'ARCHIVED' }
+  ];
+  function convertPostToFormValues(post, languageOptionList, postOptionList, additionalFieldList, statusOptions) {
+      var _a, _b, _c;
+      if (!post) {
+          return {
+              title: '',
+              excerpt: '',
+              body: '',
+              datetime: '',
+              coverImage: null,
+              image: null,
+              imageMobile: null,
+              pageTitle: '',
+              pageDescription: '',
+              openGraphImage: null,
+              urlAlias: '',
+              categories: [],
+              language: null,
+              relatedPosts: [],
+              tags: '',
+              additionalFields: additionalFieldList.map((fieldConfig) => adminDynamicField.universalFieldUtils.createFormField(fieldConfig, null)),
+              status: statusOptions[0],
+              statusDateEnabled: false,
+              statusDate: null
+          };
+      }
+      const currentLangOption = languageOptionList.find((option) => option.value === post.language);
+      const selectedPostOptionList = postOptionList.filter((option) => post.relatedPosts.some((relatedPost) => relatedPost.id === option.value));
+      const foundStatus = (_a = statusOptions.find(({ value }) => value === post.status)) !== null && _a !== void 0 ? _a : statusOptions[0];
+      return {
+          title: post.title,
+          excerpt: post.excerpt,
+          body: post.body,
+          datetime: post.datetime ? post.datetime.substr(0, 10) : '',
+          coverImage: post.coverImage
+              ? { id: adminServices.createId(), file: post.coverImage }
+              : null,
+          image: post.image ? { id: adminServices.createId(), file: post.image } : null,
+          imageMobile: post.imageMobile
+              ? { id: adminServices.createId(), file: post.imageMobile }
+              : null,
+          pageTitle: (_b = post.pageTitle) !== null && _b !== void 0 ? _b : '',
+          pageDescription: (_c = post.pageDescription) !== null && _c !== void 0 ? _c : '',
+          openGraphImage: post.openGraphImage
+              ? { id: adminServices.createId(), file: post.openGraphImage }
+              : null,
+          urlAlias: post.urlAlias,
+          categories: post.categories.map((category) => ({
+              value: category.id,
+              label: category.name
+          })),
+          language: currentLangOption !== null && currentLangOption !== void 0 ? currentLangOption : null,
+          relatedPosts: selectedPostOptionList,
+          tags: post.tags.join(','),
+          additionalFields: additionalFieldList.map((fieldConfig) => {
+              const postAdditionalField = post.additionalFields.find(({ name }) => name === fieldConfig.name);
+              return adminDynamicField.universalFieldUtils.createFormField(fieldConfig, postAdditionalField === null || postAdditionalField === void 0 ? void 0 : postAdditionalField.value);
+          }),
+          status: foundStatus,
+          statusDateEnabled: post.status === 'PUBLISHED' ? !!post.archiveAt : (post.status === 'DRAFT' ? !!post.publishAt : false),
+          statusDate: post.status === 'PUBLISHED' && post.archiveAt ? post.archiveAt.substr(0, 10) : (post.status === 'DRAFT' && post.publishAt ? post.publishAt.substr(0, 10) : null)
+      };
+  }
+  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,
+          datetime: values.datetime,
+          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,
+          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,
+          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,
+          relatedPosts: values.relatedPosts.map((relatedPostOption) => relatedPostOption.value),
+          tags: values.tags.split(',').filter((tag) => tag.trim().length > 0),
+          additionalFields: values.additionalFields.map((field) => ({
+              name: field.config.name,
+              value: adminDynamicField.universalFieldUtils.getOutgoingValue(field)
+          })),
+          status: values.status.value,
+          archiveAt: values.status.value === 'PUBLISHED' && values.statusDateEnabled && values.statusDate ? values.statusDate : null,
+          publishAt: values.status.value === 'DRAFT' && values.statusDateEnabled && values.statusDate ? values.statusDate : null
+      };
+  }
+  function convertFormValuesToUpdatePayload(values) {
+      return Object.assign(Object.assign({}, convertFormValuesToCreationPayload(values)), { urlAlias: values.urlAlias });
+  }
+  function convertCategoryListToOptions(categoryList, languageId) {
+      return categoryList
+          .filter(({ language }) => (languageId ? language === languageId : true))
+          .map(({ id, name, depth }) => ({
+          value: id,
+          label: getNameWithDepth(name, depth)
+      }));
+  }
+
   function convertPostList(postList, selectedCategory, languages) {
       return postList
           .filter((post) => selectedCategory
@@ -2701,7 +2830,7 @@
               name: 'ID',
               field: 'id',
               style: { width: '50px', textAlign: 'center' },
-              headStyle: { width: '50px', textAlign: 'center' }
+              headStyle: { width: '50px', textAlign: 'center' },
           },
           {
               id: 2,
@@ -2709,78 +2838,71 @@
               field: 'status',
               style: { width: '120px' },
               headStyle: { width: '120px' },
-              format: ({ row }) => {
-                  return getStatuses(t)[row.status];
-              }
           },
           {
-              id: 2,
+              id: 3,
               name: t('blog:name'),
               field: 'name',
               type: 'name',
               format: ({ row }) => ({
                   adminLink: {
                       text: row.title,
-                      url: getBlogPostFormUrl({ postId: row.id })
+                      url: getBlogPostFormUrl({ postId: row.id }),
                   },
                   websiteLink: {
                       text: row.url,
                       url: [
                           process.env.VUE_APP_WEBSITE_URL || window.location.origin,
-                          row.url
-                      ].join('')
-                  }
-              })
+                          row.url,
+                      ].join(''),
+                  },
+              }),
           },
           {
-              id: 3,
+              id: 4,
               name: t('blog:image'),
               field: 'image',
               type: 'image',
               style: { width: '250px' },
-              headStyle: { width: '250px' }
+              headStyle: { width: '250px' },
           },
           isLangSpecific
-              ? { id: 4, name: t('blog:language'), field: 'language' }
+              ? { id: 5, name: t('blog:language'), field: 'language' }
               : null,
-          { id: 5, name: t('blog:date'), field: 'datetime', type: 'datetime', options: { ignoreStartOfDayTime: true } },
           {
               id: 6,
+              name: t('blog:date'),
+              field: 'datetime',
+              type: 'datetime',
+              options: { ignoreStartOfDayTime: true },
+          },
+          {
+              id: 7,
               name: t('blog:categories'),
               field: 'categories',
-              format: ({ row }) => row.categories.map((category) => category.name).join(', ')
+              format: ({ row }) => row.categories.map((category) => category.name).join(', '),
           },
           {
-              id: 7,
+              id: 8,
               name: t('blog:actions'),
               field: 'actions',
               style: { whiteSpace: 'nowrap', width: '120px' },
-              headStyle: { whiteSpace: 'nowrap', width: '120px' }
-          }
+              headStyle: { whiteSpace: 'nowrap', width: '120px' },
+          },
       ];
       return COLUMN_DEFS.filter(adminServices.notEmpty);
   }
 
-  function generateNumberArray(length) {
-      return Array.from({ length }, (_, index) => index);
-  }
-  function getNameWithDepth(name, depth) {
-      return (generateNumberArray(depth)
-          .map(() => '—')
-          .join(' ') +
-          ' ' +
-          name);
-  }
-
   var FilterTypes;
   (function (FilterTypes) {
       FilterTypes["CATEGORY"] = "category";
       FilterTypes["LANGUAGE"] = "language";
       FilterTypes["FROM_DATE"] = "from-date";
       FilterTypes["TO_DATE"] = "to-date";
+      FilterTypes["STATUS"] = "status";
   })(FilterTypes || (FilterTypes = {}));
   const dateFormat = (date) => date.split('-').reverse().join('.');
-  function useAdvancedSearch({ context, categoryList, languageList, }) {
+  function useAdvancedSearch({ context, categoryList, languageList, statusOptionList, }) {
       /** Category **/
       const categoryOptionList = compositionApi.computed(() => categoryList.value.map(({ id, name, depth }) => ({
           value: String(id),
@@ -2838,11 +2960,21 @@
               title: context.root.$t('blog:dateOfPublication'),
           };
       });
+      /** Status **/
+      const initialStatusFilter = compositionApi.computed(() => {
+          const queryValue = adminUi.getFilterParamAsStringArray(context.root.$route.query, FilterTypes.STATUS);
+          return statusOptionList.value.filter(({ value }) => queryValue.some((selected) => selected === value));
+      });
+      const statusFilter = compositionApi.ref(initialStatusFilter.value);
+      compositionApi.watch(initialStatusFilter, () => {
+          statusFilter.value = initialStatusFilter.value;
+      });
       /** Params **/
       const filterParams = compositionApi.computed(() => {
           const filters = {
               [FilterTypes.CATEGORY]: categoryFilter.value.map(({ value }) => value),
               [FilterTypes.LANGUAGE]: languageFilter.value.map(({ value }) => value),
+              [FilterTypes.STATUS]: statusFilter.value.map(({ value }) => value),
           };
           if (fromDateFilter.value) {
               filters[FilterTypes.FROM_DATE] = fromDateFilter.value;
@@ -2864,6 +2996,9 @@
               fromDateFilter.value = '';
               toDateFilter.value = '';
           }
+          if (event.name === FilterTypes.STATUS) {
+              statusFilter.value = statusFilter.value.filter(({ value }) => value !== event.value);
+          }
       }
       /** Tags **/
       const tags = compositionApi.computed(() => [
@@ -2880,6 +3015,12 @@
               title: context.root.$t('blog:language'),
           })),
           date.value,
+          ...statusFilter.value.map(({ value, label }) => ({
+              value,
+              label,
+              name: FilterTypes.STATUS,
+              title: context.root.$t('blog:status'),
+          })),
       ].filter(adminServices.isNotNullish));
       /** Helpers **/
       const selectedCategoryOptionList = compositionApi.computed(() => {
@@ -2899,6 +3040,7 @@
           languageOptionList,
           fromDateFilter,
           toDateFilter,
+          statusFilter,
           tagRemovalHandler,
           tags: tags,
           filterParams,
@@ -2914,11 +3056,12 @@
               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;
           });
+          const statusOptionList = compositionApi.computed(() => getStatusOptions(t));
           /** Fetch module config **/
-          const { data: moduleConfig, loading: isModuleConfigLoading, } = useFetchModuleConfig({ context });
+          const { data: moduleConfig, loading: isModuleConfigLoading } = useFetchModuleConfig({ 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 : []; });
           /** Fetch category list **/
-          const { data: categoryList, loading: isCategoryListLoading, } = useFetchCategories({ context });
+          const { data: categoryList, loading: isCategoryListLoading } = useFetchCategories({ context });
           const selectedCategory = compositionApi.computed(() => {
               var _a;
               return categoryId.value
@@ -2930,19 +3073,20 @@
                   : context.root.$t('blog:posts');
           });
           /** Advanced search **/
-          const { categoryFilter, categoryOptionList, languageFilter, languageOptionList, fromDateFilter, toDateFilter, filterParams, tags, tagRemovalHandler, } = useAdvancedSearch({
+          const { categoryFilter, categoryOptionList, languageFilter, languageOptionList, fromDateFilter, toDateFilter, filterParams, tags, tagRemovalHandler, statusFilter } = useAdvancedSearch({
               context,
               categoryList,
               languageList,
+              statusOptionList
           });
           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({
+          const { fetchEntityList: fetchPostList, isLoading: isPostLoading, rowData: postList, errorMessage, searchQuery, handleChange, pageNumber, pageCount, pageSize } = adminUi.useDataTable({
               fetchEntityList: (params) => getPosts(Object.assign({ query: params.searchQuery, pageNumber: params.pageNumber, pageSize: params.pageSize }, filterParams.value)),
               initialValue: [],
               context,
               resourceName: 'Blog post list',
-              pageSize: 100,
+              pageSize: 100
           });
           compositionApi.watch(filterParams, () => {
               if (isModuleConfigLoading.value || isCategoryListLoading.value) {
@@ -2965,7 +3109,7 @@
               deleteResource: deleteBlogPost,
               resourceName: 'Post',
               onSuccess: fetchPostList,
-              context,
+              context
           });
           const { isCloning, handleResourceClone } = adminServices.useResourceClone({
               cloneResource: clonePost,
@@ -2973,13 +3117,15 @@
               successMessage: t('blog:cloneSuccess'),
               failureMessage: t('blog:cloneFailure'),
               onSuccessRedirectTo: (data) => `/blog/posts/${data.id}`,
-              context,
+              context
           });
           function isBusy(postId) {
               return isDeleting(postId) || isCloning(postId) || isRowDataLoading.value;
           }
           const columnDefs = compositionApi.computed(() => getPostTableColumnDefs(moduleConfig.value, context.root.$t));
           return {
+              t,
+              formatDateTime: adminUi.formatDateTime,
               columnDefs,
               rowData: displayedPostList,
               handleResourceDelete,
@@ -3002,13 +3148,16 @@
               languageOptionList,
               fromDateFilter,
               toDateFilter,
+              statusFilter,
+              statusOptionList,
               tags,
               tagRemovalHandler,
+              getStatuses,
               // Clone
               handleResourceClone,
-              isBusy,
+              isBusy
           };
-      },
+      }
   });
 
   function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
@@ -3278,6 +3427,23 @@
                                     1
                                   ),
                                 ]),
+                                _vm._v(" "),
+                                _c("form-field-multi-select", {
+                                  staticClass: "filter",
+                                  attrs: {
+                                    options: _vm.statusOptionList,
+                                    name: "statusFilter",
+                                    searchable: true,
+                                    label: _vm.$t("blog:status"),
+                                  },
+                                  model: {
+                                    value: _vm.statusFilter,
+                                    callback: function ($$v) {
+                                      _vm.statusFilter = $$v;
+                                    },
+                                    expression: "statusFilter",
+                                  },
+                                }),
                               ],
                               1
                             ),
@@ -3287,6 +3453,59 @@
                     },
                     proxy: true,
                   },
+                  {
+                    key: "cell(status)",
+                    fn: function (ref) {
+                      var row = ref.row;
+                      return [
+                        _c("div", { staticClass: "status" }, [
+                          _c("span", [
+                            _vm._v(_vm._s(_vm.getStatuses(_vm.t)[row.status])),
+                          ]),
+                          _vm._v(" "),
+                          row.status === "PUBLISHED" && row.archiveAt
+                            ? _c("span", [
+                                _vm._v(
+                                  "\n            " +
+                                    _vm._s(_vm.t("blog:publishAtLabel")) +
+                                    ": "
+                                ),
+                                _c("i", [
+                                  _vm._v(
+                                    _vm._s(
+                                      _vm.formatDateTime(
+                                        new Date(row.archiveAt),
+                                        true
+                                      )
+                                    )
+                                  ),
+                                ]),
+                              ])
+                            : _vm._e(),
+                          _vm._v(" "),
+                          row.status === "DRAFT" && row.publishAt
+                            ? _c("span", [
+                                _vm._v(
+                                  "\n            " +
+                                    _vm._s(_vm.t("blog:publishAtLabel")) +
+                                    ": "
+                                ),
+                                _c("i", [
+                                  _vm._v(
+                                    _vm._s(
+                                      _vm.formatDateTime(
+                                        new Date(row.publishAt),
+                                        true
+                                      )
+                                    )
+                                  ),
+                                ]),
+                              ])
+                            : _vm._e(),
+                        ]),
+                      ]
+                    },
+                  },
                   {
                     key: "cell(actions)",
                     fn: function (ref) {
@@ -3359,11 +3578,11 @@
     /* style */
     const __vue_inject_styles__ = function (inject) {
       if (!inject) return
-      inject("data-v-6697ac14_0", { source: ".filters[data-v-6697ac14] {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters[data-v-6697ac14]:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter[data-v-6697ac14] {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n.date-label[data-v-6697ac14] {\n  margin-bottom: 0.5rem;\n}\n.date-content[data-v-6697ac14] {\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":"AAqUA;EACA,aAAA;EACA,eAAA;ACpUA;ADsUA;EACA,gBAAA;ACpUA;ADuUA;EACA,oBAAA;EACA,UAAA;EACA,SAAA;ACrUA;ADyUA;EACA,qBAAA;ACtUA;ADyUA;EACA,aAAA;EACA,qCAAA;EACA,gBAAA;ACtUA;;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=\"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            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 { useFetchModuleConfig, useFetchCategories } from '../../../hooks';\nimport {\n  clonePost,\n  deleteBlogPost,\n  getPosts,\n} from '../../../services/requests';\nimport { getBlogPostFormUrl } from '../../../constants/paths';\nimport {\n  Category,\n  Language,\n  PostFull,\n  PostShort,\n} from '../../../typings/model';\n\nimport { convertPostList, getPostTableColumnDefs } from './PostList.helpers';\nimport { useAdvancedSearch } from './hooks';\n\nexport default defineComponent({\n  name: 'Posts',\n  setup(props, context) {\n    const { t } = useTranslation(context);\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\n    const {\n      data: moduleConfig,\n      loading: isModuleConfigLoading,\n    } = useFetchModuleConfig({ context });\n\n    const languageList = computed<Language[]>(\n      () => moduleConfig.value?.languages ?? []\n    );\n\n    /** Fetch category list **/\n\n    const {\n      data: categoryList,\n      loading: isCategoryListLoading,\n    } = useFetchCategories({ 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\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        getPosts({\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) => `/blog/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      // 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 });
+      inject("data-v-61f152be_0", { source: ".filters[data-v-61f152be] {\n  display: flex;\n  margin: 0 -10px;\n}\n.filters[data-v-61f152be]:not(:first-child) {\n  margin-top: 10px;\n}\n.filters .filter[data-v-61f152be] {\n  padding: 10px 10px 0;\n  width: 50%;\n  margin: 0;\n}\n.date-label[data-v-61f152be] {\n  margin-bottom: 0.5rem;\n}\n.date-content[data-v-61f152be] {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  column-gap: 10px;\n}\n.status span[data-v-61f152be]:first-child {\n  display: block;\n}\n.status span[data-v-61f152be]:nth-child(2) {\n  display: block;\n  margin-top: 5px;\n  font-size: 0.8rem;\n}\n.status span:nth-child(2) i[data-v-61f152be] {\n  display: block;\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":"AAsWA;EACA,aAAA;EACA,eAAA;ACrWA;ADuWA;EACA,gBAAA;ACrWA;ADwWA;EACA,oBAAA;EACA,UAAA;EACA,SAAA;ACtWA;AD0WA;EACA,qBAAA;ACvWA;AD0WA;EACA,aAAA;EACA,qCAAA;EACA,gBAAA;ACvWA;AD2WA;EACA,cAAA;ACxWA;AD2WA;EACA,cAAA;EACA,eAAA;EACA,iBAAA;ACzWA;AD2WA;EACA,cAAA;ACzWA;;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\n              <form-field-multi-select\n                v-model='statusFilter'\n                :options='statusOptionList'\n                name='statusFilter'\n                :searchable='true'\n                :label=\"$t('blog:status')\"\n                class='filter'\n              />\n            </div>\n          </advanced-search>\n        </template>\n\n        <template v-slot:cell(status)='{ row }'>\n          <div class='status'>\n            <span>{{ getStatuses(t)[row.status] }}</span>\n            <span v-if='row.status === \"PUBLISHED\" && row.archiveAt'>\n              {{ t('blog:publishAtLabel') }}: <i>{{ formatDateTime(new Date(row.archiveAt), true) }}</i>\n             </span>\n            <span v-if='row.status === \"DRAFT\" && row.publishAt'>\n              {{ t('blog:publishAtLabel') }}: <i>{{ formatDateTime(new Date(row.publishAt), true) }}</i>\n            </span>\n          </div>\n        </template>\n\n        <template v-slot:cell(actions)='{ row }'>\n          <base-button\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            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  OptionType,\n  useDataTable,\n  useTranslation,\n  formatDateTime\n} from '@tager/admin-ui';\nimport {\n  Nullable,\n  useResourceClone,\n  useResourceDelete\n} from '@tager/admin-services';\n\nimport { useFetchModuleConfig, useFetchCategories } from '../../../hooks';\nimport {\n  clonePost,\n  deleteBlogPost,\n  getPosts\n} from '../../../services/requests';\nimport { getBlogPostFormUrl } from '../../../constants/paths';\nimport {\n  Category,\n  Language,\n  PostFull,\n  PostShort\n} from '../../../typings/model';\nimport { getStatusOptions } from '../PostForm/PostForm.helpers';\n\nimport { convertPostList, getPostTableColumnDefs, getStatuses } from './PostList.helpers';\nimport { useAdvancedSearch } from './hooks';\n\nexport default defineComponent({\n  name: 'Posts',\n  setup(props, context) {\n    const { t } = useTranslation(context);\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    const statusOptionList = computed<OptionType[]>(() => getStatusOptions(t));\n\n    /** Fetch module config **/\n\n    const {\n      data: moduleConfig,\n      loading: isModuleConfigLoading\n    } = useFetchModuleConfig({ context });\n\n    const languageList = computed<Language[]>(\n      () => moduleConfig.value?.languages ?? []\n    );\n\n    /** Fetch category list **/\n\n    const {\n      data: categoryList,\n      loading: isCategoryListLoading\n    } = useFetchCategories({ 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      statusFilter\n    } = useAdvancedSearch({\n      context,\n      categoryList,\n      languageList,\n      statusOptionList\n    });\n\n    const isLangSpecific = computed<boolean>(\n      () => languageOptionList.value.length > 1\n    );\n\n    /** Fetch Post list **/\n\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        getPosts({\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) => `/blog/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      t,\n      formatDateTime,\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      statusFilter,\n      statusOptionList,\n      tags,\n      tagRemovalHandler,\n      getStatuses,\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\n.status {\n  span:first-child {\n    display: block;\n  }\n\n  span:nth-child(2) {\n    display: block;\n    margin-top: 5px;\n    font-size: 0.8rem;\n\n    i {\n      display: block;\n    }\n  }\n;\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.status span:first-child {\n  display: block;\n}\n.status span:nth-child(2) {\n  display: block;\n  margin-top: 5px;\n  font-size: 0.8rem;\n}\n.status span:nth-child(2) i {\n  display: block;\n}\n\n/*# sourceMappingURL=PostList.vue.map */"]}, media: undefined });
 
     };
     /* scoped */
-    const __vue_scope_id__ = "data-v-6697ac14";
+    const __vue_scope_id__ = "data-v-61f152be";
     /* module identifier */
     const __vue_module_identifier__ = undefined;
     /* functional template */
@@ -3387,98 +3606,6 @@
       undefined
     );
 
-  function convertPostToFormValues(post, languageOptionList, postOptionList, additionalFieldList) {
-      var _a, _b;
-      if (!post) {
-          return {
-              title: '',
-              excerpt: '',
-              body: '',
-              datetime: '',
-              coverImage: null,
-              image: null,
-              imageMobile: null,
-              pageTitle: '',
-              pageDescription: '',
-              openGraphImage: null,
-              urlAlias: '',
-              categories: [],
-              language: null,
-              relatedPosts: [],
-              tags: '',
-              additionalFields: additionalFieldList.map((fieldConfig) => adminDynamicField.universalFieldUtils.createFormField(fieldConfig, null)),
-          };
-      }
-      const currentLangOption = languageOptionList.find((option) => option.value === post.language);
-      const selectedPostOptionList = postOptionList.filter((option) => post.relatedPosts.some((relatedPost) => relatedPost.id === option.value));
-      return {
-          title: post.title,
-          excerpt: post.excerpt,
-          body: post.body,
-          datetime: post.datetime ? post.datetime.substr(0, 10) : '',
-          coverImage: post.coverImage
-              ? { id: adminServices.createId(), file: post.coverImage }
-              : null,
-          image: post.image ? { id: adminServices.createId(), file: post.image } : null,
-          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 : '',
-          openGraphImage: post.openGraphImage
-              ? { id: adminServices.createId(), file: post.openGraphImage }
-              : null,
-          urlAlias: post.urlAlias,
-          categories: post.categories.map((category) => ({
-              value: category.id,
-              label: category.name,
-          })),
-          language: currentLangOption !== null && currentLangOption !== void 0 ? 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);
-          }),
-      };
-  }
-  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,
-          datetime: values.datetime,
-          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,
-          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,
-          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,
-          relatedPosts: values.relatedPosts.map((relatedPostOption) => relatedPostOption.value),
-          tags: values.tags.split(',').filter((tag) => tag.trim().length > 0),
-          additionalFields: values.additionalFields.map((field) => ({
-              name: field.config.name,
-              value: adminDynamicField.universalFieldUtils.getOutgoingValue(field),
-          })),
-      };
-  }
-  function convertFormValuesToUpdatePayload(values) {
-      return Object.assign(Object.assign({}, convertFormValuesToCreationPayload(values)), { urlAlias: values.urlAlias });
-  }
-  function convertCategoryListToOptions(categoryList, languageId) {
-      return categoryList
-          .filter(({ language }) => (languageId ? language === languageId : true))
-          .map(({ id, name, depth }) => ({
-          value: id,
-          label: getNameWithDepth(name, depth),
-      }));
-  }
-
   var script$1 = compositionApi.defineComponent({
       name: 'BlogPostForm',
       components: { DynamicField: adminDynamicField.DynamicField, ShortCodeConstructor: adminUi.ShortCodeConstructor, FormFooter: adminUi.FormFooter },
@@ -3487,22 +3614,23 @@
           const postId = compositionApi.computed(() => context.root.$route.params.postId);
           const isCreation = compositionApi.computed(() => postId.value === 'create');
           const urlAliasChanged = compositionApi.ref(false);
+          const statusOptions = compositionApi.computed(() => getStatusOptions(context.root.$t));
           /** Fetch module config **/
-          const { data: moduleConfig, loading: isModuleConfigLoading, } = useFetchModuleConfig({ context });
+          const { data: moduleConfig, loading: isModuleConfigLoading } = useFetchModuleConfig({ 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 languageOptionList = compositionApi.computed(() => languageList.value.map(({ id, name }) => ({
               value: id,
-              label: name,
+              label: name
           })));
           const isLangSpecific = compositionApi.computed(() => languageOptionList.value.length > 0);
           /** Fetch category list */
-          const { data: categoryList, loading: isCategoryListLoading, } = useFetchCategories({ context });
+          const { data: categoryList, loading: isCategoryListLoading } = useFetchCategories({ context });
           /** Fetch Post */
           const [fetchPost, { data: post, loading: isPostLoading }] = adminServices.useResource({
               fetchResource: () => getPost(postId.value),
               initialValue: null,
               context,
-              resourceName: 'Post',
+              resourceName: 'Post'
           });
           compositionApi.onMounted(() => {
               if (isCreation.value)
@@ -3516,21 +3644,21 @@
           });
           /** Fetch post list */
           const { data: postList, loading: isPostListLoading } = useFetchPosts({
-              context,
+              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); })
               .map((post) => ({
               value: post.id,
-              label: post.title,
+              label: post.title
           })));
           /** Form State **/
           const isSubmitting = compositionApi.ref(false);
-          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, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : [], statusOptions.value));
           const errors = compositionApi.ref({});
           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, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : [], statusOptions.value);
           });
           function submitForm(event) {
               isSubmitting.value = true;
@@ -3555,14 +3683,14 @@
                       }
                   }
                   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, (_b = (_a = moduleConfig.value) === null || _a === void 0 ? void 0 : _a.fields) !== null && _b !== void 0 ? _b : [], statusOptions.value);
                   }
                   context.root.$toast({
                       variant: 'success',
                       title: context.root.$t('blog:success'),
                       body: isCreation.value
                           ? context.root.$t('blog:blogPostWasSuccessfullyCreated')
-                          : context.root.$t('blog:blogPostWasSuccessfullyUpdated'),
+                          : context.root.$t('blog:blogPostWasSuccessfullyUpdated')
                   });
               })
                   .catch((error) => {
@@ -3573,7 +3701,7 @@
                       title: context.root.$t('blog:error'),
                       body: isCreation.value
                           ? context.root.$t('blog:blogPostCreationWasFailed')
-                          : context.root.$t('blog:blogPostUpdateWasFailed'),
+                          : context.root.$t('blog:blogPostUpdateWasFailed')
                   });
               })
                   .finally(() => {
@@ -3626,24 +3754,24 @@
                           'urlAlias',
                           'excerpt',
                           'body',
-                          'date',
-                      ]),
+                          'date'
+                      ])
                   },
                   {
                       id: 'images',
                       label: context.root.$t('blog:images'),
-                      hasErrors: hasErrors(['coverImage', 'image']),
+                      hasErrors: hasErrors(['coverImage', 'image'])
                   },
                   {
                       id: 'relations',
                       label: context.root.$t('blog:relations'),
-                      hasErrors: hasErrors(['categories', 'relatedPosts', 'tags']),
+                      hasErrors: hasErrors(['categories', 'relatedPosts', 'tags'])
                   },
                   values.value.additionalFields.length > 0
                       ? {
                           id: 'additional',
                           label: context.root.$t('blog:additionalFields'),
-                          hasErrors: hasErrors([]),
+                          hasErrors: hasErrors([])
                       }
                       : null,
                   {
@@ -3652,9 +3780,9 @@
                       hasErrors: hasErrors([
                           'pageTitle',
                           'pageDescription',
-                          'openGraphImage',
-                      ]),
-                  },
+                          'openGraphImage'
+                      ])
+                  }
               ].filter(adminServices.isNotNullish);
           });
           const selectedTabId = compositionApi.ref(tabList.value[0].id);
@@ -3663,17 +3791,17 @@
                   ? {
                       text: context.root.$t('blog:viewPost'),
                       href: process.env.VUE_APP_WEBSITE_URL + post.value.url,
-                      target: '_blank',
+                      target: '_blank'
                   }
-                  : null,
+                  : null
           ].filter(adminServices.isNotNullish));
-          function handleSeoFieldGroupChange({ title, description, image, }) {
+          function handleSeoFieldGroupChange({ title, description, image }) {
               values.value.pageTitle = title;
               values.value.pageDescription = description;
               values.value.openGraphImage = image;
           }
           function handleTitleChange(value) {
-              if (urlAliasChanged.value === false) {
+              if (isCreation.value && urlAliasChanged.value === false) {
                   values.value.urlAlias = adminServices.urlTranslit(value);
               }
           }
@@ -3703,7 +3831,7 @@
                       }
                       const newSelectedOption = {
                           value: foundSelectedCategory.id,
-                          label: foundSelectedCategory.name,
+                          label: foundSelectedCategory.name
                       };
                       if (!newSelectedOptions.some(({ value }) => value === newSelectedOption.value)) {
                           newSelectedOptions.push(newSelectedOption);
@@ -3740,8 +3868,9 @@
               handleAliasChange,
               urlAliasTemplate,
               handleCategoriesChange,
+              statusOptions
           };
-      },
+      }
   });
 
   /* script */
@@ -3848,6 +3977,114 @@
                           },
                         }),
                         _vm._v(" "),
+                        _c("div", { staticClass: "status" }, [
+                          _c(
+                            "div",
+                            { staticClass: "status-value" },
+                            [
+                              _c("form-field-select", {
+                                attrs: {
+                                  name: "status",
+                                  error: _vm.errors.status,
+                                  label: _vm.$t("blog:status"),
+                                  "no-options-message": _vm.$t(
+                                    "blog:noTemplates"
+                                  ),
+                                  options: _vm.statusOptions,
+                                },
+                                model: {
+                                  value: _vm.values.status,
+                                  callback: function ($$v) {
+                                    _vm.$set(_vm.values, "status", $$v);
+                                  },
+                                  expression: "values.status",
+                                },
+                              }),
+                            ],
+                            1
+                          ),
+                          _vm._v(" "),
+                          _vm.values.status.value === "PUBLISHED" ||
+                          _vm.values.status.value === "DRAFT"
+                            ? _c(
+                                "div",
+                                { staticClass: "status-checkbox" },
+                                [
+                                  _c("form-field-checkbox", {
+                                    attrs: {
+                                      name: "statusDateEnabled",
+                                      label: _vm.$t(
+                                        _vm.values.status.value === "PUBLISHED"
+                                          ? "blog:scheduleArchive"
+                                          : "blog:schedulePublish"
+                                      ),
+                                      error: _vm.errors.status,
+                                    },
+                                    model: {
+                                      value: _vm.values.statusDateEnabled,
+                                      callback: function ($$v) {
+                                        _vm.$set(
+                                          _vm.values,
+                                          "statusDateEnabled",
+                                          $$v
+                                        );
+                                      },
+                                      expression: "values.statusDateEnabled",
+                                    },
+                                  }),
+                                ],
+                                1
+                              )
+                            : _vm._e(),
+                          _vm._v(" "),
+                          _vm.values.statusDateEnabled &&
+                          (_vm.values.status.value === "PUBLISHED" ||
+                            _vm.values.status.value === "DRAFT")
+                            ? _c(
+                                "div",
+                                { staticClass: "status-date" },
+                                [
+                                  _c("form-field", {
+                                    attrs: {
+                                      name: "statusDate",
+                                      type: "date",
+                                      label: _vm.$t(
+                                        _vm.values.status.value === "PUBLISHED"
+                                          ? "blog:archiveAt"
+                                          : "blog:publishAt"
+                                      ),
+                                      error: _vm.errors.statusDate,
+                                    },
+                                    model: {
+                                      value: _vm.values.statusDate,
+                                      callback: function ($$v) {
+                                        _vm.$set(_vm.values, "statusDate", $$v);
+                                      },
+                                      expression: "values.statusDate",
+                                    },
+                                  }),
+                                ],
+                                1
+                              )
+                            : _vm._e(),
+                        ]),
+                        _vm._v(" "),
+                        _c("form-field", {
+                          attrs: {
+                            name: "datetime",
+                            label: _vm.$t("blog:date"),
+                            type: "date",
+                            error: _vm.errors.datetime,
+                          },
+                          model: {
+                            value: _vm.values.datetime,
+                            callback: function ($$v) {
+                              _vm.$set(_vm.values, "datetime", $$v);
+                            },
+                            expression: "values.datetime",
+                          },
+                        }),
+                        _vm._v(" "),
                         _c("form-field", {
                           attrs: {
                             name: "excerpt",
@@ -3888,22 +4125,6 @@
                               : [],
                           },
                         }),
-                        _vm._v(" "),
-                        _c("form-field", {
-                          attrs: {
-                            name: "datetime",
-                            label: _vm.$t("blog:date"),
-                            type: "date",
-                            error: _vm.errors.datetime,
-                          },
-                          model: {
-                            value: _vm.values.datetime,
-                            callback: function ($$v) {
-                              _vm.$set(_vm.values, "datetime", $$v);
-                            },
-                            expression: "values.datetime",
-                          },
-                        }),
                       ]
                     : _vm._e(),
                   _vm._v(" "),
@@ -4074,15 +4295,17 @@
   __vue_render__$1._withStripped = true;
 
     /* style */
-    const __vue_inject_styles__$1 = undefined;
+    const __vue_inject_styles__$1 = function (inject) {
+      if (!inject) return
+      inject("data-v-50f3750d_0", { source: ".status[data-v-50f3750d] {\n  display: flex;\n  align-items: flex-end;\n}\n.status-value[data-v-50f3750d] {\n  flex-basis: 50%;\n}\n.status-checkbox[data-v-50f3750d] {\n  margin-left: 20px;\n  padding-bottom: 8px;\n}\n.status-date[data-v-50f3750d] {\n  margin-left: 20px;\n  flex: 1 1 1px;\n}\n\n/*# sourceMappingURL=PostForm.vue.map */", map: {"version":3,"sources":["/home/runner/work/tager-admin-blog/tager-admin-blog/src/views/Posts/PostForm/PostForm.vue","PostForm.vue"],"names":[],"mappings":"AA2nBA;EACA,aAAA;EACA,qBAAA;AC1nBA;AD6nBA;EACA,eAAA;AC1nBA;AD6nBA;EACA,iBAAA;EACA,mBAAA;AC1nBA;AD6nBA;EACA,iBAAA;EACA,aAAA;AC1nBA;;AAEA,uCAAuC","file":"PostForm.vue","sourcesContent":["<template>\n  <page\n    :title=\"isCreation ? $t('blog:createPost') : $t('blog:updatePost')\"\n    :is-content-loading='isContentLoading'\n    :header-buttons='headerButtonList'\n    :footer='{\n      backHref: postListUrl,\n      onSubmit: submitForm,\n      isSubmitting: isSubmitting,\n    }'\n  >\n    <template v-slot:content>\n      <form novalidate @submit.prevent='submitForm'>\n        <tab-list\n          :tab-list='tabList'\n          :selected-tab-id='selectedTabId'\n          @tab:update='selectedTabId = $event.tabId'\n        />\n\n        <template v-if=\"selectedTabId === 'common'\">\n\n          <form-field-select\n            v-if='isCreation && isLangSpecific'\n            v-model='values.language'\n            name='language'\n            :label=\"$t('blog:language')\"\n            :options='languageOptionList'\n            :error='errors.language'\n          />\n\n          <form-field\n            v-model='values.title'\n            name='title'\n            :label=\"$t('blog:title')\"\n            :error='errors.title'\n            @input='handleTitleChange'\n          />\n\n          <form-field-url-alias-input\n            id='urlAlias'\n            v-model='values.urlAlias'\n            name='urlAlias'\n            :label=\"$t('blog:link')\"\n            :url-template='urlAliasTemplate'\n            :error='errors.urlAlias'\n            @change='handleAliasChange'\n          />\n\n          <div class='status'>\n            <div class='status-value'>\n              <form-field-select\n                v-model='values.status'\n                name='status'\n                :error='errors.status'\n                :label=\"$t('blog:status')\"\n                :no-options-message=\"$t('blog:noTemplates')\"\n                :options='statusOptions'\n              />\n            </div>\n            <div class='status-checkbox' v-if='values.status.value === \"PUBLISHED\" || values.status.value === \"DRAFT\"'>\n              <form-field-checkbox\n                v-model='values.statusDateEnabled'\n                name='statusDateEnabled'\n                :label=\"$t(values.status.value === 'PUBLISHED' ? 'blog:scheduleArchive' : 'blog:schedulePublish')\"\n                :error='errors.status'\n              />\n            </div>\n            <div class='status-date'\n                 v-if='values.statusDateEnabled && (values.status.value === \"PUBLISHED\" || values.status.value === \"DRAFT\")'>\n              <form-field\n                v-model='values.statusDate'\n                name='statusDate'\n                type='date'\n                :label=\"$t(values.status.value === 'PUBLISHED' ? 'blog:archiveAt' : 'blog:publishAt')\"\n                :error='errors.statusDate'\n              />\n            </div>\n          </div>\n\n          <form-field\n            v-model='values.datetime'\n            name='datetime'\n            :label=\"$t('blog:date')\"\n            type='date'\n            :error='errors.datetime'\n          />\n\n          <form-field\n            v-model='values.excerpt'\n            name='excerpt'\n            :label=\"$t('blog:excerpt')\"\n            type='textarea'\n            :error='errors.excerpt'\n          />\n\n          <form-field-rich-text-input\n            v-model='values.body'\n            name='body'\n            :label=\"$t('blog:body')\"\n            :error='errors.body'\n            :get-upload-adapter-options='getUploadAdapterOptions'\n          />\n\n          <ShortCodeConstructor\n            :short-code-config-list='\n              moduleConfig ? moduleConfig.shortcodes : []\n            '\n          />\n        </template>\n\n        <template v-if=\"selectedTabId === 'images'\">\n          <form-field-file-input\n            v-model='values.coverImage'\n            :label=\"$t('blog:coverImage')\"\n            name='coverImage'\n            file-type='image'\n            :scenario='moduleConfig ? moduleConfig.fileScenarios.cover : null'\n          />\n\n          <form-field-file-input\n            v-model='values.image'\n            name='image'\n            :label=\"$t('blog:innerImage')\"\n            file-type='image'\n            :scenario='moduleConfig ? moduleConfig.fileScenarios.image : null'\n          />\n\n          <form-field-file-input\n            v-model='values.imageMobile'\n            name='imageMobile'\n            :label=\"$t('blog:innerImageMobile')\"\n            file-type='image'\n            :scenario='\n              moduleConfig ? moduleConfig.fileScenarios.imageMobile : null\n            '\n          />\n        </template>\n\n        <template v-if=\"selectedTabId === 'relations'\">\n          <form-field\n            v-model='values.tags'\n            name='tags'\n            :label=\"$t('blog:tags')\"\n            :error='errors.tags'\n          />\n\n          <form-field-multi-select\n            :selected-options='values.categories'\n            name='categories'\n            :label=\"$t('blog:categories')\"\n            :options='categoryOptionList'\n            :error='errors.categories'\n            @change='handleCategoriesChange'\n          />\n\n          <form-field-multi-select\n            v-model='values.relatedPosts'\n            name='relatedPosts'\n            :label=\"$t('blog:relatedPosts')\"\n            :options='postOptionList'\n            :error='errors.relatedPosts'\n            :searchable='true'\n          />\n        </template>\n\n        <template v-if=\"selectedTabId === 'additional'\">\n          <DynamicField\n            v-for='field of values.additionalFields'\n            :key='field.name'\n            :field='field'\n          />\n        </template>\n\n        <template v-if=\"selectedTabId === 'seo'\">\n          <seo-field-group\n            :title='values.pageTitle'\n            :title-error-message='errors.pageTitle'\n            :title-label=\"$t('blog:pageTitle')\"\n            :description='values.pageDescription'\n            :description-error-message='errors.pageDescription'\n            :description-label=\"$t('blog:pageDescription')\"\n            :image='values.openGraphImage'\n            :image-error-message='errors.openGraphImage'\n            :image-label=\"$t('blog:openGraphImage')\"\n            :image-scenario='\n              moduleConfig ? moduleConfig.fileScenarios.openGraph : null\n            '\n            @change='handleSeoFieldGroupChange'\n          />\n        </template>\n      </form>\n    </template>\n\n    <template v-slot:footer>\n      <FormFooter\n        :back-href='postListUrl'\n        :on-submit='submitForm'\n        :is-submitting='isSubmitting'\n        :is-creation='isCreation'\n        :can-create-another='isCreation'\n      />\n    </template>\n  </page>\n</template>\n\n<script lang='ts'>\nimport {\n  computed,\n  defineComponent,\n  onMounted,\n  ref,\n  watch\n} from '@vue/composition-api';\n\nimport {\n  convertRequestErrorToMap,\n  isNotNullish,\n  Nullable,\n  useResource,\n  urlTranslit\n} from '@tager/admin-services';\nimport {\n  createTabErrorFinder,\n  OptionType,\n  TabType,\n  ShortCodeConstructor,\n  SeoChangeEvent,\n  FormFooter,\n  TagerFormSubmitEvent\n} from '@tager/admin-ui';\nimport { DynamicField } from '@tager/admin-dynamic-field';\n\nimport {\n  getBlogPostFormUrl,\n  getBlogPostListUrl\n} from '../../../constants/paths';\nimport {\n  createBlogPost,\n  getPost,\n  updateBlogPost\n} from '../../../services/requests';\nimport { Language, PostFull } from '../../../typings/model';\nimport {\n  useFetchModuleConfig,\n  useFetchCategories,\n  useFetchPosts\n} from '../../../hooks';\n\nimport {\n  convertCategoryListToOptions,\n  convertFormValuesToCreationPayload,\n  convertFormValuesToUpdatePayload,\n  convertPostToFormValues,\n  FormValues,\n  getStatusOptions\n} from './PostForm.helpers';\n\nexport default defineComponent({\n  name: 'BlogPostForm',\n  components: { DynamicField, ShortCodeConstructor, FormFooter },\n  setup(props, context) {\n    const postId = computed<string>(() => context.root.$route.params.postId);\n    const isCreation = computed<boolean>(() => postId.value === 'create');\n\n    const urlAliasChanged = ref<boolean>(false);\n\n    const statusOptions = computed<OptionType[]>(() =>\n      getStatusOptions(context.root.$t)\n    );\n\n    /** Fetch module config **/\n\n    const {\n      data: moduleConfig,\n      loading: isModuleConfigLoading\n    } = useFetchModuleConfig({ context });\n\n    const languageList = computed<Language[]>(\n      () => moduleConfig.value?.languages ?? []\n    );\n\n    const languageOptionList = computed<OptionType[]>(() =>\n      languageList.value.map(({ id, name }) => ({\n        value: id,\n        label: name\n      }))\n    );\n\n    const isLangSpecific = computed(() => languageOptionList.value.length > 0);\n\n    /** Fetch category list */\n\n    const {\n      data: categoryList,\n      loading: isCategoryListLoading\n    } = useFetchCategories({ context });\n\n    /** Fetch Post */\n\n    const [fetchPost, { data: post, loading: isPostLoading }] = useResource<Nullable<PostFull>>({\n      fetchResource: () => getPost(postId.value),\n      initialValue: null,\n      context,\n      resourceName: 'Post'\n    });\n\n    onMounted(() => {\n      if (isCreation.value) return;\n\n      fetchPost();\n    });\n\n    watch(postId, () => {\n      if (isCreation.value) return;\n\n      fetchPost();\n    });\n\n    /** Fetch post list */\n    const { data: postList, loading: isPostListLoading } = useFetchPosts({\n      context\n    });\n\n    const postOptionList = computed<OptionType<number>[]>(() =>\n      postList.value\n        .filter((relatedPost) => relatedPost.id !== post.value?.id)\n        .map((post) => ({\n          value: post.id,\n          label: post.title\n        }))\n    );\n\n    /** Form State **/\n    const isSubmitting = ref<boolean>(false);\n    const values = ref<FormValues>(\n      convertPostToFormValues(\n        post.value,\n        languageOptionList.value,\n        postOptionList.value,\n        moduleConfig.value?.fields ?? [],\n        statusOptions.value\n      )\n    );\n    const errors = ref<Record<string, string>>({});\n\n    watch([post, languageOptionList, postOptionList, moduleConfig], () => {\n      values.value = convertPostToFormValues(\n        post.value,\n        languageOptionList.value,\n        postOptionList.value,\n        moduleConfig.value?.fields ?? [],\n        statusOptions.value\n      );\n    });\n\n    function submitForm(event: TagerFormSubmitEvent) {\n      isSubmitting.value = true;\n\n      const creationBody = convertFormValuesToCreationPayload(values.value);\n      const updateBody = convertFormValuesToUpdatePayload(values.value);\n\n      const requestPromise = isCreation.value\n        ? createBlogPost(creationBody)\n        : updateBlogPost(postId.value, updateBody);\n\n      requestPromise\n        .then(({ data }) => {\n          errors.value = {};\n\n          if (event.type === 'create') {\n            context.root.$router.push(\n              getBlogPostFormUrl({ postId: String(data.id) })\n            );\n          }\n\n          if (event.type === 'create_exit' || event.type === 'save_exit') {\n            if (context.root.$previousRoute) {\n              context.root.$router.back();\n            } else {\n              context.root.$router.push(getBlogPostListUrl());\n            }\n          }\n\n          if (event.type === 'create_create-another') {\n            values.value = convertPostToFormValues(\n              null,\n              languageOptionList.value,\n              postOptionList.value,\n              moduleConfig.value?.fields ?? [],\n              statusOptions.value\n            );\n          }\n\n          context.root.$toast({\n            variant: 'success',\n            title: context.root.$t('blog:success'),\n            body: isCreation.value\n              ? context.root.$t('blog:blogPostWasSuccessfullyCreated')\n              : context.root.$t('blog:blogPostWasSuccessfullyUpdated')\n          });\n        })\n        .catch((error) => {\n          console.error(error);\n          errors.value = convertRequestErrorToMap(error);\n          context.root.$toast({\n            variant: 'danger',\n            title: context.root.$t('blog:error'),\n            body: isCreation.value\n              ? context.root.$t('blog:blogPostCreationWasFailed')\n              : context.root.$t('blog:blogPostUpdateWasFailed')\n          });\n        })\n        .finally(() => {\n          isSubmitting.value = false;\n        });\n    }\n\n    /** Category Options */\n\n    const categoryOptionList = computed<OptionType<number>[]>(() =>\n      convertCategoryListToOptions(\n        categoryList.value,\n        values.value.language?.value ?? null\n      )\n    );\n\n    watch([categoryOptionList, moduleConfig], () => {\n      function isOptionExist(\n        selectedCategoryOption: OptionType<number>\n      ): boolean {\n        return categoryOptionList.value.some(\n          (option) => option.value === selectedCategoryOption.value\n        );\n      }\n\n      if (isCreation.value) {\n        if (moduleConfig?.value?.defaultCategories) {\n          const defaultIds = moduleConfig.value.defaultCategories.map(\n            (item: { id: number }) => item.id\n          );\n          values.value.categories = categoryOptionList.value.filter(\n            (item: OptionType<number>) => {\n              return defaultIds.indexOf(item.value) !== -1;\n            }\n          );\n        }\n      }\n\n      values.value.categories = values.value.categories.filter(isOptionExist);\n    });\n\n    /** Misc */\n\n    const isContentLoading = computed<boolean>(\n      () =>\n        isPostLoading.value ||\n        isCategoryListLoading.value ||\n        isPostListLoading.value ||\n        isModuleConfigLoading.value\n    );\n\n    function getUploadAdapterOptions() {\n      return { uploadScenario: moduleConfig.value?.fileScenarios.content };\n    }\n\n    const blogPagePath = computed<string>(() => {\n      const origin = process.env.VUE_APP_WEBSITE_URL || window.location.origin;\n      return origin + (post.value?.urlTemplate ?? '');\n    });\n\n    const tabList = computed<TabType[]>(() => {\n      const hasErrors = createTabErrorFinder(errors.value);\n      return [\n        {\n          id: 'common',\n          label: context.root.$t('blog:common'),\n          hasErrors: hasErrors([\n            'title',\n            'language',\n            'urlAlias',\n            'excerpt',\n            'body',\n            'date'\n          ])\n        },\n        {\n          id: 'images',\n          label: context.root.$t('blog:images'),\n          hasErrors: hasErrors(['coverImage', 'image'])\n        },\n        {\n          id: 'relations',\n          label: context.root.$t('blog:relations'),\n          hasErrors: hasErrors(['categories', 'relatedPosts', 'tags'])\n        },\n        values.value.additionalFields.length > 0\n          ? {\n            id: 'additional',\n            label: context.root.$t('blog:additionalFields'),\n            hasErrors: hasErrors([])\n          }\n          : null,\n        {\n          id: 'seo',\n          label: 'SEO',\n          hasErrors: hasErrors([\n            'pageTitle',\n            'pageDescription',\n            'openGraphImage'\n          ])\n        }\n      ].filter(isNotNullish);\n    });\n\n    const selectedTabId = ref<string>(tabList.value[0].id);\n\n    const headerButtonList = computed<{ text: string; href: string; target?: string }[]>(() =>\n      [\n        post.value\n          ? {\n            text: context.root.$t('blog:viewPost'),\n            href: process.env.VUE_APP_WEBSITE_URL + post.value.url,\n            target: '_blank'\n          }\n          : null\n      ].filter(isNotNullish)\n    );\n\n    function handleSeoFieldGroupChange({\n                                         title,\n                                         description,\n                                         image\n                                       }: SeoChangeEvent) {\n      values.value.pageTitle = title;\n      values.value.pageDescription = description;\n      values.value.openGraphImage = image;\n    }\n\n    function handleTitleChange(value: string) {\n      if (isCreation.value && urlAliasChanged.value === false) {\n        values.value.urlAlias = urlTranslit(value);\n      }\n    }\n\n    function handleAliasChange() {\n      urlAliasChanged.value = true;\n    }\n\n    const urlAliasTemplate = computed<string>(() => {\n      if (!moduleConfig.value || !moduleConfig.value.urlPostTemplate) {\n        return '';\n      }\n\n      let result = moduleConfig.value.urlPostTemplate;\n\n      if (values.value.language) {\n        result = result.replace('{language}', values.value.language.value);\n      }\n\n      if (postId.value !== 'create') {\n        result = result.replace('{id}', postId.value);\n      }\n\n      return result;\n    });\n\n    const handleCategoriesChange = (selectedOptions: OptionType<number>[]) => {\n      const newSelectedOptions: OptionType<number>[] = [];\n\n      selectedOptions.forEach((selectedOption) => {\n        const findTreeSelectedCategory = (categoryId: Nullable<number>) => {\n          const foundSelectedCategory = categoryList.value.find(\n            ({ id }) => id === categoryId\n          );\n\n          if (!foundSelectedCategory) {\n            return;\n          }\n\n          const newSelectedOption: OptionType<number> = {\n            value: foundSelectedCategory.id,\n            label: foundSelectedCategory.name\n          };\n\n          if (\n            !newSelectedOptions.some(\n              ({ value }) => value === newSelectedOption.value\n            )\n          ) {\n            newSelectedOptions.push(newSelectedOption);\n          }\n\n          if (foundSelectedCategory.parent) {\n            findTreeSelectedCategory(foundSelectedCategory.parent.id);\n          }\n        };\n\n        findTreeSelectedCategory(selectedOption.value);\n      });\n\n      values.value.categories = newSelectedOptions;\n    };\n\n    return {\n      isCreation,\n      postId,\n      pagePath: blogPagePath,\n      categoryOptionList,\n      values,\n      errors,\n      isContentLoading,\n      postListUrl: getBlogPostListUrl(),\n      submitForm,\n      isLangSpecific,\n      languageOptionList,\n      isSubmitting,\n      moduleConfig,\n      postOptionList,\n      getUploadAdapterOptions,\n      tabList,\n      selectedTabId,\n      headerButtonList,\n      handleSeoFieldGroupChange,\n      handleTitleChange,\n      handleAliasChange,\n      urlAliasTemplate,\n      handleCategoriesChange,\n\n      statusOptions\n    };\n  }\n});\n</script>\n\n<style scoped lang='scss'>\n.status {\n  display: flex;\n  align-items: flex-end;\n}\n\n.status-value {\n  flex-basis: 50%;\n}\n\n.status-checkbox {\n  margin-left: 20px;\n  padding-bottom: 8px;\n}\n\n.status-date {\n  margin-left: 20px;\n  flex: 1 1 1px;\n}\n</style>",".status {\n  display: flex;\n  align-items: flex-end;\n}\n\n.status-value {\n  flex-basis: 50%;\n}\n\n.status-checkbox {\n  margin-left: 20px;\n  padding-bottom: 8px;\n}\n\n.status-date {\n  margin-left: 20px;\n  flex: 1 1 1px;\n}\n\n/*# sourceMappingURL=PostForm.vue.map */"]}, media: undefined });
+
+    };
     /* scoped */
-    const __vue_scope_id__$1 = undefined;
+    const __vue_scope_id__$1 = "data-v-50f3750d";
     /* module identifier */
     const __vue_module_identifier__$1 = undefined;
     /* functional template */
     const __vue_is_functional_template__$1 = false;
-    /* style inject */
-    
     /* style inject SSR */
     
     /* style inject shadow dom */
@@ -4097,7 +4320,7 @@
       __vue_is_functional_template__$1,
       __vue_module_identifier__$1,
       false,
-      undefined,
+      createInjector,
       undefined,
       undefined
     );
@@ -4530,6 +4753,7 @@
               name: '',
               parent: { value: null, label: t('blog:noParent') },
               urlAlias: '',
+              isDefault: false,
               pageTitle: '',
               pageDescription: '',
               pageKeywords: '',
@@ -4540,6 +4764,7 @@
       }
       return {
           language: currentLangOption !== null && currentLangOption !== void 0 ? currentLangOption : null,
+          isDefault: category.isDefault,
           name: category.name,
           parent: category.parent
               ? { value: category.parent.id, label: category.parent.name }
@@ -4562,7 +4787,7 @@
           name: values.name,
           parent: values.parent.value,
           urlAlias: values.urlAlias,
-          isDefault: false,
+          isDefault: values.isDefault,
           pageTitle: values.pageTitle,
           pageDescription: values.pageDescription,
           openGraphImage: (_d = (_c = values.openGraphImage) === null || _c === void 0 ? void 0 : _c.file.id) !== null && _d !== void 0 ? _d : null,
@@ -4847,6 +5072,21 @@
                                   })
                                 : _vm._e(),
                               _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", {
                                 attrs: {
                                   name: "name",