From d23492bcf8bc54b60d53f60b08e92c2d56a10000 Mon Sep 17 00:00:00 2001 From: Miu Razvan Date: Sat, 22 Aug 2020 17:37:10 +0300 Subject: [PATCH] removed some customizations --- src/config.js | 48 +-- .../manage/BlockChooser/BlockChooser.jsx | 95 ------ .../components/manage/Blocks/Block/Edit.jsx | 277 ------------------ .../components/manage/Blocks/Title/Edit.jsx | 188 ------------ .../components/manage/Widgets/FileWidget.jsx | 132 --------- src/localconfig.js | 4 +- 6 files changed, 5 insertions(+), 739 deletions(-) delete mode 100644 src/customizations/volto/components/manage/BlockChooser/BlockChooser.jsx delete mode 100644 src/customizations/volto/components/manage/Blocks/Block/Edit.jsx delete mode 100644 src/customizations/volto/components/manage/Blocks/Title/Edit.jsx delete mode 100644 src/customizations/volto/components/manage/Widgets/FileWidget.jsx diff --git a/src/config.js b/src/config.js index 308beee8..82e8bdd7 100644 --- a/src/config.js +++ b/src/config.js @@ -11,45 +11,15 @@ * } * } */ -import * as voltoConfig from '@plone/volto/config'; -import { settings as defaultSettings } from '@plone/volto/config'; - -// import { -// installFolderListing, -// installTableau, -// installExpendableList, -// } from 'volto-addons/config'; -// import { applyConfig as datablocksConfig } from 'volto-datablocks/config'; -// import { applyConfig as gridlayoutConfig } from 'volto-gridlayout/config'; -import { applyConfig as mosaicConfig } from 'volto-mosaic/config'; -// import { applyConfig as tabsviewConfig } from 'volto-tabsview/config'; -import { applyConfig as eprtrConfig } from './localconfig'; - -const newConfig = [ - // datablocksConfig, - // gridlayoutConfig, - mosaicConfig, - // tabsviewConfig, - // installFolderListing, - // installTableau, - // installExpendableList, - eprtrConfig, -].reduce((acc, apply) => apply(acc), voltoConfig); -const config = { ...voltoConfig }; +import * as config from '@plone/volto/config'; export const settings = { - ...defaultSettings, - navDepth: 5, - providerUrl: 'https://discodata.eea.europa.eu/sql', + ...config.settings, }; export const views = { ...config.views, - // layoutViews: { - // ...config.views.layoutViews, - // default_view: null, - // }, }; export const widgets = { @@ -60,17 +30,5 @@ export const blocks = { ...config.blocks, }; -export const addonRoutes = [...config.addonRoutes]; export const addonReducers = { ...config.addonReducers }; -export const viewlets = [...(config.viewlets || [])]; - -export const portlets = { - ...config.portlets, -}; - -export const editForms = { - ...config.editForms, - ...newConfig.editForms, -}; - -console.log(config, newConfig); +export const addonRoutes = [...(config.addonRoutes || [])]; \ No newline at end of file diff --git a/src/customizations/volto/components/manage/BlockChooser/BlockChooser.jsx b/src/customizations/volto/components/manage/BlockChooser/BlockChooser.jsx deleted file mode 100644 index a1fec38b..00000000 --- a/src/customizations/volto/components/manage/BlockChooser/BlockChooser.jsx +++ /dev/null @@ -1,95 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { filter, map, groupBy } from 'lodash'; -import { Accordion, Button } from 'semantic-ui-react'; -import { injectIntl } from 'react-intl'; -import { Icon } from '@plone/volto/components'; -import AnimateHeight from 'react-animate-height'; -import { blocks } from '~/config'; - -import upSVG from '@plone/volto/icons/up-key.svg'; -import downSVG from '@plone/volto/icons/down-key.svg'; - -const BlockChooser = ({ currentBlock, onMutateBlock, intl }) => { - const mostUsedBlocks = filter(blocks.blocksConfig, (item) => item.mostUsed); - const groupedBlocks = groupBy(blocks.blocksConfig, (item) => item.group); - const blocksAvailable = { mostUsed: mostUsedBlocks, ...groupedBlocks }; - const [activeIndex, setActiveIndex] = React.useState(0); - - function handleClick(e, titleProps) { - const { index } = titleProps; - const newIndex = activeIndex === index ? -1 : index; - - setActiveIndex(newIndex); - } - - return ( -
- - {map(blocks.groupBlocksOrder, (groupName, index) => ( - - - {intl.formatMessage({ - id: groupName.id, - defaultMessage: groupName.title, - })} -
- {activeIndex === 0 ? ( - - ) : ( - - )} -
- - - - {map( - filter( - blocksAvailable[groupName.id], - (block) => !block.restricted, - ), - (block) => ( - - - - ), - )} - - - - ))} - -
- ); -}; - -BlockChooser.propTypes = { - currentBlock: PropTypes.string.isRequired, - onMutateBlock: PropTypes.func.isRequired, -}; - -export default injectIntl(BlockChooser); diff --git a/src/customizations/volto/components/manage/Blocks/Block/Edit.jsx b/src/customizations/volto/components/manage/Blocks/Block/Edit.jsx deleted file mode 100644 index aedb3d32..00000000 --- a/src/customizations/volto/components/manage/Blocks/Block/Edit.jsx +++ /dev/null @@ -1,277 +0,0 @@ -/** - * Edit block. - * @module components/manage/Blocks/Block/Edit - */ - -import React, { Component } from 'react'; -import PropTypes from 'prop-types'; -import { compose } from 'redux'; -import { connect } from 'react-redux'; -import { DragSource, DropTarget } from 'react-dnd'; -import { findDOMNode } from 'react-dom'; -import { defineMessages, injectIntl } from 'react-intl'; -import { blocks } from '~/config'; -import { Button } from 'semantic-ui-react'; -import includes from 'lodash/includes'; -import cx from 'classnames'; -import { setSidebarTab } from '@plone/volto/actions'; - -import withObjectBrowser from '@plone/volto/components/manage/Sidebar/ObjectBrowser'; -import Icon from '@plone/volto/components/theme/Icon/Icon'; -import dragSVG from '@plone/volto/icons/drag.svg'; -import trashSVG from '@plone/volto/icons/delete.svg'; - -const messages = defineMessages({ - unknownBlock: { - id: 'Unknown Block', - defaultMessage: 'Unknown Block {block}', - }, - delete: { - id: 'delete', - defaultMessage: 'delete', - }, -}); - -const itemSource = { - beginDrag(props) { - return { - id: props.id, - index: props.index, - }; - }, -}; - -const ItemTypes = { - ITEM: 'block', -}; - -const itemTarget = { - hover(props, monitor, component) { - const dragIndex = monitor.getItem().index; - const hoverIndex = props.index; - - // Don't replace items with themselves - if (dragIndex === hoverIndex) { - return; - } - - // Determine rectangle on screen - const hoverBoundingRect = findDOMNode(component).getBoundingClientRect(); - - // Get vertical middle - const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2; - - // Determine mouse position - const clientOffset = monitor.getClientOffset(); - - // Get pixels to the top - const hoverClientY = clientOffset.y - hoverBoundingRect.top; - - // Only perform the move when the mouse has crossed half of the items height - // When dragging downwards, only move when the cursor is below 50% - // When dragging upwards, only move when the cursor is above 50% - - // Dragging downwards - if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) { - return; - } - - // Dragging upwards - if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) { - return; - } - - // Time to actually perform the action - props.onMoveBlock(dragIndex, hoverIndex); - - // Note: we're mutating the monitor item here! - // Generally it's better to avoid mutations, - // but it's good here for the sake of performance - // to avoid expensive index searches. - monitor.getItem().index = hoverIndex; - }, -}; - -/** - * Edit block class. - * @class Edit - * @extends Component - */ -class Edit extends Component { - /** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ - static propTypes = { - type: PropTypes.string.isRequired, - data: PropTypes.objectOf(PropTypes.any).isRequired, - // properties is mapped to formData, so it's not connected to changes of the object - properties: PropTypes.objectOf(PropTypes.any).isRequired, - selected: PropTypes.bool.isRequired, - connectDragSource: PropTypes.func.isRequired, - connectDragPreview: PropTypes.func.isRequired, - connectDropTarget: PropTypes.func.isRequired, - index: PropTypes.number.isRequired, - id: PropTypes.string.isRequired, - onMoveBlock: PropTypes.func.isRequired, - onDeleteBlock: PropTypes.func.isRequired, - }; - - componentDidMount() { - const { type } = this.props; - const blockHasOwnFocusManagement = - blocks.blocksConfig?.[type]?.['blockHasOwnFocusManagement'] || null; - if ( - !blockHasOwnFocusManagement && - this.props.selected && - this.blockNode.current - ) { - this.blockNode.current.focus(); - } - if (this.props.selected) { - this.props.setSidebarTab(blocks.blocksConfig?.[type]?.sidebarBar || 0); - } - } - - UNSAFE_componentWillReceiveProps(nextProps) { - const { selected, type } = this.props; - const blockHasOwnFocusManagement = - blocks.blocksConfig?.[type]?.['blockHasOwnFocusManagement'] || null; - if ( - !blockHasOwnFocusManagement && - nextProps.selected && - selected !== nextProps.selected && - this.blockNode.current - ) { - this.blockNode.current.focus(); - } - if ( - (!this.props.selected && nextProps.selected) || - type !== nextProps.type - ) { - this.props.setSidebarTab( - blocks.blocksConfig?.[nextProps.type]?.sidebarTab || 0, - ); - } - } - - blockNode = React.createRef(); - - /** - * Render method. - * @method render - * @returns {string} Markup for the component. - */ - render() { - const { - id, - type, - selected, - connectDragSource, - connectDropTarget, - connectDragPreview, - } = this.props; - - const Block = blocks.blocksConfig?.[type]?.['edit'] || null; - const blockHasOwnFocusManagement = - blocks.blocksConfig?.[type]?.['blockHasOwnFocusManagement'] || null; - - const hideHandler = - this.props.data['@type'] === 'text' && - (!this.props.data.text || - (this.props.data.text && - this.props.data.text.blocks && - this.props.data.text.blocks.length === 1 && - this.props.data.text.blocks[0].text === '')); - - return connectDropTarget( - connectDragPreview( -
- {selected && - connectDragSource( -
- -
, - )} - {Block !== null ? ( -
this.props.onSelectBlock(this.props.id)} - onKeyDown={ - !blockHasOwnFocusManagement - ? (e) => - this.props.handleKeyDown( - e, - this.props.index, - this.props.id, - this.blockNode.current, - ) - : null - } - className={cx(`block ${type}`, { selected: this.props.selected })} - style={{ outline: 'none' }} - ref={this.blockNode} - // The tabIndex is required for the keyboard navigation - /* eslint-disable jsx-a11y/no-noninteractive-tabindex */ - tabIndex={!blockHasOwnFocusManagement ? -1 : null} - > - -
- ) : ( -
- this.props.handleKeyDown( - e, - this.props.index, - this.props.id, - this.blockNode.current, - ) - } - className={cx(`block ${type}`, { selected: this.props.selected })} - style={{ outline: 'none' }} - ref={this.blockNode} - // The tabIndex is required for the keyboard navigation - tabIndex={-1} - > - {this.props.intl.formatMessage(messages.unknownBlock, { - block: type, - })} -
- )} - {selected && !includes(blocks.requiredBlocks, type) && ( - - )} -
, - ), - ); - } -} - -export default compose( - injectIntl, - withObjectBrowser, - DropTarget(ItemTypes.ITEM, itemTarget, (connect) => ({ - connectDropTarget: connect.dropTarget(), - })), - DragSource(ItemTypes.ITEM, itemSource, (connect, monitor) => ({ - connectDragSource: connect.dragSource(), - connectDragPreview: connect.dragPreview(), - })), - connect(null, { setSidebarTab }), -)(Edit); diff --git a/src/customizations/volto/components/manage/Blocks/Title/Edit.jsx b/src/customizations/volto/components/manage/Blocks/Title/Edit.jsx deleted file mode 100644 index c4f4c48a..00000000 --- a/src/customizations/volto/components/manage/Blocks/Title/Edit.jsx +++ /dev/null @@ -1,188 +0,0 @@ -/** - * Edit title block. - * @module components/manage/Blocks/Title/Edit - */ - -import React, { Component } from 'react'; -import { Map } from 'immutable'; -import PropTypes from 'prop-types'; -import { stateFromHTML } from 'draft-js-import-html'; -import { Editor, DefaultDraftBlockRenderMap, EditorState } from 'draft-js'; -import { defineMessages, injectIntl } from 'react-intl'; -import { settings } from '~/config'; -import { FormStateContext } from '@plone/volto/components/manage/Form/FormContext'; - -const messages = defineMessages({ - title: { - id: 'Type the title…', - defaultMessage: 'Type the title…', - }, -}); - -const blockRenderMap = Map({ - unstyled: { - element: 'h1', - }, -}); - -const extendedBlockRenderMap = DefaultDraftBlockRenderMap.merge(blockRenderMap); - -/** - * Edit title block class. - * @class Edit - * @extends Component - */ -class Edit extends Component { - /** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ - static propTypes = { - // properties: PropTypes.objectOf(PropTypes.any).isRequired, - selected: PropTypes.bool.isRequired, - index: PropTypes.number.isRequired, - onChangeField: PropTypes.func.isRequired, - onSelectBlock: PropTypes.func.isRequired, - onDeleteBlock: PropTypes.func.isRequired, - onAddBlock: PropTypes.func.isRequired, - onFocusPreviousBlock: PropTypes.func.isRequired, - onFocusNextBlock: PropTypes.func.isRequired, - block: PropTypes.string.isRequired, - }; - static contextType = FormStateContext; - - /** - * Constructor - * @method constructor - * @param {Object} props Component properties - * @constructs WysiwygEditor - */ - constructor(props, context) { - super(props); - - if (!__SERVER__) { - let editorState; - const properties = context?.contextData?.formData || {}; - if (properties && properties.title) { - const contentState = stateFromHTML(properties.title); - editorState = EditorState.createWithContent(contentState); - } else { - editorState = EditorState.createEmpty(); - } - this.state = { editorState, focus: true }; - } - - this.onChange = this.onChange.bind(this); - } - - /** - * Component did mount lifecycle method - * @method componentDidMount - * @returns {undefined} - */ - componentDidMount() { - if (this.node) { - this.node.focus(); - this.node._onBlur = () => this.setState({ focus: false }); - this.node._onFocus = () => this.setState({ focus: true }); - } - } - - /** - * Component will receive props - * @method componentWillReceiveProps - * @param {Object} nextProps Next properties - * @returns {undefined} - */ - // UNSAFE_componentWillReceiveProps(nextProps) { - // if ( - // nextProps.properties.title && - // this.props.properties.title !== nextProps.properties.title && - // !this.state.focus - // ) { - // const contentState = stateFromHTML(nextProps.properties.title); - // this.setState({ - // editorState: nextProps.properties.title - // ? EditorState.createWithContent(contentState) - // : EditorState.createEmpty(), - // }); - // } - // - // if (!this.props.selected && nextProps.selected) { - // this.node.focus(); - // this.setState({ focus: true }); - // } - // } - - /** - * Change handler - * @method onChange - * @param {object} editorState Editor state. - * @returns {undefined} - */ - onChange(editorState) { - this.setState({ editorState }, () => { - this.props.onChangeField( - 'title', - editorState.getCurrentContent().getPlainText(), - ); - }); - } - - /** - * Render method. - * @method render - * @returns {string} Markup for the component. - */ - render() { - if (__SERVER__) { - return
; - } - - const placeholder = - this.props.data.placeholder || - this.props.intl.formatMessage(messages.title); - return ( - { - this.props - .onAddBlock(settings.defaultBlockType, this.props.index + 1) - .then((id) => this.props.onSelectBlock(id)); - - return 'handled'; - }} - placeholder={placeholder} - blockStyleFn={() => 'documentFirstHeading'} - onUpArrow={() => { - const selectionState = this.state.editorState.getSelection(); - const { editorState } = this.state; - if ( - editorState.getCurrentContent().getBlockMap().first().getKey() === - selectionState.getFocusKey() - ) { - this.props.onFocusPreviousBlock(this.props.block, this.node); - } - }} - onDownArrow={() => { - const selectionState = this.state.editorState.getSelection(); - const { editorState } = this.state; - if ( - editorState.getCurrentContent().getBlockMap().last().getKey() === - selectionState.getFocusKey() - ) { - this.props.onFocusNextBlock(this.props.block, this.node); - } - }} - ref={(node) => { - this.node = node; - }} - /> - ); - } -} - -export default injectIntl(Edit); diff --git a/src/customizations/volto/components/manage/Widgets/FileWidget.jsx b/src/customizations/volto/components/manage/Widgets/FileWidget.jsx deleted file mode 100644 index 0e5ed55b..00000000 --- a/src/customizations/volto/components/manage/Widgets/FileWidget.jsx +++ /dev/null @@ -1,132 +0,0 @@ -/** - * FileWidget component. - * @module components/manage/Widgets/FileWidget - */ - -import React from 'react'; -import PropTypes from 'prop-types'; -import { Form, Grid, Input, Label, Button } from 'semantic-ui-react'; -import { map } from 'lodash'; -import { readAsDataURL } from 'promise-file-reader'; - -import deleteSVG from '@plone/volto/icons/delete.svg'; -import { Icon } from '@plone/volto/components'; - -/** - * FileWidget component class. - * @function FileWidget - * @returns {string} Markup of the component. - */ -const FileWidget = ({ - id, - title, - required, - description, - error, - value, - onChange, - fieldSet, -}) => { - const fileInput = React.useRef(null); - return '' - return ( - 0} - className={description ? 'help' : ''} - id={`${fieldSet || 'field'}-${id}`} - > - - - -
- -
- - - { - const file = target.files[0]; - readAsDataURL(file).then(data => { - const fields = data.match(/^data:(.*);(.*),(.*)$/); - onChange(id, { - data: fields[3], - encoding: fields[2], - 'content-type': fields[1], - filename: file.name, - }); - }); - }} - /> -
- {value && value.filename} - {value && ( - - )} -
- {map(error, message => ( - - ))} - - - {description && ( - - -

{description}

- - - )} - - - ); -}; - -/** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ -FileWidget.propTypes = { - id: PropTypes.string.isRequired, - title: PropTypes.string.isRequired, - description: PropTypes.string, - required: PropTypes.bool, - error: PropTypes.arrayOf(PropTypes.string), - value: PropTypes.shape({ - '@type': PropTypes.string, - title: PropTypes.string, - }), - onChange: PropTypes.func.isRequired, -}; - -/** - * Default properties. - * @property {Object} defaultProps Default properties. - * @static - */ -FileWidget.defaultProps = { - description: null, - required: false, - error: [], - value: null, -}; - -export default FileWidget; \ No newline at end of file diff --git a/src/localconfig.js b/src/localconfig.js index eb506146..ae369dbf 100644 --- a/src/localconfig.js +++ b/src/localconfig.js @@ -1,6 +1,6 @@ // import RedirectView from '~/components/theme/View/RedirectView'; import DiscodataView from '~/components/theme/View/DiscodataView'; -import MosaicForm from 'volto-mosaic/components/manage/Form'; +// import MosaicForm from 'volto-mosaic/components/manage/Form'; import DetailedLinkView from '~/components/manage/Blocks/DetailedLink/View'; import DetailedLinkEdit from '~/components/manage/Blocks/DetailedLink/Edit'; @@ -43,7 +43,7 @@ export function applyConfig(voltoConfig) { ...config.editForms, byLayout: { ...config.editForms?.byLayout, - discodata_view: MosaicForm, + // discodata_view: MosaicForm, }, };