luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Moving group by menu into the new menu system

Browse source
This commit is contained in:
Jesús Espino 2020-10-24 08:32:32 +02:00
parent 2275c6b72e
commit 083052f9be
2 changed files with 30 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

83
webapp/src/components/boardComponent.tsx
View file

@ -206,6 +206,7 @@ class BoardComponent extends React.Component<Props, State> {
<Menu>
{boardTree.board.cardProperties.map((option) => (
<Menu.Switch
key={option.id}
id={option.id}
name={option.name}
isOn={activeView.visiblePropertyIds.includes(option.id)}
@ -226,18 +227,33 @@ class BoardComponent extends React.Component<Props, State> {
))}
</Menu>
</MenuWrapper>
<div
className='octo-button'
id='groupByButton'
onClick={(e) => {
this.groupByClicked(e)
}}
>
Group by <span
style={groupByStyle}
id='groupByLabel'
>{boardTree.groupByProperty?.name}</span>
</div>
<MenuWrapper>
<div
className='octo-button'
id='groupByButton'
>
Group by <span
style={groupByStyle}
id='groupByLabel'
>{boardTree.groupByProperty?.name}</span>
</div>
<Menu>
{boardTree.board.cardProperties.filter((o) => o.type === 'select').map((option) => (
<Menu.Text
key={option.id}
id={option.id}
name={option.name}
onClick={(id) => {
if (boardTree.activeView.groupById === id) {
return
}
mutator.changeViewGroupById(boardTree.activeView, id)
}}
/>
))}
</Menu>
</MenuWrapper>
<div
className={hasFilter ? 'octo-button active' : 'octo-button'}
onClick={(e) => {
@ -672,49 +688,6 @@ class BoardComponent 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 async groupByClicked(e: React.MouseEvent) {
const {boardTree} = this.props
const selectProperties = boardTree.board.cardProperties.filter((o) => o.type === 'select')
OldMenu.shared.options = selectProperties.map((o) => {
return {id: o.id, name: o.name}
})
OldMenu.shared.onMenuClicked = async (command: string) => {
if (boardTree.activeView.groupById === command) {
return
}
await mutator.changeViewGroupById(boardTree.activeView, command)
}
OldMenu.shared.showAtElement(e.target as HTMLElement)
}
private cardClicked(e: React.MouseEvent, card: Card): void {
if (e.shiftKey) {
// Shift+Click = add to selection

2
webapp/src/components/tableComponent.tsx
View file

@ -195,6 +195,7 @@ class TableComponent extends React.Component<Props, State> {
<Menu>
{boardTree.board.cardProperties.map((option) => (
<Menu.Switch
key={option.id}
id={option.id}
name={option.name}
isOn={activeView.visiblePropertyIds.includes(option.id)}
@ -236,6 +237,7 @@ class TableComponent extends React.Component<Props, State> {
<Menu>
{boardTree.board.cardProperties.map((option) => (
<Menu.Text
key={option.id}
id={option.id}
name={option.name}
icon={(activeView.sortOptions[0]?.propertyId === option.id) ? activeView.sortOptions[0].reversed ? 'sortUp' : 'sortDown' : undefined}