general-assistant
Version:
General Assistant components
40 lines (39 loc) • 3.75 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { uiRightRender as zh_uiRightRender } from '../i18n/zh-cn.json';
import { uiRightRender as en_uiRightRender } from '../i18n/en-us.json';
import { useTranslation } from 'react-i18next';
import { useEffect, useState, useContext } from 'react';
import { useStore } from 'zustand';
import StoreContext from '../_store/StoreContext';
import classNames from 'classnames';
export default function AreaRight() {
const { i18n: i18nContext } = useTranslation();
const dataStore = useContext(StoreContext);
const { isHorizontal, getAreaRight, GlobalCtxs, showAreaLeft, showAreaRight, setShowAreaRight, } = useStore(dataStore, (state) => ({
isHorizontal: state.isHorizontal,
getAreaRight: state.getAreaRight,
GlobalCtxs: state.GlobalCtxs,
showAreaLeft: state.showAreaLeft,
showAreaRight: state.showAreaRight,
setShowAreaRight: state.setShowAreaRight,
}));
useEffect(() => {
if (showAreaRight) {
if (i18nContext.language === 'zh')
setMyText(zh_uiRightRender);
if (i18nContext.language === 'en')
setMyText(en_uiRightRender);
}
}, [i18nContext.language, showAreaRight]);
const _arearight = getAreaRight();
const { Render } = _arearight === null ? {} : _arearight;
const isCustom = typeof Render === 'function' ? '01' : '02';
const [myText, setMyText] = useState('');
return (_jsxs("div", { className: classNames('AreaRightWrap', 'DS-GA-h-full DS-GA-flex', isHorizontal
? 'DS-GA-w-[330px] DS-GA-fixed DS-GA-left-[calc(100%-330px)] DS-GA-bottom-0 DS-GA-z-[11] DS-GA-flex-row DS-GA-animate-transRL DS-GA-bg-text-shal-9'
: 'DS-GA-w-full DS-GA-absolute DS-GA-bottom-0 DS-GA-z-[11] DS-GA-left-0 DS-GA-flex-col DS-GA-bg-text-shal-3', 'md:DS-GA-w-full md:DS-GA-absolute md:DS-GA-left-0 md:DS-GA-z-[11] md:DS-GA-flex-row md:DS-GA-rounded-none md:DS-GA-bg-text-shal-3', showAreaLeft ? 'lg:DS-GA-absolute lg:DS-GA-z-[11] lg:DS-GA-flex-row lg:DS-GA-rounded-none' : 'lg:DS-GA-absolute lg:DS-GA-z-[9] lg:DS-GA-left-auto lg:DS-GA-right-6 lg:DS-GA-top-3 lg:DS-GA-w-117 lg:DS-GA-rounded-xl', '2xl:DS-GA-absolute 2xl:DS-GA-right-6 2xl:DS-GA-left-auto 2xl:DS-GA-top-3 2xl:DS-GA-w-117 2xl:DS-GA-rounded-xl', showAreaLeft ? '2xl:DS-GA-z-[11]' : '2xl:DS-GA-z-[9]'), children: [_jsx("div", { className: classNames(isHorizontal ? 'DS-GA-w-[10px] DS-GA-h-full' : 'DS-GA-w-full DS-GA-h-1/4', 'md:DS-GA-grow md:DS-GA-h-full', showAreaLeft ? '' : 'lg:DS-GA-hidden', '2xl:DS-GA-hidden'), onClick: () => setShowAreaRight(false) }), _jsxs("div", { className: classNames('AreaRightContentWrap', 'DS-GA-overflow-y-auto', isHorizontal
? 'DS-GA-w-full DS-GA-h-full DS-GA-bg-area-mode DS-GA-flex DS-GA-flex-col DS-GA-justify-between DS-GA-rounded-tl-xl DS-GA-rounded-bl-xl'
: 'DS-GA-w-full DS-GA-h-3/4 DS-GA-bg-area-mode DS-GA-rounded-tl-xl DS-GA-rounded-tr-xl DS-GA-flex DS-GA-flex-col DS-GA-justify-between DS-GA-animate-transBT', 'md:DS-GA-w-117 md:DS-GA-h-full md:DS-GA-rounded-none md:DS-GA-animate-transRL', showAreaLeft
? 'lg:DS-GA-w-117 lg:DS-GA-h-full lg:DS-GA-rounded-none lg:DS-GA-animate-transRL'
: 'lg:DS-GA-w-full lg:DS-GA-h-full lg:DS-GA-rounded-xl lg:DS-GA-animate-none', '2xl:DS-GA-w-full 2xl:DS-GA-h-full 2xl:DS-GA-rounded-xl 2xl:DS-GA-animate-none'), children: [isCustom === '01' && GlobalCtxs && _jsx(Render, { ctx: GlobalCtxs }), isCustom === '02' && (_jsx("div", { className: 'DS-GA-w-full DS-GA-h-full DS-GA-flex DS-GA-justify-center DS-GA-items-center DS-GA-text-center DS-GA-p-5 DS-GA-text-text-deep-10', children: myText }))] })] }));
}