Skip to content

Commit

Permalink
Merge pull request #1335 from Coflnet/bulk-edit-option
Browse files Browse the repository at this point in the history 
Bulk edit option
  • Loading branch information
@matthias-luger
matthias-luger authored Nov 26, 2024
2 parents 9f49831 + 0e74461 commit a3f5467
Show file tree
Hide file tree
Showing 2 changed files with 77 additions and 19 deletions.
87 changes: 71 additions & 16 deletions components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,20 +18,22 @@ import FlipRestrictionListEntry from './RestrictionListEntry/FlipRestrictionList
import { Item, Menu, useContextMenu } from 'react-contexify'
import BlockIcon from '@mui/icons-material/Block'
import CheckIcon from '@mui/icons-material/CheckCircle'
import ListIcon from '@mui/icons-material/ListAlt'
import { Check } from '@mui/icons-material'

interface Props {
onRestrictionsChange(restrictions: FlipRestriction[], type: 'whitelist' | 'blacklist'): void
prefillRestriction?: RestrictionCreateState
}

const RESTRICTION_CONTEXT_MENU_ID = 'restriction-entry-context-menu'
const RESTRICTION_CONTEXT_CURRENT_SHOING_MENU_ID = 'restriction-entry-context-menu-current-showing'

function FlipRestrictionList(props: Props) {
let [isAddNewFlipperExtended, setIsNewFlipperExtended] = useState(props.prefillRestriction !== undefined)
let [restrictions, setRestrictions] = useState<FlipRestriction[]>(getInitialFlipRestrictions())
let [restrictions, setRestrictions] = useState<FlipRestriction[]>(() => getInitialFlipRestrictions())
let [restrictionInEditMode, setRestrictionsInEditMode] = useState<FlipRestriction[]>([])
let [showDeleteRestrictionsDialog, setShowDeleteRestrictionsDialog] = useState(false)
let [isRefreshingItemNames, setIsRefreshingItemNames] = useState(false)
let [searchText, setSearchText] = useState('')
let [sortByName, setSortByName] = useState(false)
let [isSSR, setIsSSR] = useState(true)
Expand All @@ -41,6 +43,9 @@ function FlipRestrictionList(props: Props) {
const { show } = useContextMenu({
id: RESTRICTION_CONTEXT_MENU_ID
})
const { show: showEditShowingRestrictionsMenu } = useContextMenu({
id: RESTRICTION_CONTEXT_CURRENT_SHOING_MENU_ID
})

useEffect(() => {
function onControlF(event: KeyboardEvent) {
Expand All @@ -67,6 +72,7 @@ function FlipRestrictionList(props: Props) {
}
restriction.itemKey = generateUUID()
})
console.log(restrictions)
return restrictions
}

Expand Down Expand Up @@ -155,8 +161,7 @@ function FlipRestrictionList(props: Props) {
newRestrictions[index].tags = updateState.tags
newRestrictions[index].isEdited = false
newRestrictions[index].type = restriction.type
if (updateState.selectedItem)
newRestrictions[index].item = updateState.selectedItem
if (updateState.selectedItem) newRestrictions[index].item = updateState.selectedItem
})

setSetting(RESTRICTIONS_SETTINGS_KEY, JSON.stringify(getCleanRestrictionsForApi(newRestrictions)))
Expand Down Expand Up @@ -265,7 +270,6 @@ function FlipRestrictionList(props: Props) {

function refreshItemNames() {
let newRestrictions = [...restrictions]
setIsRefreshingItemNames(true)
let items: Item[] = []
newRestrictions.forEach(restriction => {
if (restriction.item && restriction.item.tag) {
Expand All @@ -280,7 +284,6 @@ function FlipRestrictionList(props: Props) {
}
})
toast.success('Reloaded all item names')
setIsRefreshingItemNames(false)
setRestrictions(newRestrictions)
setSetting(RESTRICTIONS_SETTINGS_KEY, JSON.stringify(getCleanRestrictionsForApi(newRestrictions)))
if (props.onRestrictionsChange) {
Expand All @@ -294,7 +297,7 @@ function FlipRestrictionList(props: Props) {
}

function recalculateListHeight() {
; (listRef.current as any).resetAfterRowIndex(0, false)
;(listRef.current as any).resetAfterRowIndex(0, false)
}

function handleContextMenuForRestriction(event) {
Expand Down Expand Up @@ -351,6 +354,23 @@ function FlipRestrictionList(props: Props) {
}
}

function changeRestrictionDisableStateForAllCurrentShowing(newValue: boolean) {
let newRestrictions = [...restrictions]
let shownRestrictions = getRestrictionsFilteredBySearch(restrictions)
newRestrictions.forEach(r => {
if (r.itemKey && shownRestrictions.find(sr => sr.itemKey === r.itemKey)) {
r.disabled = newValue
}
})
setRestrictions(newRestrictions)

setSetting(RESTRICTIONS_SETTINGS_KEY, JSON.stringify(getCleanRestrictionsForApi(newRestrictions)))
if (props.onRestrictionsChange) {
props.onRestrictionsChange(getCleanRestrictionsForApi(newRestrictions), 'blacklist')
props.onRestrictionsChange(getCleanRestrictionsForApi(newRestrictions), 'whitelist')
}
}

let clearListDialog = (
<Modal
show={showDeleteRestrictionsDialog}
Expand Down Expand Up @@ -415,6 +435,41 @@ function FlipRestrictionList(props: Props) {
</div>
)

let currentShowingItemOptionsContextMenuElement = (
<div>
<Menu id={RESTRICTION_CONTEXT_CURRENT_SHOING_MENU_ID} theme={'dark'}>
<Item
onClick={() => {
setShowDeleteRestrictionsDialog(true)
}}
>
<DeleteIcon color="error" style={{ marginRight: 5 }} />
Delete all current showing
</Item>
<Item
onClick={() => {
changeRestrictionDisableStateForAllCurrentShowing(true)
}}
>
<BlockIcon color="error" style={{ marginRight: 5 }} />
Disable all current showing
</Item>
<Item
onClick={() => {
changeRestrictionDisableStateForAllCurrentShowing(false)
}}
>
<Check color="success" style={{ marginRight: 5 }} />
Enable all current showing
</Item>
<Item onClick={refreshItemNames}>
<Refresh style={{ marginRight: 5 }} />
Refresh item names
</Item>
</Menu>
</div>
)

let windowWidth = isSSR ? 1920 : window.innerWidth
let singleColumn = windowWidth < 1024

Expand Down Expand Up @@ -480,17 +535,16 @@ function FlipRestrictionList(props: Props) {
{addIcon}
<span> Add new restriction</span>
</div>
<Button variant="info" style={{ marginRight: '10px' }} onClick={refreshItemNames} disabled={isRefreshingItemNames}>
<Refresh /> Refresh item names
</Button>
<Button
variant="danger"
onClick={() => {
setShowDeleteRestrictionsDialog(true)
<div
onClick={e => {
showEditShowingRestrictionsMenu({
event: e
})
}}
>
<DeleteIcon /> Delete restrictions
</Button>
<label style={{ cursor: 'pointer' }}>Act on all {getRestrictionsFilteredBySearch(restrictions)?.length || 0} elements</label>
<ListIcon id="currentShowingOptions" style={{ cursor: 'pointer', marginLeft: 5 }}></ListIcon>
</div>
</div>
)}
<hr />
Expand Down Expand Up @@ -602,6 +656,7 @@ function FlipRestrictionList(props: Props) {
</div>
{clearListDialog}
{currentItemContextMenuElement}
{currentShowingItemOptionsContextMenuElement}
</>
)
}
Expand Down
9 changes: 6 additions & 3 deletions utils/SettingsUtils.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,8 @@ export function setSettingsFromServerSide(
newRestrictions.push({
type: type,
itemFilter: item.filter,
tags: item.tags
tags: item.tags,
disabled: item.disabled
})
} else if (itemName && item.tag) {
newRestrictions.push({
Expand All @@ -134,7 +135,8 @@ export function setSettingsFromServerSide(
iconUrl: api.getItemImageUrl(item)
},
itemFilter: item.filter,
tags: item.tags
tags: item.tags,
disabled: item.disabled
})
} else {
tagsToFindNamesFor.add(item.tag)
Expand All @@ -146,7 +148,8 @@ export function setSettingsFromServerSide(
iconUrl: api.getItemImageUrl(item)
},
itemFilter: item.filter,
tags: item.tags
tags: item.tags,
disabled: item.disabled
})
}
})
Expand Down

0 comments on commit a3f5467

Please sign in to comment.