sitero 0.3.0 → 0.4.0

package/dist/src/cms/client/infrastructure/i18n/messages/en-US/resources/file.js

@@ -1,4 +1,21 @@
 const file = {
+  "delete-completed": { text: "Moved to trash" },
+  "delete-skipped": { text: "Skipped" },
+  "delete-failed": { text: "Delete failed, retry available" },
+  "delete-not-found": { text: "The file no longer exists." },
+  "delete-already-deleted": { text: "The file is already in the trash." },
+  "restore-completed": { text: "Restored" },
+  "restore-skipped": { text: "Skipped" },
+  "restore-failed": { text: "Restore failed, retry available" },
+  "restore-not-found": { text: "The file no longer exists." },
+  "restore-not-deleted": { text: "The file is no longer in the trash." },
+  "purge-pending": { text: "Purge incomplete" },
+  "restore-purge-started": {
+    text: "This file cannot be restored because permanent deletion has started."
+  },
+  "purge-completed": { text: "Permanently deleted" },
+  "purge-skipped": { text: "Skipped" },
+  "purge-failed": { text: "Failed, retry available" },
   "lock-filter": {
     label: { text: "Lock status" }
   },

package/dist/src/cms/client/infrastructure/i18n/messages/zh-TW/resources/file.js

@@ -1,4 +1,21 @@
 const file = {
+  "delete-completed": { text: "\u5DF2\u79FB\u81F3\u5783\u573E\u6876" },
+  "delete-skipped": { text: "\u5DF2\u7565\u904E" },
+  "delete-failed": { text: "\u522A\u9664\u5931\u6557\uFF0C\u53EF\u91CD\u8A66" },
+  "delete-not-found": { text: "\u6A94\u6848\u5DF2\u4E0D\u5B58\u5728\u3002" },
+  "delete-already-deleted": { text: "\u6A94\u6848\u5DF2\u5728\u5783\u573E\u6876\u3002" },
+  "restore-completed": { text: "\u5DF2\u9084\u539F" },
+  "restore-skipped": { text: "\u5DF2\u7565\u904E" },
+  "restore-failed": { text: "\u9084\u539F\u5931\u6557\uFF0C\u53EF\u91CD\u8A66" },
+  "restore-not-found": { text: "\u6A94\u6848\u5DF2\u4E0D\u5B58\u5728\u3002" },
+  "restore-not-deleted": { text: "\u6A94\u6848\u5DF2\u4E0D\u5728\u5783\u573E\u6876\u3002" },
+  "purge-pending": { text: "\u6E05\u9664\u672A\u5B8C\u6210" },
+  "restore-purge-started": {
+    text: "\u6A94\u6848\u5DF2\u958B\u59CB\u6C38\u4E45\u522A\u9664\uFF0C\u7121\u6CD5\u9084\u539F\u3002"
+  },
+  "purge-completed": { text: "\u5DF2\u6C38\u4E45\u522A\u9664" },
+  "purge-skipped": { text: "\u672A\u57F7\u884C" },
+  "purge-failed": { text: "\u6E05\u9664\u5931\u6557\uFF0C\u53EF\u91CD\u8A66" },
   "lock-filter": {
     label: { text: "\u9396\u5B9A\u72C0\u614B" }
   },

package/dist/src/cms/client/interfaces/components/create-components.js

@@ -81,6 +81,7 @@ function createComponents(input) {
     strategies: constants.post.strategies
   });
   const PostList = createPostList({
+    customControlFields: constants.post.customControlFields,
     defaultWebLocale: constants.defaultWebLocale,
     postFindListCardsAction: actions.resources.post.findListCards,
     PostCard,

package/dist/src/cms/client/interfaces/components/create-post-contents.js

@@ -42,7 +42,7 @@ import { createPostEditContent } from './resources/post/content/post-edit-conten
 import { createPostShowContent } from './resources/post/content/post-show-content.js';
 
 function createPostContents(input) {
-  const { actions, applications, constants, components } = input;
+  const { actions, applications, constants, components, customControlFields } = input;
   const PostCreateContent = createPostCreateContent({
     AdminCard: components.resources.AdminCard,
     AdminList: components.resources.AdminList,
@@ -56,7 +56,8 @@ function createPostContents(input) {
     TagCard: components.resources.TagCard,
     Uploader: components.blobFile.Uploader,
     usePostCreateFormData: applications.resources.post.create,
-    webLocales: constants.webLocales
+    webLocales: constants.webLocales,
+    customControlFields
   });
   const PostEditContent = createPostEditContent({
     AdminCard: components.resources.AdminCard,
@@ -71,7 +72,8 @@ function createPostContents(input) {
     TagCard: components.resources.TagCard,
     Uploader: components.blobFile.Uploader,
     usePostUpdateFormData: applications.resources.post.update,
-    webLocales: constants.webLocales
+    webLocales: constants.webLocales,
+    customControlFields
   });
   const PostShowContent = createPostShowContent({
     AdminCard: components.resources.AdminCard,
@@ -80,7 +82,8 @@ function createPostContents(input) {
     PostCard: components.resources.PostCard,
     TagCard: components.resources.TagCard,
     contentMaxWidth: constants.contentMaxWidth,
-    webLocales: constants.webLocales
+    webLocales: constants.webLocales,
+    customControlFields
   });
   return {
     resources: {

package/dist/src/cms/client/interfaces/components/resources/admin/author-fields.js

@@ -0,0 +1,5 @@
+function createAllowAuthorField(fields) {
+  return ({ field }) => fields.includes(field);
+}
+
+export { createAllowAuthorField };

package/dist/src/cms/client/interfaces/components/resources/file/file-card.js

@@ -79,7 +79,7 @@ function createFileCard({
           )
         },
         state: /* @__PURE__ */ jsx(FileStateIcons, { file }),
-        media: /* @__PURE__ */ jsx("div", { className: cn("flex-center size-full", "overflow-hidden"), children: isImage ? /* @__PURE__ */ jsx(SmartImage, { fileKey: file.key, width: 160, height: 160 }) : isVideo ? /* @__PURE__ */ jsx("video", { src: joinUrl(storageUrl, file.key), autoPlay: true, loop: true, muted: true }) : /* @__PURE__ */ jsx("span", { className: cn("scale-[2]"), children: "\u{1F4C4}" }) }),
+        media: /* @__PURE__ */ jsx("div", { className: cn("flex-center size-full", "overflow-hidden"), children: file?.purgeStartedAt ? /* @__PURE__ */ jsx("span", { className: "text-destructive px-3 text-center text-sm", children: t("resources.file.purge-pending.text") }) : isImage ? /* @__PURE__ */ jsx(SmartImage, { fileKey: file.key, width: 160, height: 160 }) : isVideo ? /* @__PURE__ */ jsx("video", { src: joinUrl(storageUrl, file.key), autoPlay: true, loop: true, muted: true }) : /* @__PURE__ */ jsx("span", { className: cn("scale-[2]"), children: "\u{1F4C4}" }) }),
         title: fileT.name || /* @__PURE__ */ jsx(NoData, {}),
         className,
         style: { width: WIDTH, height: HEIGHT }

package/dist/src/cms/client/interfaces/components/resources/post/content/post-create-content.js

@@ -3,6 +3,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { useRouter } from 'next/navigation';
 import { POST_TYPES } from 'sitero-domain';
+import { POST_CUSTOM_STATE_FIELDS } from '../../../../../../../config/post.js';
 import 'mime-types';
 import 'react';
 import 'ua-parser-js';
@@ -62,8 +63,10 @@ import 'intor/next';
 import { ContentContainer } from '../../../ui/layouts/content-container.js';
 import { CategoryTable } from '../category/category-table.js';
 import { TagTable } from '../tag/tag-table.js';
+import { resolveControlFieldLabel } from './resolve-control-field-label.js';
 
 function createPostCreateContent({
+  customControlFields: defaultCustomControlFields = [],
   usePostCreateFormData,
   postCreateAction,
   AdminCard,
@@ -91,6 +94,7 @@ function createPostCreateContent({
     controlMeta,
     isFetching,
     allowField,
+    customControlFields = defaultCustomControlFields,
     cancelButtonHref
   }) {
     const { t, locale: cmsLocale } = useTranslator();
@@ -197,7 +201,10 @@ function createPostCreateContent({
                           ...isFieldAllowed(parentType, "isIndexActive") ? ["isIndexActive"] : [],
                           ...isFieldAllowed(parentType, "isSlugActive") ? ["isSlugActive"] : [],
                           ...isFieldAllowed(parentType, "isFeatured") ? ["isFeatured"] : [],
-                          ...isFieldAllowed(parentType, "isShownOnHome") ? ["isShownOnHome"] : []
+                          ...isFieldAllowed(parentType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                          ...POST_CUSTOM_STATE_FIELDS.filter(
+                            (key) => isFieldAllowed(parentType, key)
+                          )
                         ],
                         type: parentType,
                         topicId: topic?.id,
@@ -254,7 +261,10 @@ function createPostCreateContent({
                       ...isFieldAllowed(tagType, "isIndexActive") ? ["isIndexActive"] : [],
                       ...isFieldAllowed(tagType, "isSlugActive") ? ["isSlugActive"] : [],
                       ...isFieldAllowed(tagType, "isFeatured") ? ["isFeatured"] : [],
-                      ...isFieldAllowed(tagType, "isShownOnHome") ? ["isShownOnHome"] : []
+                      ...isFieldAllowed(tagType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                      ...POST_CUSTOM_STATE_FIELDS.filter(
+                        (key) => isFieldAllowed(tagType, key)
+                      )
                     ],
                     type: tagType,
                     Card: TagCard,
@@ -555,7 +565,10 @@ function createPostCreateContent({
                           ...isFieldAllowed(postType, "isIndexActive") ? ["isIndexActive"] : [],
                           ...isFieldAllowed(postType, "isSlugActive") ? ["isSlugActive"] : [],
                           ...isFieldAllowed(postType, "isFeatured") ? ["isFeatured"] : [],
-                          ...isFieldAllowed(postType, "isShownOnHome") ? ["isShownOnHome"] : []
+                          ...isFieldAllowed(postType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                          ...POST_CUSTOM_STATE_FIELDS.filter(
+                            (key) => isFieldAllowed(postType, key)
+                          )
                         ],
                         type: postType,
                         topicId: topic?.id
@@ -576,8 +589,8 @@ function createPostCreateContent({
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsxs(SideFields, { children: [
-          /* @__PURE__ */ jsx("div", { className: "max-lg:hidden", children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxs(SideFields, { className: "lg:max-h-[calc(100dvh-7rem)]", children: [
+          /* @__PURE__ */ jsx("div", { className: "shrink-0 max-lg:hidden", children: /* @__PURE__ */ jsx(
             ActionButtonsCard,
             {
               isInitializing: isFetching,
@@ -594,7 +607,12 @@ function createPostCreateContent({
                 ...isFieldAllowed(postType, "isIndexActive") ? [{ key: "isIndexActive" }] : [],
                 ...isFieldAllowed(postType, "isSlugActive") ? [{ key: "isSlugActive" }] : [],
                 ...isFieldAllowed(postType, "isFeatured") ? [{ key: "isFeatured" }] : [],
-                ...isFieldAllowed(postType, "isShownOnHome") ? [{ key: "isShownOnHome" }] : []
+                ...isFieldAllowed(postType, "isShownOnHome") ? [{ key: "isShownOnHome" }] : [],
+                ...customControlFields.filter(({ key }) => isFieldAllowed(postType, key)).map(({ key, icon, label }) => ({
+                  key,
+                  icon,
+                  label: resolveControlFieldLabel(label, cmsLocale)
+                }))
               ],
               controlMeta,
               formData,

package/dist/src/cms/client/interfaces/components/resources/post/content/post-edit-content.js

@@ -3,6 +3,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { useRouter } from 'next/navigation';
 import { POST_TYPES } from 'sitero-domain';
+import { POST_CUSTOM_STATE_FIELDS } from '../../../../../../../config/post.js';
 import 'mime-types';
 import 'react';
 import 'ua-parser-js';
@@ -61,8 +62,10 @@ import 'intor/next';
 import { ContentContainer } from '../../../ui/layouts/content-container.js';
 import { CategoryTable } from '../category/category-table.js';
 import { TagTable } from '../tag/tag-table.js';
+import { resolveControlFieldLabel } from './resolve-control-field-label.js';
 
 function createPostEditContent({
+  customControlFields: defaultCustomControlFields = [],
   usePostUpdateFormData,
   postUpdateAction,
   AdminCard,
@@ -89,7 +92,8 @@ function createPostEditContent({
     controlMeta,
     isFetching,
     isNotFound,
-    allowField
+    allowField,
+    customControlFields = defaultCustomControlFields
   }) {
     const { t, locale: cmsLocale } = useTranslator();
     const router = useRouter();
@@ -195,7 +199,10 @@ function createPostEditContent({
                           ...isFieldAllowed(parentType, "isIndexActive") ? ["isIndexActive"] : [],
                           ...isFieldAllowed(parentType, "isSlugActive") ? ["isSlugActive"] : [],
                           ...isFieldAllowed(parentType, "isFeatured") ? ["isFeatured"] : [],
-                          ...isFieldAllowed(parentType, "isShownOnHome") ? ["isShownOnHome"] : []
+                          ...isFieldAllowed(parentType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                          ...POST_CUSTOM_STATE_FIELDS.filter(
+                            (key) => isFieldAllowed(parentType, key)
+                          )
                         ],
                         type: parentType,
                         topicId: topic?.id,
@@ -252,7 +259,10 @@ function createPostEditContent({
                       ...isFieldAllowed(tagType, "isIndexActive") ? ["isIndexActive"] : [],
                       ...isFieldAllowed(tagType, "isSlugActive") ? ["isSlugActive"] : [],
                       ...isFieldAllowed(tagType, "isFeatured") ? ["isFeatured"] : [],
-                      ...isFieldAllowed(tagType, "isShownOnHome") ? ["isShownOnHome"] : []
+                      ...isFieldAllowed(tagType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                      ...POST_CUSTOM_STATE_FIELDS.filter(
+                        (key) => isFieldAllowed(tagType, key)
+                      )
                     ],
                     type: tagType,
                     Card: TagCard,
@@ -553,7 +563,10 @@ function createPostEditContent({
                           ...isFieldAllowed(postType, "isIndexActive") ? ["isIndexActive"] : [],
                           ...isFieldAllowed(postType, "isSlugActive") ? ["isSlugActive"] : [],
                           ...isFieldAllowed(postType, "isFeatured") ? ["isFeatured"] : [],
-                          ...isFieldAllowed(postType, "isShownOnHome") ? ["isShownOnHome"] : []
+                          ...isFieldAllowed(postType, "isShownOnHome") ? ["isShownOnHome"] : [],
+                          ...POST_CUSTOM_STATE_FIELDS.filter(
+                            (key) => isFieldAllowed(postType, key)
+                          )
                         ],
                         type: postType,
                         topicId: topic?.id,
@@ -575,8 +588,8 @@ function createPostEditContent({
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsxs(SideFields, { children: [
-          /* @__PURE__ */ jsx("div", { className: "max-lg:hidden", children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxs(SideFields, { className: "lg:max-h-[calc(100dvh-7rem)]", children: [
+          /* @__PURE__ */ jsx("div", { className: "shrink-0 max-lg:hidden", children: /* @__PURE__ */ jsx(
             ActionButtonsCard,
             {
               action: "update",
@@ -593,7 +606,14 @@ function createPostEditContent({
                 ...isFieldAllowed(postType, "isIndexActive", post?.slug) ? [{ key: "isIndexActive" }] : [],
                 ...isFieldAllowed(postType, "isSlugActive", post?.slug) ? [{ key: "isSlugActive" }] : [],
                 ...isFieldAllowed(postType, "isFeatured", post?.slug) ? [{ key: "isFeatured" }] : [],
-                ...isFieldAllowed(postType, "isShownOnHome", post?.slug) ? [{ key: "isShownOnHome" }] : []
+                ...isFieldAllowed(postType, "isShownOnHome", post?.slug) ? [{ key: "isShownOnHome" }] : [],
+                ...customControlFields.filter(
+                  ({ key }) => isFieldAllowed(postType, key, post?.slug)
+                ).map(({ key, icon, label }) => ({
+                  key,
+                  icon,
+                  label: resolveControlFieldLabel(label, cmsLocale)
+                }))
               ],
               controlMeta,
               formData,

package/dist/src/cms/client/interfaces/components/resources/post/content/post-show-content.js

@@ -47,8 +47,10 @@ import 'next/navigation';
 import 'intor/next';
 import 'zod';
 import { ContentContainer } from '../../../ui/layouts/content-container.js';
+import { resolveControlFieldLabel } from './resolve-control-field-label.js';
 
 function createPostShowContent({
+  customControlFields: defaultCustomControlFields = [],
   contentMaxWidth,
   AdminCard,
   PostCard,
@@ -65,9 +67,10 @@ function createPostShowContent({
     topChildren,
     subcategoryType,
     CategoryCard = DefaultCategoryCard,
-    allowField
+    allowField,
+    customControlFields = defaultCustomControlFields
   }) {
-    const { t, format } = useTranslator();
+    const { t, format, locale: cmsLocale } = useTranslator();
     const type = post?.type;
     const topicSlug = post?.topic?.slug;
     const categories = post?.parents;
@@ -280,12 +283,12 @@ function createPostShowContent({
         ] }),
         children
       ] }),
-      /* @__PURE__ */ jsxs(SideFields, { children: [
+      /* @__PURE__ */ jsxs(SideFields, { className: "lg:max-h-[calc(100dvh-7rem)]", children: [
         /* @__PURE__ */ jsx(
           Field,
           {
             label: t("resources.post.created-at.text"),
-            wrapperClassName: "max-lg:hidden",
+            wrapperClassName: "shrink-0 max-lg:hidden",
             children: /* @__PURE__ */ jsx(FieldBody, { isLoading: isFetching, children: post?.createdAt && format.date(new Date(post?.createdAt), DATE_FORMAT_OPTIONS) })
           }
         ),
@@ -298,7 +301,12 @@ function createPostShowContent({
               ...isFieldAllowed(type, "isIndexActive", post?.slug) ? [{ key: "isIndexActive" }] : [],
               ...isFieldAllowed(type, "isSlugActive", post?.slug) ? [{ key: "isSlugActive" }] : [],
               ...isFieldAllowed(type, "isFeatured", post?.slug) ? [{ key: "isFeatured" }] : [],
-              ...isFieldAllowed(type, "isShownOnHome", post?.slug) ? [{ key: "isShownOnHome" }] : []
+              ...isFieldAllowed(type, "isShownOnHome", post?.slug) ? [{ key: "isShownOnHome" }] : [],
+              ...customControlFields.filter(({ key }) => isFieldAllowed(type, key, post?.slug)).map(({ key, icon, label }) => ({
+                key,
+                icon,
+                label: resolveControlFieldLabel(label, cmsLocale)
+              }))
             ],
             formData: { ...post },
             isDisplay: true,

package/dist/src/cms/client/interfaces/components/resources/post/content/resolve-control-field-label.js

@@ -0,0 +1,9 @@
+import { CMS_LOCALES_ARRAY, CMS_DEFAULT_LOCALE } from '../../../../../../../constants/cms-locale.js';
+
+function resolveControlFieldLabel(label, locale) {
+  if (typeof label === "string") return label;
+  const cmsLocale = CMS_LOCALES_ARRAY.find((supported) => supported === locale) ?? CMS_DEFAULT_LOCALE;
+  return label[cmsLocale] ?? label[CMS_DEFAULT_LOCALE];
+}
+
+export { resolveControlFieldLabel };

package/dist/src/cms/client/interfaces/components/resources/post/post-list.js

@@ -36,22 +36,18 @@ import '../../../../../../constants/paths/redirect.js';
 import '../../../../../../constants/cms-locale.js';
 import { ListContainer } from '../../ui/blocks/list-container/list-container.js';
 import { PostTable } from './post-table.js';
+import { toActiveControlFieldFilters } from './search/control-field-filter-state.js';
 import { ControlFieldsFilters } from './search/control-fields-filters.js';
 
-function toActiveControlFieldFilters(controlFields, usableFields) {
-  return Object.fromEntries(
-    Object.entries(controlFields).flatMap(
-      ([key, value]) => value !== null && (!usableFields || usableFields.includes(key)) ? [[key, value]] : []
-    )
-  );
-}
 function createPostList({
+  customControlFields: defaultCustomControlFields = [],
   postFindListCardsAction,
   PostCard,
   defaultWebLocale,
   strategies
 }) {
   return function PostList({
+    customControlFields = defaultCustomControlFields,
     enabled = true,
     usableFields,
     // search
@@ -94,6 +90,7 @@ function createPostList({
     };
     const activeControlFieldFilters = toActiveControlFieldFilters(
       controlFields,
+      customControlFields,
       usableFields
     );
     const { data, isFetching } = useQuery(
@@ -150,6 +147,7 @@ function createPostList({
         filters: /* @__PURE__ */ jsx(
           ControlFieldsFilters,
           {
+            customControlFields,
             usableFields,
             controlFields,
             setControlFields: setControlFieldsWithPageReset

package/dist/src/cms/client/interfaces/components/resources/post/search/control-field-filter-state.js

@@ -0,0 +1,20 @@
+const BUILT_IN_KEYS = [
+  "isActive",
+  "isIndexActive",
+  "isSlugActive",
+  "isFeatured",
+  "isShownOnHome"
+];
+function toActiveControlFieldFilters(controlFields, customControlFields, usableFields) {
+  const result = {};
+  const keys = [...BUILT_IN_KEYS, ...customControlFields.map(({ key }) => key)];
+  for (const key of keys) {
+    const value = controlFields[key];
+    if (typeof value === "boolean" && (!usableFields || usableFields.includes(key))) {
+      result[key] = value;
+    }
+  }
+  return result;
+}
+
+export { toActiveControlFieldFilters };

package/dist/src/cms/client/interfaces/components/resources/post/search/control-fields-filters.js

@@ -1,7 +1,8 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { Eye, Binary, MapPinCheckInside, Star, House } from 'lucide-react';
 import { BooleanFilter } from '../../../ui/features/boolean-filter.js';
+import { resolveControlFieldLabel } from '../content/resolve-control-field-label.js';
 
 const CONTROL_FIELDS = [
   {
@@ -32,22 +33,35 @@ const CONTROL_FIELDS = [
 ];
 function ControlFieldsFilters({
   usableFields,
+  customControlFields = [],
   controlFields,
   setControlFields
 }) {
-  const { t } = useTranslator();
-  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3", children: CONTROL_FIELDS.filter(
-    ({ key }) => !usableFields || usableFields.includes(key)
-  ).map(({ key, label, icon: Icon }) => /* @__PURE__ */ jsx(
-    BooleanFilter,
-    {
-      value: controlFields[key],
-      onChange: (value) => setControlFields((previous) => ({ ...previous, [key]: value })),
-      label: t(label),
-      icon: Icon
-    },
-    key
-  )) });
+  const { t, locale } = useTranslator();
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+    CONTROL_FIELDS.filter(
+      ({ key }) => !usableFields || usableFields.includes(key)
+    ).map(({ key, label, icon: Icon }) => /* @__PURE__ */ jsx(
+      BooleanFilter,
+      {
+        value: controlFields[key] ?? null,
+        onChange: (value) => setControlFields((previous) => ({ ...previous, [key]: value })),
+        label: t(label),
+        icon: Icon
+      },
+      key
+    )),
+    customControlFields.filter(({ key }) => !usableFields || usableFields.includes(key)).map(({ key, label, icon }) => /* @__PURE__ */ jsx(
+      BooleanFilter,
+      {
+        value: controlFields[key] ?? null,
+        onChange: (value) => setControlFields((previous) => ({ ...previous, [key]: value })),
+        label: resolveControlFieldLabel(label, locale),
+        icon
+      },
+      key
+    ))
+  ] });
 }
 
 export { ControlFieldsFilters };

package/dist/src/cms/client/interfaces/components/ui/form/containers/side-fields.js

@@ -22,7 +22,7 @@ function SideFields({
       className: cn("relative", "lg:min-h-full", wrapperClassName),
       style: { width: isMobile ? "100%" : `${CMS_FORM_SIDE_FIELDS_WIDTH}px` },
       ...props,
-      children: /* @__PURE__ */ jsx("div", { className: cn("top-24 lg:sticky", "flex flex-col gap-6", className), children })
+      children: /* @__PURE__ */ jsx("div", { className: cn("top-22 lg:sticky", "flex flex-col gap-6", className), children })
     }
   );
 }

package/dist/src/cms/client/interfaces/components/ui/form/control-fields/control-fields-display.js

@@ -95,16 +95,26 @@ function ControlFieldsDisplay({
         )
       }
     ),
-    notBuiltInFields.map(({ key, label }) => {
-      return /* @__PURE__ */ jsx(Field, { label, children: /* @__PURE__ */ jsx(
-        Checkbox,
+    notBuiltInFields.map(({ key, icon: Icon, label }) => {
+      return /* @__PURE__ */ jsx(
+        Field,
         {
-          fieldName: key,
-          formData,
-          isLoading,
-          isDisplay: true
-        }
-      ) }, key);
+          label: Icon ? /* @__PURE__ */ jsxs("span", { className: "flex-center gap-2", children: [
+            /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true" }),
+            label
+          ] }) : label,
+          children: /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              fieldName: key,
+              formData,
+              isLoading,
+              isDisplay: true
+            }
+          )
+        },
+        key
+      );
     })
   ] });
 }

package/dist/src/cms/client/interfaces/components/ui/form/control-fields/control-fields-input.js

@@ -139,18 +139,29 @@ function ControlFieldsInput({
         )
       }
     ),
-    notBuiltInFields.map(({ key, label }) => {
-      return /* @__PURE__ */ jsx(Field, { htmlFor: key, label, children: /* @__PURE__ */ jsx(
-        Checkbox,
+    notBuiltInFields.map(({ key, icon: Icon, label }) => {
+      return /* @__PURE__ */ jsx(
+        Field,
         {
-          id: key,
-          fieldName: key,
-          formData,
-          setFormData,
-          isLoading,
-          isDisabled
-        }
-      ) }, key);
+          htmlFor: key,
+          label: Icon ? /* @__PURE__ */ jsxs("span", { className: "flex-center gap-2", children: [
+            /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true" }),
+            label
+          ] }) : label,
+          children: /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              id: key,
+              fieldName: key,
+              formData,
+              setFormData,
+              isLoading,
+              isDisabled
+            }
+          )
+        },
+        key
+      );
     })
   ] });
 }

package/dist/src/cms/client/interfaces/components/ui/form/control-fields/control-fields.js

@@ -45,7 +45,12 @@ function ControlFields({
   return /* @__PURE__ */ jsx(
     Card,
     {
-      className: cn("flex flex-col gap-6", "bg-base-100 p-4", "[&_svg]:size-4"),
+      className: cn(
+        "flex flex-col gap-6",
+        "bg-base-100 p-4",
+        "lg:min-h-0 lg:overflow-y-auto",
+        "*:shrink-0 [&_svg]:size-4"
+      ),
       ...props,
       children: !isDisplay ? /* @__PURE__ */ jsx(
         ControlFieldsInput,

package/dist/src/cms/client/interfaces/pages/dashboard/content/content-management/_topicSlug_/page.js

@@ -12,6 +12,7 @@ import '../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { useCmsQuery } from '../../../../../../infrastructure/operation-result/use-cms-query.js';
 import { isContentTopic, hasTopicRole } from '../../../../../../../../config/topics.js';
+import { POST_CUSTOM_STATE_FIELDS } from '../../../../../../../../config/post.js';
 import { CMS_PATHS } from '../../../../../../../../constants/paths/cms-paths.js';
 import '../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../constants/cms-locale.js';
@@ -94,6 +95,7 @@ function createTopicScopePage({
       {}
     );
     const getUsableFields = (type) => [
+      ...POST_CUSTOM_STATE_FIELDS.filter((key) => isFieldAllowed(type, key)),
       ...isFieldAllowed(type, "isActive") ? ["isActive"] : [],
       ...isFieldAllowed(type, "isIndexActive") ? ["isIndexActive"] : [],
       ...isFieldAllowed(type, "isSlugActive") ? ["isSlugActive"] : [],

package/dist/src/cms/client/interfaces/pages/dashboard/content/content-management/tag/page.js

@@ -3,6 +3,7 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { Tag, Plus } from 'lucide-react';
 import { POST_TYPES } from 'sitero-domain';
+import { POST_CUSTOM_STATE_FIELDS } from '../../../../../../../../config/post.js';
 import { CMS_PATHS } from '../../../../../../../../constants/paths/cms-paths.js';
 import '../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../constants/cms-locale.js';
@@ -80,6 +81,9 @@ function createTagIndexPage({
         PostList,
         {
           usableFields: [
+            ...POST_CUSTOM_STATE_FIELDS.filter(
+              (field) => allowField({ type, field })
+            ),
             ...allowField({ type, field: "isActive" }) ? ["isActive"] : [],
             ...allowField({ type, field: "isIndexActive" }) ? ["isIndexActive"] : [],
             ...allowField({ type, field: "isSlugActive" }) ? ["isSlugActive"] : [],

package/dist/src/cms/client/interfaces/pages/dashboard/content/content-management/topic/page.js

@@ -5,6 +5,7 @@ import { SquareLibrary } from 'lucide-react';
 import { useMemo } from 'react';
 import { POST_TYPES } from 'sitero-domain';
 import { isContentTopic } from '../../../../../../../../config/topics.js';
+import { POST_CUSTOM_STATE_FIELDS } from '../../../../../../../../config/post.js';
 import 'mime-types';
 import 'ua-parser-js';
 import '../../../../../../../../shared/client/react-query/client.js';
@@ -79,6 +80,9 @@ function createTopicIndexPage({
         {
           enabled: !isFetching,
           usableFields: [
+            ...POST_CUSTOM_STATE_FIELDS.filter(
+              (field) => allowField({ type: POST_TYPES.TOPIC, field })
+            ),
             ...allowField({ type: POST_TYPES.TOPIC, field: "isActive" }) ? ["isActive"] : [],
             ...allowField({ type: POST_TYPES.TOPIC, field: "isIndexActive" }) ? ["isIndexActive"] : [],
             ...allowField({ type: POST_TYPES.TOPIC, field: "isSlugActive" }) ? ["isSlugActive"] : [],