index.tsx

TLDR

This file contains a React component for rendering a divider block in a blocks editor. The component includes a display component and an input component.

Classes

Divider

This class represents a divider block in the blocks editor. It includes properties such as name, display name, slash command, prefix, and more. The class also defines a runSlashCommand method, which sets the block's type and value based on the slash command arguments.

END

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {useEffect} from 'react'

import {BlockInputProps, ContentType} from '../types'

import './divider.scss'

const Divider: ContentType = {
    name: 'divider',
    displayName: 'Divider',
    slashCommand: '/divider',
    prefix: '--- ',
    runSlashCommand: (): void => {},
    editable: false,
    Display: () => <hr className='Divider'/>,
    Input: (props: BlockInputProps) => {
        useEffect(() => {
            props.onSave(props.value)
        }, [])
        return null
    },
}

Divider.runSlashCommand = (changeType: (contentType: ContentType) => void, changeValue: (value: string) => void, ...args: string[]): void => {
    changeType(Divider)
    changeValue(args.join(' '))
}

export default Divider