diff --git a/webapp/src/components/boardComponent.tsx b/webapp/src/components/boardComponent.tsx
index 9ff969b1c..8f45caaa4 100644
--- a/webapp/src/components/boardComponent.tsx
+++ b/webapp/src/components/boardComponent.tsx
@@ -196,12 +196,36 @@ class BoardComponent extends React.Component<Props, State> {
                                 />
                             </MenuWrapper>
                             <div className='octo-spacer'/>
-                            <div
-                                className='octo-button'
-                                onClick={(e) => {
-                                    this.propertiesClicked(e)
-                                }}
-                            >Properties</div>
+                            <MenuWrapper>
+                                <div className={'octo-button'}>
+                                    <FormattedMessage
+                                        id='TableComponent.properties'
+                                        defaultMessage='Properties'
+                                    />
+                                </div>
+                                <Menu>
+                                    {boardTree.board.cardProperties.map((option) => (
+                                        <Menu.Switch
+                                            id={option.id}
+                                            name={option.name}
+                                            isOn={activeView.visiblePropertyIds.includes(option.id)}
+                                            onClick={(propertyId: string) => {
+                                                const property = boardTree.board.cardProperties.find((o) => o.id === propertyId)
+                                                Utils.assertValue(property)
+                                                Utils.log(`Toggle property ${property.name}`)
+
+                                                let newVisiblePropertyIds = []
+                                                if (activeView.visiblePropertyIds.includes(propertyId)) {
+                                                    newVisiblePropertyIds = activeView.visiblePropertyIds.filter((o) => o !== propertyId)
+                                                } else {
+                                                    newVisiblePropertyIds = [...activeView.visiblePropertyIds, propertyId]
+                                                }
+                                                mutator.changeViewVisibleProperties(activeView, newVisiblePropertyIds)
+                                            }}
+                                        />
+                                    ))}
+                                </Menu>
+                            </MenuWrapper>
                             <div
                                 className='octo-button'
                                 id='groupByButton'
diff --git a/webapp/src/components/tableComponent.tsx b/webapp/src/components/tableComponent.tsx
index 8232c8f24..6713b0579 100644
--- a/webapp/src/components/tableComponent.tsx
+++ b/webapp/src/components/tableComponent.tsx
@@ -185,17 +185,36 @@ class TableComponent extends React.Component<Props, State> {
                                 />
                             </MenuWrapper>
                             <div className='octo-spacer'/>
-                            <div
-                                className='octo-button'
-                                onClick={(e) => {
-                                    this.propertiesClicked(e)
-                                }}
-                            >
-                                <FormattedMessage
-                                    id='TableComponent.properties'
-                                    defaultMessage='Properties'
-                                />
-                            </div>
+                            <MenuWrapper>
+                                <div className={'octo-button'}>
+                                    <FormattedMessage
+                                        id='TableComponent.properties'
+                                        defaultMessage='Properties'
+                                    />
+                                </div>
+                                <Menu>
+                                    {boardTree.board.cardProperties.map((option) => (
+                                        <Menu.Switch
+                                            id={option.id}
+                                            name={option.name}
+                                            isOn={activeView.visiblePropertyIds.includes(option.id)}
+                                            onClick={(propertyId: string) => {
+                                                const property = boardTree.board.cardProperties.find((o) => o.id === propertyId)
+                                                Utils.assertValue(property)
+                                                Utils.log(`Toggle property ${property.name}`)
+
+                                                let newVisiblePropertyIds = []
+                                                if (activeView.visiblePropertyIds.includes(propertyId)) {
+                                                    newVisiblePropertyIds = activeView.visiblePropertyIds.filter((o) => o !== propertyId)
+                                                } else {
+                                                    newVisiblePropertyIds = [...activeView.visiblePropertyIds, propertyId]
+                                                }
+                                                mutator.changeViewVisibleProperties(activeView, newVisiblePropertyIds)
+                                            }}
+                                        />
+                                    ))}
+                                </Menu>
+                            </MenuWrapper>
                             <div
                                 className={hasFilter ? 'octo-button active' : 'octo-button'}
                                 onClick={(e) => {
@@ -409,32 +428,6 @@ class TableComponent extends React.Component<Props, State> {
         )
     }
 
-    private async propertiesClicked(e: React.MouseEvent) {
-        const {boardTree} = this.props
-        const {activeView} = boardTree
-
-        const selectProperties = boardTree.board.cardProperties
-        OldMenu.shared.options = selectProperties.map((o) => {
-            const isVisible = activeView.visiblePropertyIds.includes(o.id)
-            return {id: o.id, name: o.name, type: 'switch', isOn: isVisible}
-        })
-
-        OldMenu.shared.onMenuToggled = async (id: string, isOn: boolean) => {
-            const property = selectProperties.find((o) => o.id === id)
-            Utils.assertValue(property)
-            Utils.log(`Toggle property ${property.name} ${isOn}`)
-
-            let newVisiblePropertyIds = []
-            if (activeView.visiblePropertyIds.includes(id)) {
-                newVisiblePropertyIds = activeView.visiblePropertyIds.filter((o) => o !== id)
-            } else {
-                newVisiblePropertyIds = [...activeView.visiblePropertyIds, id]
-            }
-            await mutator.changeViewVisibleProperties(activeView, newVisiblePropertyIds)
-        }
-        OldMenu.shared.showAtElement(e.target as HTMLElement)
-    }
-
     private filterClicked(e: React.MouseEvent) {
         this.props.showFilter(e.target as HTMLElement)
     }
diff --git a/webapp/src/widgets/menu.tsx b/webapp/src/widgets/menu.tsx
index 1707770d1..651ce282e 100644
--- a/webapp/src/widgets/menu.tsx
+++ b/webapp/src/widgets/menu.tsx
@@ -90,13 +90,15 @@ class SwitchOption extends React.Component<SwitchOptionProps> {
     render() {
         const {name, icon, isOn} = this.props
         return (
-            <div className='MenuOption SwitchOption menu-option'>
+            <div
+                className='MenuOption SwitchOption menu-option'
+                onClick={this.handleOnClick}
+            >
                 <div className='menu-name'>{name}</div>
                 {icon && <div className={`icon ${icon}`}/>}
                 <div className={isOn ? 'octo-switch on' : 'octo-switch'}>
                     <div
                         className='octo-switch-inner'
-                        onClick={this.handleOnClick}
                     />
                 </div>
             </div>