main

mattermost/focalboard

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

tableCalculationOptions.tsx

TLDR

This file exports a functional React component called TableCalculationOptions, which is used to display calculation options for a table.

TableCalculationOptions

This functional React component accepts a prop called props that contains common calculation option properties. It creates an array of options based on the props.property.type and renders the CalculationOptions component from the .../calculations/options module with the following props:

  • value: The value of the calculation option.
  • menuOpen: A boolean indicating whether the options menu is open or closed.
  • onClose: A function to close the options menu.
  • onChange: A function to handle changes in the calculation option value.
  • property: The property object of the calculation option.
  • options: An array of calculation options to display.
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react'

import {CalculationOptions, CommonCalculationOptionProps, optionsByType} from '../../calculations/options'

export const TableCalculationOptions = (props: CommonCalculationOptionProps): JSX.Element => {
    const options = [...optionsByType.get('common')!]
    if (props.property && optionsByType.get(props.property.type)) {
        options.push(...optionsByType.get(props.property.type)!)
    }

    return (
        <CalculationOptions
            value={props.value}
            menuOpen={props.menuOpen}
            onClose={props.onClose}
            onChange={props.onChange}
            property={props.property}
            options={options}
        />
    )
}