@abtnode/ux 1.16.14-beta-c308dc3b → 1.16.14-beta-cb53c14b

package/es/blocklet/access/index.js

@@ -0,0 +1,216 @@
+import { useState } from 'react';
+import styled from '@emotion/styled';
+import PropTypes from 'prop-types';
+import useTheme from '@mui/material/styles/useTheme';
+import Box from '@mui/material/Box';
+import Tooltip from '@mui/material/Tooltip';
+import IconButton from '@mui/material/IconButton';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import ChevronRightIcon from '@mui/icons-material/ChevronRight';
+import Collapse from '@mui/material/Collapse';
+import LaunchIcon from '@mui/icons-material/Launch';
+import EditIcon from '@arcblock/icons/lib/EditIcon';
+import { getDisplayName } from '@blocklet/meta/lib/util';
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Empty from '@arcblock/ux/lib/Empty';
+import { useBlockletContext } from '../../contexts/blocklet';
+import { useTeamContext } from '../../contexts/team';
+import { getBlockletUrl, getBlockletUrlParams } from '../../util';
+import Line from '../component/line';
+import BlockletBundleAvatar from '../bundle-avatar';
+import ConfigAccess, { getComponentWhoCanAccess } from './config-access';
+import AccessConfig from '../../who-can-access/config';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function ComponentItem({
+  blocklet,
+  ancestors,
+  depth
+}) {
+  const theme = useTheme();
+  const {
+    t,
+    locale
+  } = useLocaleContext();
+  const {
+    roles: roleList
+  } = useTeamContext();
+  const [expand, setExpand] = useState(true);
+  const {
+    recommendedDomain: domain
+  } = useBlockletContext();
+  const app = ancestors[0] || blocklet;
+  const mountPoint = `/${ancestors.map(x => x.mountPoint || '/').join('/')}/${blocklet.mountPoint || '/'}`.replace(/\/+/g, '/');
+  const href = getBlockletUrl({
+    blocklet: app,
+    domain: {
+      value: domain
+    },
+    mountPoint,
+    params: getBlockletUrlParams(app, locale)
+  });
+  const iconStyle = {
+    fill: theme.palette.text.secondary
+  };
+  const canExpand = depth > 0 && blocklet.children.length > 0;
+  const expandIcon = /*#__PURE__*/_jsx(IconButton, {
+    size: "small",
+    children: expand ? /*#__PURE__*/_jsx(ExpandMoreIcon, {
+      fontSize: "inherit"
+    }) : /*#__PURE__*/_jsx(ChevronRightIcon, {
+      fontSize: "inherit"
+    })
+  });
+  const {
+    access: whoCanAccess,
+    roles
+  } = getComponentWhoCanAccess(blocklet, app, {
+    roles: roleList
+  });
+  let accessConfig;
+  if (whoCanAccess !== 'roles') {
+    accessConfig = AccessConfig.find(x => x.value === whoCanAccess) || AccessConfig[2];
+  } else {
+    const str = roles.map(x => x.title).join('/');
+    accessConfig = {
+      title: {
+        zh: `只有 ${str} 可以访问`,
+        en: `Only ${str} can access`
+      }
+    };
+  }
+  return [(depth > 0 || blocklet.meta.group !== 'gateway') && /*#__PURE__*/_jsxs(Box, {
+    display: "flex",
+    py: 2,
+    className: "component-item",
+    justifyContent: "space-between",
+    alignItems: "center",
+    children: [/*#__PURE__*/_jsxs(Box, {
+      pl: Math.max((depth - 1) * 2, 0),
+      width: {
+        xs: 300,
+        md: 400
+      },
+      display: "flex",
+      alignItems: "center",
+      style: {
+        cursor: canExpand ? 'pointer' : 'cursor'
+      },
+      onClick: () => canExpand && setExpand(!expand),
+      children: [canExpand ? expandIcon : /*#__PURE__*/_jsx(Box, {
+        width: 28
+      }), /*#__PURE__*/_jsx(BlockletBundleAvatar, {
+        blocklet: blocklet,
+        ancestors: ancestors
+      }), /*#__PURE__*/_jsxs(Box, {
+        ml: "16px",
+        children: [/*#__PURE__*/_jsx(Box, {
+          style: {
+            color: '#222',
+            fontSize: 18
+          },
+          children: getDisplayName(blocklet, true)
+        }), /*#__PURE__*/_jsx(Box, {
+          display: "flex",
+          alignItems: "center",
+          children: /*#__PURE__*/_jsx(Box, {
+            color: "text.secondary",
+            children: accessConfig.title[locale]
+          })
+        })]
+      })]
+    }, blocklet), /*#__PURE__*/_jsxs(Box, {
+      children: [/*#__PURE__*/_jsx(Tooltip, {
+        title: t('common.visit'),
+        children: /*#__PURE__*/_jsx("a", {
+          target: "_blank",
+          href: href,
+          rel: "noopener noreferrer",
+          title: href,
+          children: /*#__PURE__*/_jsx(IconButton, {
+            children: /*#__PURE__*/_jsx(LaunchIcon, {})
+          })
+        })
+      }), /*#__PURE__*/_jsx(ConfigAccess, {
+        blocklet: blocklet,
+        ancestors: ancestors,
+        children: ({
+          open
+        }) => /*#__PURE__*/_jsx(Tooltip, {
+          title: t('common.edit'),
+          children: /*#__PURE__*/_jsx(IconButton, {
+            onClick: open,
+            "data-cy": `btn-edit-${blocklet.meta.did}`,
+            children: /*#__PURE__*/_jsx(EditIcon, {
+              style: iconStyle
+            })
+          })
+        })
+      })]
+    }, "actions")]
+  }, "group-not-gateway-box"), /*#__PURE__*/_jsx(Line, {
+    depth: depth
+  }), blocklet.children?.length ? /*#__PURE__*/_jsx(Collapse, {
+    in: expand,
+    children: blocklet.children.map(x => /*#__PURE__*/_jsx(ComponentItem, {
+      blocklet: x,
+      ancestors: [...ancestors, blocklet],
+      depth: depth + 1
+    }, `${depth + 1}-${x.meta.did}`))
+  }, "blocklet-collapse") : null];
+}
+ComponentItem.propTypes = {
+  blocklet: PropTypes.object.isRequired,
+  ancestors: PropTypes.array,
+  depth: PropTypes.number
+};
+ComponentItem.defaultProps = {
+  ancestors: [],
+  depth: 0
+};
+export default function BlockletAccess() {
+  const {
+    t
+  } = useLocaleContext();
+  const {
+    blocklet
+  } = useBlockletContext();
+  const components = [...blocklet.children] || [];
+  if (blocklet.meta.group !== 'gateway') {
+    // add root blocklet to table list
+    components.unshift(blocklet);
+  }
+  return /*#__PURE__*/_jsx(Div, {
+    component: "div",
+    children: components && components.length ? [/*#__PURE__*/_jsx(Box, {
+      mt: 2,
+      ml: {
+        xs: '-12px',
+        md: '-24px'
+      },
+      style: {
+        maxWidth: 1080
+      },
+      children: /*#__PURE__*/_jsx(ComponentItem, {
+        blocklet: blocklet
+      }, `0-${blocklet.meta.did}`)
+    }, `top-blocklet-${blocklet.meta.did}`)] : /*#__PURE__*/_jsx(Box, {
+      mt: 8,
+      children: /*#__PURE__*/_jsx(Empty, {
+        children: t('blocklet.component.noComponent')
+      })
+    })
+  });
+}
+BlockletAccess.propTypes = {};
+const Div = styled(Box)`
+  .title {
+    font-size: 1.2rem;
+    font-weight: bold;
+    margin-top: ${props => props.theme.spacing(5)};
+    margin-bottom: ${props => props.theme.spacing(3)};
+    &.first {
+      margin-top: 0;
+    }
+  }
+`;

package/es/blocklet/actions.js

@@ -0,0 +1,474 @@
+/* eslint-disable react/no-unstable-nested-components */
+/* eslint-disable operator-linebreak */
+import { useState, useContext } from 'react';
+import PropTypes from 'prop-types';
+import styled from '@emotion/styled';
+import { useNavigate, Link } from 'react-router-dom';
+import useLocalStorage from 'react-use/lib/useLocalStorage';
+import IconButton from '@mui/material/IconButton';
+import Menu from '@mui/material/Menu';
+import Divider from '@mui/material/Divider';
+import ButtonGroup from '@mui/material/ButtonGroup';
+import Spinner from '@mui/material/CircularProgress';
+import MenuItem from '@mui/material/MenuItem';
+import MoreVertIcon from '@mui/icons-material/MoreVert';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import Typography from '@mui/material/Typography';
+import Radio from '@mui/material/Radio';
+import RadioGroup from '@mui/material/RadioGroup';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Alert from '@mui/material/Alert';
+import Button from '@arcblock/ux/lib/Button';
+import { getAppMissingConfigs, isDeletableBlocklet, hasRunnableComponent, getDisplayName, isInProgress } from '@blocklet/meta/lib/util';
+import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
+import { BLOCKLET_CONTROLLER_STATUS, BLOCKLET_MODES, SUSPENDED_REASON } from '@blocklet/constant';
+import { APP_STRUCT_VERSION } from '@abtnode/constant';
+import Toast from '@arcblock/ux/lib/Toast';
+import { sleep, formatError, isDownloading } from '../util';
+import { getServerUrl } from './util';
+import { useNodeContext } from '../contexts/node';
+import Confirm from '../confirm';
+import Icons from './icons';
+import { useBlockletContext } from '../contexts/blocklet';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export default function BlockletActions({
+  blocklet,
+  onStart,
+  onComplete,
+  variant,
+  hasPermission,
+  useBlockletUrlEvaluation,
+  ...rest
+}) {
+  const navigate = useNavigate();
+  const node = useNodeContext();
+  const [anchorEl, setAnchorEl] = useState(null);
+  const [currentAction, setCurrentAction] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [confirmSetting, setConfirmSetting] = useState(null);
+  const {
+    t
+  } = useContext(LocaleContext);
+  const [skipSetup] = useLocalStorage('skip-blocklet-setup', false);
+  const {
+    loading: recommendedUrlLoading,
+    recommendedUrl
+  } = useBlockletUrlEvaluation(blocklet);
+  const {
+    nftState
+  } = useBlockletContext();
+  const inProgress = isInProgress(blocklet.status);
+  let disableStart = blocklet?.controller?.status?.value === BLOCKLET_CONTROLLER_STATUS.suspended;
+  if (!nftState?.expired && blocklet?.controller?.status?.reason === SUSPENDED_REASON.expired) {
+    disableStart = false;
+  }
+  const {
+    inService
+  } = node;
+  const createHandler = (action, fn, requireUserConfirm = false) => async () => {
+    const onConfirm = async params => {
+      onStart({
+        action,
+        blocklet
+      });
+      setLoading(true);
+      setCurrentAction(action);
+      setConfirmSetting(null);
+      let isRemoved = false;
+      try {
+        if (action === 'remove') {
+          await fn(params);
+        } else if (action === 'start') {
+          if (!hasRunnableComponent(blocklet)) {
+            Toast.error(t('blocklet.noComponent'));
+            return;
+          }
+          if (!inService && !skipSetup && !blocklet.settings?.initialized && blocklet.mode !== BLOCKLET_MODES.DEVELOPMENT) {
+            // 跳转到 setup 流程界面时携带 serverUrl 查询参数
+            const serverUrl = getServerUrl(node.info);
+            const url = new URL(recommendedUrl);
+            url.searchParams.set('serverUrl', serverUrl);
+            window.open(url.href);
+            onComplete({
+              action,
+              blocklet
+            });
+            return;
+          }
+          const componentDids = blocklet.children.filter(x => !isInProgress(x.status) && x.status !== 'running').map(x => x.meta.did);
+          const input = {
+            did: blocklet.meta.did,
+            componentDids
+          };
+          await fn({
+            input
+          });
+        } else if (['stop', 'restart', 'reload'].includes(action)) {
+          const componentDids = blocklet.children.filter(x => x.status === 'running').map(x => x.meta.did);
+          const input = {
+            did: blocklet.meta.did,
+            componentDids
+          };
+          await fn({
+            input
+          });
+        } else {
+          const input = {
+            did: blocklet.meta.did
+          };
+          await fn({
+            input
+          });
+        }
+        if (action === 'remove') {
+          isRemoved = true; // Deleted send request and succeeded
+        } else {
+          await sleep(1000); // just avoid user feeling so fast
+        }
+
+        if (action === 'reload') {
+          Toast.success(t('blocklet.reloadSuccess'));
+        }
+        onComplete({
+          action,
+          blocklet
+        });
+      } catch (err) {
+        const errMsg = `Blocklet ${action} failed: ${formatError(err)}`;
+        onComplete({
+          action,
+          blocklet,
+          error: new Error(errMsg)
+        });
+      } finally {
+        if (!isRemoved) {
+          setLoading(false);
+        }
+      }
+    };
+    const onCancel = () => {
+      setLoading(false);
+      setConfirmSetting(null);
+    };
+    const name = getDisplayName(blocklet, true);
+    const removeSetting = blocklet.mode === BLOCKLET_MODES.DEVELOPMENT ? {
+      description: () => /*#__PURE__*/_jsx(Typography, {
+        component: "div",
+        children: /*#__PURE__*/_jsx(Typography, {
+          gutterBottom: true,
+          children: t('blocklet.action.removeApplicationDescription')
+        })
+      }),
+      params: {
+        removeType: 'complete'
+      }
+    } : {
+      description: (params, setParams) => /*#__PURE__*/_jsxs(Typography, {
+        component: "div",
+        children: [/*#__PURE__*/_jsx(Typography, {
+          gutterBottom: true,
+          children: t('blocklet.action.removeApplicationDescription')
+        }), /*#__PURE__*/_jsxs(RadioGroup, {
+          name: "removeType",
+          value: params.removeType,
+          onChange: e => setParams({
+            ...params,
+            removeType: e.target.value
+          }),
+          children: [/*#__PURE__*/_jsx(FormControlLabel, {
+            value: "backup",
+            control: /*#__PURE__*/_jsx(Radio, {}),
+            label: t('blocklet.action.removeApplicationAfterBackup')
+          }), /*#__PURE__*/_jsx(FormControlLabel, {
+            value: "complete",
+            control: /*#__PURE__*/_jsx(Radio, {}),
+            label: t('blocklet.action.removeApplicationComplete')
+          })]
+        })]
+      }),
+      params: {
+        removeType: 'backup'
+      }
+    };
+    const confirmSettings = {
+      stop: {
+        title: `${t('common.stop')} ${name}`,
+        description: t('blocklet.action.stopDescription'),
+        confirm: t('blocklet.action.confirmStop'),
+        cancel: t('common.cancel'),
+        onConfirm,
+        onCancel
+      },
+      restart: {
+        title: `${t('common.restart')} ${name}`,
+        description: t('blocklet.action.restartDescription'),
+        confirm: t('blocklet.action.confirmRestart'),
+        cancel: t('common.cancel'),
+        onConfirm,
+        onCancel
+      },
+      remove: {
+        title: `${t('common.remove')} ${name}`,
+        confirm: t('blocklet.action.confirmRemove'),
+        cancel: t('common.cancel'),
+        onConfirm,
+        onCancel,
+        ...removeSetting
+      },
+      cancelDownload: {
+        title: `${t('common.cancel')}`,
+        description: t('blocklet.action.cancelDownloadDescription', {
+          name
+        }),
+        confirm: t('common.confirm'),
+        cancel: t('common.cancel'),
+        onConfirm,
+        onCancel
+      }
+    };
+    if (requireUserConfirm) {
+      setConfirmSetting(confirmSettings[action]);
+    } else {
+      await onConfirm();
+    }
+  };
+  const open = Boolean(anchorEl);
+  const onOpen = e => {
+    try {
+      e.stopPropagation();
+      e.preventDefault();
+      // eslint-disable-next-line no-empty
+    } catch {}
+    setAnchorEl(e.currentTarget);
+  };
+  const onClose = e => {
+    try {
+      e.stopPropagation();
+      e.preventDefault();
+      // eslint-disable-next-line no-empty
+    } catch {}
+    setAnchorEl(null);
+  };
+  const onAction = async (action, e) => {
+    try {
+      e.stopPropagation();
+      e.preventDefault();
+      // eslint-disable-next-line no-empty
+    } catch {}
+    setAnchorEl(null);
+    if (typeof action.handler === 'function') {
+      try {
+        setLoading(true);
+        setCurrentAction(action.action);
+        await action.handler();
+      } catch (err) {
+        // eslint-disable-next-line no-console
+        console.error(`Blocklet ${action.name} failed: `, err);
+      } finally {
+        setLoading(false);
+      }
+    }
+  };
+  const removeAction = !inService && isDeletableBlocklet(blocklet) && blocklet.structVersion === APP_STRUCT_VERSION ? {
+    action: 'remove',
+    icon: Icons.Remove,
+    name: t('common.remove'),
+    handler: createHandler('remove', async ({
+      removeType
+    }) => {
+      if (removeType === 'backup') {
+        await node.api.backupBlocklet({
+          input: {
+            appDid: blocklet.appDid,
+            to: 'disk'
+          }
+        });
+      }
+      await node.api.deleteBlocklet({
+        input: {
+          did: blocklet.meta.did,
+          keepData: false
+        }
+      });
+    }, true),
+    disabled: inProgress
+  } : null;
+  const cancelDownloadAction = {
+    action: 'remove',
+    icon: Icons.Remove,
+    name: t('common.cancel'),
+    handler: createHandler('cancelDownload', node.api.cancelDownloadBlocklet, true)
+  };
+  const missingRequiredConfigs = getAppMissingConfigs(blocklet);
+  const actions = [{
+    action: 'start',
+    icon: Icons.Start,
+    name: t('common.start'),
+    handler: createHandler('start', node.api.startBlocklet),
+    disabled: disableStart || blocklet.children.every(x => x.status === 'running') || isDownloading(blocklet.status) || recommendedUrlLoading || inProgress
+  }, {
+    action: 'stop',
+    icon: Icons.Stop,
+    name: t('common.stop'),
+    handler: createHandler('stop', node.api.stopBlocklet, true),
+    disabled: !['running', 'starting'].includes(blocklet.status)
+  }, {
+    action: 'restart',
+    icon: Icons.Restart,
+    name: t('common.restart'),
+    handler: createHandler('restart', node.api.restartBlocklet, true),
+    disabled: disableStart || blocklet.status !== 'running'
+  }, {
+    action: 'reload',
+    icon: Icons.Reload,
+    name: t('common.reload'),
+    handler: createHandler('reload', node.api.reloadBlocklet),
+    disabled: disableStart || blocklet.status !== 'running'
+  }, isDownloading(blocklet.status) ? cancelDownloadAction : removeAction, {
+    separator: true
+  }, {
+    onlyInMenu: true,
+    action: 'config',
+    icon: Icons.Config,
+    name: t('common.config'),
+    handler: () => {
+      navigate(`/blocklets/${blocklet.meta.did}/configuration`);
+    },
+    disabled: isDownloading(blocklet.status)
+  }, {
+    onlyInMenu: true,
+    action: 'team',
+    icon: Icons.Group,
+    name: t('common.manageTeam'),
+    handler: () => {
+      navigate(`/blocklets/${blocklet.meta.did}/members`);
+    },
+    disabled: isDownloading(blocklet.status)
+  }, {
+    onlyInMenu: true,
+    action: 'log',
+    icon: Icons.Log,
+    name: t('common.log'),
+    handler: () => {
+      navigate(`/logs/blocklet-${blocklet.meta.did}`);
+    },
+    disabled: isDownloading(blocklet.status)
+  }].filter(Boolean);
+  if (variant === 'menu') {
+    return /*#__PURE__*/_jsxs(Div, {
+      "data-cy": "blocklet-actions",
+      children: [/*#__PURE__*/_jsx(IconButton, {
+        "aria-label": "more",
+        "aria-controls": "actions-menu",
+        "aria-haspopup": "true",
+        "data-cy": "trigger-blocklet-actions",
+        "actions-blocklet-did": blocklet.meta.did,
+        onClick: onOpen,
+        size: "small",
+        disabled: !hasPermission || !isDownloading(blocklet.status) && loading,
+        children: /*#__PURE__*/_jsx(MoreVertIcon, {})
+      }), /*#__PURE__*/_jsxs(Menu, {
+        id: "actions-menu",
+        anchorEl: anchorEl,
+        keepMounted: true,
+        open: open,
+        onClose: onClose,
+        PaperProps: {},
+        children: [missingRequiredConfigs.length > 0 && /*#__PURE__*/_jsxs(Alert, {
+          style: {
+            maxWidth: '400px'
+          },
+          severity: "error",
+          children: [t('blocklet.config.missingRequired'), /*#__PURE__*/_jsx("br", {}), /*#__PURE__*/_jsx(Link, {
+            to: `/blocklets/${blocklet.meta.did}/components`,
+            children: t('blocklet.config.gotoFix')
+          })]
+        }), actions.map((action, i) => {
+          if (action.separator) {
+            // eslint-disable-next-line react/no-array-index-key
+            return /*#__PURE__*/_jsx(Divider, {}, `separator-${i}`);
+          }
+          return /*#__PURE__*/_jsxs(MenuItem, {
+            dense: true,
+            onClick: e => onAction(action, e),
+            disabled: action.disabled,
+            "data-cy": `${action.action}-blocklet`,
+            children: [/*#__PURE__*/_jsx(ListItemIcon, {
+              style: {
+                minWidth: 24
+              },
+              children: /*#__PURE__*/_jsx(action.icon, {
+                fontSize: "small"
+              })
+            }), /*#__PURE__*/_jsx(ListItemText, {
+              primary: action.name
+            })]
+          }, action.name);
+        })]
+      }), confirmSetting && /*#__PURE__*/_jsx(Confirm, {
+        title: confirmSetting.title,
+        description: confirmSetting.description,
+        confirm: confirmSetting.confirm,
+        cancel: confirmSetting.cancel,
+        params: confirmSetting.params,
+        onConfirm: confirmSetting.onConfirm,
+        onCancel: confirmSetting.onCancel
+      })]
+    });
+  }
+  return /*#__PURE__*/_jsxs(Div, {
+    "data-cy": "blocklet-actions",
+    ...rest,
+    children: [/*#__PURE__*/_jsx(ButtonGroup, {
+      children: actions.filter(x => !x.separator && !x.onlyInMenu).map(action => /*#__PURE__*/_jsxs(Button, {
+        title: action.name,
+        "data-cy": `${action.action}-blocklet`,
+        onClick: () => onAction(action),
+        disabled: Boolean(action.disabled) || loading,
+        children: [currentAction === action.action && loading && inProgress ? /*#__PURE__*/_jsx(Spinner, {
+          size: 16
+        }) : /*#__PURE__*/_jsx(action.icon, {}), /*#__PURE__*/_jsx("span", {
+          className: "blocklet-action-text",
+          children: action.name
+        })]
+      }, action.name))
+    }), confirmSetting && /*#__PURE__*/_jsx(Confirm, {
+      title: confirmSetting.title,
+      description: confirmSetting.description,
+      confirm: confirmSetting.confirm,
+      cancel: confirmSetting.cancel,
+      params: confirmSetting.params,
+      onConfirm: confirmSetting.onConfirm,
+      onCancel: confirmSetting.onCancel
+    })]
+  });
+}
+BlockletActions.propTypes = {
+  blocklet: PropTypes.object.isRequired,
+  onStart: PropTypes.func.isRequired,
+  onComplete: PropTypes.func.isRequired,
+  variant: PropTypes.oneOf(['menu', 'group']),
+  hasPermission: PropTypes.bool,
+  useBlockletUrlEvaluation: PropTypes.func
+};
+BlockletActions.defaultProps = {
+  variant: 'menu',
+  hasPermission: false,
+  useBlockletUrlEvaluation: () => ({
+    loading: false,
+    recommendedUrl: window?.location?.href
+  })
+};
+const Div = styled.div`
+  display: flex;
+  align-items: center;
+
+  @media (max-width: ${props => props.theme.breakpoints.values.sm}px) {
+    .MuiButton-root {
+      padding: 4px;
+      font-size: 10px;
+    }
+  }
+`;