@leav/ui 0.2.8 → 0.3.0

package/dist/components/LibraryItemsList/VersionsPanel/VersionsPanel.js

@@ -1,24 +1,24 @@
-import {jsx as _jsx, jsxs as _jsxs} from 'react/jsx-runtime';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {faAngleLeft} from '@fortawesome/free-solid-svg-icons';
-import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
-import {Button} from 'antd';
+import { faAngleLeft } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { Button } from 'antd';
 import styled from 'styled-components';
-import {themeVars} from '../../../antdTheme';
+import { themeVars } from '../../../antdTheme';
 import useSearchReducer from '../../../components/LibraryItemsList/hooks/useSearchReducer';
-import {SearchActionTypes} from '../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
+import { SearchActionTypes } from '../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
 import ValuesVersionConfigurator from '../../../components/ValuesVersionConfigurator';
-import {useSharedTranslation} from '../../../hooks/useSharedTranslation';
-const Wrapper = styled.div`
+import { useSharedTranslation } from '../../../hooks/useSharedTranslation';
+const Wrapper = styled.div `
     width: 100%;
     display: flex;
     flex-flow: column nowrap;
     border-right: ${themeVars.borderLightColor} 1px solid;
     overflow-y: auto;
 `;
-const Header = styled.div`
+const Header = styled.div `
     width: 100%;
     background-color: ${themeVars.headerBg};
     display: grid;
@@ -47,34 +47,20 @@ const Header = styled.div`
     }
 `;
 function VersionsPanel() {
-    const {t} = useSharedTranslation();
-    const {state: searchState, dispatch: searchDispatch} = useSearchReducer();
+    const { t } = useSharedTranslation();
+    const { state: searchState, dispatch: searchDispatch } = useSearchReducer();
     const _handleHidePanel = () => {
         searchDispatch({
             type: SearchActionTypes.TOGGLE_SIDEBAR
         });
     };
-    const _handleVersionChange = version => {
+    const _handleVersionChange = (version) => {
         searchDispatch({
             type: SearchActionTypes.SET_VALUES_VERSIONS,
             valuesVersions: version
         });
     };
-    return _jsxs(Wrapper, {
-        children: [
-            _jsxs(Header, {
-                children: [
-                    _jsx('span', {children: t('values_version.title')}),
-                    _jsx(Button, {onClick: _handleHidePanel, icon: _jsx(FontAwesomeIcon, {icon: faAngleLeft})})
-                ]
-            }),
-            _jsx(ValuesVersionConfigurator, {
-                libraryId: searchState.library.id,
-                selectedVersion: searchState.valuesVersions,
-                onVersionChange: _handleVersionChange
-            })
-        ]
-    });
+    return (_jsxs(Wrapper, { children: [_jsxs(Header, { children: [_jsx("span", { children: t('values_version.title') }), _jsx(Button, { onClick: _handleHidePanel, icon: _jsx(FontAwesomeIcon, { icon: faAngleLeft }) })] }), _jsx(ValuesVersionConfigurator, { libraryId: searchState.library.id, selectedVersion: searchState.valuesVersions, onVersionChange: _handleVersionChange })] }));
 }
 export default VersionsPanel;
-//# sourceMappingURL=VersionsPanel.js.map
+//# sourceMappingURL=VersionsPanel.js.map

package/dist/components/LibraryItemsList/VersionsPanel/index.js

@@ -3,4 +3,4 @@
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
 import VersionsPanel from './VersionsPanel';
 export default VersionsPanel;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/LibraryItemsList/ViewPanel/EditView/EditView.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import {IView} from '../../../../types/views';
+import { IView } from '../../../../types/views';
 interface IEditViewProps {
     view: IView;
     libraryId: string;
     onClose: () => void;
     visible: boolean;
 }
-declare function EditView({visible, onClose, view, libraryId}: IEditViewProps): JSX.Element;
+declare function EditView({ visible, onClose, view, libraryId }: IEditViewProps): JSX.Element;
 export default EditView;

package/dist/components/LibraryItemsList/ViewPanel/EditView/EditView.js

@@ -1,25 +1,25 @@
-import {jsx as _jsx, jsxs as _jsxs} from 'react/jsx-runtime';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {Checkbox, Divider, Form, Input, Modal, Select} from 'antd';
-import {useState} from 'react';
+import { Checkbox, Divider, Form, Input, Modal, Select } from 'antd';
+import { useState } from 'react';
 import useSearchReducer from '../../../../components/LibraryItemsList/hooks/useSearchReducer';
-import {SearchActionTypes} from '../../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
+import { SearchActionTypes } from '../../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
 import useLang from '../../../../hooks/useLang';
-import {useSharedTranslation} from '../../../../hooks/useSharedTranslation';
-import {useAddViewMutation, ViewTypes} from '../../../../_gqlTypes';
-import {getRequestFromFilters} from '../../../../_utils/getRequestFromFilter';
-import {PREFIX_SHARED_VIEWS_ORDER_KEY, PREFIX_USER_VIEWS_ORDER_KEY} from '../../../../constants';
+import { useSharedTranslation } from '../../../../hooks/useSharedTranslation';
+import { useAddViewMutation, ViewTypes } from '../../../../_gqlTypes';
+import { getRequestFromFilters } from '../../../../_utils/getRequestFromFilter';
+import { PREFIX_SHARED_VIEWS_ORDER_KEY, PREFIX_USER_VIEWS_ORDER_KEY } from '../../../../constants';
 import useUpdateViewsOrderMutation from '../../hooks/useUpdateViewsOrderMutation';
-function EditView({visible, onClose, view, libraryId}) {
-    const {t} = useSharedTranslation();
-    const {state: searchState, dispatch: searchDispatch} = useSearchReducer();
-    const {availableLangs, defaultLang} = useLang();
+function EditView({ visible, onClose, view, libraryId }) {
+    const { t } = useSharedTranslation();
+    const { state: searchState, dispatch: searchDispatch } = useSearchReducer();
+    const { availableLangs, defaultLang } = useLang();
     const [form] = Form.useForm();
     const [confirmLoading, setConfirmLoading] = useState(false);
     const [addView] = useAddViewMutation();
-    const {updateViewsOrder} = useUpdateViewsOrderMutation(libraryId);
+    const { updateViewsOrder } = useUpdateViewsOrderMutation(libraryId);
     const _handleOk = async () => {
         form.submit();
     };
@@ -27,12 +27,12 @@ function EditView({visible, onClose, view, libraryId}) {
         form.resetFields();
         onClose();
     };
-    const _handleSubmit = async values => {
+    const _handleSubmit = async (values) => {
         setConfirmLoading(true);
         const upView = {
             id: view.id,
             library: libraryId,
-            display: {type: values.type, size: view.display.size},
+            display: { type: values.type, size: view.display.size },
             shared: values.shared,
             label: values.label,
             description: !Object.values(values.description).every(x => x === '') ? values.description : null,
@@ -42,8 +42,9 @@ function EditView({visible, onClose, view, libraryId}) {
         };
         try {
             // save view in backend
-            await addView({variables: {view: upView}});
-        } catch (e) {
+            await addView({ variables: { view: upView } });
+        }
+        catch (e) {
             console.error(e);
         }
         if (view.shared !== values.shared) {
@@ -67,126 +68,13 @@ function EditView({visible, onClose, view, libraryId}) {
         if (view.id === searchState.view.current.id) {
             searchDispatch({
                 type: SearchActionTypes.CHANGE_VIEW,
-                view: Object.assign(Object.assign({}, searchState.view.current), {
-                    label: values.label,
-                    description: !Object.values(values.description).every(x => x === '') ? values.description : null,
-                    display: {type: values.type, size: view.display.size},
-                    shared: values.shared
-                })
+                view: Object.assign(Object.assign({}, searchState.view.current), { label: values.label, description: !Object.values(values.description).every(x => x === '') ? values.description : null, display: { type: values.type, size: view.display.size }, shared: values.shared })
             });
         }
         setConfirmLoading(false);
         onClose();
     };
-    return _jsx(
-        Modal,
-        Object.assign(
-            {
-                forceRender: true,
-                title: t('view.edit-view.title'),
-                open: visible,
-                onCancel: _handleCancel,
-                onOk: _handleOk,
-                confirmLoading: confirmLoading
-            },
-            {
-                children: _jsxs(
-                    Form,
-                    Object.assign(
-                        {labelCol: {span: 8}, wrapperCol: {span: 16}, form: form, onFinish: _handleSubmit},
-                        {
-                            children: [
-                                availableLangs.map(availableLang =>
-                                    _jsxs(
-                                        'div',
-                                        {
-                                            children: [
-                                                _jsx('h2', {children: t(`language.${availableLang}`)}),
-                                                _jsx(
-                                                    Form.Item,
-                                                    Object.assign(
-                                                        {
-                                                            label: t('view.edit-view.label'),
-                                                            name: ['label', availableLang],
-                                                            initialValue: view.label[availableLang],
-                                                            rules:
-                                                                defaultLang === availableLang ? [{required: true}] : [],
-                                                            'data-testid': `viewName-input-${availableLang}`
-                                                        },
-                                                        {children: _jsx(Input, {})}
-                                                    )
-                                                ),
-                                                _jsx(
-                                                    Form.Item,
-                                                    Object.assign(
-                                                        {
-                                                            label: t('view.edit-view.description'),
-                                                            initialValue: !!view.description
-                                                                ? view.description[availableLang] || ''
-                                                                : '',
-                                                            name: ['description', availableLang],
-                                                            'data-testid': `description-input-${availableLang}`
-                                                        },
-                                                        {children: _jsx(Input, {})}
-                                                    )
-                                                ),
-                                                _jsx(Divider, {})
-                                            ]
-                                        },
-                                        availableLang
-                                    )
-                                ),
-                                _jsx(
-                                    Form.Item,
-                                    Object.assign(
-                                        {
-                                            label: t('view.edit-view.type'),
-                                            name: 'type',
-                                            'data-testid': 'input-type',
-                                            initialValue: view.display.type
-                                        },
-                                        {
-                                            children: _jsxs(Select, {
-                                                children: [
-                                                    _jsx(
-                                                        Select.Option,
-                                                        Object.assign(
-                                                            {value: ViewTypes.list},
-                                                            {children: t('view.type-list')}
-                                                        )
-                                                    ),
-                                                    _jsx(
-                                                        Select.Option,
-                                                        Object.assign(
-                                                            {value: ViewTypes.cards},
-                                                            {children: t('view.type-cards')}
-                                                        )
-                                                    )
-                                                ]
-                                            })
-                                        }
-                                    )
-                                ),
-                                _jsx(
-                                    Form.Item,
-                                    Object.assign(
-                                        {
-                                            name: 'shared',
-                                            initialValue: view.shared,
-                                            valuePropName: 'checked',
-                                            'data-testid': 'input-shared',
-                                            wrapperCol: {offset: 8, span: 16}
-                                        },
-                                        {children: _jsx(Checkbox, {children: t('view.edit-view.shared')})}
-                                    )
-                                )
-                            ]
-                        }
-                    )
-                )
-            }
-        )
-    );
+    return (_jsx(Modal, Object.assign({ forceRender: true, title: t('view.edit-view.title'), open: visible, onCancel: _handleCancel, onOk: _handleOk, confirmLoading: confirmLoading }, { children: _jsxs(Form, Object.assign({ labelCol: { span: 8 }, wrapperCol: { span: 16 }, form: form, onFinish: _handleSubmit }, { children: [availableLangs.map(availableLang => (_jsxs("div", { children: [_jsx("h2", { children: t(`language.${availableLang}`) }), _jsx(Form.Item, Object.assign({ label: t('view.edit-view.label'), name: ['label', availableLang], initialValue: view.label[availableLang], rules: defaultLang === availableLang ? [{ required: true }] : [], "data-testid": `viewName-input-${availableLang}` }, { children: _jsx(Input, {}) })), _jsx(Form.Item, Object.assign({ label: t('view.edit-view.description'), initialValue: !!view.description ? view.description[availableLang] || '' : '', name: ['description', availableLang], "data-testid": `description-input-${availableLang}` }, { children: _jsx(Input, {}) })), _jsx(Divider, {})] }, availableLang))), _jsx(Form.Item, Object.assign({ label: t('view.edit-view.type'), name: "type", "data-testid": "input-type", initialValue: view.display.type }, { children: _jsxs(Select, { children: [_jsx(Select.Option, Object.assign({ value: ViewTypes.list }, { children: t('view.type-list') })), _jsx(Select.Option, Object.assign({ value: ViewTypes.cards }, { children: t('view.type-cards') }))] }) })), _jsx(Form.Item, Object.assign({ name: "shared", initialValue: view.shared, valuePropName: "checked", "data-testid": "input-shared", wrapperCol: { offset: 8, span: 16 } }, { children: _jsx(Checkbox, { children: t('view.edit-view.shared') }) }))] })) })));
 }
 export default EditView;
-//# sourceMappingURL=EditView.js.map
+//# sourceMappingURL=EditView.js.map

package/dist/components/LibraryItemsList/ViewPanel/EditView/index.js

@@ -3,4 +3,4 @@
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
 import EditView from './EditView';
 export default EditView;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/LibraryItemsList/ViewPanel/View/View.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import {DraggableProvidedDragHandleProps} from 'react-beautiful-dnd';
-import {IView} from '../../../../types/views';
+import { DraggableProvidedDragHandleProps } from 'react-beautiful-dnd';
+import { IView } from '../../../../types/views';
 interface IViewProps {
     view: IView;
     onEdit: (viewId: string) => void;
     handleProps?: DraggableProvidedDragHandleProps;
 }
-declare function View({view, onEdit, handleProps}: IViewProps): JSX.Element;
+declare function View({ view, onEdit, handleProps }: IViewProps): JSX.Element;
 export default View;

package/dist/components/LibraryItemsList/ViewPanel/View/View.js

@@ -1,37 +1,37 @@
-import {jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment} from 'react/jsx-runtime';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {CopyOutlined, DeleteOutlined, EditOutlined} from '@ant-design/icons';
-import {localizedTranslation, objectToNameValueArray} from '@leav/utils';
-import {Button, Tooltip, Typography} from 'antd';
+import { CopyOutlined, DeleteOutlined, EditOutlined } from '@ant-design/icons';
+import { localizedTranslation, objectToNameValueArray } from '@leav/utils';
+import { Button, Tooltip, Typography } from 'antd';
 import omit from 'lodash/omit';
-import {useState} from 'react';
-import {RiUserReceivedLine} from 'react-icons/ri';
+import { useState } from 'react';
+import { RiUserReceivedLine } from 'react-icons/ri';
 import styled from 'styled-components';
-import {themeVars} from '../../../../antdTheme';
+import { themeVars } from '../../../../antdTheme';
 import useSearchReducer from '../../../../components/LibraryItemsList/hooks/useSearchReducer';
-import {SearchActionTypes} from '../../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
+import { SearchActionTypes } from '../../../../components/LibraryItemsList/hooks/useSearchReducer/searchReducer';
 import IconViewType from '../../../../components/LibraryItemsList/IconViewType';
-import {PREFIX_SHARED_VIEWS_ORDER_KEY, PREFIX_USER_VIEWS_ORDER_KEY} from '../../../../constants';
-import {useLang} from '../../../../hooks';
+import { PREFIX_SHARED_VIEWS_ORDER_KEY, PREFIX_USER_VIEWS_ORDER_KEY } from '../../../../constants';
+import { useLang } from '../../../../hooks';
 import useExecuteAddViewMutation from '../../../../hooks/useExecuteAddViewMutation/useExecuteAddViewMutation';
 import useExecuteDeleteViewMutation from '../../../../hooks/useExecuteDeleteViewMutation/useExecuteDeleteViewMutation';
-import {useSharedTranslation} from '../../../../hooks/useSharedTranslation';
-import {ViewSizes, ViewTypes} from '../../../../_gqlTypes';
-import {getRequestFromFilters} from '../../../../_utils/getRequestFromFilter';
-import {defaultView} from '../../constants';
+import { useSharedTranslation } from '../../../../hooks/useSharedTranslation';
+import { ViewSizes, ViewTypes } from '../../../../_gqlTypes';
+import { getRequestFromFilters } from '../../../../_utils/getRequestFromFilter';
+import { defaultView } from '../../constants';
 import useUpdateViewsOrderMutation from '../../hooks/useUpdateViewsOrderMutation';
-const Infos = styled.div`
+const Infos = styled.div `
     width: 100%;
 `;
-const Wrapper = styled.div`
-    background: ${({selected}) => (selected ? `${themeVars.activeColor} ` : 'none')};
+const Wrapper = styled.div `
+    background: ${({ selected }) => (selected ? `${themeVars.activeColor} ` : 'none')};
     padding: 0.5rem;
     display: flex;
     align-items: center;
 `;
-const Handle = styled.div`
+const Handle = styled.div `
     content: '....';
     width: 20px;
     height: 30px;
@@ -49,65 +49,56 @@ const Handle = styled.div`
         content: '.. .. .. ..';
     }
 `;
-const Title = styled.div`
+const Title = styled.div `
     display: flex;
     align-items: center;
     margin-left: 10px;
 `;
-const Description = styled.div`
+const Description = styled.div `
     opacity: 0.8;
     margin-left: 10px;
     overflow: hidden;
 `;
-function View({view, onEdit, handleProps}) {
+function View({ view, onEdit, handleProps }) {
     var _a;
-    const {t} = useSharedTranslation();
-    const {lang, defaultLang} = useLang();
-    const {state: searchState, dispatch: searchDispatch} = useSearchReducer();
-    const [description, setDescription] = useState({expand: false, key: 0});
-    const {addView} = useExecuteAddViewMutation();
-    const {deleteView} = useExecuteDeleteViewMutation();
-    const {updateViewsOrder} = useUpdateViewsOrderMutation(searchState.library.id);
+    const { t } = useSharedTranslation();
+    const { lang, defaultLang } = useLang();
+    const { state: searchState, dispatch: searchDispatch } = useSearchReducer();
+    const [description, setDescription] = useState({ expand: false, key: 0 });
+    const { addView } = useExecuteAddViewMutation();
+    const { deleteView } = useExecuteDeleteViewMutation();
+    const { updateViewsOrder } = useUpdateViewsOrderMutation(searchState.library.id);
     const _changeView = () => {
-        searchDispatch({type: SearchActionTypes.CHANGE_VIEW, view});
+        searchDispatch({ type: SearchActionTypes.CHANGE_VIEW, view });
     };
     const ROWS_DESCRIPTION = 3;
-    const _handleDelete = async event => {
+    const _handleDelete = async (event) => {
         // stop progation to avoid click on view
         event.stopPropagation();
         await deleteView(view.id);
-        const newOrder = (view.shared ? searchState.sharedViewsOrder : searchState.userViewsOrder).filter(
-            vId => vId !== view.id
-        );
+        const newOrder = (view.shared ? searchState.sharedViewsOrder : searchState.userViewsOrder).filter(vId => vId !== view.id);
         await updateViewsOrder({
             key: (view.shared ? PREFIX_SHARED_VIEWS_ORDER_KEY : PREFIX_USER_VIEWS_ORDER_KEY) + searchState.library.id,
             value: newOrder,
             global: false
         });
         if (view.id === searchState.view.current.id) {
-            searchDispatch({type: SearchActionTypes.CHANGE_VIEW, view: defaultView});
+            searchDispatch({ type: SearchActionTypes.CHANGE_VIEW, view: defaultView });
         }
     };
-    const _handleDuplicate = async event => {
+    const _handleDuplicate = async (event) => {
         // stop progation to avoid click on view
         event.stopPropagation();
         try {
-            const newView = Object.assign(Object.assign({}, omit(view, ['id', 'owner'])), {
-                library: searchState.library.id,
-                label: {
+            const newView = Object.assign(Object.assign({}, omit(view, ['id', 'owner'])), { library: searchState.library.id, label: {
                     [defaultLang]: `${localizedTranslation(view.label, lang)} (${t('global.copy')})`
-                },
-                filters: getRequestFromFilters(view.filters),
-                display: {
+                }, filters: getRequestFromFilters(view.filters), display: {
                     size: ViewSizes.MEDIUM,
                     type: ViewTypes.list
-                },
-                valuesVersions: objectToNameValueArray(view.valuesVersions).map(version => ({
+                }, valuesVersions: objectToNameValueArray(view.valuesVersions).map(version => ({
                     treeId: version.name,
                     treeNode: version.value.id
-                })),
-                shared: false
-            });
+                })), shared: false });
             const newViewRes = await addView({
                 view: newView
             });
@@ -116,167 +107,34 @@ function View({view, onEdit, handleProps}) {
                 value: [...searchState.userViewsOrder, newViewRes.data.saveView.id],
                 global: false
             });
-        } catch (e) {
+        }
+        catch (e) {
             console.error(e);
         }
     };
-    const _handleEdit = event => {
+    const _handleEdit = (event) => {
         // stop progation to avoid click on view
         event.stopPropagation();
         onEdit(view.id);
     };
     const _onExpand = () => {
-        setDescription({expand: true, key: description.key});
+        setDescription({ expand: true, key: description.key });
     };
     const _onClose = () => {
-        setDescription({expand: false, key: description.key + 1});
+        setDescription({ expand: false, key: description.key + 1 });
     };
     const selected = view.id === ((_a = searchState.view.current) === null || _a === void 0 ? void 0 : _a.id);
     const [isActionsShown, setIsActionsShown] = useState(false);
     const viewLabel = localizedTranslation(view.label, lang);
-    return _jsxs(
-        Wrapper,
-        Object.assign(
-            {
-                selected: selected,
-                onClick: _changeView,
-                color: view.color,
-                onMouseEnter: () => setIsActionsShown(true),
-                onMouseLeave: () => setIsActionsShown(false)
-            },
-            {
-                children: [
-                    _jsx(Handle, Object.assign({className: 'view-handle'}, handleProps)),
-                    _jsxs(Infos, {
-                        children: [
-                            _jsxs(
-                                Title,
-                                Object.assign(
-                                    {'data-testid': 'view-title'},
-                                    {
-                                        children: [
-                                            _jsx(IconViewType, {type: view.display.type}),
-                                            _jsx(
-                                                Typography.Text,
-                                                Object.assign(
-                                                    {
-                                                        ellipsis: {tooltip: true},
-                                                        style: {padding: '0 .5em', width: 'calc(100% - 1em)'}
-                                                    },
-                                                    {children: viewLabel}
-                                                )
-                                            )
-                                        ]
-                                    }
-                                )
-                            ),
-                            view.description &&
-                                _jsxs(Description, {
-                                    children: [
-                                        _jsx(
-                                            Typography.Paragraph,
-                                            Object.assign(
-                                                {
-                                                    ellipsis: {
-                                                        rows: ROWS_DESCRIPTION,
-                                                        expandable: true,
-                                                        onExpand: _onExpand,
-                                                        symbol: t('view.see-more')
-                                                    },
-                                                    style: {marginBottom: 0}
-                                                },
-                                                {children: localizedTranslation(view.description, lang)}
-                                            ),
-                                            description.key
-                                        ),
-                                        description.expand &&
-                                            _jsx(
-                                                'a',
-                                                Object.assign(
-                                                    {
-                                                        href: '!#',
-                                                        onClick: ev => {
-                                                            ev.preventDefault();
-                                                            _onClose();
-                                                        }
-                                                    },
-                                                    {children: t('global.close')}
-                                                )
-                                            )
-                                    ]
-                                })
-                        ]
-                    }),
-                    !view.owner && !isActionsShown && _jsx(RiUserReceivedLine, {size: '1.3em'}),
-                    isActionsShown &&
-                        _jsxs(_Fragment, {
-                            children: [
-                                _jsx(
-                                    Tooltip,
-                                    Object.assign(
-                                        {title: t('global.edit')},
-                                        {
-                                            children: _jsx(
-                                                Button,
-                                                {
-                                                    onClick: _handleEdit,
-                                                    disabled: !view.owner,
-                                                    type: 'text',
-                                                    size: 'small',
-                                                    shape: 'circle',
-                                                    icon: _jsx(EditOutlined, {})
-                                                },
-                                                'edit'
-                                            )
-                                        }
-                                    )
-                                ),
-                                _jsx(
-                                    Tooltip,
-                                    Object.assign(
-                                        {title: t('global.duplicate')},
-                                        {
-                                            children: _jsx(
-                                                Button,
-                                                {
-                                                    onClick: _handleDuplicate,
-                                                    type: 'text',
-                                                    size: 'small',
-                                                    shape: 'circle',
-                                                    icon: _jsx(CopyOutlined, {})
-                                                },
-                                                'duplicate'
-                                            )
-                                        }
-                                    )
-                                ),
-                                _jsx(
-                                    Tooltip,
-                                    Object.assign(
-                                        {title: t('global.delete')},
-                                        {
-                                            children: _jsx(
-                                                Button,
-                                                {
-                                                    onClick: _handleDelete,
-                                                    disabled: !view.owner,
-                                                    type: 'text',
-                                                    size: 'small',
-                                                    shape: 'circle',
-                                                    icon: _jsx(DeleteOutlined, {})
-                                                },
-                                                'delete'
-                                            )
-                                        }
-                                    )
-                                )
-                            ]
-                        })
-                ]
-            }
-        ),
-        view.id
-    );
+    return (_jsxs(Wrapper, Object.assign({ selected: selected, onClick: _changeView, color: view.color, onMouseEnter: () => setIsActionsShown(true), onMouseLeave: () => setIsActionsShown(false) }, { children: [_jsx(Handle, Object.assign({ className: "view-handle" }, handleProps)), _jsxs(Infos, { children: [_jsxs(Title, Object.assign({ "data-testid": "view-title" }, { children: [_jsx(IconViewType, { type: view.display.type }), _jsx(Typography.Text, Object.assign({ ellipsis: { tooltip: true }, style: { padding: '0 .5em', width: 'calc(100% - 1em)' } }, { children: viewLabel }))] })), view.description && (_jsxs(Description, { children: [_jsx(Typography.Paragraph, Object.assign({ ellipsis: {
+                                    rows: ROWS_DESCRIPTION,
+                                    expandable: true,
+                                    onExpand: _onExpand,
+                                    symbol: t('view.see-more')
+                                }, style: { marginBottom: 0 } }, { children: localizedTranslation(view.description, lang) }), description.key), description.expand && (_jsx("a", Object.assign({ href: "!#", onClick: ev => {
+                                    ev.preventDefault();
+                                    _onClose();
+                                } }, { children: t('global.close') })))] }))] }), !view.owner && !isActionsShown && _jsx(RiUserReceivedLine, { size: "1.3em" }), isActionsShown && (_jsxs(_Fragment, { children: [_jsx(Tooltip, Object.assign({ title: t('global.edit') }, { children: _jsx(Button, { onClick: _handleEdit, disabled: !view.owner, type: "text", size: "small", shape: "circle", icon: _jsx(EditOutlined, {}) }, "edit") })), _jsx(Tooltip, Object.assign({ title: t('global.duplicate') }, { children: _jsx(Button, { onClick: _handleDuplicate, type: "text", size: "small", shape: "circle", icon: _jsx(CopyOutlined, {}) }, "duplicate") })), _jsx(Tooltip, Object.assign({ title: t('global.delete') }, { children: _jsx(Button, { onClick: _handleDelete, disabled: !view.owner, type: "text", size: "small", shape: "circle", icon: _jsx(DeleteOutlined, {}) }, "delete") }))] }))] }), view.id));
 }
 export default View;
-//# sourceMappingURL=View.js.map
+//# sourceMappingURL=View.js.map

package/dist/components/LibraryItemsList/ViewPanel/View/index.js

@@ -3,4 +3,4 @@
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
 import View from './View';
 export default View;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map