sitero 0.2.0 → 0.3.0

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

@@ -1,5 +1,4 @@
 import 'react/jsx-runtime';
-import 'intor/react';
 import 'lucide-react';
 import '../../../../constants/paths/redirect.js';
 import '../../../../constants/cms-locale.js';
@@ -11,7 +10,6 @@ import '../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import 'next/link';
 import '@radix-ui/react-avatar';
 import './shadcn/badge.js';
@@ -29,8 +27,16 @@ import 'next-themes';
 import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import 'intor/react';
 import 'next/navigation';
+import './ui/inputs/input.js';
+import './ui/inputs/textarea.js';
+import './ui/inputs/switch-input.js';
+import './ui/inputs/password-input.js';
 import 'next/image';
+import 'zod';
+import '../../infrastructure/admin-session/admin-context.js';
+import 'intor/next';
 import { createPostCreateContent } from './resources/post/content/post-create-content.js';
 import { createPostEditContent } from './resources/post/content/post-edit-content.js';
 import { createPostShowContent } from './resources/post/content/post-show-content.js';
@@ -38,39 +44,43 @@ import { createPostShowContent } from './resources/post/content/post-show-conten
 function createPostContents(input) {
   const { actions, applications, constants, components } = input;
   const PostCreateContent = createPostCreateContent({
+    AdminCard: components.resources.AdminCard,
     AdminList: components.resources.AdminList,
+    CategoryCard: components.resources.CategoryCard,
     FileCard: components.resources.FileCard,
     FileList: components.resources.FileList,
-    I18nEditor: components.I18nEditor,
-    I18nNumberInput: components.i18n.I18nNumberInput,
-    I18nObjectArrayInput: components.i18n.I18nObjectArrayInput,
-    I18nTextarea: components.i18n.I18nTextarea,
+    Editor: components.Editor,
     PostCard: components.resources.PostCard,
     postCreateAction: actions.resources.post.create,
     PostList: components.resources.PostList,
+    TagCard: components.resources.TagCard,
     Uploader: components.blobFile.Uploader,
-    usePostCreateFormData: applications.resources.post.create
+    usePostCreateFormData: applications.resources.post.create,
+    webLocales: constants.webLocales
   });
   const PostEditContent = createPostEditContent({
+    AdminCard: components.resources.AdminCard,
     AdminList: components.resources.AdminList,
+    CategoryCard: components.resources.CategoryCard,
     FileCard: components.resources.FileCard,
     FileList: components.resources.FileList,
-    I18nEditor: components.I18nEditor,
-    I18nNumberInput: components.i18n.I18nNumberInput,
-    I18nObjectArrayInput: components.i18n.I18nObjectArrayInput,
-    I18nTextarea: components.i18n.I18nTextarea,
+    Editor: components.Editor,
     PostCard: components.resources.PostCard,
     postUpdateAction: actions.resources.post.update,
     PostList: components.resources.PostList,
+    TagCard: components.resources.TagCard,
     Uploader: components.blobFile.Uploader,
-    usePostUpdateFormData: applications.resources.post.update
+    usePostUpdateFormData: applications.resources.post.update,
+    webLocales: constants.webLocales
   });
   const PostShowContent = createPostShowContent({
+    AdminCard: components.resources.AdminCard,
+    CategoryCard: components.resources.CategoryCard,
     FileCard: components.resources.FileCard,
-    I18nDisplay: components.i18n.I18nDisplay,
-    I18nObjectArrayDisplay: components.i18n.I18nObjectArrayDisplay,
     PostCard: components.resources.PostCard,
-    contentMaxWidth: constants.contentMaxWidth
+    TagCard: components.resources.TagCard,
+    contentMaxWidth: constants.contentMaxWidth,
+    webLocales: constants.webLocales
   });
   return {
     resources: {

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

@@ -1,7 +1,7 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
-import { Activity, ShieldUser } from 'lucide-react';
+import { ShieldUser } from 'lucide-react';
 import { ADMIN_ROLES } from 'sitero-domain';
 import { CMS_PATHS } from '../../../../../../constants/paths/cms-paths.js';
 import '../../../../../../constants/paths/redirect.js';
@@ -15,8 +15,8 @@ import '@tanstack/react-query';
 import 'clsx';
 import 'tailwind-merge';
 import { joinUrl } from '../../../../../../shared/utils/join-url.js';
-import 'zod';
-import { ResourceCard } from '../../ui/cards/resource-card/resource-card.js';
+import { ResourceCard } from '../../ui/cards/resource-card.js';
+import 'next/link';
 import '@radix-ui/react-avatar';
 import '../../shadcn/badge.js';
 import '../../shadcn/button.js';
@@ -33,48 +33,55 @@ import 'next-themes';
 import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
-import 'next/navigation';
-import 'next/link';
+import { NoData } from '../../ui/display/no-data.js';
+import '../../ui/inputs/input.js';
+import '../../ui/inputs/textarea.js';
 import { AdminStateIcons } from './admin-state-icons.js';
 
 const WIDTH = "200px";
-function AdminCard({
-  admin,
-  // link
-  openNewTab,
-  // pick
-  isPicked,
-  // base
-  anchorProps,
-  className = ""
+function createAdminCard({
+  defaultWebLocale
 }) {
-  const { t, locale } = useTranslator();
-  const adminT = findTranslation(admin?.translations, locale);
-  const href = joinUrl(CMS_PATHS.system.access.admin.pathname, admin?.id);
-  return /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
-    ResourceCard,
-    {
-      className,
-      style: { width: WIDTH },
-      href,
-      openNewTab,
-      anchorProps,
-      isPicked,
-      modelIcon: /* @__PURE__ */ jsx(ShieldUser, {}),
-      badge: t(
-        `resources.admin.role.${(admin?.role ?? ADMIN_ROLES.ADMIN).toLowerCase()}.text`
-      ),
-      statesChildren: /* @__PURE__ */ jsx(AdminStateIcons, { admin }),
-      titleChildren: adminT.name,
-      contentChildren: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1.5 opacity-75", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ jsx(Activity, {}),
-        /* @__PURE__ */ jsxs("p", { className: "truncate", children: [
-          ":\xA0",
-          /* @__PURE__ */ jsx("span", { className: "text-xs opacity-50", children: t("resources.see-in-details.text") })
-        ] })
-      ] }) })
-    }
-  ) });
+  return function AdminCard({
+    admin,
+    // link
+    openNewTab,
+    // pick
+    isPicked,
+    onSelect,
+    // base
+    className = ""
+  }) {
+    const { t } = useTranslator();
+    const adminT = findTranslation(admin?.translations, defaultWebLocale);
+    const href = joinUrl(CMS_PATHS.system.access.admin.pathname, admin?.id);
+    const title = adminT.name || /* @__PURE__ */ jsx(NoData, {});
+    return /* @__PURE__ */ jsx(
+      ResourceCard,
+      {
+        interaction: onSelect ? {
+          type: "select",
+          isSelected: !!isPicked,
+          onSelect
+        } : {
+          type: "navigate",
+          href,
+          openNewTab
+        },
+        identity: {
+          icon: /* @__PURE__ */ jsx(ShieldUser, {}),
+          badge: t(
+            `resources.admin.role.${(admin?.role ?? ADMIN_ROLES.ADMIN).toLowerCase()}.text`
+          )
+        },
+        state: /* @__PURE__ */ jsx(AdminStateIcons, { admin }),
+        title,
+        secondary: admin?.email,
+        className,
+        style: { width: WIDTH }
+      }
+    );
+  };
 }
 
-export { AdminCard };
+export { createAdminCard };

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

@@ -1,23 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { useTranslator } from 'intor/react';
 import { useState, useMemo, useEffect } from 'react';
-import { useAdmin } from '../../../../infrastructure/admin-session/admin-context.js';
+import 'mime-types';
+import 'sitero-domain';
 import 'ua-parser-js';
 import '../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { useQuery } from '../../../../../../shared/client/react-query/use-query.js';
-import 'mime-types';
-import 'sitero-domain';
 import { cn } from '../../../../../../shared/utils/cn.js';
 import { debounce } from '../../../../../../shared/utils/debounce.js';
 import { ensureArray } from '../../../../../../shared/utils/ensure-array.js';
 import { normalizeUnorderedCacheKey } from '../../../../../../shared/utils/normalize-unordered-cache-key.js';
-import 'zod';
+import { useAdmin } from '../../../../infrastructure/admin-session/admin-context.js';
+import 'intor/react';
 import 'lucide-react';
-import 'next/navigation';
-import '../../../../../../constants/paths/redirect.js';
-import '../../../../../../constants/cms-locale.js';
 import '@radix-ui/react-avatar';
 import '../../shadcn/badge.js';
 import '../../shadcn/button.js';
@@ -34,12 +30,17 @@ import 'next-themes';
 import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import 'next/link';
+import 'next/navigation';
+import '../../../../../../constants/paths/redirect.js';
+import '../../../../../../constants/cms-locale.js';
 import { ListContainer } from '../../ui/blocks/list-container/list-container.js';
-import { AdminCard } from './admin-card.js';
 import { AdminTable } from './admin-table.js';
 
 function createAdminList({
-  adminFindListCardsAction
+  adminFindListCardsAction,
+  AdminCard,
+  defaultWebLocale
 }) {
   return function AdminList({
     // search
@@ -51,10 +52,10 @@ function createAdminList({
     handleClick,
     // item states
     setListItemStates,
+    onLoadingChange,
     // list
     localKey = "admin"
   }) {
-    const { locale } = useTranslator();
     const { admin } = useAdmin();
     const [page, setPage] = useState(1);
     const [pageSize, setPageSize] = useState(20);
@@ -65,7 +66,7 @@ function createAdminList({
     );
     const { data, isFetching } = useQuery(
       () => adminFindListCardsAction({
-        locale,
+        locale: defaultWebLocale,
         searchString,
         adminIds,
         currentRole: admin?.role,
@@ -74,7 +75,7 @@ function createAdminList({
       }),
       [
         "adminFindListCardsAction",
-        locale,
+        defaultWebLocale,
         searchString,
         normalizeUnorderedCacheKey(adminIds),
         admin?.role,
@@ -90,10 +91,12 @@ function createAdminList({
         isFetching
       });
     }, [admins, data?.total, isFetching, setListItemStates]);
+    useEffect(() => {
+      onLoadingChange?.(isFetching);
+    }, [onLoadingChange, isFetching]);
     return /* @__PURE__ */ jsx(
       ListContainer,
       {
-        localKey,
         setListItemStates,
         page,
         setPage,
@@ -103,34 +106,34 @@ function createAdminList({
         searchString,
         setSearchString: debouncedSetSearchString,
         isFetching,
-        cardChildren: admins.map((admin2) => {
-          const isPicked = !!pickedItems?.some(({ id }) => id === admin2.id);
-          return /* @__PURE__ */ jsx(
-            AdminCard,
+        display: {
+          mode: "switchable",
+          localKey,
+          cards: admins.map((admin2) => {
+            const isPicked = !!pickedItems?.some(({ id }) => id === admin2.id);
+            return /* @__PURE__ */ jsx(
+              AdminCard,
+              {
+                admin: admin2,
+                openNewTab,
+                isPicked,
+                onSelect: handleClick ? () => handleClick(admin2) : void 0,
+                className: cn(pickedItems && !isPicked && "opacity-50")
+              },
+              admin2.id
+            );
+          }),
+          table: /* @__PURE__ */ jsx(
+            AdminTable,
             {
-              admin: admin2,
+              admins,
+              pickedItems,
+              onSelect: handleClick,
               openNewTab,
-              isPicked,
-              anchorProps: handleClick && {
-                onClick: (e) => {
-                  e.preventDefault();
-                  handleClick(admin2);
-                }
-              },
-              className: cn(pickedItems && !isPicked && "opacity-50")
-            },
-            admin2.id
-          );
-        }),
-        tableChildren: /* @__PURE__ */ jsx(
-          AdminTable,
-          {
-            admins,
-            pickedItems,
-            handleClick,
-            openNewTab
-          }
-        )
+              contentLocale: defaultWebLocale
+            }
+          )
+        }
       }
     );
   };

package/dist/src/cms/client/interfaces/components/resources/admin/admin-refresh-tokens/active-spot.js

@@ -6,7 +6,6 @@ import 'ua-parser-js';
 import '../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { cn } from '../../../../../../../shared/utils/cn.js';
-import 'zod';
 
 function ActiveSpot({ isActive }) {
   return /* @__PURE__ */ jsx(

package/dist/src/cms/client/interfaces/components/resources/admin/admin-refresh-tokens/admin-refresh-token-card.js

@@ -10,7 +10,6 @@ import 'ua-parser-js';
 import '../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { cn } from '../../../../../../../shared/utils/cn.js';
-import 'zod';
 import '@radix-ui/react-avatar';
 import '../../../shadcn/badge.js';
 import '../../../shadcn/button.js';
@@ -30,7 +29,8 @@ import 'sonner';
 import { Table, TableBody, TableRow, TableCell } from '../../../shadcn/table.js';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
-import { Button } from '../../../ui/buttons/button.js';
+import { ActionButton } from '../../../ui/buttons/action-button.js';
+import 'next/link';
 import 'next/navigation';
 import { ActiveSpot } from './active-spot.js';
 
@@ -38,25 +38,30 @@ function AdminRefreshTokenCard({
   adminRefreshToken,
   isCurrent,
   isDestroying,
+  isDisabled,
   handleDestroy
 }) {
   const { t, format } = useTranslator(
     "resources.admin-refresh-token"
   );
-  const { email, ip, deviceInfo, createdAt, expiresAt } = adminRefreshToken || {};
+  const { email, lastIp, deviceInfo, createdAt, lastUsedAt, expiresAt } = adminRefreshToken || {};
   const { deviceType, platform, timezone, language, browser } = deviceInfo || {};
   const fields = [
     { label: t("email.text"), value: email },
-    { label: t("ip.text"), value: ip },
+    { label: t("last-ip.text"), value: lastIp },
     { label: t("device-type.text"), value: deviceType },
     { label: t("platform.text"), value: platform },
     { label: t("timezone.text"), value: timezone },
     { label: t("language.text"), value: language },
     { label: t("browser.text"), value: browser },
     {
-      label: t("created-at.text"),
+      label: t("session-started-at.text"),
       value: createdAt ? format.date(new Date(createdAt), DATE_FORMAT_OPTIONS) : ""
     },
+    {
+      label: t("last-used-at.text"),
+      value: lastUsedAt ? format.date(new Date(lastUsedAt), DATE_FORMAT_OPTIONS) : ""
+    },
     {
       label: t("expires-at.text"),
       value: expiresAt ? format.date(new Date(expiresAt), DATE_FORMAT_OPTIONS) : ""
@@ -65,20 +70,22 @@ function AdminRefreshTokenCard({
   return /* @__PURE__ */ jsxs(
     Card,
     {
-      className: cn("h-104 justify-between gap-0 p-4 max-sm:w-full sm:w-80"),
+      className: cn(
+        "min-h-112 justify-between gap-0 p-4 max-sm:w-full sm:w-80"
+      ),
       children: [
         /* @__PURE__ */ jsx(Table, { children: /* @__PURE__ */ jsx(TableBody, { children: fields.map(({ label, value }) => /* @__PURE__ */ jsxs(TableRow, { children: [
           /* @__PURE__ */ jsx(TableCell, { className: "min-w-24 font-medium", children: label }),
           /* @__PURE__ */ jsx(TableCell, { className: "max-w-36", children: /* @__PURE__ */ jsx("p", { className: "truncate", children: value }) })
         ] }, label)) }) }),
-        isCurrent ? /* @__PURE__ */ jsxs(Button, { variant: "secondary", isDisabled: true, children: [
+        isCurrent ? /* @__PURE__ */ jsxs(ActionButton, { variant: "secondary", isDisabled: true, children: [
           /* @__PURE__ */ jsx(ActiveSpot, { isActive: true }),
           /* @__PURE__ */ jsx("span", { className: "truncate", children: t("current-session.text") })
         ] }) : /* @__PURE__ */ jsx(
-          Button,
+          ActionButton,
           {
             variant: "destructive",
-            isDisabled: isDestroying,
+            isDisabled,
             isLoading: isDestroying,
             onClick: () => void handleDestroy?.(adminRefreshToken?.id ?? ""),
             children: t("delete-session.text")

package/dist/src/cms/client/interfaces/components/resources/admin/admin-refresh-tokens/admin-sessions-link.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslator } from 'intor/react';
+import { Activity } from 'lucide-react';
+import Link from 'next/link';
+import { CMS_PATHS } from '../../../../../../../constants/paths/cms-paths.js';
+import '../../../../../../../constants/paths/redirect.js';
+import '../../../../../../../constants/cms-locale.js';
+import 'mime-types';
+import 'sitero-domain';
+import 'react';
+import 'ua-parser-js';
+import '../../../../../../../shared/client/react-query/client.js';
+import '@tanstack/react-query';
+import 'clsx';
+import 'tailwind-merge';
+import { joinUrl } from '../../../../../../../shared/utils/join-url.js';
+
+function AdminSessionsLink({ adminId }) {
+  const { t } = useTranslator();
+  return /* @__PURE__ */ jsxs(
+    Link,
+    {
+      href: joinUrl(
+        CMS_PATHS.system.access.admin.pathname,
+        adminId,
+        "admin-refresh-token"
+      ),
+      className: "border-border hover:bg-accent/50 flex h-9 items-center gap-3 rounded-md border px-3 text-sm transition-colors duration-100",
+      children: [
+        /* @__PURE__ */ jsx(Activity, { "aria-hidden": true, className: "text-muted-foreground size-4" }),
+        /* @__PURE__ */ jsx("p", { className: "line-clamp-1 font-medium", children: t("resources.admin-refresh-token.text") })
+      ]
+    }
+  );
+}
+
+export { AdminSessionsLink };

package/dist/src/cms/client/interfaces/components/resources/admin/admin-relations-link.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslator } from 'intor/react';
+import { Network } from 'lucide-react';
+import Link from 'next/link';
+import { CMS_PATHS } from '../../../../../../constants/paths/cms-paths.js';
+import '../../../../../../constants/paths/redirect.js';
+import '../../../../../../constants/cms-locale.js';
+import 'mime-types';
+import 'sitero-domain';
+import 'react';
+import 'ua-parser-js';
+import '../../../../../../shared/client/react-query/client.js';
+import '@tanstack/react-query';
+import 'clsx';
+import 'tailwind-merge';
+import { joinUrl } from '../../../../../../shared/utils/join-url.js';
+
+function AdminRelationsLink({ adminId }) {
+  const { t } = useTranslator();
+  return /* @__PURE__ */ jsxs(
+    Link,
+    {
+      href: joinUrl(
+        CMS_PATHS.system.access.admin.pathname,
+        adminId,
+        "relations"
+      ),
+      className: "border-border hover:bg-accent/50 flex h-9 items-center gap-3 rounded-md border px-3 text-sm transition-colors duration-100",
+      children: [
+        /* @__PURE__ */ jsx(Network, { "aria-hidden": true, className: "text-muted-foreground size-4" }),
+        /* @__PURE__ */ jsx("p", { className: "line-clamp-1 font-medium", children: t("resources.related-resources.text") })
+      ]
+    }
+  );
+}
+
+export { AdminRelationsLink };

package/dist/src/cms/client/interfaces/components/resources/admin/admin-state-icons.js

@@ -1,9 +1,35 @@
-import { jsx } from 'react/jsx-runtime';
-import { MailCheckIcon, MailQuestion } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslator } from 'intor/react';
+import { MailCheckIcon, MailQuestion, Bell } from 'lucide-react';
+import 'mime-types';
+import 'sitero-domain';
+import 'react';
+import 'ua-parser-js';
+import '../../../../../../shared/client/react-query/client.js';
+import '@tanstack/react-query';
+import { cn } from '../../../../../../shared/utils/cn.js';
 
 function AdminStateIcons({ admin }) {
+  const { t } = useTranslator();
   const isEmailVerified = !!admin?.emailVerifiedAt;
-  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: isEmailVerified ? /* @__PURE__ */ jsx(MailCheckIcon, { className: "text-success" }) : /* @__PURE__ */ jsx(MailQuestion, { className: "text-warning" }) });
+  const status = isEmailVerified ? "is-verified" : "not-verified";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-2",
+      role: "img",
+      "aria-label": t(`resources.admin.email-verified-at.status.${status}.text`),
+      children: [
+        isEmailVerified ? /* @__PURE__ */ jsx(MailCheckIcon, { className: "text-success" }) : /* @__PURE__ */ jsx(MailQuestion, { className: "text-warning" }),
+        /* @__PURE__ */ jsx(
+          Bell,
+          {
+            className: cn(!admin?.receivesInquiryNotifications && "opacity-10")
+          }
+        )
+      ]
+    }
+  );
 }
 
 export { AdminStateIcons };