tycho-components 0.46.2 → 0.46.3

package/dist/common/AppCard/AppCard.d.ts

@@ -8,6 +8,7 @@ type Props = {
     options?: DropdownMenuItem[];
     className?: string;
     onClick?: () => void;
+    dataTour?: string;
 };
-export default function AppCard({ title, children, extraHeaderActions, footer, options, className, onClick, }: Props): import("react").JSX.Element;
+export default function AppCard({ title, children, extraHeaderActions, footer, options, className, onClick, dataTour, }: Props): import("react").JSX.Element;
 export {};

package/dist/common/AppCard/AppCard.js

@@ -2,6 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cx from 'classnames';
 import { DropdownMenu } from 'tycho-storybook';
 import './style.scss';
-export default function AppCard({ title, children, extraHeaderActions, footer, options, className, onClick, }) {
-    return (_jsxs("div", { className: cx('ds-app-card', className), onClick: onClick, children: [title && (_jsxs("div", { className: "header", children: [_jsx("div", { className: "title", children: title }), extraHeaderActions && (_jsx("div", { className: "extra-header-actions", children: extraHeaderActions })), options && _jsx(DropdownMenu, { list: options })] })), _jsx("div", { className: "body", children: children }), footer && _jsx("div", { className: "footer", children: footer })] }));
+export default function AppCard({ title, children, extraHeaderActions, footer, options, className, onClick, dataTour, }) {
+    return (_jsxs("div", { className: cx('ds-app-card', className), onClick: onClick, "data-tour": dataTour, children: [title && (_jsxs("div", { className: "header", children: [_jsx("div", { className: "title", children: title }), extraHeaderActions && (_jsx("div", { className: "extra-header-actions", children: extraHeaderActions })), options && _jsx(DropdownMenu, { list: options })] })), _jsx("div", { className: "body", children: children }), footer && _jsx("div", { className: "footer", children: footer })] }));
 }

package/dist/features/AccessControl/AccessUsers/AccessUsers.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { AccessMode } from '../../../configs/types/Access';
-import './styles.scss';
+import React from "react";
+import { AccessMode } from "../../../configs/types/Access";
+import "./styles.scss";
 export type AccessUsersProps = {
     mode: AccessMode;
     resourceUid: string;

package/dist/features/AccessControl/AccessUsers/AccessUsers.js

@@ -1,25 +1,25 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Tag } from 'tycho-storybook';
-import { AppCard, AppLoading, AppPicture, AppPlaceholder, AppTable, EMPTY_PAGE, } from '../../../common';
-import DateUtils from '../../../functions/DateUtils';
-import AccessControlService from '../AccessControlService';
-import AccessGrant from '../AccessGrant';
-import AccessUser from '../AccessUser';
-import { EMPTY_ACCESS_SEARCH_FILTER, } from './AccessUsersFilter';
-import './styles.scss';
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Tag } from "tycho-storybook";
+import { AppCard, AppLoading, AppPicture, AppPlaceholder, AppTable, EMPTY_PAGE, } from "../../../common";
+import DateUtils from "../../../functions/DateUtils";
+import AccessControlService from "../AccessControlService";
+import AccessGrant from "../AccessGrant";
+import AccessUser from "../AccessUser";
+import { EMPTY_ACCESS_SEARCH_FILTER, } from "./AccessUsersFilter";
+import "./styles.scss";
 const STATUS_TAG_COLOR = {
-    ACTIVE: 'green',
-    INACTIVE: 'gray',
+    ACTIVE: "green",
+    INACTIVE: "gray",
 };
 const ROLE_TAG_COLOR = {
-    ADMIN: 'violet',
-    EDITOR: 'blue',
-    READER: 'yellow',
+    ADMIN: "violet",
+    EDITOR: "blue",
+    READER: "yellow",
 };
 export default function AccessUsers({ mode, resourceUid }) {
-    const { t } = useTranslation('access');
+    const { t } = useTranslation("access");
     const [filter, setFilter] = useState(EMPTY_ACCESS_SEARCH_FILTER);
     const [open, setOpen] = useState(false);
     const [loading, setLoading] = useState(true);
@@ -47,8 +47,8 @@ export default function AccessUsers({ mode, resourceUid }) {
     });
     const menuOptions = [
         {
-            icon: 'add',
-            label: t('common:button.add'),
+            icon: "add",
+            label: t("common:button.add"),
             onClick: handleCreate,
         },
     ];
@@ -57,7 +57,7 @@ export default function AccessUsers({ mode, resourceUid }) {
     };
     const addStatusToCell = (props) => {
         const status = props.row.original.status;
-        return (_jsx(Tag, { text: t(`status.label.${status?.toLowerCase() ?? ''}`), color: status ? STATUS_TAG_COLOR[status] : 'gray', size: "small" }));
+        return (_jsx(Tag, { text: t(`status.label.${status?.toLowerCase() ?? ""}`), color: status ? STATUS_TAG_COLOR[status] : "gray", size: "small" }));
     };
     const addRoleToCell = (props) => {
         const role = props.row.original.role;
@@ -69,29 +69,29 @@ export default function AccessUsers({ mode, resourceUid }) {
     };
     const columns = React.useMemo(() => [
         {
-            id: 'original',
-            header: '',
+            id: "original",
+            header: "",
             cell: addImageToCell,
             size: 10,
         },
         {
-            id: 'name',
-            header: t('table.label.name'),
+            id: "name",
+            header: t("table.label.name"),
             accessorFn: (row) => row.name || row.email,
             cell: addNameToCell,
             size: 35,
         },
         {
-            id: 'status',
-            header: t('table.label.status'),
-            accessorKey: 'status',
+            id: "status",
+            header: t("table.label.status"),
+            accessorKey: "status",
             cell: addStatusToCell,
             size: 15,
         },
         {
-            id: 'role',
-            header: t('table.label.role'),
-            accessorKey: 'role',
+            id: "role",
+            header: t("table.label.role"),
+            accessorKey: "role",
             cell: addRoleToCell,
             size: 35,
         },
@@ -99,11 +99,11 @@ export default function AccessUsers({ mode, resourceUid }) {
     useEffect(() => {
         paginate();
     }, [filter, resourceUid, mode]);
-    return (_jsxs(AppCard, { title: t('title.users'), options: menuOptions, className: "access-users-container", children: [loading && _jsx(AppLoading, { pageLoading: true }), !loading && data.totalElements > 0 && (_jsx(AppTable, { columns: columns, data: data, className: "users-table", onClickRow: onClickRow, pagination: { pageIndex: filter.page, pageSize: filter.size }, setPagination: (p) => {
+    return (_jsxs(AppCard, { title: t("title.users"), options: menuOptions, className: "access-users-container", "data-tour": "admin-access-users-panel", children: [loading && _jsx(AppLoading, { pageLoading: true }), !loading && data.totalElements > 0 && (_jsx(AppTable, { columns: columns, data: data, className: "users-table", onClickRow: onClickRow, pagination: { pageIndex: filter.page, pageSize: filter.size }, setPagination: (p) => {
                     setFilter({ ...filter, page: p.pageIndex, size: p.pageSize });
                 }, sorting: filter.sort || [], setSorting: (s) => {
                     setFilter({ ...filter, sort: s });
-                } })), !loading && data.totalElements === 0 && (_jsx(AppPlaceholder, { text: t('access.placeholder') })), selected && (_jsx(AccessUser, { mode: mode, resourceUid: resourceUid, user: selected, setItems: setData, onClose: () => {
+                } })), !loading && data.totalElements === 0 && (_jsx(AppPlaceholder, { text: t("access.placeholder"), useMarginTop: true })), selected && (_jsx(AccessUser, { mode: mode, resourceUid: resourceUid, user: selected, setItems: setData, onClose: () => {
                     setSelected(undefined);
                 }, onReload: () => {
                     setSelected(undefined);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tycho-components",
   "private": false,
-  "version": "0.46.2",
+  "version": "0.46.3",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {