main

mattermost/focalboard

Last updated at: 29/12/2023 09:42

switchOption.tsx

TLDR

This file, located at src/widgets/menu/switchOption.tsx, contains a single React component called SwitchOption. It is a menu option with a switch that can be turned on or off.

Methods

No methods are defined in this file.

Classes

No classes are defined in this file.

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

import Switch from '../switch'

import {MenuOptionProps} from './menuItem'

type SwitchOptionProps = MenuOptionProps & {
    isOn: boolean
    icon?: React.ReactNode
    suppressItemClicked?: boolean
}

function SwitchOption(props: SwitchOptionProps): JSX.Element {
    const {name, icon, isOn, suppressItemClicked} = props

    return (
        <div
            className='MenuOption SwitchOption menu-option'
            role='button'
            aria-label={name}
            onClick={(e: React.MouseEvent) => {
                if (!suppressItemClicked) {
                    e.target.dispatchEvent(new Event('menuItemClicked'))
                }
                props.onClick(props.id)
                e.stopPropagation()
            }}
        >
            {icon ? <div className='menu-option__icon'>{icon}</div> : <div className='noicon'/>}
            <div className='menu-name'>{name}</div>
            <Switch
                isOn={isOn}
                onChanged={() => {}}
            />
        </div>
    )
}

export default React.memo(SwitchOption)